interfect/tildefriends
1
0
Fork 0
forked from cory/tildefriends
Code Pull Requests Activity

Accrued fixes, most recently making an effort to show all mentions.

Browse Source 
git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@3982 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
Cory McWilliams
2022-09-14 23:33:57 +00:00
parent 7077e69bf7
commit 88592886ca
7 changed files with 173 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
apps/cory/ssblit/tf-tab-news.js
View File

@@ -2,14 +2,14 @@ import {LitElement, html, unsafeHTML, until} from './lit-all.min.js';
import * as tfrpc from '/static/tfrpc.js';
import {styles} from './tf-styles.js';
class TfTabNewsElement extends LitElement {
class TfTabNewsFeedElement extends LitElement {
static get properties() {
return {
whoami: {type: String},
users: {type: Object},
hash: {type: String},
unread: {type: Array},
following: {type: Array},
messages: {type: Array},
}
}
@@ -21,9 +21,7 @@ class TfTabNewsElement extends LitElement {
this.whoami = null;
this.users = {};
this.hash = '#';
this.unread = [];
this.following = [];
this.cache = {};
}
async fetch_messages() {
@@ -65,42 +63,86 @@ class TfTabNewsElement extends LitElement {
}
}
async show_more() {
let unread = this.unread;
this.unread = [];
this.process_messages(unread);
await this.finalize_messages();
render() {
if (!this.messages ||
this._messages_hash !== this.hash ||
this._messages_following !== this.following) {
console.log('loading messages');
let self = this;
this.messages = [];
this._messages_hash = this.hash;
this._messages_following = this.following;
this.fetch_messages().then(function(messages) {
self.messages = messages;
});
}
return html`<tf-news id="news" whoami=${this.whoami} .users=${this.users} .messages=${this.messages} .following=${this.following}></tf-news>`;
}
}
class TfTabNewsElement extends LitElement {
static get properties() {
return {
whoami: {type: String},
users: {type: Object},
hash: {type: String},
unread: {type: Array},
following: {type: Array},
}
}
async render_news() {
if (this.cache.hash !== this.hash ||
this.cache.whoami !== this.whoami ||
this.cache.users !== this.users ||
!this.cache.messages) {
this.cache = {
hash: this.hash,
whoami: this.whoami,
users: this.users,
messages: this.fetch_messages(),
};
static styles = styles;
constructor() {
super();
let self = this;
this.whoami = null;
this.users = {};
this.hash = '#';
this.unread = [];
this.following = [];
this.cache = {};
}
show_more() {
let unread = this.unread;
let news = this.renderRoot?.getElementById('news');
if (news) {
console.log('injecting messages', news.messages);
news.messages = [...this.unread, ...news.messages];
this.dispatchEvent(new CustomEvent('refresh'));
}
let messages = await this.cache.messages;
return html`<tf-news whoami=${this.whoami} .users=${this.users} .messages=${messages}></tf-news>`;
}
new_messages_text() {
if (!this.unread?.length) {
return 'No new messages.';
}
let counts = {};
for (let message of this.unread) {
let type = 'unknown';
try {
type = JSON.parse(message.content).type || type;
} catch {
}
counts[type] = (counts[type] || 0) + 1;
}
return 'Show New: ' + Object.keys(counts).sort().map(x => (counts[x].toString() + ' ' + x + 's')).join(', ');
}
render() {
let profile = this.hash.startsWith('#@') ?
html`<tf-profile id=${this.hash.substring(1)} whoami=${this.whoami} .users=${this.users}></tf-profile>` : undefined;
return html`
<div><input type="button" value=${'Show ' + this.unread.length + ' New Messages'} @click=${this.show_more}></input></div>
<button id="load_button" @click=${this.load}>Load</button>
<div><input type="button" value=${this.new_messages_text()} @click=${this.show_more}></input></div>
<a target="_top" href="#" ?hidden=${this.hash.length <= 1}>🏠Home</a>
<div>Welcome, <tf-user id=${this.whoami} .users=${this.users}></tf-user>!</div>
<div><tf-compose whoami=${this.whoami} .users=${this.users}></tf-compose></div>
${profile}
${until(this.render_news(), html`<div>Loading...</div>`)}
<tf-tab-news-feed id="news" whoami=${this.whoami} .users=${this.users} .following=${this.following} hash=${this.hash}></tf-tab-news-feed>
`;
}
}
customElements.define('tf-tab-news-feed', TfTabNewsFeedElement);
customElements.define('tf-tab-news', TfTabNewsElement);