From 6a052f9ea1a220a30280142890abeddd507d6a28 Mon Sep 17 00:00:00 2001
From: Connor Turland <connorturland@gmail.com>
Date: Mon, 3 Nov 2014 21:59:15 -0500
Subject: [PATCH] added loading icon to account page while image uploads

---
 app/assets/javascripts/src/Metamaps.js | 11 +++++++++++
 app/assets/stylesheets/application.css |  7 +++++++
 app/views/users/edit.html.erb          |  3 ++-
 3 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/src/Metamaps.js b/app/assets/javascripts/src/Metamaps.js
index 2b778840..fd1b817b 100644
--- a/app/assets/javascripts/src/Metamaps.js
+++ b/app/assets/javascripts/src/Metamaps.js
@@ -4429,6 +4429,17 @@ Metamaps.Account = {
 
         $('.userImageMenu').hide();
     },
+    showLoading: function(){
+        var self = Metamaps.Account;
+
+        var loader = new CanvasLoader('accountPageLoading');
+        loader.setColor('#4FC059'); // default is '#000000'
+        loader.setDiameter(28); // default is 40
+        loader.setDensity(41); // default is 40
+        loader.setRange(0.9); // default is 1.3
+        loader.show(); // Hidden by default
+        $('#accountPageLoading').show();
+    },
     showImagePreview: function(){
         var self = Metamaps.Account;
 
diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index e9df1092..89d879d7 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -448,6 +448,13 @@ input[type="submit"]:active {
 
 }
 
+#accountPageLoading {
+    display: none;
+    position: absolute;
+    bottom: 16px;
+    right: 120px;
+}
+
 .centerGreyForm input[type="text"],
 .centerGreyForm input[type="email"],
 .centerGreyForm input[type="password"] {
diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb
index 9b963045..45904d68 100644
--- a/app/views/users/edit.html.erb
+++ b/app/views/users/edit.html.erb
@@ -49,6 +49,7 @@
   <%= form.password_field :password_confirmation, :autocomplete => :off%></div>
   <div class="noChangePass" onclick="Metamaps.Account.hidePass()">Oops, don't change password</div>
 </div>
-  <%= form.submit "Update", class: "update" %>
+  <div id="accountPageLoading"></div>
+  <%= form.submit "Update", class: "update", onclick: "Metamaps.Account.showLoading()" %>
 <% end %>
 </div>