UX: show caps lock warning on password reset page

This commit is contained in:
Arpit Jalan 2015-05-04 11:58:34 +05:30
parent 4dfc1907ac
commit f3687b6e56
1 changed files with 9 additions and 2 deletions

View File

@ -36,9 +36,10 @@
<%=form_tag({}, method: :put) do %>
<p>
<span style="display: none;"><input name="username" type="text" value="<%= @user.username %>"></span>
<input id="user_password" name="password" size="30" type="password" maxlength="<%= User.max_password_length %>">
<input id="user_password" name="password" size="30" type="password" maxlength="<%= User.max_password_length %>" onkeypress="capsLock(event)">
<label><%= t('js.user.password.instructions', count: SiteSetting.min_password_length) %></label>
</p>
<div id="capsLockWarning" class="caps-lock-warning" style="visibility:hidden"><i class="fa fa-exclamation-triangle"></i> <%= t 'js.login.caps_lock_warning' %></div>
<p>
<%=submit_tag( @user.has_password? ? t('password_reset.update') : t('password_reset.save'), class: 'btn')%>
</p>
@ -48,5 +49,11 @@
</div>
<script type="text/javascript">
document.getElementById('user_password').focus()
document.getElementById('user_password').focus();
function capsLock(e) {
kc = e.keyCode?e.keyCode:e.which;
sk = e.shiftKey?e.shiftKey:((kc == 16)?true:false);
(((kc >= 65 && kc <= 90) && !sk)||((kc >= 97 && kc <= 122) && sk)) ? document.getElementById('capsLockWarning').style.visibility = 'visible' : document.getElementById('capsLockWarning').style.visibility = 'hidden';
}
</script>