From 6a052f9ea1a220a30280142890abeddd507d6a28 Mon Sep 17 00:00:00 2001 From: Connor Turland 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%>
Oops, don't change password
- <%= form.submit "Update", class: "update" %> +
+ <%= form.submit "Update", class: "update", onclick: "Metamaps.Account.showLoading()" %> <% end %>