dynamically disabled up/down buttons
This commit is contained in:
parent
11cc78b6be
commit
b8059ce62a
@ -1,6 +1,7 @@
|
|||||||
// nostalgia for a simpler, more complicated time
|
// nostalgia for a simpler, more complicated time
|
||||||
const $ = document.querySelector.bind(document);
|
const $ = document.querySelector.bind(document);
|
||||||
const $$ = document.querySelectorAll.bind(document);
|
const $$ = document.querySelectorAll.bind(document);
|
||||||
|
const initialLines = 10;
|
||||||
|
|
||||||
class Button extends HTMLButtonElement {
|
class Button extends HTMLButtonElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
@ -25,24 +26,54 @@ class LineUpper extends Button {
|
|||||||
click() {
|
click() {
|
||||||
const l = this.closest("div.linecontainer").parentElement;
|
const l = this.closest("div.linecontainer").parentElement;
|
||||||
const s = l.previousElementSibling;
|
const s = l.previousElementSibling;
|
||||||
if (s == null) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
s.before(l);
|
s.before(l);
|
||||||
|
this.checkDisabled();
|
||||||
|
s.querySelector("button[is=line-upper]").checkDisabled()
|
||||||
|
s.querySelector("button[is=line-downer]").checkDisabled()
|
||||||
|
}
|
||||||
|
|
||||||
|
checkDisabled() {
|
||||||
|
const l = this.closest("div.linecontainer").parentElement;
|
||||||
|
if (l.previousElementSibling == null) {
|
||||||
|
this.setAttribute("disabled", "yeah");
|
||||||
|
} else {
|
||||||
|
this.removeAttribute("disabled");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
connectedCallback() {
|
||||||
|
this.checkDisabled();
|
||||||
}
|
}
|
||||||
// TODO connectedCallback to disable this if first in list
|
|
||||||
// TODO change callback (i forget what it's called but i think i saw it) to enable if not first in list
|
|
||||||
}
|
}
|
||||||
|
|
||||||
class LineDowner extends Button {
|
class LineDowner extends Button {
|
||||||
click() {
|
click() {
|
||||||
const l = this.closest("div.linecontainer").parentElement;
|
const l = this.closest("div.linecontainer").parentElement;
|
||||||
const s = l.nextElementSibling;
|
const s = l.nextElementSibling;
|
||||||
if (s == null) return;
|
|
||||||
s.after(l);
|
s.after(l);
|
||||||
|
this.checkDisabled()
|
||||||
|
s.querySelector("button[is=line-downer]").checkDisabled()
|
||||||
|
s.querySelector("button[is=line-upper]").checkDisabled()
|
||||||
|
}
|
||||||
|
|
||||||
|
checkDisabled() {
|
||||||
|
const l = this.closest("div.linecontainer").parentElement;
|
||||||
|
if (l.nextElementSibling == null) {
|
||||||
|
this.setAttribute("disabled", "yeah");
|
||||||
|
} else {
|
||||||
|
this.removeAttribute("disabled");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
connectedCallback() {
|
||||||
|
const count = $$("button[is=line-downer]").length;
|
||||||
|
console.log(count);
|
||||||
|
console.log(initialLines);
|
||||||
|
if (count != initialLines) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.checkDisabled();
|
||||||
}
|
}
|
||||||
// TODO connectedCallback to disable this if last in list
|
|
||||||
// TODO change callback (i forget what it's called but i think i saw it) to enable if not last in list
|
|
||||||
}
|
}
|
||||||
|
|
||||||
class LineAdder extends Button {
|
class LineAdder extends Button {
|
||||||
@ -97,7 +128,7 @@ class Lines extends HTMLDivElement {
|
|||||||
if (this.connected) {
|
if (this.connected) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
for (var i = 0; i < 10; i++) {
|
for (var i = 0; i < initialLines; i++) {
|
||||||
this.add();
|
this.add();
|
||||||
}
|
}
|
||||||
this.connected = true
|
this.connected = true
|
||||||
|
@ -35,6 +35,8 @@ func main() {
|
|||||||
'=': true,
|
'=': true,
|
||||||
'`': true,
|
'`': true,
|
||||||
'-': true,
|
'-': true,
|
||||||
|
// TODO try adding |. it breaks up content that we don't generally want,
|
||||||
|
// anyway, and will lead to short garby phrases being discarded. i think.
|
||||||
}
|
}
|
||||||
|
|
||||||
s := bufio.NewScanner(os.Stdin)
|
s := bufio.NewScanner(os.Stdin)
|
||||||
|
Loading…
x
Reference in New Issue
Block a user