ejallday · December 19, 2015 01:38 · Jun 27, 2013 · Jun 27, 2013 · Apr 23, 2013
diff --git a/_roll.erb b/_roll.erb
@@ -0,0 +1,3 @@
+<% if @roll %>
+<img src="/<%= @roll.value %>.png" title="<%= @roll.value %>" alt="the roll">
+<% end %>
diff --git a/index.erb b/index.erb
@@ -0,0 +1,12 @@
+<div class="container">
+  <h1>Simplest Possible AJAX</h1>
+  <p>This contrived app will simulate a roll of a 6-sided die.</p>
+
+  <form method="post" action="/rolls">
+    <input type="submit" value="Roll the Die">
+  </form>
+
+  <div id="die">  
+    <%= erb :_roll %>
+  </div>
+</div>
diff --git a/application.js b/application.js
@@ -0,0 +1,10 @@
+$(document).ready(function () {
+  $("form").on("submit", function(event){
+    event.preventDefault();
+    var rand_num = Math.floor(Math.random() * 6) + 1;
+    $.post('/rolls', {value: rand_num}, function(server_response) {
+      //var dieRoll = $(server_response).find('#die');
+      $('#die').html(server_response);
+    })
+  })
+});
diff --git a/index.rb b/index.rb
@@ -0,0 +1,19 @@
+get '/' do
+  erb :index
+end
+
+
+# TODO: convert this route to use AJAX
+post '/rolls' do
+  # If the user passes-in a "value", let's use it. Otherwise, we'll generate a random one.
+  # See: roll_if_value_is_nil method in the Roll model.
+  value = params[:value] ? params[:value].to_i : nil
+
+  @roll = value ? Roll.create({ value: value }) : Roll.create
+
+  if request.xhr?
+    erb :_roll, :layout => false  # HINT: what does this do? what should we do instead?
+  else
+    erb :index
+  end
+end
diff --git a/lucky_ajax.md b/lucky_ajax.md
@@ -0,0 +1,5 @@
+# Instructions:
+
+1. Download this [application skeleton](http://cl.ly/1l1F3N2I3E3x).
+2. Convert the app to use AJAX.
+3. Add any files you changed to your gist and submit your code.
No results found