tasiaiso/tildefriends
1
0
Fork 0
forked from cory/tildefriends
Code Issues Pull Requests Releases Wiki Activity

ssb: Prettier.

Browse Source
This commit is contained in:
Cory McWilliams
2025-01-04 12:41:04 -05:00
parent 2328f3afb5
commit 763f7d45d8
6 changed files with 111 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -272,7 +272,9 @@ class TfElement extends LitElement {
async get_latest_private(following) {
const k_version = 1;
// { "version": 1, "range": [1234, 5678], messages: [ "%1.sha256", "%2.sha256", ... ], latest: rowid }
let cache = JSON.parse(await tfrpc.rpc.databaseGet(`private:${this.whoami}`) ?? '{}');
let cache = JSON.parse(
(await tfrpc.rpc.databaseGet(`private:${this.whoami}`)) ?? '{}'
);
if (cache.version !== k_version) {
cache = {
version: k_version,
@@ -290,7 +292,11 @@ class TfElement extends LitElement {
ranges.push([i, Math.min(i + k_chunk_size, latest), true]);
}
for (let i = cache.range[0]; i >= 0; i -= k_chunk_size) {
ranges.push([Math.max(i - k_chunk_size, 0), Math.min(cache.range[0], i + k_chunk_size), false]);
ranges.push([
Math.max(i - k_chunk_size, 0),
Math.min(cache.range[0], i + k_chunk_size),
false,
]);
}
} else {
for (let i = 0; i < latest; i += k_chunk_size) {
@@ -309,23 +315,26 @@ class TfElement extends LitElement {
json(messages.content) LIKE '"%'
ORDER BY sequence DESC
`,
[
range[0],
range[1],
]
[range[0], range[1]]
);
messages = (await this.decrypt(messages)).filter((x) => x.decrypted);
if (messages.length) {
cache.latest = Math.max(cache.latest ?? 0, ...messages.map((x) => x.rowid));
cache.latest = Math.max(
cache.latest ?? 0,
...messages.map((x) => x.rowid)
);
if (range[2]) {
cache.messages = [...cache.messages, ...messages.map(x => x.id)];
cache.messages = [...cache.messages, ...messages.map((x) => x.id)];
} else {
cache.messages = [...messages.map(x => x.id), ...cache.messages];
cache.messages = [...messages.map((x) => x.id), ...cache.messages];
}
}
cache.range[0] = Math.min(cache.range[0] ?? range[0], range[0]);
cache.range[1] = Math.max(cache.range[1] ?? range[1], range[1]);
await tfrpc.rpc.databaseSet(`private:${this.whoami}`, JSON.stringify(cache));
await tfrpc.rpc.databaseSet(
`private:${this.whoami}`,
JSON.stringify(cache)
);
}
console.log(cache);
return cache.latest;
@@ -428,7 +437,9 @@ class TfElement extends LitElement {
);
this.following = Object.keys(following);
this.users = users;
console.log(`load finished ${whoami} => ${this.whoami} in ${(new Date() - start_time) / 1000}`);
console.log(
`load finished ${whoami} => ${this.whoami} in ${(new Date() - start_time) / 1000}`
);
this.whoami = whoami;
this.loaded = whoami;
}

6
apps/ssb/tf-compose.js
View File

@@ -605,7 +605,11 @@ class TfComposeElement extends LitElement {
<footer class="w3-container">
${this.render_attach_app()} ${this.render_content_warning()}
${this.render_new_thread()}
<button class="w3-button w3-theme-d1" id="submit" @click=${this.submit}>
<button
class="w3-button w3-theme-d1"
id="submit"
@click=${this.submit}
>
Submit
</button>
<button class="w3-button w3-theme-d1" @click=${this.attach}>

118
apps/ssb/tf-message.js
View File

@@ -437,9 +437,9 @@ class TfMessageElement extends LitElement {
render_header() {
let is_encrypted = this.message?.decrypted
? html`<span class="w3-bar-item">🔓</span>`
: typeof(this.message?.content) == 'string'
? html`<span class="w3-bar-item">🔒</span>`
: undefined;
: typeof this.message?.content == 'string'
? html`<span class="w3-bar-item">🔒</span>`
: undefined;
return html`
<header class="w3-bar">
<span class="w3-bar-item">
@@ -448,9 +448,7 @@ class TfMessageElement extends LitElement {
${is_encrypted}
<span class="w3-bar-item w3-right">${this.render_raw_button()}</span>
<span class="w3-bar-item w3-right" style="text-wrap: nowrap"
><a
target="_top"
href=${'#' + encodeURIComponent(this.message.id)}
><a target="_top" href=${'#' + encodeURIComponent(this.message.id)}
>%</a
>
${new Date(this.message.timestamp).toLocaleString()}</span
@@ -481,28 +479,30 @@ class TfMessageElement extends LitElement {
>
${inner}
</div>
`;
`;
}
render_small_frame(inner) {
let self = this;
return this.render_frame(html`
${self.render_header()}
${self.format == 'raw' ? html`<div class="w3-container">${self.render_raw()}</div>` : inner}
${self.render_votes()}
${(self.message.child_messages || []).map(
(x) => html`
<tf-message
.message=${x}
whoami=${self.whoami}
.users=${self.users}
.drafts=${self.drafts}
.expanded=${self.expanded}
channel=${self.channel}
channel_unread=${self.channel_unread}
></tf-message>
`
)}
${self.render_header()}
${self.format == 'raw'
? html`<div class="w3-container">${self.render_raw()}</div>`
: inner}
${self.render_votes()}
${(self.message.child_messages || []).map(
(x) => html`
<tf-message
.message=${x}
whoami=${self.whoami}
.users=${self.users}
.drafts=${self.drafts}
.expanded=${self.expanded}
channel=${self.channel}
channel_unread=${self.channel_unread}
></tf-message>
`
)}
`);
}
@@ -545,8 +545,8 @@ class TfMessageElement extends LitElement {
let class_background = this.class_background();
let self = this;
if (this.message?.type === 'contact_group') {
return this.render_frame(html`
${this.message.messages.map(
return this.render_frame(
html` ${this.message.messages.map(
(x) =>
html`<tf-message
.message=${x}
@@ -557,34 +557,38 @@ class TfMessageElement extends LitElement {
channel=${this.channel}
channel_unread=${this.channel_unread}
></tf-message>`
)}`);
)}`
);
} else if (this.message.placeholder) {
return this.render_frame(html`
<a target="_top" href=${'#' + encodeURIComponent(this.message.id)}
>${this.message.id}</a
>
(placeholder)
<div>${this.render_votes()}</div>
${(this.message.child_messages || []).map(
(x) => html`
<tf-message
.message=${x}
whoami=${this.whoami}
.users=${this.users}
.drafts=${this.drafts}
.expanded=${this.expanded}
channel=${this.channel}
channel_unread=${this.channel_unread}
></tf-message>
`
)}`);
} else if (typeof(content?.type) === 'string') {
return this.render_frame(
html` <a target="_top" href=${'#' + encodeURIComponent(this.message.id)}
>${this.message.id}</a
>
(placeholder)
<div>${this.render_votes()}</div>
${(this.message.child_messages || []).map(
(x) => html`
<tf-message
.message=${x}
whoami=${this.whoami}
.users=${this.users}
.drafts=${this.drafts}
.expanded=${this.expanded}
channel=${this.channel}
channel_unread=${this.channel_unread}
></tf-message>
`
)}`
);
} else if (typeof content?.type === 'string') {
if (content.type == 'about') {
let name;
let image;
let description;
if (content.name !== undefined) {
name = html`<div class="w3-container"><b>Name:</b> ${content.name}</div>`;
name = html`<div class="w3-container">
<b>Name:</b> ${content.name}
</div>`;
}
if (content.image !== undefined) {
image = html`
@@ -593,14 +597,19 @@ class TfMessageElement extends LitElement {
}
if (content.description !== undefined) {
description = html`
<div class="w3-container" style="flex: 1 0 50%; overflow-wrap: anywhere">
<div
class="w3-container"
style="flex: 1 0 50%; overflow-wrap: anywhere"
>
<div>${unsafeHTML(tfutils.markdown(content.description))}</div>
</div>
`;
}
let update =
content.about == this.message.author
? html`<div class="w3-container" style="font-weight: bold">Updated profile.</div>`
? html`<div class="w3-container" style="font-weight: bold">
Updated profile.
</div>`
: html`<div class="w3-container" style="font-weight: bold">
Updated profile for
<tf-user id=${content.about} .users=${this.users}></tf-user>.
@@ -675,8 +684,7 @@ class TfMessageElement extends LitElement {
`);
} else if (content.type === 'issue') {
return this.render_frame(html`
${this.render_header()}
${content.text} ${this.render_votes()}
${this.render_header()} ${content.text} ${this.render_votes()}
<footer class="w3-container">
<button class="w3-button w3-theme-d1" @click=${this.react}>
React
@@ -752,11 +760,13 @@ class TfMessageElement extends LitElement {
>
</div>
`);
} else if (typeof(this.message.content) == 'string') {
} else if (typeof this.message.content == 'string') {
if (this.message?.decrypted) {
if (this.format == 'decrypted') {
return this.render_small_frame(
html`<span class="w3-container">🔓</span> ${this.render_json(this.message.decrypted)}`
html`<span class="w3-container">🔓</span> ${this.render_json(
this.message.decrypted
)}`
);
} else {
return this.render_small_frame(
@@ -772,7 +782,7 @@ class TfMessageElement extends LitElement {
html`<div class="w3-container"><b>type</b>: ${content.type}</div>`
);
}
} else if (typeof(this.message.content) == 'string') {
} else if (typeof this.message.content == 'string') {
return this.render_small_frame();
} else {
return this.render_small_frame(this.render_raw());

6
apps/ssb/tf-styles.js
View File

@@ -396,9 +396,9 @@ function is_dark(hex, value) {
function generated() {
let now = new Date();
let k_color = rgb_to_hex([
now.getDay() * 255 / 6,
now.getHours() * 255 / 23,
now.getSeconds() * 255 / 59,
(now.getDay() * 255) / 6,
(now.getHours() * 255) / 23,
(now.getSeconds() * 255) / 59,
]);
//let k_color = '#034f84';
//let k_color = rgb_to_hex([Math.random() * 256, Math.random() * 256, Math.random() * 256]);

15
apps/ssb/tf-tab-news.js
View File

@@ -194,11 +194,18 @@ class TfTabNewsElement extends LitElement {
>
`
)}
<div class="w3-bar-item w3-theme-d2">Connections</div>
${this.connections.map((x) => (html`
<tf-user class="w3-bar-item" style="max-width: 100%" id=${x.id} .users=${this.users}></tf-user>
`))}
${this.connections.map(
(x) => html`
<tf-user
class="w3-bar-item"
style="max-width: 100%"
id=${x.id}
.users=${this.users}
></tf-user>
`
)}
</div>
<div
class="w3-overlay"

8
apps/ssb/tf-user.js
View File

@@ -25,7 +25,9 @@ class TfUserElement extends LitElement {
>?</span
>`;
let name = this.users?.[this.id]?.name;
name = html`<a target="_top" href=${'#' + this.id}>${name !== undefined ? name : this.id}</a>`
name = html`<a target="_top" href=${'#' + this.id}
>${name !== undefined ? name : this.id}</a
>`;
if (this.users[this.id]) {
let image_link = this.users[this.id].image;
@@ -39,7 +41,9 @@ class TfUserElement extends LitElement {
/>`;
}
}
return html` <div style="display: inline-block; vertical-align: middle; font-weight: bold; text-wrap: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis">
return html` <div
style="display: inline-block; vertical-align: middle; font-weight: bold; text-wrap: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis"
>
${image} ${name}
</div>`;
}