Pass-WORDs Plugin

Share

Want to see pass-WORDs in action? You can find that here.

Want to cut to the chase and download a copy of your own so that you can go play? Here you go.

This plug-in is written in plain ol’ vanilla JavaScript and is not dependent on any other libraries (such as jQuery).

There are just three things you need to do to include the Pass-WORDs generator on your web page:

  1. Include the HTML markup for the controls and the containers that hold them and the passwords
  2. Include the JavaScript plug-in that does all the heavy lifting
  3. Activate the plugin

1. HTML Markup

Somewhere within the body of your page, you’ll need to include markup similar to the example below. You can customize the text if you like – and if you delve into the script itself, you’ll see that you can change the names of the controls too. There are also plenty of hooks for CSS, so you can customize the appearance.

<div id="possibilities"></div>
Generate
<select id="count"></select>
password(s) with
<select id="length"></select>
words, separated with
<select id="sep"></select><br>
<button id="doIt">Do it!</button>
<div id="results"></div>

2. Include the JavaScript plugin

You’ll need to host the script itself somewhere – then adjust the path/to the file to reflect that location

<script src="path/to/wordPassword.js"></script>

3. Activate the plugin

Once the other pieces are in place (steps 1 and 2), all you have to do is run it. Here are two examples of how to do that…

<script>
// using all the defaults...
var gen = new document.PassWORDs( );
</script>

Alternatively, you can change some of the default options to make the plugin a little more “yours”.

<script>
// customizing what happens...
var gen = new document.PassWORDs( {
runOnLoad: true,
lingo: 'potential combos'
} );
</script>

4. Enjoy!

Share

Leave a Reply

Your email address will not be published. Required fields are marked *

%d bloggers like this: