settings-element, tabbar-element: fix attributeChangedCallback

This commit is contained in:
Iris Lightshard 2024-08-22 19:18:30 -06:00
parent b4145db359
commit bb7d4e2f7d
Signed by: Iris Lightshard
GPG key ID: 688407174966CAF3
3 changed files with 22 additions and 21 deletions

3
.gitignore vendored
View file

@ -1,4 +1,5 @@
node_modules/
frontend/dist/*.js
frontend/.js
underbbs
underbbs
__debug_*

View file

@ -13,15 +13,14 @@ export class SettingsElement extends HTMLElement {
}
connectedCallback() {
this.attributeChangedCallback();
}
attributeChangedCallback() {
const adapters = this.getAttribute("data-adapters");
if (adapters) {
this._adapters = this.getAttribute("data-adapters")?.split(",") ?? [];
} else {
this._adapters = [];
attributeChangedCallback(attr: string, prev: string, next: string) {
switch (attr) {
case "data-adapters":
if (next) {
this._adapters = next.split(",");
}
}
this.showSettings(this)();
}

View file

@ -4,7 +4,7 @@ import {Settings} from "./settings"
export class TabBarElement extends HTMLElement {
static observedAttributes = [ "data-adapters", "data-currentadapter" ]
private _adapters: string[] | null = null;
private _adapters: string[] = [];
private _currentAdapter: string | null = null;
constructor() {
@ -12,8 +12,6 @@ export class TabBarElement extends HTMLElement {
}
connectedCallback() {
this.attributeChangedCallback();
if (this._currentAdapter) {
this.showAdapterFunc(this, this._currentAdapter)();
} else {
@ -21,18 +19,21 @@ export class TabBarElement extends HTMLElement {
}
}
attributeChangedCallback() {
let html = "<ul><li><a id='tabbar_settings' href='#settings'>settings</a></li>";
if (!this.getAttribute("data-adapters")) {
this._adapters = [];
} else {
this._adapters = this.getAttribute("data-adapters")?.split(",") ?? [];
attributeChangedCallback(attr: string, prev: string, next: string) {
switch (attr) {
case "data-adapters":
if (next) {
this._adapters = next.split(",")
} else {
this._adapters = [];
}
break;
case "data-currentadapter":
this._currentAdapter = next || null;
break;
}
this._currentAdapter = this.getAttribute("data-currentadapter");
if (this._currentAdapter == "") {
this._currentAdapter = null;
}
let html = "<ul><li><a id='tabbar_settings' href='#settings'>settings</a></li>";
html = this._adapters.reduce((self: string, a: string)=>{
self += `<li><a id="tabbar_${a}" href="#${a}">${a}</a></li>`;