Skip to content

Commit

Permalink
Maskable password strength meter during setup
Browse files Browse the repository at this point in the history
  • Loading branch information
Bloke committed Nov 10, 2015
1 parent fe6d087 commit 2846140
Show file tree
Hide file tree
Showing 2 changed files with 37 additions and 8 deletions.
35 changes: 28 additions & 7 deletions textpattern/setup/index.php
Expand Up @@ -76,17 +76,28 @@
$rel_txpurl = rtrim(dirname(dirname($_SERVER['PHP_SELF'])), '/\\');
$bodyclass = ($step == '') ? ' welcome' : '';

print <<<eod
echo <<<eod
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="robots" content="noindex, nofollow">
<title>Setup &#124; Textpattern CMS</title>
<script src="../vendors/jquery/jquery/jquery.js"></script>
<script src="../vendors/jquery/jquery-ui/jquery-ui.js"></script>
<script>var textpattern = { do_spellcheck: "", textarray: {} };</script>
<script src="../textpattern.js"></script>
eod;

echo script_js('../vendors/jquery/jquery/jquery.js', TEXTPATTERN_SCRIPT_URL).
script_js('../vendors/jquery/jquery-ui/jquery-ui.js', TEXTPATTERN_SCRIPT_URL).
script_js('../vendors/dropbox/zxcvbn/zxcvbn.js', TEXTPATTERN_SCRIPT_URL).
script_js(
'var textpattern = '.json_encode(array(
'event' => 'setup',
'step' => $step,
'do_spellcheck' => '',
'textarray' => (object) null,
)).';').
script_js('../textpattern.js', TEXTPATTERN_SCRIPT_URL);

echo <<<eod
<link rel="stylesheet" href="../theme/hive/assets/css/textpattern.min.css">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
</head>
Expand Down Expand Up @@ -222,7 +233,12 @@ function getDbInfo()
).
inputLabel(
'setup_mysql_pass',
fInput('text', 'dpass', (isset($_SESSION['dpass']) ? txpspecialchars($_SESSION['dpass']) : ''), '', '', '', INPUT_REGULAR, '', 'setup_mysql_pass'),
fInput('password', 'dpass', (isset($_SESSION['dpass']) ? txpspecialchars($_SESSION['dpass']) : ''), 'txp-maskable', '', '', INPUT_REGULAR, '', 'setup_mysql_pass').
n.tag(null, 'div', array('class' => 'strength-meter')).
n.tag(
checkbox('unmask', 1, false, 0, 'show_password').
n.tag(gTxt('show_password'), 'label', array('for' => 'show_password')),
'div', array('class' => 'show-password')),
'mysql_password', '', array('class' => 'txp-form-field')
).
inputLabel(
Expand Down Expand Up @@ -512,7 +528,12 @@ function getTxpLogin()
).
inputLabel(
'setup_user_pass',
fInput('text', 'pass', (isset($_SESSION['pass']) ? txpspecialchars($_SESSION['pass']) : ''), '', '', '', INPUT_REGULAR, '', 'setup_user_pass', '', true),
fInput('password', 'pass', (isset($_SESSION['pass']) ? txpspecialchars($_SESSION['pass']) : ''), 'txp-maskable', '', '', INPUT_REGULAR, '', 'setup_user_pass', '', true).
n.tag(null, 'div', array('class' => 'strength-meter')).
n.tag(
checkbox('unmask', 1, false, 0, 'show_password').
n.tag(gTxt('show_password'), 'label', array('for' => 'show_password')),
'div', array('class' => 'show-password')),
'choose_password', 'setup_user_pass', array('class' => 'txp-form-field')
).
inputLabel(
Expand Down
10 changes: 9 additions & 1 deletion textpattern/textpattern.js
Expand Up @@ -1556,6 +1556,14 @@ function txp_search()

var cookieEnabled = true;

// Setup panel.

textpattern.Route.add('setup', function ()
{
textpattern.passwordMask();
textpattern.passwordStrength();
});

// Login panel.

textpattern.Route.add('login', function ()
Expand Down Expand Up @@ -1657,7 +1665,7 @@ textpattern.Route.add('form', function ()
});
});

// Admin panel
// Admin panel.

textpattern.Route.add('admin', function ()
{
Expand Down

5 comments on commit 2846140

@phiw13
Copy link

@phiw13 phiw13 commented on 2846140 Nov 10, 2015

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don’t think it makes sense to have the strength-meter display for the setup_mysql_pass (step 2 of set up). You’re not creating a password at this step, but inputting some required data from an outside source (the password needed to access the DB).

@philwareham
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I was thinking the same thing. Stef can you revert that part of the commit?

@Bloke
Copy link
Member Author

@Bloke Bloke commented on 2846140 Nov 11, 2015

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sure. The only reason I added it was:

  • most of the time I'm the one setting up the MySQL database connection password so it's a handy test to see if the password I chose for the user is any good :-)
  • fields that are set as password aren't saved in the browser's auto-complete system, thus reducing the likelihood of seeing your MySQL password popping up when you type the first character in another field somewhere.

But if these aren't strong enough reasons to keep it then we can just remove the txp-maskable class and revert it to a standard type="text" and all the extra fluff goes away.

@phiw13
Copy link

@phiw13 phiw13 commented on 2846140 Nov 11, 2015

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The input type=password is fine (and you can add that script thingie to unmask it), it is the strength-meter that makes no sense.

(and fwiw I never had my browser(s) auto-complete text like you describe, is that a Google thing?)

@Bloke
Copy link
Member Author

@Bloke Bloke commented on 2846140 Nov 11, 2015

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK, good point. Unfortunately both show_password and the strength meter are tied to the same class: txp-maskable so they come as a pair. I'll need to either introduce a new class specifically for the strength meter or just drop the strength meter container in this case (which still leaves the event handler in play: probably less desirable). Leave it with me.

Please sign in to comment.