website: finish up tutorial steps

website/source/_ember_steps.html.erb

@@ -43,7 +43,7 @@
         of Vault.
         </p>
     <p>
-        Initialize Vault now, with 1 unseal key, using the command:
+        Initialize Vault now, with 1 unseal key for simplicity, using the command:
     </p>
     <p>
         <code>vault init -key-shares=1 -key-threshold=1</code>
@@ -63,7 +63,7 @@
     <p>
         Vault encrypts data with an encryption key. This key is encrypted with the "master key", which
         isn't stored. Decrypting the master key requires a threshold of shards. In this example,
-        we use one shard to decrypt this master key for simplicity.
+        we use one shard to decrypt this master key.
     </p>
     <p>
         Unseal the Vault:
@@ -95,60 +95,70 @@
 
 <script type="text/x-handlebars" data-template-name="mounts">
     <p>
-        Before performing any operation with Vault, the
-        connecting client must be authenticated. Authentication is
-        the process of verifying a person or machine is who they say
-        they are and assigning an identity to them. This identity is then
-        used when making requests with Vault.
+        Vault supports a number of secret backends. This behaves
+        a lot like a virtual filesystem. The read/write/delete
+        operations are forwarded to the backend, and the backend can
+        choose to react to these operations however it wishes.
     </p>
     <p>
-        For simplicity, we'll use the root token we generated on init in Step 2. This
-        output should be available in the scrollback.
+        Backends can be very powerful, dynamically interacting with
+        services like AWS IAM, but for now we'll mount a simple
+        generic backend that simply passes data through to
+        the storage backend (after encrypting it).
     </p>
     <p>
-        Authorize with a client token:
-    </p>
-    <p>
-        <code>vault auth &lt;root token&gt;</code>
+        <code>vault mount generic</code>
     </p>
 </script>
 
 <script type="text/x-handlebars" data-template-name="secrets">
     <p>
-        Before performing any operation with Vault, the
-        connecting client must be authenticated. Authentication is
-        the process of verifying a person or machine is who they say
-        they are and assigning an identity to them. This identity is then
-        used when making requests with Vault.
+        Now that Vault has been set-up, we can start reading and writing secrets
+        with the previously mounted generic backend. Secrets written to Vault
+        are encrypted and then written to the backend storage.
+        The backend storage mechanism never sees the unencrypted
+        value and doesn't have the means necessary to decrypt
+        it without Vault.
     </p>
     <p>
-        For simplicity, we'll use the root token we generated on init in Step 2. This
-        output should be available in the scrollback.
+        <code>vault write secret/hello value=world</code>
     </p>
     <p>
-        Authorize with a client token:
+        Of course, you can then read this data too:
     </p>
     <p>
-        <code>vault auth &lt;root token&gt;</code>
+        <code>vault read secret/hello</code>
     </p>
 </script>
 
 <script type="text/x-handlebars" data-template-name="seal">
     <p>
-        Before performing any operation with Vault, the
-        connecting client must be authenticated. Authentication is
-        the process of verifying a person or machine is who they say
-        they are and assigning an identity to them. This identity is then
-        used when making requests with Vault.
+        There is also an API to seal the Vault. This will throw
+        away the encryption key and require another unseal process
+        to restore it. Sealing only requires a single operator
+        with root privileges. This is typically part of a rare "break glass
+        procedure".
     </p>
     <p>
-        For simplicity, we'll use the root token we generated on init in Step 2. This
-        output should be available in the scrollback.
+        This way, if there is a detected intrustion, the Vault data can be locked
+        quickly to try to minimize damages. It can't be accessed again
+        without access to the master key shards.
     </p>
     <p>
-        Authorize with a client token:
-    </p>
-    <p>
-        <code>vault auth &lt;root token&gt;</code>
+        <code>vault seal</code>
+    </p>
+</script>
+
+<script type="text/x-handlebars" data-template-name="finish">
+    <p>
+        Thanks for trying out the Vault CLI.
+    </p>
+    <p>
+        Note that the Vault CLI uses the HTTP API, which gives you full access to Vault. Every aspect
+        of Vault can be controlled via this API.
+    </p>
+    <p>
+        We recommend reading through the <a href="/intro/index.html">intro guide</a> next, which will
+        provide more background information, use cases and examples.
     </p>
 </script>

website/source/assets/javascripts/demo/controllers/demo.js

@@ -7,15 +7,13 @@ Demo.DemoController = Ember.ObjectController.extend({
 
     if (prefix) {
       data = '$ ' + data;
-    }
-
-    if (this.get('logs.length') === 0) {
-      newline = '';
     } else {
-      newline = '\n';
+      newline = '';
     }
 
-    this.set('logs', this.get('logs')+newline+data);
+    newline = '\n';
+
+    this.set('logs', this.get('logs')+data+newline);
 
     Ember.run.later(function() {
       var element = $('.demo-terminal');

website/source/assets/javascripts/demo/controllers/step.js

@@ -70,6 +70,10 @@ Demo.DemoStepController = Ember.ObjectController.extend({
           this.set('notCleared', true);
           this.send('previous');
           break;
+        case "quit":
+        case "exit":
+          this.send('close');
+          break;
         case "clear":
           this.set('logs', "");
           this.set('notCleared', false);

website/source/assets/javascripts/demo/initializer/load-steps.js

@@ -11,9 +11,10 @@ Ember.Application.initializer({
         { id: 2, name: 'init', humanName: "Step 2: Initialize your Vault"},
         { id: 3, name: 'unseal', humanName: "Step 3: Unsealing your Vault"},
         { id: 4, name: 'auth', humanName: "Step 4: Authorize your requests"},
-        { id: 5, name: 'mounts', humanName: "Step 5: Mount a backend"},
-        { id: 6, name: 'secrets', humanName: "Step 6: Read, write and delete secrets"},
+        { id: 5, name: 'mounts', humanName: "Step 5: Mount a secret backend"},
+        { id: 6, name: 'secrets', humanName: "Step 6: Read, and write secrets"},
         { id: 7, name: 'seal', humanName: "Step 7: Seal your Vault"},
+        { id: 8, name: 'finish', humanName: "You're finished!"},
       ]
     };
 

website/source/assets/stylesheets/_buttons.scss

@@ -39,6 +39,10 @@
 	   	@include img-retina("../images/icon-terminal.png", "../images/icon-terminal@2x.png", 26px, 25px);
 	}
 
+	&.started{
+		margin-bottom: 12px;
+	}
+
 	&:hover{
 		text-decoration: none;
 		@include transition(color .3s ease-in-out);

website/source/assets/stylesheets/_demo.scss

@@ -36,6 +36,11 @@
         padding-left: 10px;
     }
 
+    a {
+        color: white;
+        text-decoration: underline;
+    }
+
     p:last-child {
         margin-bottom: 0px;
     }

website/source/index.html.erb

@@ -20,7 +20,7 @@
 				</div>
 				<h2 id="tag-line">A tool for managing secrets.</h2>
 				<div>
-					<a class="v-btn blue lrg" href="/intro">Get Started</a>
+					<a class="v-btn blue lrg started" href="/intro">Get Started</a>
 					<a class="v-btn black lrg terminal" href="/#/demo/0">Launch Interactive Terminal</a>
 				</div>
 				<div id="diagram"></div>