Commit b28af681fc624d234a4d2447ab16ac19dee9042e
1 parent
20d798fd
Exists in
master
and in
29 other branches
Don't show the strong of password if the field is blank
-Edited the javascript adding a var blankPass -Code Review. Daniela: "When I filled in the username and used "tab" to go to password field, it already displayed the "short" message. You should test if there's at least one character before checking the password strength :)" (ActionItem3008) Signed-off-by: Luciano Prestes <lucianopcbr@gmail.com> Color of password rate message moved to style.css -Edited the style css adding the id of password rate messages with yours respective colors -Code Review. Daniela: "The style of an element should not be included directly on the element, but on a CSS file :) Adding the style on a separated file will make the code cleaner and will be better to style it on themes that don't like the default colors, for example." (ActionItem3008) Signed-off-by: Luciano Prestes <lucianopcbr@gmail.com>
Showing
3 changed files
with
28 additions
and
4 deletions
Show diff stats
app/views/account/_signup_form.rhtml
| @@ -55,16 +55,16 @@ | @@ -55,16 +55,16 @@ | ||
| 55 | <%= required f.password_field(:password, :id => 'user_pw') %> | 55 | <%= required f.password_field(:password, :id => 'user_pw') %> |
| 56 | <%= content_tag(:small,_('Choose a password that you can remember easily. It must have at least 4 characters.'), :id => 'password-balloon') %> | 56 | <%= content_tag(:small,_('Choose a password that you can remember easily. It must have at least 4 characters.'), :id => 'password-balloon') %> |
| 57 | <div id='password-rate'> | 57 | <div id='password-rate'> |
| 58 | - <p><span class="invalid hidden" style="color:red" id='result-short'> | 58 | + <p><span class="invalid hidden" id='result-short'> |
| 59 | <%=_('Short') %> | 59 | <%=_('Short') %> |
| 60 | </span></p> | 60 | </span></p> |
| 61 | - <p><span class="invalid hidden" style="color:brown" id='result-bad'> | 61 | + <p><span class="invalid hidden" id='result-bad'> |
| 62 | <%=_('Bad') %> | 62 | <%=_('Bad') %> |
| 63 | </span></p> | 63 | </span></p> |
| 64 | - <p><span class="invalid hidden" style="color:green" id='result-good'> | 64 | + <p><span class="invalid hidden" id='result-good'> |
| 65 | <%=_('Good') %> | 65 | <%=_('Good') %> |
| 66 | </span></p> | 66 | </span></p> |
| 67 | - <p><span class="invalid hidden" style="color:limegreen" id='result-strong'> | 67 | + <p><span class="invalid hidden" id='result-strong'> |
| 68 | <%=_('Strong') %> | 68 | <%=_('Strong') %> |
| 69 | </span></p> | 69 | </span></p> |
| 70 | </div> | 70 | </div> |
public/javascripts/sign_up_password_rate.js
| @@ -2,6 +2,7 @@ | @@ -2,6 +2,7 @@ | ||
| 2 | // Firas Kassem phiras.wordpress.com || phiras at gmail {dot} com | 2 | // Firas Kassem phiras.wordpress.com || phiras at gmail {dot} com |
| 3 | // for more information : http://phiras.wordpress.com/2007/04/08/password-strength-meter-a-jquery-plugin/ | 3 | // for more information : http://phiras.wordpress.com/2007/04/08/password-strength-meter-a-jquery-plugin/ |
| 4 | 4 | ||
| 5 | +var blankPass = -1 | ||
| 5 | var shortPass = 0 | 6 | var shortPass = 0 |
| 6 | var badPass = 1 | 7 | var badPass = 1 |
| 7 | var goodPass = 2 | 8 | var goodPass = 2 |
| @@ -12,6 +13,8 @@ function passwordStrength(password,username) | @@ -12,6 +13,8 @@ function passwordStrength(password,username) | ||
| 12 | { | 13 | { |
| 13 | score = 0 | 14 | score = 0 |
| 14 | 15 | ||
| 16 | + if(password.length == 0) return blankPass | ||
| 17 | + | ||
| 15 | //password < 4 | 18 | //password < 4 |
| 16 | if (password.length < 4 ) { return shortPass } | 19 | if (password.length < 4 ) { return shortPass } |
| 17 | 20 | ||
| @@ -81,6 +84,10 @@ jQuery(document).ready(function() { | @@ -81,6 +84,10 @@ jQuery(document).ready(function() { | ||
| 81 | jQuery('#user_pw').keyup(function() | 84 | jQuery('#user_pw').keyup(function() |
| 82 | { | 85 | { |
| 83 | var result = passwordStrength(jQuery('#user_pw').val(),jQuery('#user_login').val()) | 86 | var result = passwordStrength(jQuery('#user_pw').val(),jQuery('#user_login').val()) |
| 87 | + if(result == blankPass) | ||
| 88 | + { | ||
| 89 | + showRateField('#result-blank') | ||
| 90 | + } else | ||
| 84 | if(result == shortPass) | 91 | if(result == shortPass) |
| 85 | { | 92 | { |
| 86 | showRateField('#result-short') | 93 | showRateField('#result-short') |
| @@ -103,6 +110,7 @@ jQuery(document).ready(function() { | @@ -103,6 +110,7 @@ jQuery(document).ready(function() { | ||
| 103 | 110 | ||
| 104 | function showRateField(validation) | 111 | function showRateField(validation) |
| 105 | { | 112 | { |
| 113 | + jQuery('#result-blank').addClass('hidden') | ||
| 106 | jQuery('#result-short').addClass('hidden') | 114 | jQuery('#result-short').addClass('hidden') |
| 107 | jQuery('#result-bad').addClass('hidden') | 115 | jQuery('#result-bad').addClass('hidden') |
| 108 | jQuery('#result-good').addClass('hidden') | 116 | jQuery('#result-good').addClass('hidden') |
public/stylesheets/application.css
| @@ -6535,3 +6535,19 @@ ul.article-versions li { | @@ -6535,3 +6535,19 @@ ul.article-versions li { | ||
| 6535 | .controller-features .manage-fields-batch-actions td { | 6535 | .controller-features .manage-fields-batch-actions td { |
| 6536 | font-style: italic; | 6536 | font-style: italic; |
| 6537 | } | 6537 | } |
| 6538 | + | ||
| 6539 | +#result-short { | ||
| 6540 | + color: red !important; | ||
| 6541 | +} | ||
| 6542 | + | ||
| 6543 | +#result-bad { | ||
| 6544 | + color: #825A2C !important; | ||
| 6545 | +} | ||
| 6546 | + | ||
| 6547 | +#result-good { | ||
| 6548 | + color: green !important; | ||
| 6549 | +} | ||
| 6550 | + | ||
| 6551 | +#result-strong { | ||
| 6552 | + color: #32CD32 !important; | ||
| 6553 | +} | ||
| 6538 | \ No newline at end of file | 6554 | \ No newline at end of file |