dogeystamp/encryptme
1
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

improve hiding form elements

Browse Source
This commit is contained in:
dogeystamp 2022-12-30 14:32:27 -05:00
parent 2bcfefbd2a
commit 31c6958277
Signed by: dogeystamp
GPG Key ID: 7225FE3592EFFA38
2 changed files with 45 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
scripts/interface.js
View File

@ -1,5 +1,21 @@
class Form {
class Element {
#hidden = false;
get hidden() {
return this.#hidden;
}
set hidden(x) {
this.#hidden = x;
this.handle.hidden = this.hidden;
if (this.label !== undefined) {
this.label.hidden = this.hidden;
}
}
}
class Form extends Element {
constructor({id, formTag}) {
super();
this.id = id;
if (formTag !== undefined) {
@ -48,7 +64,7 @@ function bufToB64 (buf) {
return btoa(ascii);
}
class FormElement {
class FormElement extends Element {
#enabled = true;
get enabled() {
return this.#enabled;
@ -58,20 +74,8 @@ class FormElement {
this.handle.disabled = !this.#enabled;
}
#hidden = true;
get hidden() {
return this.#hidden;
}
set hidden(x) {
this.#hidden = x;
this.handle.hidden = this.hidden;
if (this.label !== undefined) {
this.label.hidden = this.hidden;
}
}
constructor({id, type, form, label="", dataType="plaintext", advanced=false, enabled=true}) {
super();
this.id = id;
this.advanced = advanced;
@ -160,8 +164,11 @@ class FormElement {
case "plaintext":
return this.handle.value;
case "b64":
// TODO: error handling
return b64ToBuf(this.handle.value);
try {
return b64ToBuf(this.handle.value);
} catch (e) {
// TODO
}
case "none":
return undefined;
}

22
style.css
View File

@ -27,6 +27,10 @@ textarea {
resize: none;
}
input {
height: 100%;
}
label, input, button, textarea {
display: block;
margin-top: 1em;
@ -52,8 +56,24 @@ textarea:disabled, input:disabled {
}
[hidden] {
height: 0;
animation: fadeOut 0.2s, disappear 0.3s;
opacity: 0;
visibility: hidden;
max-height: 0;
margin: 0;
}
@keyframes fadeOut {
0% {opacity: 1; visibility: visible;}
100% {opacity: 0; visibility: hidden;}
}
@keyframes disappear {
0% {
max-height: 100em;
}
100% {
max-height: 0;
margin: 0;
}
}
p {