Add 'Link Code' button to rspec example

adambeynon · adambeynon · commit de6f0a3f86c1 · 2013-12-19T14:52:40.000Z
diff --git a/source/javascripts/playground-rspec.js.rb b/source/javascripts/playground-rspec.js.rb
@@ -20,13 +20,22 @@ def initialize
 
       @result = Element['#result-frame']
 
-      @ruby.value = RUBY
-
       Element.find('#run-code').on(:click) { run_code }
+      @link = Element.find('#link-code')
+
+      hash = `decodeURIComponent(location.hash)`
+
+      if hash.start_with? '#code:'
+        @ruby.value = hash[6..-1]
+      else
+        @ruby.value = RUBY.strip
+      end
+
       run_code
     end
 
     def run_code
+      @link[:href] = "#code:#{`encodeURIComponent(#{@ruby.value})`}"
       js = Opal.compile @ruby.value
 
       update_iframe(<<-HTML)
@@ -48,6 +57,8 @@ def run_code
           </body>
         </html>
       HTML
+    rescue => e
+      alert "#{e.class}: #{e.message}"
     end
 
     def update_iframe(html)
diff --git a/source/rspec.html.haml b/source/rspec.html.haml
@@ -1,4 +1,3 @@
-
 !!!
 %html
   %head
@@ -15,10 +14,13 @@
         %a.navbar-brand Opal Playground - RSpec
       .container
         .collapse.navbar-collapse
-          %ul.nav.navbar-nav
+          %ul.nav.navbar-nav(style="padding: 7px")
             %li
               %button.btn.btn-primary#run-code
                 Run Code (Cmd+Enter)
+            %li
+              %a.btn.btn-default#link-code(style="padding: 6px")
+                Link Code
 
     .row
       .col-md-6(style="height: 100%")
