Changeset 1368:441ba2052da8

Timestamp:

08/02/13 22:40:12 (12 years ago)

Author:

Lepeltier kévin

Branch:

Ticket #1453-2

Message:

Ticket #1453

Indiquer le niveau de sécurité des mots de passes
et pis c'est tout.

La localisation est géré, manque juste les traduction.

Location:

admin

Files:

• preferences.php (modified) (2 diffs)
• style/default.css (modified) (2 diffs)

admin/preferences.php

@@ -344 +344 @@
      ($user_acc_nodragdrop ? '' : dcPage::jsLoad('js/_preferences-dragdrop.js')).
      dcPage::jsLoad('js/jquery/jquery-ui.custom.js').
+     dcPage::jsLoad('js/jquery/jquery.pwstrength.js').
+          '<script type="text/javascript">'."\n".
+          "//<![CDATA[\n".
+          "\$(function() {\n".
+          "    \$('#new_pwd').pwstrength({texts: ['".__('very weak')."', '".__('weak')."', '".__('mediocre')."', '".__('strong')."', '".__('very strong')."']});\n".
+          "});\n".
+          "\n//]]>\n".
+          "</script>\n".
      dcPage::jsPageTabs($default_tab).
      dcPage::jsConfirmClose('user-form').
@@ -417 +425 @@
      
      '<p><label for="new_pwd">'.__('New password:').
-     form::password('new_pwd',20,255).'</label></p>'.
+     form::password('new_pwd',20,255,'','','',false,' data-indicator="pwindicator" ').'</label></p>'.
+    '<div id="pwindicator">'.
+    '    <div class="bar"></div>'.
+    '    <div class="label"></div>'.
+    '</div>'.
      
      '<p><label for="new_pwd_c">'.__('Confirm password:').

admin/style/default.css

@@ -1151 +1151 @@
 label {
      display: block;
+    cursor: pointer;
 }
 label input, label select, label span {
@@ -1384 +1385 @@
      color: white;
 }
+
+
+
+/* --------------------------------------------------------------- password indcator */
+
+#pwindicator {
+    margin-top: 4px;
+    width: 150px;
+}
+
+.bar {
+    height: 2px;
+}
+
+.pw-very-weak .bar {
+    background: #d00;
+    width: 30px;
+}
+
+.pw-very-weak .label {
+    color: #d00;
+}
+
+.pw-weak .bar {
+    background: #d00;
+    width: 60px;
+}
+
+.pw-weak .label {
+    color: #d00;
+}
+
+.pw-mediocre .bar {
+    background: #f3f01a;
+    width: 90px;
+}
+
+.pw-mediocre .label {
+    color: #f3f01a;
+}
+
+.pw-strong .bar {
+    background: #f3b31a;
+    width: 120px;
+}
+
+.pw-strong .label {
+    color: #f3b31a;
+}
+
+.pw-very-strong .bar {
+    background: #0d0;
+    width: 150px;
+}
+
+.pw-very-strong .label {
+    color: #0d0;
+}