Merge b4cde22cfc into 35faa2afcf

package.json

@@ -11,30 +11,30 @@
   "author": "Quantum",
   "license": "AGPL-3.0-only",
   "devDependencies": {
+    "webpack": "4",
+    "css-loader": "5",
+    "file-loader": "6",
+    "optimize-css-assets-webpack-plugin": "6",
+    "mini-css-extract-plugin": "1",
+    "html-webpack-plugin": "4",
+    "terser-webpack-plugin": "4",
+    "node-sass": "8",
+    "sass-loader": "10",    
     "autoprefixer": "^9.8.0",
-    "css-loader": "^1.0.1",
     "ejs-loader": "^0.5.0",
     "exports-loader": "^0.7.0",
-    "file-loader": "^2.0.0",
     "html-loader": "^1.1.0",
-    "html-webpack-plugin": "^3.2.0",
-    "mini-css-extract-plugin": "^0.4.5",
     "mocha": "^8.1.3",
-    "node-sass": "^4.14.1",
-    "optimize-css-assets-webpack-plugin": "^5.0.3",
     "postcss-loader": "^3.0.0",
     "rimraf": "^2.7.1",
-    "sass-loader": "^7.3.1",
     "style-loader": "^0.23.1",
-    "terser-webpack-plugin": "latest",
-    "webpack": "^4.43.0",
     "webpack-cli": "^3.3.11"
   },
   "dependencies": {
     "bootstrap": "^4.5.0",
-    "clipboard": "^2.0.6",
-    "core-js": "^2.6.11",
-    "cross-env": "^5.2.1",
+    "core-js": "2",
+    "cross-env": "7.0.3",
+    "clipboard": "latest",
     "form-serializer": "^2.5.0",
     "jquery": "^3.5.1",
     "octicons": "^8.5.0",

src/clipboard.js

@@ -3,8 +3,7 @@ import $ from 'jquery/dist/jquery'
 import 'popper.js'
 import 'bootstrap/js/dist/tooltip'
 
-$(() => {
-  function showTooltip ($element, message) {
+export function showTooltip ($element, message) {
     $element.tooltip('dispose')
       .attr('data-original-title', message)
       .tooltip('show')
@@ -12,6 +11,7 @@ $(() => {
     setTimeout(() => $element.tooltip('dispose'), 1000)
   }
 
+$(() => {
   new Clipboard('.copy', {})
     .on('success', e => showTooltip($(e.trigger), 'Copied!'))
     .on('error', e => showTooltip($(e.trigger), 'Failed to copy!'))

src/index.ejs

@@ -93,6 +93,10 @@
             <input class="form-check-input" type="checkbox" id="use-digit" name="digit">
             <label for="use-digit">Add a digit</label>
           </div>
+          <div class="form-check">
+            <input class="form-check-input" type="checkbox" id="copy-after-generate" name="copy">
+            <label for="copy-after-generate">Automatically copy the password on generation</label>
+          </div>
         </div>
       </div>
 
@@ -243,4 +247,4 @@
 </footer>
 
 </body>
-</html>
+</html>

src/ui.js

@@ -1,5 +1,7 @@
+const Clipboard = require('clipboard/dist/clipboard')
 import $ from 'jquery/dist/jquery'
 import 'form-serializer/jquery.serialize-object'
+import { showTooltip } from './clipboard'
 
 import { generate, computeBits, defaultSymbol } from './generator'
 
@@ -12,6 +14,7 @@ $(() => {
     list: 'large',
     count: 4,
     symbol: true,
+    copy: false,
     separator: defaultSymbol,
   }
 
@@ -61,6 +64,10 @@ $(() => {
     $('#run-generator').click(() => {
       const options = $options.serializeObject()
       $output.text(generate(options)).removeClass('placeholder')
+      if(options.copy) {
+        const checkCopy = Clipboard.copy(document.querySelector("#generated-password"))
+        showTooltip($('#run-generator'), checkCopy ? 'Copied!' : 'Failed to copy!')
+      }
       $('#copy-password').prop('disabled', false)
       return false
     })