use template

This commit is contained in:
nate smith 2024-02-11 23:28:30 -08:00
parent 49d3426985
commit d4a741127d
2 changed files with 12 additions and 9 deletions

View File

@ -1,10 +1,13 @@
// TODO
function main() {
function addLine() {
const ltp = document.querySelector("#linetmpl");
const lines = document.querySelector("#lines");
const bp = document.querySelector("#blueprint .linecontainer");
function addLine() {
lines.appendChild(bp.cloneNode(true));
}
const l = ltp.content.cloneNode(true);
lines.appendChild(l);
}
function main() {
for (var i = 0; i < 10; i++) {
addLine();
}

View File

@ -9,17 +9,17 @@
</style>
</head>
<body>
<div id="blueprint">
<div class="linecontainer">
<template id="linetmpl">
<div class="linecontainer unpinned">
<span class="linecontrols">
<button>pin</button>
<button _="on click toggle .unpinned on the closest <div/>">pin</button>
<button>edit</button>
<button>move</button>
<button _="on click remove the closest <div/>">remove</button>
</span>
<span hx-trigger="load" hx-swap="outerHTML" hx-get="/line" class="linetext"></span>
</div>
</div>
</template>
<h1>Trunkless</h1>
<div id="pagecontrols">
<a href="/about">about</a>