Commit c5a3749

mo khan <mo@mokhan.ca>
2015-06-20 17:27:03
use Ractive to display syncing spinner.
1 parent 71cfeb9
Changed files (5)
app/assets/javascripts/views/google_sync_button.js.coffee
@@ -0,0 +1,13 @@
+Stronglifters.GoogleSyncButton = Ractive.extend
+  template: "<button on-click='synchronize'><i class='fa {{icon}}'></i> {{text}}</button>",
+  oninit: ->
+    @set(text: 'Sync With Google', icon: 'fa-camera-retro')
+    @on 'synchronize', (event) =>
+      @synchronize()
+
+  synchronize: ->
+    @set(text: 'Syncing...', icon: 'fa-spin fa-spinner')
+    new Stronglifters.GoogleDrive({
+      client_id: @get('client_id')
+      drive_upload_path: @get('drive_upload_path')
+    }).syncFile()
app/assets/javascripts/application.js
@@ -14,6 +14,7 @@
 //= require jquery_ujs
 //= require foundation
 //= require turbolinks
+//= require ractive
 //= require_self
 //= require_tree .
 
app/views/training_sessions/index.html.erb
@@ -13,9 +13,7 @@
           </div> <!-- /.small-12 -->
         <% end %>
       </div>
-      <div class="row">
-        <%= fa_icon "camera-retro" %>
-        <button id='google-sync-button'>Sync with Google Drive</button>
+      <div id='google-sync' class="row">
       </div>
     </div>
     <div class="panel callout radius">
@@ -32,11 +30,12 @@
 
 <script type="text/javascript" charset="utf-8">
   $(function(){
-    $('#google-sync-button').click(function(){
-      new Stronglifters.GoogleDrive({
+    new Stronglifters.GoogleSyncButton({
+      el: '#google-sync',
+      data: {
         client_id: '<%= ENV['GOOGLE_CLIENT_ID'] %>',
         drive_upload_path: '<%= drive_upload_training_sessions_path %>'
-      }).syncFile();
+      }
     });
   });
 </script>
Gemfile
@@ -41,6 +41,10 @@ gem 'sequel'
 gem 'rubyzip', require: "zip"
 gem 'font-awesome-rails'
 
+source 'https://rails-assets.org' do
+  gem 'rails-assets-ractive'
+end
+
 group :development, :test do
   # Call 'byebug' anywhere in the code to stop execution and get a debugger console
   gem 'byebug'
Gemfile.lock
@@ -1,5 +1,6 @@
 GEM
   remote: https://rubygems.org/
+  remote: https://rails-assets.org/
   specs:
     actionmailer (4.2.1)
       actionpack (= 4.2.1)
@@ -202,6 +203,7 @@ GEM
       bundler (>= 1.3.0, < 2.0)
       railties (= 4.2.1)
       sprockets-rails
+    rails-assets-ractive (0.7.3)
     rails-deprecated_sanitizer (1.0.3)
       activesupport (>= 4.2.0.alpha)
     rails-dom-testing (1.0.6)
@@ -366,6 +368,7 @@ DEPENDENCIES
   rack-mini-profiler
   rack-timeout
   rails (~> 4.2)
+  rails-assets-ractive!
   rails-erd
   rails_12factor
   rspec-rails