feat(Register): Can't copy password and paste to retyep_password

1. Can't copy password and paste to retyep_password 2. Redesign help block with list tag `<ul>`,`<li>` Signed-off-by: Rhilip <rhilipruan@gmail.com>
Rhilip · Jun 6, 2019 · 2cb15e6 · 2cb15e6
1 parent 1c1f31b
commit 2cb15e6
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 5 deletions.
diff --git a/apps/public/static/js/main.js b/apps/public/static/js/main.js
@@ -124,7 +124,12 @@ jQuery(document).ready(function() {
                     let result = zxcvbn(val);
                     password_strength.show();
                     strength_text.html(paswordStrengthText[result.score]);
-                    strength_suggest.html( (result.feedback.warning !== "" ? (result.feedback.warning + "<br>") : "") + result.feedback.suggestions);
+                    let feedback = [];
+                    if (result.feedback.warning !== "") {feedback.push(result.feedback.warning);}
+                    feedback = feedback.concat(result.feedback.suggestions);
+                    if (feedback.length > 0) {
+                        strength_suggest.html('<ul><li>' + feedback.join('</li><li>') + '</li></ul>');
+                    }
                 } catch (e) {
                 }
             } else {

diff --git a/apps/views/auth/register.php b/apps/views/auth/register.php
@@ -47,7 +47,14 @@
                                         <input type="text" class="form-control" id="username" name="username" required
                                                value="<?= $username ?? '' ?>">
                                     </div>
-                                    <div class="help-block">Max Length 12 with those character: <code>A-Za-z0-9_</code></div>
+                                    <div class="help-block">
+                                        <ul>
+                                            <?php if (strtolower($register_type) == 'invite'): ?>
+                                             <li>You are invited by one of our member, Please retype your username without any change.</li>
+                                            <?php endif;?>
+                                            <li>Max Length 12 with those character: <code>A-Za-z0-9_</code></li>
+                                        </ul>
+                                    </div>
                                 </div>
 
                                 <div class="form-group">
@@ -63,10 +70,12 @@
                                     <label for="password">Password</label>
                                     <div class="pull-right" id="password_strength" style="display: none">
                                         Strength: <span id="password_strength_text"></span>
-                                    </div> <!-- TODO add password strength check -->
+                                    </div>
                                     <div class="input-group">
                                         <span class="input-group-addon"><span class="fas fa-key fa-fw"></span></span>
-                                        <input type="password" class="form-control" id="password" name="password" required>
+                                        <input type="password" class="form-control" id="password" name="password" required
+                                               oncopy="return false;"
+                                        >
                                         <button id="password_help_btn" type="button" class="btn btn-link auth-password-help-btn"><i class="fas fa-eye fa-fw"></i></button>
                                     </div>
                                     <div class="help-block" id="password_strength_suggest"></div>
@@ -76,7 +85,9 @@
                                     <label for="password_again">Retype Password</label>
                                     <div class="input-group">
                                         <span class="input-group-addon"><span class="fas fa-key fa-fw"></span></span>
-                                        <input type="password" class="form-control" id="password_again" name="password_again" required>
+                                        <input type="password" class="form-control" id="password_again" name="password_again" required
+                                               onpaste="return false;"
+                                        >
                                     </div>
                                 </div>