some cleanup

This commit is contained in:
nate smith 2024-02-14 20:35:22 -08:00
parent 34a67f2c71
commit c397766687
2 changed files with 21 additions and 21 deletions

View File

@ -13,7 +13,7 @@ class Button extends HTMLButtonElement {
class LineRemover extends Button { class LineRemover extends Button {
click() { click() {
const container = this.closest("div.linecontainer").parentElement; const container = this.closest("div.line");
const gp = container.parentElement; const gp = container.parentElement;
container.remove(); container.remove();
gp.dispatchEvent(reorder); gp.dispatchEvent(reorder);
@ -22,7 +22,7 @@ class LineRemover extends Button {
class LinePinner extends Button { class LinePinner extends Button {
click() { click() {
const l = this.closest("div.linecontainer"); const l = this.closest("div.line");
l.classList.toggle("unpinned"); l.classList.toggle("unpinned");
if (l.classList.contains("unpinned")) { if (l.classList.contains("unpinned")) {
this.innerText = "pin"; this.innerText = "pin";
@ -34,14 +34,14 @@ class LinePinner extends Button {
class LineUpper extends Button { class LineUpper extends Button {
click() { click() {
const l = this.closest("div.linecontainer").parentElement; const l = this.closest("div.line");
const s = l.previousElementSibling; const s = l.previousElementSibling;
s.before(l); s.before(l);
this.dispatchEvent(reorder); this.dispatchEvent(reorder);
} }
checkDisabled() { checkDisabled() {
const l = this.closest("div.linecontainer").parentElement; const l = this.closest("div.line");
if (l.previousElementSibling == null) { if (l.previousElementSibling == null) {
this.setAttribute("disabled", "yeah"); this.setAttribute("disabled", "yeah");
} else { } else {
@ -52,14 +52,14 @@ class LineUpper extends Button {
class LineDowner extends Button { class LineDowner extends Button {
click() { click() {
const l = this.closest("div.linecontainer").parentElement; const l = this.closest("div.line");
const s = l.nextElementSibling; const s = l.nextElementSibling;
s.after(l); s.after(l);
this.dispatchEvent(reorder); this.dispatchEvent(reorder);
} }
checkDisabled() { checkDisabled() {
const l = this.closest("div.linecontainer").parentElement; const l = this.closest("div.line");
if (l.nextElementSibling == null) { if (l.nextElementSibling == null) {
this.setAttribute("disabled", "yeah"); this.setAttribute("disabled", "yeah");
} else { } else {
@ -77,7 +77,7 @@ class LineAdder extends Button {
class PoemRegenner extends Button { class PoemRegenner extends Button {
click() { click() {
$$(".unpinned").forEach((e) => { $$(".unpinned").forEach((e) => {
e.parentElement.regen(); e.regen();
}); });
} }
} }
@ -131,7 +131,7 @@ class PoemLines extends HTMLDivElement {
connectedCallback() { connectedCallback() {
this.init(); this.init();
addEventListener("beforeunload", (e) => { addEventListener("beforeunload", (e) => {
if ($$("div.linecontainer:not(.unpinned)").length > 0) { if ($$("div.line:not(.unpinned)").length > 0) {
e.preventDefault(); e.preventDefault();
} }
}); });
@ -144,14 +144,16 @@ class PoemLines extends HTMLDivElement {
} }
reset() { reset() {
this.querySelectorAll("div.linecontainer").forEach((e) => { this.querySelectorAll("div.line").forEach((e) => {
e.parentElement.remove(); e.remove();
}); });
this.init() this.init()
} }
add() { add() {
var ld = document.createElement("div", {is: "poem-line"}); var ld = document.createElement("div", {is: "poem-line"});
ld.classList.add("line"); // div[is=poem-line] isn't working, idk why.
ld.classList.add("unpinned");
this.append(ld); this.append(ld);
ld.regen(); ld.regen();
this.dispatchEvent(reorder); this.dispatchEvent(reorder);

View File

@ -6,7 +6,7 @@
#blueprint { #blueprint {
display: none; display: none;
} }
div.linecontainer:not(.unpinned) { div.line:not(.unpinned) {
font-weight: bold; font-weight: bold;
} }
button[is=line-pinner] { button[is=line-pinner] {
@ -16,16 +16,14 @@
</head> </head>
<body> <body>
<template id="linetmpl"> <template id="linetmpl">
<div class="linecontainer unpinned"> <span class="linecontrols">
<span class="linecontrols"> <button is="line-pinner">pin</button>
<button is="line-pinner">pin</button> <button >edit</button>
<button >edit</button> <button is="line-upper">up</button>
<button is="line-upper">up</button> <button is="line-downer">down</button>
<button is="line-downer">down</button> <button is="line-remover">remove</button>
<button is="line-remover">remove</button> </span>
</span> <span class="linetext"></span>
<span class="linetext"></span>
</div>
</template> </template>
<h1>Trunkless</h1> <h1>Trunkless</h1>
<script src="/main.js"></script> <script src="/main.js"></script>