Fortify.js
A password strength indicator.
Demo
http://codepen.io/adammy/pen/dNmGmr
CDN
Add a link to the css file in your <head>
:
Then, before your closing <body>
tag add:
Package Managers
NPM
npm install fortify-js --save
Bower
bower install fortify --save
Usage
Reference the fortify method on your password input fields like so:
var field = document;var confirmField = document;var fortify = field confirmField;
Settings
When calling the Fortify constructor, you can pass it an object to overwrite some settings. See below:
var fortify = field confirmField allowSubmission: true feedback: true keyTimeout: 150 progressBar: true { // your code };
Details of each setting are below:
allowSubmission (boolean)
Default value: true
If true, the parent form to your fields can freely submit without interference from Fortify. If false, the form can only be submitted when the password is at least 'good' and the confirm password field matches the password field.
feedback (boolean)
Default value: true
If true, password strength feedback will be displayed to the user. If false, feedback will not be shown, but Fortify can still be used by your application via the callback function.
keyTimeout (number)
Default value: 150
The amount of time (in milliseconds) it takes for the password script to run when the user stops typing.
progressBar (boolean)
Default value: true
If true, user feedback will be shown in the form of a progress bar. If false, the bar will just be a full block display containing the string feedback.
callback (function)
Default value: undefined
Parameters: score, feedback
Lets you do whatever you want with the data being generated.