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

2
apps/ssb.json
View File

@@ -1,5 +1,5 @@
{ {
"type": "tildefriends-app", "type": "tildefriends-app",
"emoji": "🦀", "emoji": "🦀",
"previous": "&W1tVCm6k+sTaIprqugaZlifh/FPQWCqGXXHn1hojCHI=.sha256" "previous": "&NdaJseW11fi9Cj4m+WITGxOF2JExm6GDhdCJKFV284Y=.sha256"
} }

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

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