tildefriends/apps/user_settings/tf-theme-picker.js

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

47 lines
916 B
JavaScript
Raw Normal View History

import {LitElement, html} from './lit-all.min.js';
import * as tfrpc from '/static/tfrpc.js';
class TfThemePickerElement extends LitElement {
static get properties() {
return {
selected: {type: String},
themes: {type: Array},
};
}
constructor() {
super();
this.load();
}
async load() {
this.themes = await tfrpc.rpc.getThemes();
}
changed(event) {
this.selected = event.srcElement.value;
console.log('selected theme', this.selected);
// TODO
}
render() {
return html`
<link rel="stylesheet" href="/static/tildefriends-v1.css" />
<label for="theme">[Not implemented] Choose your theme:</label>
<select
name="theme"
?hidden=${!this.themes?.length}
@change=${this.changed}
>
${(this.themes ?? []).map(
(id) => html`<option value=${id}>${id}</option>`
)}
</select>
`;
}
}
customElements.define('tf-theme-picker', TfThemePickerElement);