From d1c8f67d699fcd5e4ce262688b89503d3ddc0f88 Mon Sep 17 00:00:00 2001
From: Brian Cully <bjc@spork.org>
Date: Mon, 12 May 2025 13:21:12 -0400
Subject: append history when ‘+’ button clicked
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 history.mjs | 46 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 46 insertions(+)
 create mode 100644 history.mjs

(limited to 'history.mjs')

diff --git a/history.mjs b/history.mjs
new file mode 100644
index 0000000..f056ac7
--- /dev/null
+++ b/history.mjs
@@ -0,0 +1,46 @@
+export default class extends HTMLElement {
+    static name = 'x-chords-history'
+    static register() {
+        console.debug('Registering Element', this.name, this);
+        customElements.define(this.name, this);
+    }
+
+    delayMs = 1000;
+    #list
+
+    oldList = [
+        'GCEGCE',
+        'EBEGBE'
+    ];
+
+    constructor() {
+        super();
+
+        console.debug('History#constructor', this);
+        this.onClick = e => console.debug('history click', e);
+
+        this.template = this.querySelector('template');
+        this.list = this.querySelector('ol');
+
+        // mess around with custom states
+        this._internals = this.attachInternals();
+    }
+
+    connectedCallback() {
+        console.debug('History#connectedCallback', this);
+    }
+
+    add(fretboard) {
+        console.debug('History#add', this, fretboard);
+        this._internals.states.add('fresh');
+        setTimeout(_ => this._internals.states.delete('fresh'),
+            this.delayMs);
+
+        const item = this.template.content.cloneNode(true);
+        // TODO: i don't think this is how slots are supposed to work,
+        // but maybe they're not really for this at all?
+        item.querySelectorAll('[name="fretboard"]')
+            .forEach(s => s.innerText = fretboard.notes.join(' '));
+        this.list.appendChild(item);
+    }
+}
-- 
cgit v1.3