Did some routing for the search tab.

git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@3984 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
2022-09-15 00:16:37 +00:00
parent d216d96144
commit ab1f47ee9a
6 changed files with 49 additions and 12 deletions

View File

@ -49,6 +49,9 @@ core.register('message', async function message_handler(message) {
tfrpc.register(function getHash(id, message) {
return g_hash;
});
tfrpc.register(function setHash(hash) {
return app.setHash(hash);
});
ssb.addEventListener('message', async function(id) {
await tfrpc.rpc.notifyNewMessage(id);
});

View File

@ -33,9 +33,9 @@ class TfElement extends LitElement {
this.loaded = false;
tfrpc.rpc.getBroadcasts().then(b => { self.broadcasts = b || [] });
tfrpc.rpc.getConnections().then(c => { self.connections = c || [] });
tfrpc.rpc.getHash().then(hash => self.hash = hash || '#');
tfrpc.rpc.getHash().then(hash => self.set_hash(hash));
tfrpc.register(function hashChanged(hash) {
self.hash = hash;
self.set_hash(hash);
});
tfrpc.register(async function notifyNewMessage(id) {
await self.fetch_new_message(id);
@ -50,6 +50,15 @@ class TfElement extends LitElement {
tfrpc.rpc.localStorageGet('whoami').then(whoami => self.whoami = whoami);
}
set_hash(hash) {
this.hash = hash || '#';
if (this.hash.startsWith('#q=')) {
this.tab = 'search';
} else {
this.tab = 'news';
}
}
async contacts_internal(id, last_row_id, following, max_row_id) {
let result = Object.assign({}, following[id] || {});
result.following = result.following || {};
@ -246,7 +255,7 @@ class TfElement extends LitElement {
`;
} else if (this.tab === 'search') {
return html`
<tf-tab-search .following=${this.following} whoami=${this.whoami} .users=${this.users}></tf-tab-search>
<tf-tab-search .following=${this.following} whoami=${this.whoami} .users=${this.users} query=${this.hash?.startsWith('#q=') ? decodeURIComponent(this.hash.substring(3)) : null}></tf-tab-search>
`;
}
}

View File

@ -102,8 +102,10 @@ class TfMessageElement extends LitElement {
}
render_mention(mention) {
if (mention.link?.startsWith('&') &&
mention.type?.startsWith('image/')) {
if (!mention?.link || typeof(mention.link) != 'string') {
return html`<pre>${JSON.stringify(mention)}</pre>`;
} else if (mention?.link?.startsWith('&') &&
mention?.type?.startsWith('image/')) {
return html`
<img src=${'/' + mention.link + '/view'} style="max-width: 128px; max-height: 128px" title=${mention.name} @click=${() => this.show_image('/' + mention.link + '/view')}>
`;

View File

@ -8,6 +8,7 @@ class TfTabSearchElement extends LitElement {
whoami: {type: String},
users: {type: Object},
following: {type: Array},
query: {type: String},
}
}
@ -21,9 +22,15 @@ class TfTabSearchElement extends LitElement {
this.following = [];
}
async search(event) {
let query = this.renderRoot.getElementById('search').value;
async search(query) {
console.log('Searching...', this.whoami, query);
let search = this.renderRoot.getElementById('search');
if (search ) {
search.value = query;
search.focus();
search.select();
}
await tfrpc.rpc.setHash('#q=' + encodeURIComponent(query));
let results = await tfrpc.rpc.query(`
SELECT messages.*
FROM messages_fts(?)
@ -33,20 +40,31 @@ class TfTabSearchElement extends LitElement {
`,
['"' + query.replace('"', '""') + '"', JSON.stringify(this.following)]);
console.log('Done.');
this.renderRoot.getElementById('search').value = '';
search = this.renderRoot.getElementById('search');
if (search ) {
search.value = query;
search.focus();
search.select();
}
this.renderRoot.getElementById('news').messages = results;
}
search_keydown(event) {
if (event.keyCode == 13) {
this.search();
this.query = this.renderRoot.getElementById('search').value;
}
}
render() {
if (this.query !== this.last_query) {
this.search(this.query);
}
let self = this;
return html`
<input type="text" id="search" @keydown=${this.search_keydown}></input>
<input type="button" value="Search" @click=${this.search}></input>
<div style="display: flex; flex-direction: row">
<input type="text" id="search" value=${this.query} style="flex: 1" @keydown=${this.search_keydown}></input>
<input type="button" value="Search" @click=${(event) => self.search(self.renderRoot.getElementById('search').value)}></input>
</div>
<tf-news id="news" whoami=${this.whoami} .messages=${this.messages} .users=${this.users}></tf-news>
`;
}