Permalink
Browse files

add progress indicator to create account page

As filed in mozilla/gombot#3
  • Loading branch information...
1 parent 7ceeeac commit ee3da01ccef6a239f624dbccd0b5ae344a17b892 @psawaya psawaya committed Dec 28, 2012
Showing with 21 additions and 0 deletions.
  1. BIN images/spinny.gif
  2. +2 −0 pages/first_run/create_account.html
  3. +19 −0 pages/first_run/create_account.js
View
BIN images/spinny.gif
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
2 pages/first_run/create_account.html
@@ -98,6 +98,8 @@
<p class="small">
By proceeding, you agree to Gombot's <a href="#">Terms</a> and <a href="#">Privacy Policy</a>.
</p>
+
+ <span class="progress-indicator"></span>
<p>
<button class="button-blue">Sign up &raquo;</button><br />
View
19 pages/first_run/create_account.js
@@ -18,12 +18,14 @@ $(document).ready(function() {
ok = checkEmail() && ok;
ok = checkPasswords() && ok;
if (ok) {
+ ProgressIndicator.show();
client.account({
email: $('[name="email"]').get()[0].value,
pass: $('[name="password"]').get()[0].value,
newsletter: $('[name="newsletter"]').get()[0].value === 'subscribe',
}, function (err, result){
busy = false;
+ ProgressIndicator.hide();
console.log('result', err, result);
if (!err && result.success) {
window.location = 'success.html';
@@ -38,6 +40,23 @@ $(document).ready(function() {
});
});
+var ProgressIndicator = (function() {
+ var indicatorImage = $('<img>')
+ .addClass('progress-indicator-image')
+ .attr('src','/images/spinny.gif').get(0);
+ return {
+ show: function() {
+ if ($('.progress-indicator').has(indicatorImage).length == 0) {
+ $('.progress-indicator').append(indicatorImage);
+ }
+ $(indicatorImage).show();
+ },
+ hide: function() {
+ $(indicatorImage).hide();
+ }
+ }
+})();
+
function checkPINs() {
var pin = $('[name="pin"]').get()[0];
var repeat = $('[name="pin_repeat"]').get()[0];

0 comments on commit ee3da01

Please sign in to comment.