stress three step layout with a little helper

2 files changed, 40 insertions, 12 deletions

diff --git a/http-srp.rb b/http-srp.rb
index ab1a4f4..c0c9360 100644
--- a/http-srp.rb
+++ b/http-srp.rb
@@ -53,3 +53,16 @@ post '/login' do
   @user.login!(params)
   redirect '/'
 end
+
+helpers do
+  def button_link(action, options = {})
+    action = action.to_s
+    label = action.capitalize
+    klass = "btn btn-large"
+    if options.delete(:primary)
+      klass += " btn-primary"
+      label += " now..."
+    end
+    %Q(<a href="#{action}" class="#{klass}" id="#{action}-btn">#{label}</a>)
+  end
+end
diff --git a/views/index.erb b/views/index.erb
index 54068c2..48d9f71 100644
--- a/views/index.erb
+++ b/views/index.erb
@@ -5,24 +5,12 @@
     <p>
     First you signup just like normal. Your browser runs a bit of javascript and does not transfer your password but some validator based on it.
     </p>
-    <% if @user.login %>
-      <p> You are signed up as <%= @user.login %>
-      <% if @user.active %>
-        <p> You are logged in.
-      <% end %>
-    <% end %>
-    <a href="signup" class="btn btn-primary btn-large" id="signup">
-      Signup now...
-    </a>
   </div>
   <div class="span4">
     <h2>2. Login</h2>
     <p>
     Login using the same credentials. Again javascript is used to calculate a random number and a key based on it that the server then uses to validate your password.
     </p>
-    <a href="login" class="btn btn-large" id="login">
-      Login
-    </a>
   </div>
   <div class="span4">
     <h2>3. Verify</h2>
@@ -31,5 +19,32 @@
     </p>
   </div>
 </div>
+<div class="row-fluid">
+  <div class="span4">
+    <% if @user.login %>
+      <h4> You are signed up as <%= @user.login %>. </h4>
+    <% end %>
+  </div>
+  <div class="span4">
+    <% if @user.active %>
+      <h4> You are logged in.</h4>
+    <% end %>
+  </div>
+  <div class="span4">
+  </div>
+</div>
+<div class="row-fluid">
+  <div class="span4">
+    <%= button_link(:signup, :primary => !@user.login) %>
+  </div>
+  <div class="span4">
+    <%= button_link(:login, :primary => @user.login && !@user.active) %>
+  </div>
+  <div class="span4">
+    <%= button_link(:verify, :primary => @user.active) %>
+  </div>
+</div>
+
+