cory/tildefriends
5
6
Fork 2
Code Issues 38 Pull Requests Actions Releases 33 Wiki Activity

Run prettier.

Browse Source
This commit is contained in:
Cory McWilliams
2024-02-24 11:09:34 -05:00
parent 8e7e0ed490
commit d5267be38c
90 changed files with 5789 additions and 2265 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
apps/wiki/tf-collection.js
View File

@ -14,52 +14,62 @@ class TfCollectionElement extends LitElement {
on_create(event) {
let name = this.shadowRoot.getElementById('create_name').value;
this.dispatchEvent(new CustomEvent('create', {
bubbles: true,
detail: {
name: name,
},
}));
this.dispatchEvent(
new CustomEvent('create', {
bubbles: true,
detail: {
name: name,
},
})
);
this.is_creating = false;
}
on_rename(event) {
let id = this.shadowRoot.getElementById('select').value;
let name = this.shadowRoot.getElementById('rename_name').value;
this.dispatchEvent(new CustomEvent('rename', {
bubbles: true,
detail: {
id: id,
value: this.collection[id],
name: name,
},
}));
this.dispatchEvent(
new CustomEvent('rename', {
bubbles: true,
detail: {
id: id,
value: this.collection[id],
name: name,
},
})
);
this.is_renaming = false;
}
on_tombstone(event) {
let id = this.shadowRoot.getElementById('select').value;
if (confirm(`Are you sure you want to delete '${this.collection[id].name}'?`)) {
this.dispatchEvent(new CustomEvent('tombstone', {
bubbles: true,
detail: {
id: id,
value: this.collection[id],
},
}));
if (
confirm(`Are you sure you want to delete '${this.collection[id].name}'?`)
) {
this.dispatchEvent(
new CustomEvent('tombstone', {
bubbles: true,
detail: {
id: id,
value: this.collection[id],
},
})
);
}
}
on_selected(event) {
let id = event.srcElement.value;
this.selected_id = id != '' ? id : undefined;
this.dispatchEvent(new CustomEvent('change', {
bubbles: true,
detail: {
id: id,
value: this.collection[id],
},
}));
this.dispatchEvent(
new CustomEvent('change', {
bubbles: true,
detail: {
id: id,
value: this.collection[id],
},
})
);
}
render() {
@ -68,28 +78,38 @@ class TfCollectionElement extends LitElement {
<span style="display: inline-flex; flex-direction: row">
<select @change=${this.on_selected} id="select" value=${this.selected_id}>
<option value="" ?selected=${this.selected_id === ''} disabled hidden>(select)</option>
${Object.values(this.collection ?? {}).sort((x, y) => x.name.localeCompare(y.name)).map(x => html`<option value=${x.id} ?selected=${this.selected_id === x.id}>${x.name}</option>`)}
${Object.values(this.collection ?? {})
.sort((x, y) => x.name.localeCompare(y.name))
.map(
(x) =>
html`<option
value=${x.id}
?selected=${this.selected_id === x.id}
>
${x.name}
</option>`
)}
</select>
<span ?hidden=${!this.is_renaming || !this.whoami}>
<span style="display: inline-flex; flex-direction: row; margin-left: 8px; margin-right: 8px">
<label for="rename_name">🏷Rename to:</label>
<input type="text" id="rename_name"></input>
<button @click=${this.on_rename}>Rename ${this.type}</button>
<button @click=${() => self.is_renaming = false}>x</button>
<button @click=${() => (self.is_renaming = false)}>x</button>
</span>
</span>
<button @click=${() => self.is_renaming = true} ?disabled=${this.is_renaming || !this.selected_id} ?hidden=${!this.whoami}>🏷</button>
<button @click=${() => (self.is_renaming = true)} ?disabled=${this.is_renaming || !this.selected_id} ?hidden=${!this.whoami}>🏷</button>
<button @click=${self.on_tombstone} ?disabled=${!this.selected_id} ?hidden=${!this.whoami}>🪦</button>
<span ?hidden=${!this.is_creating || !this.whoami}>
<label for="create_name">New ${this.type} name:</label>
<input type="text" id="create_name"></input>
<button @click=${this.on_create}>Create ${this.type}</button>
<button @click=${() => self.is_creating = false}>x</button>
<button @click=${() => (self.is_creating = false)}>x</button>
</span>
<button @click=${() => self.is_creating = true} ?hidden=${this.is_creating || !this.whoami}>+</button>
<button @click=${() => (self.is_creating = true)} ?hidden=${this.is_creating || !this.whoami}>+</button>
</span>
`;
}
}
customElements.define('tf-collection', TfCollectionElement);
customElements.define('tf-collection', TfCollectionElement);