add architecture graphic

_src/_assets/javascripts/page-getstarted.js

@@ -8,3 +8,48 @@ jQuery(function($) {
     //
     Newsletter.init()
 })
+
+window.addEventListener('load', function load(event){
+    window.removeEventListener('load', load, false)
+
+    const driver = window.BigchainDB
+    const API_PATH = 'https://test.ipdb.io/api/v1/'
+    const APP_ID = 'b563bf22'
+    const APP_KEY = 'fd639614dcf8ee90a8c51a013ac11fb0'
+
+    const postButton = document.getElementById('post')
+
+    postButton.addEventListener('click', function(e) {
+        e.preventDefault()
+
+        const alice = new driver.Ed25519Keypair()
+
+        const message = document.getElementById('message').value
+        const metadata = document.getElementById('metadata').value
+
+        const tx = driver.Transaction.makeCreateTransaction(
+            { assetMessage: message },
+            { metaDataMessage: metadata },
+            [ driver.Transaction.makeOutput(
+                    driver.Transaction.makeEd25519Condition(alice.publicKey))
+            ],
+            alice.publicKey
+        )
+        const txSigned = driver.Transaction.signTransaction(tx, alice.privateKey)
+
+        const conn = new driver.Connection(API_PATH, {
+            app_id: APP_ID,
+            app_key: APP_KEY
+        })
+
+        conn.postTransaction(txSigned)
+            .then(() => {
+                const output = document.getElementById('output')
+                const outputContent = conn.getStatus(txSigned.id)
+
+                output.textContent = outputContent
+            })
+            .then((res) => console.log('Transaction status:', res.status))
+
+    }, false)
+}, false)

_src/start.html

@@ -29,7 +29,7 @@ redirect_from:
                     <p class="form-group">
                         A transaction can contain a digital asset along with a message. Type something to be sent along the asset.
                     </p>
-                    <a class="btn btn-primary" href="">Off you go</a>
+                    <a class="btn btn-primary" id="post" href="#">Off you go</a>
                 </form>
             </div>
             <div class="grid__col">
@@ -57,17 +57,17 @@ redirect_from:
             </div>
         </div>
     </div>
+    <div class="row">
+        <header class="section-header">
+            <p class="section-description">Simple, eh?</p>
+        </header>
+    </div>
 </section>
 
 <section class="section section--architecture">
-    <div class="row">
-        <header class="section-header">
-            <p class="section-description">Architecture overview</p>
-        </header>
-    </div>
-    <div class="row">
+    <div class="row row--wide">
         <figure class="architecture">
-
+            <img class="img--responsive" src="/assets/img/architecture.svg" alt="BigchainDB Overview">
         </figure>
     </div>
 </section>