mardi 11 juillet 2017

convert single password generator to multiple

I' working with the password generator code at the snippet below. At the moment the generator is creating one password at a time but i want to extent its functionality and make it create multiple different passwords, depending on the number that the user is giving as input at the Number of Passwords field.

var CHARACTER_TABLE = [
  [true, "Numbers", "0123456789"],
  [true, "Lowercase", "abcdefghijklmnopqrstuvwxyz"],
  [false, "Upercase", "ABCDEFGHIJKLMNOPQRSTUVWXYZ"],
  [false, "Symbols", "!\"#$%" + String.fromCharCode(38) + "'()*+,-./:;" + String.fromCharCode(60) + "=>?@[\\]^_`{|}~"],
  [false, "Empty space", " "],
]; 

var passwordContent = document.createTextNode("");
var statisticsContent = document.createTextNode("\u00A0");

function init() {
  document.getElementById("generatedPassword").appendChild(passwordContent);
  document.getElementById("generatedStatistics").appendChild(statisticsContent);
  var items = document.createDocumentFragment();
  CHARACTER_TABLE.forEach(function(key, x){
    var spanItem = document.createElement("span");
    var inputItem = document.createElement("input");
    inputItem.type = "checkbox";
    inputItem.checked = key[0];
    inputItem.id = "charset-" + x;
    spanItem.appendChild(inputItem);
    var labelItem = document.createElement("label");
    labelItem.htmlFor = inputItem.id;
    labelItem.appendChild(document.createTextNode(" " + key[1] + " "));
    var detailsItem = document.createElement("em");
    detailsItem.appendChild(document.createTextNode("(" + key[2] + ")"));
    labelItem.appendChild(detailsItem);
    spanItem.appendChild(labelItem);
    items.appendChild(spanItem);
    items.appendChild(document.createElement("br"));
  });
  var itemsWrapper = document.getElementById("charset-options");
  itemsWrapper.insertBefore(items, itemsWrapper.firstChild);
}

init();

function generatePassword() {
  var charsetTxt = "";
  CHARACTER_TABLE.forEach(function(key, x){
    if (document.getElementById("charset-" + x).checked) {
      charsetTxt += key[2];
    }
  });
  if (document.getElementById("special").checked){
    charsetTxt += document.getElementById("specialchars").value;
    charsetTxt = charsetTxt.replace(/ /, "\u00A0");
  }
  var charsetArray = [];
  for (var i = 0; charsetTxt.length > i; i++) {
    var character = charsetTxt.charCodeAt(i);
    var placeholder = null;
    if (0xD800 > character || character >= 0xE000) {
      placeholder = charsetTxt.charAt(i);
    } else if (character >= 0xD800 ? 0xDC00 > character : false){
        if (charsetTxt.length > i + 1) {
         var next = charsetTxt.charCodeAt(i + 1);
          if (next >= 0xDC00 ? 0xE000 > next : false) {
            placeholder = charsetTxt(i, 2);
            i++;
          }
        }
      } else if (next >= 0xDC00 ? 0xE000 > next : false) {
        i++;
      } else {
        throw "Assertion error";
      }
    if (placeholder != null ? charsetArray.indexOf(placeholder) == -1 : false) {
      charsetArray.push(placeholder);
    }
  }

var thePassword = "";
var theStatistics = "";
if (charsetArray.length == 0) {
  alert("Error: Character set is empty");
} else {
  var theLength;
  if (document.getElementById("select-length").checked) {
    theLength = parseInt(document.getElementById("length").value, 10);
  } else {
    throw "Assertion error";
  }
  if (0 > theLength) {
    alert("Negative password length");
  } else if (theLength > 10000) {
    slert("Password length too large");
  } else {
    for (var i = 0; theLength > i; i++) {
      thePassword += charsetArray[randomInt(charsetArray.length)];
      theStatistics = "Length = " + theLength + " chars";
    }
  }
}
  passwordContent.data = thePassword;
  statisticsContent.data = theStatistics;
}

$('#generator').on('click', generatePassword);

function randomInt(n) {
        var x = randomIntMathRandom(n);
        x = (x + randomIntBrowserCrypto(n)) % n;
        return x;
}

function randomIntMathRandom(n) {
        var x = Math.floor(Math.random() * n);
        if (0 > x || x >= n) {
                throw "Arithmetic exception";
  }
        return x;
}

var cryptoObject = null;

function randomIntBrowserCrypto(n) {
        if (cryptoObject == null) {
                return 0;
  }
        var x = new Uint32Array(1);
        do cryptoObject.getRandomValues(x);
        while (x[0] - x[0] % n > 4294967296 - n);
        return x[0] % n;
}
#generator {
    display:inline-block;
    color:#444;
    border:1px solid #CCC;
    background:#DDD;
    box-shadow: 0 0 5px -1px rgba(0,0,0,0.2);
    cursor:pointer;
    vertical-align:middle;
    max-width: 100px;
    padding: 5px;
    text-align: center;
}
#generator:active {
    color:red;
    box-shadow: 0 0 5px -1px rgba(0,0,0,0.6);
}
<script src="http://ift.tt/1oMJErh"></script>
<h1>Generate Password</h1>
                <form>
                        <div id="charset" class="section">
                                <div>
                                        <p>Character set:</p>
                                        <p id="charset-options">
                                                <span><input type="checkbox" id="special"> <label for="special">Special:</label> <input type="text" id="specialchars" value="" size="15" style="width:10em; font-size:80%; line-height:1.5" oninput="document.getElementById('special').checked=true;"></span>
                                        </p>
                                </div>
                        </div>
                        
                        <div class="section">
                                <div>
                                        <table>
                                                <tbody>
                                                        <tr>
                                                                <td><input type="hidden" name="type" id="select-length" checked="checked"> <label for="select-length">Length:&#xA0;</label></td>
                                                                <td><input type="number" min="0" value="10" step="1" id="length" style="width:4em"> characters</td>
                                                        </tr>
              <tr>
                                                                <td><input type="hidden" name="amount" id="select-amount"> <label for="select-amount">Number of Passwords:&#xA0;</label></td>
                                                                <td><input type="number" min="0" value="1" step="1" id="amount" style="width:4em"></td>
                                                        </tr>
                                                </tbody>
                                        </table>
                                </div>
                        </div>
      <br>
      <div id="generator" style="padding:0.5em 0.5em">Generate</div>:
                                <span id="generatedPassword"></span>
                        <p id="generatedStatistics"></p>
                </form>



Aucun commentaire:

Enregistrer un commentaire