️ This Gitlab will be shut down at 2021-12-31 23:59:59.
Students and staff can migrate to gitlab.utwente.nl.
SNT members can migrate to gitlab.snt.utwente.nl.
Contact bestuur@snt.utwente.nl for more information.

Migrate your projects today!
Export your project using the webinterface or use a script.

Commit de100c9d authored by Silke Hofstra's avatar Silke Hofstra

Add copy button

parent 15f1df6b
Pipeline #43312 passed with stages
in 1 minute and 5 seconds
......@@ -5,6 +5,8 @@ language: Nederlands
licence: Licentie
text:
generate: Genereer
copy: Kopieer
copied: Gekopieerd!
list: Lijst
words: Woorden
licenced: In licentie gegeven krachtens de
......
<h1 id="password">&nbsp;</h1>
<textarea id="password">&nbsp;</textarea>
<p>
{{ .Params.text.description | safeHTML }}
</p>
<p>
<a class="generate button" href="#" role="button" onclick="generate()">{{ .Params.text.generate }}</a>
<a id="generate" class="generate button" href="#" role="button" onclick="generate()">{{ .Params.text.generate }}</a>
<a id="copy" class="copy button" href="#" role="button" onclick="copy()" name="{{ .Params.text.copied }}">{{ .Params.text.copy }}</a>
</p>
<span class="setting">
{{ .Params.text.list }}:
......@@ -12,4 +14,4 @@
<span class="setting">
{{ .Params.text.words }}:
<input id="password-length" type="number" value="4" min="4"/>
</span>
\ No newline at end of file
</span>
......@@ -141,7 +141,10 @@ function generate() {
// Check if the password has as much entropy as the individual letters
if (gen.join("").length >= minLength) {
// Display the password
setHTML("h1#password", gen.join(settings.joinChar));
const pw = document.getElementById("password");
pw.value = gen.join(settings.joinChar);
pw.style.height = "";
pw.style.height = pw.scrollHeight + "px";
} else {
// Try again
console.log(
......@@ -255,6 +258,24 @@ function init() {
});
}
// Copy password to clipboard
function copy() {
"use strict";
let pw = document.getElementById("password");
pw.select();
pw.setSelectionRange(0, 99999);
navigator.clipboard.writeText(pw.value)
.then(() => {
const button = document.getElementById("copy");
const oldText = button.innerText;
button.innerText = button.name;
setTimeout(() => {
button.innerText = oldText;
}, 1500);
});
}
// Initialise the password generator.
try {
init();
......
......@@ -74,9 +74,29 @@ main {
background-color: #D3D3D3;
}
main #password {
font-weight: 600;
font-size: 1.5em;
text-align: center;
width: 80%;
height: 0;
word-break: break-word;
margin-top: 1em;
/* reset styling */
font-family: inherit;
resize: none;
border: none;
background-image: none;
background-color: transparent;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
main .button {
font-size: 110%;
margin: .5em 0;
margin: .5em 0.25em;
}
main .setting {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment