cory/tildefriends
5
6
Fork 2
Code Issues 28 Pull Requests Actions Releases 40 Wiki Activity

ssb: Move the search to an ever-present textbox on the menu bar.

Browse Source
This commit is contained in:
Cory McWilliams
2025-12-02 18:47:58 -05:00
parent ec3064e0a1
commit 19b346cc6d
3 changed files with 38 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
apps/ssb/tf-app.js
View File

@@ -752,6 +752,16 @@ class TfElement extends LitElement {
input.click();
}
search() {
this.set_hash('#q=' + this.renderRoot.getElementById('search_text').value);
}
search_keydown(event) {
if (event.keyCode == 13) {
this.search();
}
}
render() {
let self = this;
@@ -765,7 +775,6 @@ class TfElement extends LitElement {
const k_tabs = {
'📰': 'news',
'📡': 'connections',
'🔍': 'search',
};
let tabs = html`
@@ -773,25 +782,27 @@ class TfElement extends LitElement {
class="w3-bar w3-theme-l1"
style="position: static; top: 0; z-index: 10"
>
${this.is_administrator
? html`
<button
class=${'w3-bar-item w3-button w3-circle w3-ripple' +
(this.connections?.some((x) => x.flags.one_shot)
? ' w3-spin'
: '')}
@click=${this.refresh}
>
↻
</button>
<button
class="w3-bar-item w3-button w3-ripple"
@click=${this.toggle_stay_connected}
>
${this.stay_connected ? '🔗' : '⛓️‍💥'}
</button>
`
: undefined}
${
this.is_administrator
? html`
<button
class=${'w3-bar-item w3-button w3-circle w3-ripple' +
(this.connections?.some((x) => x.flags.one_shot)
? ' w3-spin'
: '')}
@click=${this.refresh}
>
↻
</button>
<button
class="w3-bar-item w3-button w3-ripple"
@click=${this.toggle_stay_connected}
>
${this.stay_connected ? '🔗' : '⛓️‍💥'}
</button>
`
: undefined
}
${Object.entries(k_tabs).map(
([k, v]) => html`
<button
@@ -814,6 +825,8 @@ class TfElement extends LitElement {
>
🎨<span class="w3-hide-small">Color</span>
</button>
<button class="w3-bar-item w3-button w3-right" @click=${this.search}>Search</button>
<input type="text" class="w3-input w3-bar-item w3-right w3-theme-d1" placeholder="keywords, @id, #channel" id="search_text" @keydown=${this.search_keydown}></input>
</div>
`;
let contents = this.guest

18
apps/ssb/tf-tab-search.js
View File

@@ -77,12 +77,6 @@ class TfTabSearchElement extends LitElement {
}
}
search_keydown(event) {
if (event.keyCode == 13) {
this.query = this.renderRoot.getElementById('search').value;
}
}
on_expand(event) {
if (event.detail.expanded) {
let expand = {};
@@ -146,14 +140,10 @@ class TfTabSearchElement extends LitElement {
}
let self = this;
return html`
<style>${generate_theme()}</style>
<div class="w3-padding">
<div style="display: flex; flex-direction: row; gap: 4px">
<input type="text" class="w3-input w3-theme-d1" id="search" value=${this.query} style="flex: 1" @keydown=${this.search_keydown}></input>
<button class="w3-button w3-theme-d1" @click=${(event) => self.search(self.renderRoot.getElementById('search').value)}>Search</button>
</div>
${this.render_results()}
</div>
<style>
${generate_theme()}
</style>
<div class="w3-padding">${this.render_results()}</div>
`;
}
}