Adapt the interface to generate passphrase too (#267)

src/app/tools/password-generator.component.html

@@ -6,7 +6,17 @@
         {{password}}
     </div>
 </div>
-<div class="row">
+<div class="form-group">
+    <div class="form-check">
+        <input id="generate-password" name="generator-type" value="generate-password" class="form-check-input" type="radio" (change)="saveOptions()" [(ngModel)]="options.generateTypePassword">
+        <label for="generate-password">{{'generatePassword' | i18n}}</label>
+    </div>
+    <div class="form-check">
+        <input id="generate-passphrase" name="generator-type" value="generate-passphrase" class="form-check-input" type="radio" (change)="saveOptions()" [(ngModel)]="options.generateTypePassword">
+        <label for="generate-passphrase">{{'generatePassphrase' | i18n}}</label>
+    </div>
+</div>
+<div class="row typePassword" *ngIf="options.generateTypePassword != 'generate-passphrase'">
     <div class="form-group col-4">
         <label for="length">{{'length' | i18n}}</label>
         <input id="length" class="form-control" type="number" min="5" max="128" [(ngModel)]="options.length" (blur)="saveOptions()">
@@ -20,7 +30,13 @@
         <input id="min-special" class="form-control" type="number" min="0" max="9" (input)="saveOptions()" [(ngModel)]="options.minSpecial">
     </div>
 </div>
-<div class="form-group">
+<div class="row typePassphrase" *ngIf="options.generateTypePassword == 'generate-passphrase'">
+    <div class="form-group col-4">
+        <label for="num-words">{{'numWords' | i18n}}</label>
+        <input id="num-words" class="form-control" type="number" min="3" max="128" [(ngModel)]="options.numWords" (blur)="saveOptions()">
+    </div>
+</div>
+<div class="form-group typePassword" *ngIf="options.generateTypePassword != 'generate-passphrase'">
     <div class="form-check">
         <input id="uppercase" class="form-check-input" type="checkbox" (change)="saveOptions()" [(ngModel)]="options.uppercase">
         <label for="uppercase" class="form-check-label">A-Z</label>

src/locales/en/messages.json

@@ -207,6 +207,9 @@
   "generatePassword": {
     "message": "Generate Password"
   },
+  "generatePassphrase": {
+    "message": "Generate Passphrase"
+  },
   "checkPassword": {
     "message": "Check if password has been exposed."
   },
@@ -798,6 +801,9 @@
   "length": {
     "message": "Length"
   },
+  "numWords": {
+    "message": "Number of Words"
+  },
   "passwordHistory": {
     "message": "Password History"
   },