diff options
| -rw-r--r-- | index.html | 57 | ||||
| -rw-r--r-- | js/codeq/change_password.js | 50 | ||||
| -rw-r--r-- | js/codeq/login.js | 11 | ||||
| -rw-r--r-- | js/codeq/navigation.js | 4 | ||||
| -rw-r--r-- | js/codeq/profile.js | 30 | ||||
| -rw-r--r-- | js/codeq/signup.js | 22 |
6 files changed, 107 insertions, 67 deletions
@@ -52,7 +52,7 @@ <li id="navigation-logout"><a href="#" data-tkey="logout">Logout</a></li> <li id="navigation-profile"><a href="#" data-tkey="profile">Profile</a></li> <li role="separator" class="divider"></li> - <li><a href="#" data-toggle="modal" data-target="#modalChangePassword" data-tkey="change_pass">Change password</a></li> + <li><a href="#" data-toggle="modal" data-target="#modalChangePassword" data-tkey="change_pass" id="change-password">Change password</a></li> </ul> </li> <li class="dropdown" id="settings_dropdown_menu"> @@ -183,6 +183,31 @@ </div> </div> + <!-- change password screen --> + <div class="container" id="screen_change_pass" style="display: none;"> + <div class="modal-dialog modal-sm"> + <div class="row"> + <h3 class="text-center" data-tkey="change_password_header">Change password </h3> + </div> + <div class="row"> + <form id="formChangePassword" class="form"> + <div class="form-group"> + <label class="control-label small" data-tkey="password_new">New Password</label> + <input class="form-control" name="new" id="modalChangePasswordNew" type="password" data-tkey-placeholder="password_new_placeholder" placeholder="Enter a new password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}" data-valid-min="6" data-tkey-title="password_title" title="Choose a password with at least one number, one lowercase and one uppercase letter and at least 6 characters." required=""> + </div> + <div class="form-group"> + <label class="control-label small" data-tkey="password_verify">Verify Password</label> + <input class="form-control" name="verify" id="modalChangePasswordVerify" type="password" data-tkey-placeholder="password_verify_placeholder" placeholder="Repeat the password again" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}" data-valid-min="6" data-tkey-title="password_title" title="Choose a password with at least one number, one lowercase and one uppercase letter and at least 6 characters." required=""> + </div> + </form> + </div> + <div class="row"> + <button class="btn btn-default" data-dismiss="modal" aria-hidden="true" data-tkey="cancel" id="cancel_change_pass_button">Cancel</button> + <input form="formChangePassword" class="btn btn-primary" id="btnPasswdChange" type="submit" data-tkey-value="change_password_button" value="Change password"></button> + </div> + </div> + </div> + <!-- main screen: programming language selection, settings, etc. --> <div class="container" id="screen_language" style="text-align: center; display: none;"> <div class="row"> @@ -329,7 +354,7 @@ <h2> Profile <div class="btn-group btn-group-xs hidden-md pull-right"> - <a href="" data-toggle="modal" data-target="#modalChangePassword" class="btn btn-default" data-tkey="change_pass">Change Password</a> + <a href="" data-toggle="modal" data-target="#modalChangePassword" class="btn btn-default" data-tkey="change_pass" id="change_pass_profile">Change Password</a> <a href="#" class="btn btn-default" id="btnProfileGoBack" onclick="history.back()">Go back</a> </div> </h2> @@ -356,33 +381,6 @@ </div><!--container--> <!-- Modals --> - <div id="modalChangePassword" class="modal fade in" tabindex="-1" role="dialog" aria-hidden="false" style="display: none;"> - <div class="modal-dialog modal-sm"> - <div class="modal-content"> - <div class="modal-header"> - <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> - <h3 class="text-center" data-tkey="change_password_header">Change password </h3> - </div> - <div class="modal-body"> - <form id="formChangePassword" class="form"> - <div class="form-group"> - <label class="control-label small" data-tkey="password_new">New Password</label> - <input class="form-control" name="new" id="modalChangePasswordNew" type="password" data-tkey-placeholder="password_new_placeholder" placeholder="Enter a new password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}" data-valid-min="6" data-tkey-title="password_title" title="Choose a password with at least one number, one lowercase and one uppercase letter and at least 6 characters." required=""> - </div> - <div class="form-group"> - <label class="control-label small" data-tkey="password_verify">Verify Password</label> - <input class="form-control" name="verify" id="modalChangePasswordVerify" type="password" data-tkey-placeholder="password_verify_placeholder" placeholder="Repeat the password again" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}" data-valid-min="6" data-tkey-title="password_title" title="Choose a password with at least one number, one lowercase and one uppercase letter and at least 6 characters." required=""> - </div> - </form><!--/row--> - </div><!--/modal-body--> - <div class="modal-footer"> - <button class="btn btn-default" data-dismiss="modal" aria-hidden="true" data-tkey="cancel">Cancel</button> - <input form="formChangePassword" class="btn btn-primary" id="btnPasswdChange" type="submit" data-tkey-value="change_password_button" value="Change password"></button> - </div><!--/modal-footer--> - </div> - </div> - </div> - <div id="modalAAI" class="modal fade in" tabindex="-1" role="dialog" aria-hidden="false" data-keyboard="false" data-backdrop="static" style="display: none;"> <div class="modal-dialog"> <div class="modal-content"> @@ -433,6 +431,7 @@ <script src="js/codeq/robot.js"></script> <script src="js/codeq/signup.js"></script> <script src="js/codeq/login.js"></script> + <script src="js/codeq/change_password.js"></script> <script src="js/codeq/profile.js"></script> <script src="js/codeq/language.js"></script> <script src="js/codeq/problem_list.js"></script> diff --git a/js/codeq/change_password.js b/js/codeq/change_password.js new file mode 100644 index 0000000..c08c2d2 --- /dev/null +++ b/js/codeq/change_password.js @@ -0,0 +1,50 @@ +/** + * Created by robert on 10/14/15. + */ +(function(){ + + var jqNew = $("#modalChangePasswordNew"), + jqVerify = $("#modalChangePasswordVerify"), + jqCancelBtn = $("#cancel_change_pass_button"), + jqChangePassForm = $('#formChangePassword'); + + codeq.globalStateMachine.register('changePassword',{ + 'enter': function(){ + jqCancelBtn.on('click',function(){ + history.back();//forces a transition to the previous state + }); + jqChangePassForm.on('submit',function(event) { + + if (jqNew.val() != jqVerify.val()) { + alert('Passwords do not match.'); + } + else { + codeq.comms.changePassword(jqNew.val()) + .then(function (data) { + if (data.code !== 0) throw new Error('Password change failed, code: ' + data.code + ', message: ' + data.message); + alert('Password changed.'); + history.back();//force to return to previous state + }) + .fail(function (reason) { + codeq.log.error('Password change failed: ' + reason, reason); + alert('Password change failed: ' + reason); + }) + .done(); + } + event.preventDefault(); // Prevent the form from submitting via the browser. + }); + + + $("#screen_change_pass").css('display', ''); + $('#disabled').css('display', 'none'); + }, + 'exit' : function(){ + jqChangePassForm.off('submit'); + jqCancelBtn.off('click'); + $("#screen_change_pass").css('display', 'none'); + jqNew.val(''); + jqVerify.val(''); + } + }); + +})(); diff --git a/js/codeq/login.js b/js/codeq/login.js index 53a422c..29dd87b 100644 --- a/js/codeq/login.js +++ b/js/codeq/login.js @@ -3,6 +3,9 @@ */ (function(){ + var jqNavBarRight = $('.nav.navbar-nav.navbar-right'), + jqNavigationHomeBtn = $('#navigation-home'); + var loginFun = function(){ $('#disabled').css('display', ''); $('#disabled').css('cursor', 'wait'); @@ -48,8 +51,8 @@ codeq.globalStateMachine.register('login',{ 'enter': function(){ - $('#navigation-home').off('click');//remove the click listener of this element here - $('.nav.navbar-nav.navbar-right').css('display','none');//hide settings etc. + jqNavigationHomeBtn.off('click');//remove the click listener of this element here + jqNavBarRight.css('display','none');//hide settings etc. $('#signed-in-title').html(''); //setup the signup button @@ -76,11 +79,11 @@ $('#signed-in-title').html($('#username').val()); $("#password").val(''); //re-enable the click listener - $('#navigation-home').on('click', function(e){ + jqNavigationHomeBtn.on('click', function(e){ codeq.globalStateMachine.transition('language'); e.preventDefault(); }); - $('.nav.navbar-nav.navbar-right').css('display',''); + jqNavBarRight.css('display',''); //remove the listener from the signup button $('#signup_button').off('click'); diff --git a/js/codeq/navigation.js b/js/codeq/navigation.js index 58f0cf2..9b7a8f7 100644 --- a/js/codeq/navigation.js +++ b/js/codeq/navigation.js @@ -126,5 +126,9 @@ codeq.globalStateMachine.transition('profile'); e.preventDefault();//prevent this since we'll trigger a page reload otherwise }); + $('#change-password').on('click', function(e){ + codeq.globalStateMachine.transition('changePassword'); + e.preventDefault();//prevent this since we'll trigger a page reload otherwise + }); })(); diff --git a/js/codeq/profile.js b/js/codeq/profile.js index 08a8883..3f4a274 100644 --- a/js/codeq/profile.js +++ b/js/codeq/profile.js @@ -4,31 +4,7 @@ (function(){
- $('#formChangePassword').submit(function(event) {
- var jqNew = $("#modalChangePasswordNew"),
- jqVerify = $("#modalChangePasswordVerify");
-
- if (jqNew.val() != jqVerify.val()) {
- alert('Passwords do not match.');
- }
- else {
- codeq.comms.changePassword(jqNew.val())
- .then(function (data) {
- if (data.code !== 0) throw new Error('Password change failed, code: ' + data.code + ', message: ' + data.message);
-
- $('#modalChangePassword').modal('hide');
- jqNew.val('');
- jqVerify.val('');
- alert('Password changed.');
- })
- .fail(function (reason) {
- codeq.log.error('Password change failed: ' + reason, reason);
- alert('Password change failed: ' + reason);
- })
- .done();
- }
- event.preventDefault(); // Prevent the form from submitting via the browser.
- });
+ var jqBtnChangePass = $("#change_pass_profile");
codeq.profile = {
};
@@ -74,9 +50,13 @@ alert('GetUserStat failed: ' + reason);
})
.done();
+ jqBtnChangePass.on('click',function(){
+ codeq.globalStateMachine.transition('changePassword');
+ });
},
'exit' : function(){
$("#screen_profile").css('display', 'none');
+ jqBtnChangePass.off('click');
}
});
})();
\ No newline at end of file diff --git a/js/codeq/signup.js b/js/codeq/signup.js index aab831f..bafd690 100644 --- a/js/codeq/signup.js +++ b/js/codeq/signup.js @@ -7,21 +7,25 @@ jqName = $("#modalSignUpName"), jqEmail = $("#modalSignUpEmail"), jqPassword = $("#modalSignUpPassword"), - jqVerify = $("#modalSignUpVerify"); + jqVerify = $("#modalSignUpVerify"), + jqFormSignUp = $('#formSignUp'), + jqExitSignUpBtn = $('#exit_signup_btn'), + jqNavBarRight = $('.nav.navbar-nav.navbar-right'), + jqNavigationHomeBtn = $('#navigation-home'); codeq.globalStateMachine.register('signup',{ 'enter': function(){ - $('#navigation-home').off('click');//remove the click listener of this element here - $('.nav.navbar-nav.navbar-right').css('display','none');//hide settings etc. + jqNavigationHomeBtn.off('click');//remove the click listener of this element here + jqNavBarRight.css('display','none');//hide settings etc. $('#signed-in-title').html(''); $("#screen_signup").css('display', ''); $('#disabled').css('display', 'none'); - $('#exit_signup_btn').on('click',function(){ + jqExitSignUpBtn.on('click',function(){ codeq.globalStateMachine.transition('login'); }); //prepare listener for successfull signup - $('#formSignUp').on('submit',function(event) { + jqFormSignUp.on('submit',function(event) { console.log($(this).serialize()); if (jqPassword.val() != jqVerify.val()) { alert('Passwords do not match.'); @@ -51,15 +55,15 @@ 'exit' : function(){ $("#screen_signup").css('display', 'none'); //re-enable the click listener - $('#navigation-home').on('click', function(e){ + jqNavigationHomeBtn.on('click', function(e){ codeq.globalStateMachine.transition('language'); e.preventDefault(); }); //disable listeners on stuff from this page only - $('#exit_signup_btn').off('click'); - $('#formSignUp').off('submit'); + jqExitSignUpBtn.off('click'); + jqFormSignUp.off('submit'); //show the menu buttons - $('.nav.navbar-nav.navbar-right').css('display',''); + jqNavBarRight.css('display',''); jqUsername.val(''); jqName.val(''); |