Changeset 8686

Timestamp:

07/24/2014 01:11:02 AM (10 years ago)

Author:

boonebgorges

Message:

Add password strength meters to registration and settings panels.

See #5775

Props SGr33n

Location:

trunk/src/bp-templates/bp-legacy

Files:

• buddypress-functions.php (modified) (1 diff)
• buddypress/members/register.php (modified) (1 diff)
• buddypress/members/single/settings/general.php (modified) (1 diff)
• css/buddypress.css (modified) (1 diff)
• js/password-verify.js (added)

trunk/src/bp-templates/bp-legacy/buddypress-functions.php

@@ -254 +254 @@
             wp_enqueue_script( 'comment-reply' );
         }
+
+        // Maybe enqueue password verify JS (register page or user settings page)
+        if ( bp_is_register_page() || ( function_exists( 'bp_is_user_settings_general' ) && bp_is_user_settings_general() ) ) {
+            $min      = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ? '' : '.min';
+            $filename = "password-verify{$min}.js";
+
+            // Locate the Register Page JS file
+            $asset = $this->locate_asset_in_stack( $filename, 'js' );
+
+            // Enqueue script
+            $dependencies = array_merge( bp_core_get_js_dependencies(), array(
+                'password-strength-meter',
+            ) );
+            wp_enqueue_script( $asset['handle'] . '-password-verify', $asset['location'], $dependencies, $this->version);
+        }
     }
 

trunk/src/bp-templates/bp-legacy/buddypress/members/register.php

@@ -40 +40 @@
                 <label for="signup_password"><?php _e( 'Choose a Password', 'buddypress' ); ?> <?php _e( '(required)', 'buddypress' ); ?></label>
                 <?php do_action( 'bp_signup_password_errors' ); ?>
-                <input type="password" name="signup_password" id="signup_password" value="" />
+                <input type="password" name="signup_password" id="signup_password" value="" class="password-entry" />
+                <div id="pass-strength-result"></div>
 
                 <label for="signup_password_confirm"><?php _e( 'Confirm Password', 'buddypress' ); ?> <?php _e( '(required)', 'buddypress' ); ?></label>
                 <?php do_action( 'bp_signup_password_confirm_errors' ); ?>
-                <input type="password" name="signup_password_confirm" id="signup_password_confirm" value="" />
+                <input type="password" name="signup_password_confirm" id="signup_password_confirm" value="" class="password-entry-confirm" />
 
                 <?php do_action( 'bp_account_details_fields' ); ?>

trunk/src/bp-templates/bp-legacy/buddypress/members/single/settings/general.php

@@ -14 +14 @@
 
     <label for="pass1"><?php _e( 'Change Password <span>(leave blank for no change)</span>', 'buddypress' ); ?></label>
-    <input type="password" name="pass1" id="pass1" size="16" value="" class="settings-input small" /> &nbsp;<?php _e( 'New Password', 'buddypress' ); ?><br />
-    <input type="password" name="pass2" id="pass2" size="16" value="" class="settings-input small" /> &nbsp;<?php _e( 'Repeat New Password', 'buddypress' ); ?>
+    <input type="password" name="pass1" id="pass1" size="16" value="" class="settings-input small password-entry" /> &nbsp;<?php _e( 'New Password', 'buddypress' ); ?><br />
+    <div id="pass-strength-result"></div>
+    <input type="password" name="pass2" id="pass2" size="16" value="" class="settings-input small password-entry-confirm" /> &nbsp;<?php _e( 'Repeat New Password', 'buddypress' ); ?>
 
     <?php do_action( 'bp_core_general_settings_before_submit' ); ?>

trunk/src/bp-templates/bp-legacy/css/buddypress.css

@@ -530 +530 @@
     border: 1px solid #591;
     color: #250;
+}
+#buddypress #pass-strength-result {
+    background-color: #eee;
+    border-color: #ddd;
+    border-style: solid;
+    border-width: 1px;
+    display: none;
+    margin: 5px 5px 5px 0;
+    padding: 5px;
+    text-align: center;
+    width: 150px;
+}
+#buddypress .standard-form #basic-details-section #pass-strength-result {
+    width: 35%;
+}
+#buddypress #pass-strength-result.error,
+#buddypress #pass-strength-result.bad {
+    background-color: #ffb78c;
+    border-color: #ff853c !important;
+    display: block;
+}
+#buddypress #pass-strength-result.good {
+    background-color: #ffec8b;
+    border-color: #fc0 !important;
+    display: block;
+}
+#buddypress #pass-strength-result.short {
+    background-color: #ffa0a0;
+    border-color: #f04040 !important;
+    display: block;
+}
+#buddypress #pass-strength-result.strong {
+    background-color: #c3ff88;
+    border-color: #8dff1c !important;
+    display: block;
 }
 #buddypress .standard-form#signup_form div div.error {