Use built-in login validation (#6434)

* Use built-in login validation * use button instead of submit to avoid duplicate submits --------- Co-authored-by: Simon Smith <simonsmith5521@gmail.com>

trmdi committed Oct 19, 2024 at 22:47 UTC 63930c4b3390784c87303c5d726bf4ae2f20dafc
3 files changed +12 -48
views/login-mobile.handlebars
+4 -15
@@ -63,15 +63,15 @@
63 <table>
64 <tr>
65 <td id=loginusername align=right width=100>Username:</td>
66 - <td><input id=username type=text autocomplete="username" maxlength=64 name=username onchange=validateLogin(1) onkeyup=validateLogin(1,event) /></td>
66 + <td><input id=username type=text autocomplete="username" maxlength=64 name=username required /></td>
67 </tr>
68 <tr>
69 <td align=right>Password:</td>
70 - <td><input id=password type=password autocomplete="current-password" maxlength=256 name=password autocomplete=off onchange=validateLogin(2) onkeyup=validateLogin(2,event) /></td>
70 + <td><input id=password type=password autocomplete="current-password" maxlength=256 name=password autocomplete=off required /></td>
71 </tr>
72 <tr>
73 <td><div id=showPassHintLink style=display:none><a onclick=showPassHint() style="cursor:pointer">Show Hint</a></div></td>
74 - <td align=right><input id=loginButton type=submit value="Log In" disabled="disabled" /></td>
74 + <td align=right><input id=loginButton type=submit value="Log In" /></td>
75 </tr>
76 </table>
77 <div id="hrAccountDiv" style="display:none"><hr /></div>
@@ -422,7 +422,6 @@
422
423 window.onresize = center;
424 center();
425 - validateLogin();
425 validateCreate();
426 if (loginMode.length != 0) { go(parseInt(loginMode)); } else { go(1); }
427 QV('newAccountDiv', (newAccount === '1') || (newAccount === 'true')); // If new accounts are not allowed, don't display the new account link.
@@ -573,16 +572,6 @@
572 }
573 }
574
576 - function validateLogin(box, e) {
577 - setTimeout(function(){
578 - var ok = ((Q('username').value.length > 0) && (Q('username').value.indexOf(' ') == -1) && (Q('password').value.length > 0));
579 - QE('loginButton', ok);
580 - setDialogMode(0);
581 - if ((e != null) && (e.keyCode == 13)) { if (box == 1) { Q('password').focus(); } else if (box == 2) { Q('loginButton').click(); } }
582 - if (e != null) { haltEvent(e); }
583 - }, 100);
584 - }
585 -
575 function validateCreate(box,e) {
576 setDialogMode(0);
577 var ok = false;
@@ -818,4 +807,4 @@
807
808 </script>
809 </body>
821 -</html>
\ No newline at end of file
810 +</html>
views/login.handlebars
+4 -15
@@ -55,15 +55,15 @@
55 <table>
56 <tr>
57 <td id=loginusername align=right width=100>Username:</td>
58 - <td><input id=username {{{autocomplete}}}="username" type=text maxlength=64 name=username onchange=validateLogin(1) onkeyup=validateLogin(1,event) /></td>
58 + <td><input id=username {{{autocomplete}}}="username" type=text maxlength=64 name=username required /></td>
59 </tr>
60 <tr>
61 <td align=right>Password:</td>
62 - <td><input id=password {{{autocomplete}}}="current-password" type=password maxlength=256 name=password onchange=validateLogin(2) onkeyup=validateLogin(2,event) /></td>
62 + <td><input id=password {{{autocomplete}}}="current-password" type=password maxlength=256 name=password required /></td>
63 </tr>
64 <tr>
65 <td><div id=showPassHintLink style=display:none><a onclick="return showPassHint(event);" href="#" style="cursor:pointer">Show Hint</a></div></td>
66 - <td align=right><input id=loginButton type=submit value="Log In" disabled="disabled" /></td>
66 + <td align=right><input id=loginButton type=submit value="Log In" /></td>
67 </tr>
68 </table>
69 <div id="hrAccountDiv" style="display:none"><hr /></div>
@@ -456,7 +456,6 @@
456 window.onresize = center;
457 center();
458
459 - validateLogin();
459 validateCreate();
460 if (loginMode.length != 0) { go(parseInt(loginMode)); } else { go(1); }
461 QV('newAccountDiv', (newAccount === '1') || (newAccount === 'true')); // If new accounts are not allowed, don't display the new account link.
@@ -661,16 +660,6 @@
660 }
661 }
662
664 - function validateLogin(box, e) {
665 - setTimeout(function(){
666 - var ok = ((Q('username').value.length > 0) && (Q('username').value.indexOf(' ') == -1) && (Q('password').value.length > 0));
667 - QE('loginButton', ok);
668 - setDialogMode(0);
669 - if ((e != null) && (e.keyCode == 13)) { if ((box == 1) && (Q('username').value != '')) { Q('password').focus(); } else if ((box == 2) && (Q('password').value != '')) { Q('loginButton').click(); } }
670 - if (e != null) { haltEvent(e); }
671 - }, 100);
672 - }
673 -
663 function validateCreate(box, e) {
664 setDialogMode(0);
665 var userok = false;
@@ -971,4 +960,4 @@
960
961 </script>
962 </body>
974 -</html>
\ No newline at end of file
963 +</html>
views/login2.handlebars
+4 -18
@@ -69,12 +69,12 @@
69 <table style="width:100%">
70 <tr>
71 <td>
72 - <input id=username title="Username" style="box-sizing:border-box;width:280px;border:0;border-radius:4px;padding:8px;background-color:#FFF8CC" {{{autocomplete}}}="username" placeholder="Username" type=text maxlength=64 name=username onchange=validateLogin(1) onkeyup=validateLogin(1,event) />
72 + <input id=username title="Username" style="box-sizing:border-box;width:280px;border:0;border-radius:4px;padding:8px;background-color:#FFF8CC" {{{autocomplete}}}="username" placeholder="Username" type=text maxlength=64 name=username required />
73 </td>
74 </tr>
75 <tr>
76 <td>
77 - <input id=password title="Password" style="box-sizing:border-box;width:280px;border:0;border-radius:4px;padding:8px;background-color:#FFF8CC" {{{autocomplete}}}="current-password" placeholder="Password" type=password maxlength=256 name=password onchange=validateLogin(2) onkeyup=validateLogin(2,event) />
77 + <input id=password title="Password" style="box-sizing:border-box;width:280px;border:0;border-radius:4px;padding:8px;background-color:#FFF8CC" {{{autocomplete}}}="current-password" placeholder="Password" type=password maxlength=256 name=password required />
78 </td>
79 </tr>
80 <tr>
@@ -84,7 +84,7 @@
84 </tr>
85 <tr>
86 <td>
87 - <input id=loginButton style="box-sizing:border-box;width:280px;border:0;border-radius:4px;padding:6px" onclick="submitButtonClicked('loginpanelform')" type=button value="Log In" disabled="disabled" />
87 + <input id=loginButton style="box-sizing:border-box;width:280px;border:0;border-radius:4px;padding:6px" onclick="submitButtonClicked('loginpanelform')" type=button value="Log In" />
88 </td>
89 </tr>
90 <tr id="topLanguageSelectRow" style="display:none"><td id="topLanguageSelect"></td></tr>
@@ -529,7 +529,6 @@
529 if (authStrategies.indexOf('saml') >= 0) { QV('auth-saml', true); }
530 }
531
532 - validateLogin();
532 validateCreate();
533 if (loginMode.length != 0) { go(parseInt(loginMode)); } else { go(1); }
534 QV('newAccountDiv', (newAccount === '1') || (newAccount === 'true')); // If new accounts are not allowed, don't display the new account link.
@@ -772,19 +771,6 @@
771 if (!formSubmitted) { formSubmitted = true; document.getElementById(v).submit(); }
772 }
773
775 - function validateLogin(box, e) {
776 - setTimeout(function(){
777 - var ok = ((Q('username').value.length > 0) && (Q('username').value.indexOf(' ') == -1) && (Q('password').value.length > 0));
778 - QE('loginButton', ok);
779 - setDialogMode(0);
780 - if ((e != null) && (e.keyCode == 13)) {
781 - if ((box == 1) && (Q('username').value != '')) { Q('password').focus(); }
782 - else if ((box == 2) && (Q('password').value != '')) { Q('loginButton').click(); }
783 - }
784 - if (e != null) { haltEvent(e); }
785 - }, 100);
786 - }
787 -
774 function validateCreate(box, e) {
775 setDialogMode(0);
776 var userok = false;
@@ -1041,4 +1027,4 @@
1027
1028 </script>
1029 </body>
1044 -</html>
\ No newline at end of file
1030 +</html>