fortify-js v2.2.2
Fortify.js
A password strength indicator.
Demo
http://codepen.io/adammy/pen/dNmGmr
CDN
Add a link to the css file in your <head>:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fortify-js@2.2.2/dist/fortify.min.css">Then, before your closing <body> tag add:
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/fortify-js@2.2.2/dist/fortify.min.js"></script>Package Managers
NPM
npm install fortify-js --saveBower
bower install fortify --saveUsage
Reference the fortify method on your password input fields like so:
<div>
<input type="password" id="password" />
</div>
<div>
<input type="password" id="confirm-password" />
</div>var field = document.getElementById('password');
var confirmField = document.getElementById('confirm-password');
var fortify = new Fortify(field, confirmField);Settings
When calling the Fortify constructor, you can pass it an object to overwrite some settings. See below:
var fortify = new Fortify(field, confirmField, {
allowSubmission: true,
feedback: true,
keyTimeout: 150,
progressBar: true,
callback: function (score, feedback) {
// 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.