use a template

This commit is contained in:
nate smith 2024-02-17 01:55:23 -08:00
parent b7470d8dfc
commit 42d136e8a6
2 changed files with 14 additions and 16 deletions

View File

@ -61,19 +61,11 @@ class LineUpper extends Button {
class LineEditor extends Button {
connectedCallback() {
this.span = this.closest(".line").querySelector("span.linetext");
this.f = document.createElement("form");
this.i = document.createElement("input");
const b = document.createElement("input");
this.f.setAttribute("style", "display: inline");
this.i.setAttribute("name", "editedLine");
this.i.setAttribute("style", "min-width: 50em");
b.setAttribute("type", "submit");
b.setAttribute("style", "display: none");
this.f.appendChild(this.i);
this.f.appendChild(b);
this.f = $("#line-editor-tmpl").content.firstElementChild.cloneNode(true);
this.i = this.f.querySelector("input[type=text]");
this.f.addEventListener("submit", (e) => {
e.preventDefault();
this.done()
this.done();
})
}
done() {

View File

@ -9,6 +9,12 @@
</style>
</head>
<body>
<template id="line-editor-tmpl">
<form style="display:inline">
<input type="text" name="editedLine" style="min-width: 50em">
<input type="submit" style="display: none">
</form>
</template>
<template id="linetmpl">
<span class="linecontrols">
<button is="line-pinner">pin</button>