cory/tildefriends
4
5
Fork 1
Code Issues 33 Pull Requests 1 Actions Releases 27 Wiki Activity

index => ssb

Browse Source 
git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@3849 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
Cory McWilliams 2022-02-27 02:30:11 +00:00
parent 011038a38a
commit c138582638
15 changed files with 13353 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
apps/cory/ssb.json Normal file
View File

@ -0,0 +1 @@
{"type":"tildefriends-app","files":{"app.js":"&nbY2UrHp+GcW1FrromCZRyJNg7in7InypXSaFNipTrs=.sha256","index.html":"&xCI4SATYvlJkVX5EdlRROoDSMWlajF+wDFrWSUYZqd8=.sha256","vue-material.js":"&K5cdLqXYCENPak/TCINHQhyJhpS4G9DlZHGwoh/LF2g=.sha256","tf-user.js":"&DdJwZYEo7AqFyutYMvEjykoVXxdHVog0UXye6Sbo0TU=.sha256","tf-message.js":"&kIpc5B2dt4oefsTgNASz2cVte3WRO0k2NCYJYRzu/MA=.sha256","tf.js":"&WvteLAg4G92YOUO3/B36kmar5lqFq8Pil4rsy7uFNDY=.sha256","commonmark.min.js":"&EP0OeR9zyLwZannz+0ga4s9AGES2RLvvIIQYHqqV6+k=.sha256","vue.js":"&g1wvA+yHl1sVC+eufTsg9If7ZeVyMTBU+h0tks7ZNzE=.sha256","vue-material-theme-default-dark.css":"&RP2nr+2CR18BpHHw5ST9a5GJUCOG9n0G2kuGkcQioWE=.sha256","vue-material.min.css":"&kGbUM2QgFSyHZRzqQb0b+0S3EVIlZ0AXpdiAVjIhou8=.sha256","roboto.css":"&jJv43Om673mQO5JK0jj7714s5E+5Yrf82H6LcDx7wUs=.sha256","material-icons.css":"&a28PdcVvgq/DxyIvJAx/e+ZOEtOuHnr3kjLWKyzH11M=.sha256","tf-shared.js":"&g17mCj0bfk0tw0sYk2VMU67Bt8Hdznjl44E01TxQF5Y=.sha256"}}

562
apps/cory/ssb/app.js Normal file
View File

@ -0,0 +1,562 @@
"use strict";
const k_posts_max = 20;
const k_votes_max = 20;
var g_ready = false;
var g_selected = null;
var g_blocking_cache = {};
var g_following_cache = {};
var g_following_deep_cache = {};
var g_sequence = {};
async function following(db, id) {
if (g_following_cache[id]) {
return g_following_cache[id];
}
var o = await db.get(id + ":following");
const k_version = 5;
var f = o ? JSON.parse(o) : o;
if (!f || f.version != k_version) {
f = {users: [], sequence: 0, version: k_version};
}
f.users = new Set(f.users);
await ssb.sqlStream(
"SELECT "+
" sequence, "+
" json_extract(content, '$.contact') AS contact, "+
" json_extract(content, '$.following') AS following "+
"FROM messages "+
"WHERE "+
" author = ?1 AND "+
" sequence > ?2 AND "+
" json_extract(content, '$.type') = 'contact' "+
"UNION SELECT MAX(sequence) AS sequence, NULL, NULL FROM messages WHERE author = ?1 "+
"ORDER BY sequence",
[id, f.sequence],
function(row) {
if (row.following) {
f.users.add(row.contact);
} else {
f.users.delete(row.contact);
}
if (row.sequence) {
f.sequence = row.sequence;
}
});
g_sequence[id] = f.sequence;
var as_set = f.users;
f.users = Array.from(f.users).sort();
var j = JSON.stringify(f);
if (o != j) {
await db.set(id + ":following", j);
}
f.users = as_set;
g_following_cache[id] = f.users;
return f.users;
}
async function followingDeep(db, seed_ids, depth, blocked) {
if (depth <= 0) {
return seed_ids;
}
var key = JSON.stringify([seed_ids, depth, blocked]);
if (g_following_deep_cache[key]) {
return g_following_deep_cache[key];
}
var f = await Promise.all(seed_ids.map(x => following(db, x).then(x => [...x])));
var ids = [].concat(...f);
if (blocked) {
ids = ids.filter(x => !blocked.has(x));
}
var x = await followingDeep(db, [...new Set(ids)].sort(), depth - 1, blocked);
x = [...new Set([].concat(...x, ...seed_ids))].sort();
g_following_deep_cache[key] = x;
return x;
}
async function blocking(db, id) {
if (g_blocking_cache[id]) {
return g_blocking_cache[id];
}
var o = await db.get(id + ":blocking");
const k_version = 5;
var f = o ? JSON.parse(o) : o;
if (!f || f.version != k_version) {
f = {users: [], sequence: 0, version: k_version};
}
f.users = new Set(f.users);
if (!g_sequence[id] || g_sequence[id] > f.sequence) {
await ssb.sqlStream(
"SELECT "+
" sequence, "+
" json_extract(content, '$.contact') AS contact, "+
" json_extract(content, '$.blocking') AS blocking "+
"FROM messages "+
"WHERE "+
" author = ?1 AND "+
" sequence > ?2 AND "+
" json_extract(content, '$.type') = 'contact' "+
"UNION SELECT MAX(sequence) AS sequence, NULL, NULL FROM messages WHERE author = ?1 "+
"ORDER BY sequence",
[id, f.sequence],
function(row) {
if (row.blocking) {
f.users.add(row.contact);
} else {
f.users.delete(row.contact);
}
if (row.sequence) {
f.sequence = row.sequence;
}
});
g_sequence[id] = f.sequence;
}
var as_set = f.users;
f.users = Array.from(f.users).sort();
var j = JSON.stringify(f);
if (o != j) {
await db.set(id + ":blocking", j);
}
f.users = as_set;
g_blocking_cache[id] = f.users;
return f.users;
}
async function getAbout(db, id) {
var o = await db.get(id + ":about");
const k_version = 5;
var f = o ? JSON.parse(o) : o;
if (!f || f.version != k_version) {
f = {about: {}, sequence: 0, version: k_version};
}
if (g_sequence[id] === undefined || g_sequence[id] > f.sequence) {
await ssb.sqlStream(
"SELECT "+
" sequence, "+
" content "+
"FROM messages "+
"WHERE "+
" author = ?1 AND "+
" sequence > ?2 AND "+
" json_extract(content, '$.type') = 'about' AND "+
" json_extract(content, '$.about') = ?1 "+
"UNION SELECT MAX(sequence) as sequence, NULL FROM messages WHERE author = ?1 "+
"ORDER BY sequence",
[id, f.sequence],
function(row) {
if (row.content) {
var about = {};
try {
about = JSON.parse(row.content);
} catch {
}
delete about.about;
delete about.type;
f.about = Object.assign(f.about, about);
}
if (row.sequence) {
f.sequence = Math.max(f.sequence, row.sequence);
}
});
g_sequence[id] = f.sequence;
var j = JSON.stringify(f);
if (o != j) {
await db.set(id + ":about", j);
}
}
return f.about;
}
function fnv32a(value)
{
var result = 0x811c9dc5;
for (var i = 0; i < value.length; i++) {
result ^= value.charCodeAt(i);
result += (result << 1) + (result << 4) + (result << 7) + (result << 8) + (result << 24);
}
return result >>> 0;
}
async function getRecentPostsSingleId(db, id, limit) {
var recent = [];
await ssb.sqlStream(
"SELECT "+
" rowid, "+
" id, "+
" timestamp "+
"FROM messages "+
"WHERE "+
" author = ? AND "+
" json_extract(content, '$.type') = 'post' "+
"ORDER BY sequence DESC LIMIT ?",
[id, limit],
function(row) {
if (row.id) {
recent.push({id: row.id, timestamp: row.timestamp});
}
});
recent.sort((x, y) => y.timestamp - x.timestamp);
return recent.map(x => x.id);
}
async function getRecentPostIds(db, id, ids, limit) {
if (ids.length == 1) {
return await getRecentPostsSingleId(db, ids[0], limit);
}
const k_version = 11;
const k_batch_max = 32;
var o = await db.get(id + ':recent_posts');
var recent = [];
var f = o ? JSON.parse(o) : o;
var ids_hash = fnv32a(JSON.stringify(ids));
if (!f || f.version != k_version || f.ids_hash != ids_hash) {
f = {recent: [], rowid: 0, version: k_version, ids_hash: ids_hash};
}
var row_id_max = 0;
await ssb.sqlStream(
"SELECT MAX(rowid) as rowid FROM messages",
[],
function(row) {
row_id_max = row.rowid;
});
for (var i = 0; i < ids.length; i += k_batch_max) {
var ids_batch = ids.slice(i, Math.min(i + k_batch_max, ids.length));
await ssb.sqlStream(
"SELECT "+
" rowid, "+
" id, "+
" timestamp "+
"FROM messages "+
"WHERE "+
" rowid > ? AND "+
" rowid <= ? AND "+
" author IN (" + ids_batch.map(x => '?').join(", ") + ") "+
"ORDER BY timestamp DESC LIMIT ?",
[].concat([f.rowid, row_id_max], ids_batch, [limit]),
function(row) {
if (row.id) {
recent.push({id: row.id, timestamp: row.timestamp});
}
});
}
f.rowid = row_id_max;
f.recent = [].concat(recent, f.recent);
var have = {};
f.recent = f.recent.filter(function(x) {
if (!have[x.id]) {
have[x.id] = true;
return true;
}
});
f.recent.sort((x, y) => y.timestamp - x.timestamp);
f.recent = f.recent.slice(0, limit);
var j = JSON.stringify(f);
if (o != j) {
await db.set(id + ":recent_posts", j);
}
return f.recent.map(x => x.id);
}
async function getRelatedPostIds(db, message, ids, limit) {
const k_batch_max = 16;
var recent = [];
var row_id_max = 0;
await ssb.sqlStream(
"SELECT MAX(rowid) as rowid FROM messages",
[],
function(row) {
row_id_max = row.rowid;
});
var id = message.id;
try {
id = JSON.parse(message.content).root || id;
} catch {
}
for (var i = 0; i < ids.length; i += k_batch_max) {
var ids_batch = ids.slice(i, Math.min(i + k_batch_max, ids.length));
await ssb.sqlStream(
"SELECT "+
" rowid, "+
" id, "+
" timestamp "+
"FROM messages "+
"WHERE "+
" timestamp >= ? AND "+
" rowid <= ? AND "+
" author IN (" + ids_batch.map(x => '?').join(", ") + ") AND "+
" json_extract(content, '$.type') = 'post' AND "+
" (id = ? OR json_extract(content, '$.root') = ?) "+
"ORDER BY timestamp DESC LIMIT ?",
[].concat([message.timestamp || 0, row_id_max], ids_batch, [message.id, id, limit]),
function(row) {
if (row.id) {
recent.push({id: row.id, timestamp: row.timestamp});
}
});
}
recent.sort((x, y) => y.timestamp - x.timestamp);
recent = recent.slice(0, limit);
return recent.map(x => x.id);
}
async function getVotes(db, id) {
var o = await db.get(id + ":votes");
const k_version = 7;
var f = o ? JSON.parse(o) : o;
if (!f || f.version != k_version) {
f = {votes: [], sequence: 0, version: k_version};
}
if (g_sequence[id] === undefined || g_sequence[id] > f.sequence) {
var votes = [];
await ssb.sqlStream(
"SELECT "+
" author, "+
" id, "+
" sequence, "+
" timestamp, "+
" content "+
"FROM messages "+
"WHERE "+
" author = ? AND "+
" sequence > ? AND "+
" json_extract(content, '$.type') = 'vote' "+
"UNION SELECT NULL, NULL, MAX(sequence) AS sequence, NULL, NULL FROM messages WHERE author = ? "+
"ORDER BY sequence DESC LIMIT ?",
[id, f.sequence, id, k_votes_max],
function(row) {
if (row.id) {
votes.push(row);
}
if (row.sequence) {
f.sequence = Math.max(f.sequence, row.sequence);
}
});
g_sequence[id] = f.sequence;
f.votes = [].concat(votes, f.votes).slice(0, k_votes_max);
var j = JSON.stringify(f);
if (o != j) {
await db.set(id + ":votes", j);
}
}
return f.votes;
}
async function getPosts(db, ids) {
var posts = [];
if (ids.length) {
await ssb.sqlStream(
"SELECT rowid, * FROM messages WHERE id IN (" + ids.map(x => "?").join(", ") + ") ORDER BY timestamp DESC",
ids,
row => posts.push(row));
}
return posts;
}
async function ready() {
g_ready = true;
return refresh(g_selected);
}
ssb.addEventListener('broadcasts', async function() {
await app.postMessage({broadcasts: await ssb.getBroadcasts()});
});
core.register('onConnectionsChanged', async function() {
var connections = await ssb.connections();
await app.postMessage({connections: connections});
});
async function updateSequences(db) {
var k_batch_max = 100;
var changes = {};
var keys = Object.keys(g_sequence);
for (var i = 0; i < keys.length; i += k_batch_max) {
var ids_batch = keys.slice(i, Math.min(i + k_batch_max, keys.length));
await ssb.sqlStream(
"SELECT "+
" author, "+
" MAX(sequence) AS sequence "+
"FROM messages "+
"WHERE "+
" author IN (" + ids_batch.map(x => '?').join(", ") + ")",
ids_batch,
function(row) {
if (g_sequence[row.author] != row.sequence) {
g_sequence[row.author] = row.sequence;
changes[row.author] = row.sequence;
}
});
}
return changes;
}
async function refresh(selected) {
var timing = [];
timing.push({name: 'start', time: new Date()});
g_following_cache = {};
g_following_deep_cache = {};
await app.postMessage({clear: true});
var whoami = await ssb.whoami();
var db = await database("ssb");
g_sequence = {};
try {
g_sequence = JSON.parse(await db.get('sequence'));
} catch (e) {
}
await updateSequences(db);
timing.push({name: 'init', time: new Date()});
var blocked = await blocking(db, whoami);
timing.push({name: 'blocked', time: new Date()});
var all_followed = await followingDeep(db, [whoami], 2, blocked);
timing.push({name: 'all_followed', time: new Date()});
if (selected) {
g_selected = selected;
} else {
g_selected = all_followed;
}
await Promise.all([
app.postMessage({whoami: whoami}),
app.postMessage({hash: selected && selected.length == 1 ? selected[0] : null}),
ssb.getBroadcasts().then(broadcasts => app.postMessage({broadcasts: broadcasts})),
ssb.connections().then(connections => app.postMessage({connections: connections})),
core.apps().then(apps => app.postMessage({apps: apps})),
]);
timing.push({name: 'core', time: new Date()});
var ids;
if (selected && selected.length == 1 && selected[0].startsWith('%')) {
var m = await getPosts(db, selected);
m = m.length ? m[0] : {id: selected[0]};
ids = await getRelatedPostIds(db, m, all_followed, k_posts_max);
} else {
ids = await getRecentPostIds(db, whoami, g_selected, k_posts_max);
}
timing.push({name: 'get_post_ids', time: new Date()});
var posts = await getPosts(db, ids);
timing.push({name: 'get_posts', time: new Date()});
var roots = posts.map(function(x) {
try {
return JSON.parse(x.content).root;
} catch {
return null;
}
});
var have = new Set(posts.map(x => x.id));
roots = [...new Set(roots)].filter(x => x && !have.has(x));
var all_posts = [].concat(posts, await getPosts(db, roots));
timing.push({name: 'get_root_posts', time: new Date()});
await Promise.all(all_posts.map(x => app.postMessage({message: x})));
timing.push({name: 'send_posts', time: new Date()});
await Promise.all(all_followed.map(id => getAbout(db, id).then(results => Object.keys(results).length ? app.postMessage({user: {user: id, about: results}}) : null)));
timing.push({name: 'about', time: new Date()});
var all_votes = [];
for (let id of all_followed) {
var results = await getVotes(db, id);
if (results.length) {
all_votes.push(results);
}
}
all_votes = all_votes.flat();
const k_votes_send_max = 2048;
for (var i = 0; i < all_votes.length; i += k_votes_send_max) {
var votes = all_votes.slice(i, Math.min(i + k_votes_send_max, all_votes.length));
await app.postMessage({votes: votes});
}
timing.push({name: 'votes', time: new Date()});
await all_followed.map(
id => app.postMessage(
{
following: {
id: id,
users: [...(g_following_cache[id] || [])],
}
}
)
);
timing.push({name: 'following', time: new Date()});
await app.postMessage({blocking: {id: whoami, users: [...(g_blocking_cache[whoami] || [])]}});
timing.push({name: 'send_blocking', time: new Date()});
await db.set('sequence', JSON.stringify(g_sequence));
var times = {};
var previous = null;
for (let t of timing) {
times[t.name] = (t.time - (previous || t).time) / 1000.0 + ' s';
previous = t;
}
await app.postMessage({ready: true, times: times});
}
ssb.addEventListener('message', async function(id) {
var db = await database("ssb");
var posts = await getPosts(db, [id]);
for (let post of posts) {
if (post.author == await ssb.whoami() ||
JSON.parse(post.content).type != 'post') {
await app.postMessage({message: post});
} else {
await app.postMessage({unread: 1});
}
}
});
async function addAppSources(message) {
if (message.mentions) {
for (let mention of message.mentions) {
if (mention.type == 'application/tildefriends') {
var blob = await ssb.blobGet(mention.link);
var json = JSON.parse(utf8Decode(blob));
for (let file of Object.keys(json.files)) {
message.mentions.push({
name: file,
link: json.files[file],
});
}
}
}
}
}
core.register('message', async function(m) {
if (m.message == 'ready') {
await ready();
} else if (m.message) {
if (m.message.connect) {
await ssb.connect(m.message.connect);
} else if (m.message.appendMessage) {
await addAppSources(m.message.appendMessage);
await ssb.appendMessage(m.message.appendMessage);
} else if (m.message.refresh) {
await refresh(g_selected);
}
} else if (m.event == 'hashChange') {
if (m.hash.length > 1) {
g_selected = [m.hash.substring(1)];
} else {
g_selected = null;
}
if (g_ready) {
await refresh(g_selected);
}
} else if (m.event == 'storeBlobComplete') {
await app.postMessage({storeBlobComplete: m.path});
} else if (m.event == 'focus' || m.event == 'blur') {
/* Shh. */
} else {
print(JSON.stringify(m));
}
});
async function main() {
if (core.user &&
core.user.credentials &&
core.user.credentials.permissions &&
core.user.credentials.permissions.administration) {
await app.setDocument(utf8Decode(await getFile("index.html")));
} else {
await app.setDocument('<div style="color: #f00">Only the administrator can use this app at this time. Login at the top right.</div>');
}
}
main();

1
apps/cory/ssb/commonmark.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

171
apps/cory/ssb/index.html Normal file
View File

@ -0,0 +1,171 @@
<html>
<head>
<meta content="width=device-width,initial-scale=1,minimal-ui" name="viewport">
<link rel="stylesheet" href="roboto.css">
<link rel="stylesheet" href="material-icons.css">
<link rel="stylesheet" href="vue-material.min.css">
<link rel="stylesheet" href="vue-material-theme-default-dark.css">
<script src="vue.js"></script>
<script src="vue-material.js"></script>
<script src="commonmark.min.js"></script>
<script src="tf-shared.js"></script>
<script src="tf-user.js"></script>
<script src="tf-message.js"></script>
<script src="tf.js"></script>
</head>
<body style="color: #fff">
<div id="app">
<md-dialog :md-active.sync="show_connect_dialog">
<md-dialog-title>Connect</md-dialog-title>
<md-dialog-content>
<md-field>
<label>net:127.0.0.1:8008~shs:id</label>
<md-input v-model="connect"></md-input>
</md-field>
</md-dialog-content>
<md-dialog-actions>
<md-button class="md-primary" @click="ssb_connect(connect); connect = null; show_connect_dialog = false">Connect</md-button>
<md-button @click="connect = null; show_connect_dialog = false">Cancel</md-button>
</md-dialog-actions>
</md-dialog>
<md-app style="position: absolute; height: 100%; width: 100%">
<md-app-toolbar class="md-primary">
<span class="md-title">Tilde Scuttlebutt</span>
</md-app-toolbar>
<md-app-content>
<div class="md-layout">
<div class="md-layout-item md-size-20">
<md-list>
<md-subheader>Broadcasts</md-subheader>
<md-list-item v-for="broadcast in broadcasts" v-bind:key="JSON.stringify(broadcast)" @click="ssb_connect(broadcast)">{{broadcast.address}}:{{broadcast.port}} <tf-user :id="broadcast.pubkey"></tf-user></md-list-item>
<md-subheader>Connections</md-subheader>
<md-list-item v-for="connection in connections" v-bind:key="'connection-' + JSON.stringify(connection)"><tf-user :id="connection"></tf-user></md-list-item>
<md-list-item @click="show_connect_dialog = true">Connect</md-list-item>
</md-list>
</div>
<div class="md-layout-item md-size-80">
<md-app-toolbar class="md-secondary" v-show="unread > 0">
<md-button @click="refresh()" class="md-raised md-primary">Refresh</md-button>
<span class="md-title">{{unread}} unread item{{unread == 1 ? '' : 's'}}</span>
</md-app-toolbar>
Welcome, <tf-user :id="whoami"></tf-user>.
<span v-if="load_time" style="float: right">
Loaded in {{load_time}} seconds.
<md-tooltip v-if="Object.keys(times).length" style="height: auto">
<div v-for="key in Object.keys(times)">{{key}}: {{times[key]}}</div>
</md-tooltip>
</span>
<md-card class="md-elevation-8">
<md-card-header>
<div class="md-title">What's up?</div>
</md-card-header>
<md-card-content>
<md-chip v-if="reply_root || reply_branch" md-deletable @md-delete="reply_root = null; reply_branch = null">Replying in thread {{reply_root}} to message {{reply_branch}}</md-chip>
<md-chip v-for="link in Object.keys(mentions)" v-bind:key="link" md-deletable @md-delete="remove_from_mentions(link)">
{{mentions[link].name}}: {{link}}
</md-chip>
<div class="md-layout">
<md-field class="md-layout-item">
<label>Post a message</label>
<md-textarea id="post_text" v-model="post_text" v-on:paste="paste" md-autogrow></md-textarea>
</md-field>
<md-card class="md-layout-item" v-if="post_text && post_text.length">
<md-card-content v-html="markdown(post_text)"></md-card-content>
<md-card-content>
<md-card-media v-for="link in Object.keys(mentions)" v-bind:key="link">
<img v-if="(mentions[link].type || '').startsWith('image/')" :src="'/' + link + '/view'" class="md-elevation-4" style="margin: 4px; max-width: 320px; max-height: 240px">
</md-card-media>
</md-card-content>
</md-card>
</div>
</md-card-content>
<md-card-actions>
<md-button class="md-icon-button" @click="attach">
<md-icon>attach_file</md-icon>
</md-button>
<md-menu>
<md-button md-menu-trigger>Share App</md-button>
<md-menu-content>
<md-menu-item v-for="app in Object.keys(apps)" v-bind:key="app" @click="add_app_to_mentions(app)">
{{app}}
</md-menu-item>
</md-menu-content>
</md-menu>
<md-button class="md-raised md-primary" v-on:click="post_message()">Submit Post</md-button>
</md-card-actions>
</md-card>
<md-button v-if="selected" class="md-raised md-primary" style="margin: 1em" @click="set_hash(null)">
<md-icon>home</md-icon> Home
</md-button>
<md-card v-if="selected && selected.charAt(0) == '@'" class="md-raised md-elevation-8" style="margin: 1em">
<md-card-header>
<md-card-header-text>
<div class="md-title">{{users[selected] &amp;&amp; users[selected].name ? users[selected].name : selected}}</div>
<div class="md-subhead" v-if="users[selected] && users[selected].name">{{selected}}</div>
</md-card-header-text>
<md-card-media v-if="users[selected] && users[selected].image" class="md-medium">
<div><img :src="'/' + (typeof(users[selected].image) == 'string' ? users[selected].image : users[selected].image.link) + '/view'"></div>
</md-card-media>
</md-card-header>
<md-card-content>
<div v-if="selected == whoami">
<md-field>
<label>Name</label>
<md-input v-model="edit_profile_name"></md-input>
</md-field>
<md-field>
<label>Description</label>
<md-textarea v-model="edit_profile_description"></md-textarea>
</md-field>
</div>
<template v-if="users[selected]">
<div v-if="users[selected].name">{{selected}}</div>
<div v-html="markdown(users[selected].description)"></div>
</template>
<md-card-actions>
<md-menu md-size="small" v-if="users[selected] && users[selected].followers">
<md-button md-menu-trigger>{{Object.keys(users[selected].followers).length}} followers</md-button>
<md-menu-content>
<md-menu-item v-for="id of Object.keys(users[selected].followers)" v-bind:key="id"><tf-user :id="id"></tf-user></md-menu-item>
</md-menu-content>
</md-menu>
<md-menu md-size="small" v-if="users[selected] && users[selected].following">
<md-button md-menu-trigger>{{Object.keys(users[selected].following).length}} following</md-button>
<md-menu-content>
<md-menu-item v-for="id of Object.keys(users[selected].following)" v-bind:key="id"><tf-user :id="id"></tf-user></md-menu-item>
</md-menu-content>
</md-menu>
<template v-if="selected != whoami && users[whoami] && users[whoami].blocking">
<md-button @click="block(selected)" v-if="!users[whoami].blocking[selected]" class="md-raised md-secondary">Block</md-button>
<md-button @click="unblock(selected)" v-else class="md-raised md-secondary">Unblock</md-button>
</template>
<template v-if="selected != whoami && users[whoami] && users[whoami].following">
<md-button @click="follow(selected)" v-if="!users[whoami].following[selected]" class="md-raised md-secondary">Follow</md-button>
<md-button @click="unfollow(selected)" v-else class="md-raised md-secondary">Unfollow</md-button>
</template>
<md-button @click="save_profile" v-if="selected == whoami" class="md-primary md-raised">Save Profile</md-button>
</md-card-actions>
</md-card-content>
</md-card>
<template v-if="messages.length">
<tf-message
v-for="message in messages"
v-bind:message="message"
v-bind:messages="messages"
v-bind:key="message.id"
v-bind:votes="votes"></tf-message>
</template>
<md-empty-state v-else-if="loading" md-label="Loading...">
<md-progress-spinner md-mode="indeterminate"></md-progress-spinner>
</md-empty-state>
<md-empty-state v-else md-label="Nothing to see here."></md-empty-state>
</div>
</div>
</md-app-content>
</md-app>
</div>
</body>
</html>

20
apps/cory/ssb/material-icons.css Normal file
View File

@ -0,0 +1,20 @@
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/materialicons/v118/flUhRq6tzZclQEJ-Vdg-IuiaDsNZ.ttf) format('truetype');
}
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
}

44
apps/cory/ssb/roboto.css Normal file
View File

@ -0,0 +1,44 @@
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/materialicons/v118/flUhRq6tzZclQEJ-Vdg-IuiaDsNZ.ttf) format('truetype');
}
@font-face {
font-family: 'Roboto';
font-style: italic;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOkCnqEu92Fr1Mu52xP.ttf) format('truetype');
}
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOmCnqEu92Fr1Me5Q.ttf) format('truetype');
}
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 500;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOlCnqEu92Fr1MmEU9vAw.ttf) format('truetype');
}
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 700;
src: url(https://fonts.gstatic.com/s/roboto/v29/KFOlCnqEu92Fr1MmWUlvAw.ttf) format('truetype');
}
.material-icons {
font-family: 'Material Icons';
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
}

165
apps/cory/ssb/tf-message.js Normal file
View File

@ -0,0 +1,165 @@
"use strict";
Vue.component('tf-message', {
props: ['message', 'messages', 'votes'],
data: function() { return { showRaw: false } },
computed: {
content_json: function() {
try {
return JSON.parse(this.message.content);
} catch {
return undefined;
}
},
content_raw: function() {
try {
return JSON.stringify(JSON.parse(this.message.content), null, 2);
} catch {
return this.message.content;
}
},
timestamp_relative: function() {
var units = [
{value: 1, name: 'milliseconds'},
{value: 1000, name: 'seconds'},
{value: 1000 * 60, name: 'minutes'},
{value: 1000 * 60 * 60, name: 'hours'},
{value: 1000 * 60 * 60 * 24, name: 'days'},
{value: 1000 * 60 * 60 * 24 * 7, name: 'weeks'},
{value: 1000 * 60 * 60 * 24 * 30, name: 'months'},
{value: 1000 * 60 * 60 * 24 * 365, name: 'years'},
];
var v = new Date().valueOf() - this.message.timestamp;
var result = null;
for (let unit of units) {
if (v >= unit.value) {
result = Math.round(v / unit.value) + ' ' + unit.name + ' ago';
}
}
return result;
},
},
methods: {
markdown: markdown,
set_reply: function() {
g_data.reply_root = this.content_json.root || this.message.id;
g_data.reply_branch = this.message.id;
},
vote: function(event) {
var reaction = event.srcElement.innerText;
var message = this.message.id;
if (confirm('Are you sure you want to react with ' + reaction + ' to ' + message + '?')) {
window.parent.postMessage(
{
appendMessage: {
type: 'vote',
vote: {
link: message,
value: 1,
expression: reaction,
},
},
},
'*');
}
},
show_message: function() {
window.parent.postMessage({action: 'setHash', hash: this.message.id}, '*');
},
expand_image: function(event) {
var div = document.createElement('div');
div.style.left = 0;
div.style.top = 0;
div.style.width = '100%';
div.style.height = '100%';
div.style.position = 'fixed';
div.style.background = '#000';
div.style.zIndex = 100;
div.style.display = 'grid';
var img = document.createElement('img');
img.src = event.srcElement.src;
img.style.maxWidth = '100%';
img.style.maxHeight = '100%';
img.style.display = 'block';
img.style.margin = 'auto';
img.style.objectFit = 'contain';
img.style.width = '100%';
div.appendChild(img);
div.onclick = function() { document.body.removeChild(div); };
document.body.appendChild(div);
},
},
template: `<md-app class="md-elevation-8" style="margin: 1em" v-if="!content_json || ['pub', 'vote'].indexOf(content_json.type) == -1">
<md-app-toolbar>
<h3>
<md-button class="md-icon-button md-dense" @click="show_message">
<md-icon>percent</md-icon>
</md-button>
<tf-user :id="message.author" v-if="message.author"></tf-user>
</h3>
<template v-if="message.author">
<div style="font-size: x-small">
{{timestamp_relative}}
<md-tooltip style="height: auto">
<div>{{new Date(message.timestamp)}}</div>
<div>{{message.id}}</div>
</md-tooltip>
</div>
<div class="md-toolbar-section-end">
<md-menu>
<md-switch v-model="showRaw"></md-switch>
<md-tooltip>Show Raw Message</md-tooltip>
</md-menu>
</div>
</template>
<template v-else>
<h3>Missing</h3>
</template>
</md-app-toolbar>
<md-app-content>
<template v-if="message.author">
<div v-if="showRaw">
<h1>{{message.id}}</h1>
<pre style="word-wrap: break-all; white-space: pre-wrap">{{content_raw}}</pre>
</div>
<div v-else>
<div v-if="content_json && content_json.type == 'post'">
<div v-html="this.markdown(content_json.text)"></div>
<span v-for="mention in content_json.mentions" v-if="mention.link && typeof(mention.link) == 'string' && mention.link.startsWith('&')">
<a v-if="mention.type == 'application/tildefriends'" :href="'/' + mention.link + '/'" target="_top">{{mention.name}}</a>
<img v-else class="md-elevation-4" style="margin: 4px; max-width: 320px; max-height: 240px" :src="'/' + mention.link + '/view'" v-on:click="expand_image"></img>
</span>
</div>
<div v-else-if="content_json && content_json.type == 'tildefriends-app'">
<div v-html="this.markdown(content_json.text)"></div>
<md-button target="_top" :href="'/' + message.id + '/'">{{content_json.name || 'tildefriends-app'}}</md-button>
</div>
<div v-else-if="content_json && content_json.type == 'contact'"><tf-user :id="message.author"></tf-user> {{content_json.following ? '==&gt;' : '=/=&gt;'}} <tf-user :id="content_json.contact"></tf-user></div>
<div v-else>{{message.content}}</div>
</div>
</template>
<template v-else>
{{message.id}}
</template>
<tf-message v-for="sub_message in (message.children || [])" v-bind:message="sub_message" v-bind:messages="messages" v-bind:votes="votes" v-bind:key="sub_message.id"></tf-message>
<md-chip md-clickable v-for="v in Object.keys(votes[message.id] || {})" v-bind:key="v" @click="vote">
{{v + (votes[message.id][v].length > 1 ? ' (' + votes[message.id][v].length + ')' : '')}}
<md-tooltip style="height: auto">
<div v-for="vote in votes[message.id][v]" v-bind:key="vote.author">{{vote.author}}</div>
</md-tooltip>
</md-chip>
<md-card-actions v-if="message.author">
<md-button class="md-icon-button" @click="set_reply">
<md-icon>reply</md-icon>
</md-button>
<md-menu>
<md-menu-content>
<md-menu-item @click="vote">Like</md-menu-item>
</md-menu-content>
<md-button class="md-icon-button" md-menu-trigger>
<md-icon>thumb_up</md-icon>
</md-button>
</md-menu>
</md-card-actions>
</md-app-content>
</md-app>`,
});

31
apps/cory/ssb/tf-shared.js Normal file
View File

@ -0,0 +1,31 @@
"use strict";
function markdown(md) {
var reader = new commonmark.Parser({safe: true});
var writer = new commonmark.HtmlRenderer();
var parsed = reader.parse(md || '');
var walker = parsed.walker();
var event, node;
while ((event = walker.next())) {
node = event.node;
if (event.entering) {
if (node.type == 'link') {
if (node.destination.startsWith('@') &&
node.destination.endsWith('.ed25519')) {
node.destination = '#' + node.destination;
} else if (node.destination.startsWith('%') &&
node.destination.endsWith('.sha256')) {
node.destination = '#' + node.destination;
} else if (node.destination.startsWith('&') &&
node.destination.endsWith('.sha256')) {
node.destination = '/' + node.destination + '/view';
}
} else if (node.type == 'image') {
if (node.destination.startsWith('&')) {
node.destination = '/' + node.destination + '/view';
}
}
}
}
return writer.render(parsed);
}

25
apps/cory/ssb/tf-user.js Normal file
View File

@ -0,0 +1,25 @@
"use strict";
Vue.component('tf-user', {
props: ['id'],
computed: {
following: {
get: function() {
return g_data.users &&
g_data.users[g_data.whoami] &&
g_data.users[g_data.whoami].following &&
g_data.users[g_data.whoami].following[this.id];
},
},
whoami: { get: function() { return g_data.whoami; } },
users: { get: function() { return g_data.users; } },
},
methods: {
show_user: function() {
window.parent.postMessage({action: 'setHash', hash: this.id}, '*');
},
},
template: `<md-chip md-clickable :class="following ? 'md-accent' : ''" @click="show_user()">
{{users[id] && users[id].name ? users[id].name : id}}
<md-tooltip v-if="users[id] && users[id].name">{{id}}</md-tooltip>
</md-chip>`,
});

302
apps/cory/ssb/tf.js Normal file
View File

@ -0,0 +1,302 @@
"use strict";
var g_data = {
whoami: null,
connections: [],
messages: [],
messages_by_id: {},
users: {},
broadcasts: [],
show_connect_dialog: false,
show_user_dialog: null,
connect: null,
pubs: [],
votes: {},
apps: {},
reply_root: null,
reply_branch: null,
mentions: {},
unread: 0,
loading: true,
selected: null,
edit_profile_name: null,
edit_profile_description: null,
load_time: null,
post_text: null,
times: {},
};
var g_load_start = new Date();
var g_data_initial = JSON.parse(JSON.stringify(g_data));
var g_message_queue = [];
var g_process_pending = false;
function updateEditUser() {
g_data.edit_profile_name = g_data.users[g_data.whoami] ? g_data.users[g_data.whoami].name : null;
g_data.edit_profile_description = g_data.users[g_data.whoami] ? g_data.users[g_data.whoami].description : null;
}
function processMessages() {
for (let event of g_message_queue) {
var key = Object.keys(event.data)[0];
if (key == 'message') {
var new_message = event.data.message;
new_message.children = [];
var found = false;
var root = JSON.parse(new_message.content).root;
/* If we had inserted a fake root, replace it if we see the real message. */
if (g_data.messages_by_id[new_message.id]) {
var old_message = g_data.messages_by_id[new_message.id];
new_message.children = old_message.children;
for (let child of new_message.children) {
child.parent = new_message;
}
if (old_message.parent) {
old_message.parent.children = old_message.parent.children.filter(x => x != old_message);
} else {
g_data.messages = g_data.messages.filter(x => x != old_message);
}
}
Vue.set(g_data.messages_by_id, new_message.id, new_message);
if (root) {
/* If we don't know of the message's root, add it. */
if (!g_data.messages_by_id[root]) {
var fake_root = {
id: root,
children: [],
timestamp: new_message.timestamp,
content: '{}',
};
Vue.set(g_data.messages_by_id, root, fake_root);
g_data.messages.push(fake_root);
g_data.messages.sort((x, y) => y.timestamp - x.timestamp);
found = true;
}
var message = g_data.messages_by_id[root];
new_message.parent = message;
message.children.push(new_message);
message.children.sort((x, y) => x.timestamp - y.timestamp);
} else {
/* This is just a new message with no root. Add it. */
g_data.messages.push(new_message);
g_data.messages.sort((x, y) => y.timestamp - x.timestamp);
g_data.messages = g_data.messages.slice(0, 32);
}
} else if (key + 's' in g_data && Array.isArray(g_data[key + 's'])) {
g_data[key + 's'].push(event.data[key]);
} else if (key == 'user') {
Vue.set(g_data.users, event.data.user.user, Object.assign({}, g_data.users[event.data.user.user] || {}, event.data.user.about));
if (event.data.user.user == g_data.whoami) {
updateEditUser();
}
} else if (key == 'following') {
if (!g_data.users[event.data.following.id]) {
Vue.set(g_data.users, event.data.following.id, {});
}
if (!g_data.users[event.data.following.id].following) {
Vue.set(g_data.users[event.data.following.id], 'following', {});
}
for (let user of event.data.following.users) {
Vue.set(g_data.users[event.data.following.id].following, user, true);
if (!g_data.users[user]) {
Vue.set(g_data.users, user, {});
}
if (!g_data.users[user].followers) {
Vue.set(g_data.users[user], 'followers', {});
}
Vue.set(g_data.users[user].followers, event.data.following.id, true);
}
} else if (key == 'blocking') {
if (!g_data.users[event.data.blocking.id]) {
Vue.set(g_data.users, event.data.blocking.id, {});
}
if (!g_data.users[event.data.blocking.id].blocking) {
Vue.set(g_data.users[event.data.blocking.id], 'blocking', {});
}
for (let user of event.data.blocking.users) {
Vue.set(g_data.users[event.data.blocking.id].blocking, user, true);
}
} else if (key == 'broadcasts') {
g_data.broadcasts = event.data.broadcasts;
} else if (key == 'pubs') {
g_data.pubs = event.data.pubs;
} else if (key == 'apps') {
g_data.apps = event.data.apps;
} else if (key == 'votes') {
event.data.votes.forEach(function(vote) {
var content = JSON.parse(vote.content);
var link = content.vote.link;
if (!g_data.votes[link]) {
Vue.set(g_data.votes, link, {});
}
if (!g_data.votes[link][content.vote.expression]) {
Vue.set(g_data.votes[link], content.vote.expression, []);
}
g_data.votes[link][content.vote.expression].push({author: vote.author, value: content.vote.value});
});
} else if (key == 'clear') {
g_load_start = new Date();
g_data.loading = true;
Object.keys(g_data_initial).forEach(function(key) {
Vue.set(g_data, key, JSON.parse(JSON.stringify(g_data_initial[key])));
});
} else if (key == 'ready') {
g_data.load_time = (new Date() - g_load_start) / 1000;
g_data.loading = false;
g_data.times = event.data.times;
} else if (key == 'unread') {
g_data.unread += event.data.unread;
} else if (key == 'hash') {
g_data.selected = event.data.hash;
if (g_data.selected == g_data.whoami) {
updateEditUser();
}
} else if (key == 'storeBlobComplete') {
var blob = event.data.storeBlobComplete;
g_data.post_text = (g_data.post_text || '') + `\n![${blob.name}](${blob.path.substring(1)})`;
Vue.set(g_data.mentions, blob.path.substring(1), {
link: blob.path.substring(1),
name: blob.name,
type: blob.type,
});
} else {
g_data[key] = event.data[key];
}
}
g_message_queue = [];
g_process_pending = false;
}
window.addEventListener('message', function(event) {
g_message_queue.push(event);
if (!g_process_pending) {
g_process_pending = true;
setTimeout(processMessages, 250);
}
});
window.addEventListener('load', function() {
Vue.use(VueMaterial.default);
var vue = new Vue({
el: '#app',
data: g_data,
methods: {
post_message: function() {
var message = {
type: 'post',
text: document.getElementById('post_text').value,
};
if (g_data.reply_root || g_data.reply_branch) {
message.root = g_data.reply_root;
message.branch = g_data.reply_branch;
}
if (Object.keys(g_data.mentions).length) {
message.mentions = Object.values(g_data.mentions);
}
window.parent.postMessage({appendMessage: message}, '*');
g_data.post_text = null;
Vue.set(g_data, 'mentions', {});
g_data.reply_root = null;
g_data.reply_branch = null;
},
ssb_connect: function(connection) {
window.parent.postMessage({connect: connection}, '*');
},
content_json: function(message) {
try {
return JSON.parse(message.content);
} catch {
return undefined;
}
},
markdown: markdown,
refresh: function() {
window.parent.postMessage({refresh: true}, '*');
},
add_app_to_mentions: function(app) {
Vue.set(g_data.mentions, g_data.apps[app], {
link: g_data.apps[app],
name: app,
type: 'application/tildefriends',
});
},
remove_from_mentions: function(link) {
Vue.delete(g_data.mentions, link);
},
save_profile: function() {
var message = {appendMessage: {
type: 'about',
about: g_data.selected,
name: g_data.edit_profile_name,
description: g_data.edit_profile_description,
}};
window.parent.postMessage(message, '*');
},
follow: function(id) {
if (confirm('Are you sure you want to follow ' + id + '?')) {
window.parent.postMessage({appendMessage: {type: "contact", following: true, contact: id}}, '*');
}
},
unfollow: function(id) {
if (confirm('Are you sure you want to unfollow ' + id + '?')) {
window.parent.postMessage({appendMessage: {type: "contact", following: false, contact: id}}, '*');
}
},
block: function(id) {
if (confirm('Are you sure you want to block ' + id + '?')) {
window.parent.postMessage({appendMessage: {type: "contact", blocking: true, contact: id}}, '*');
}
},
unblock: function(id) {
if (confirm('Are you sure you want to unblock ' + id + '?')) {
window.parent.postMessage({appendMessage: {type: "contact", blocking: false, contact: id}}, '*');
}
},
set_hash(hash) {
window.parent.postMessage({action: 'setHash', hash: hash ? hash : '#'}, '*');
},
attach() {
var input = document.createElement('input');
input.type = 'file';
input.onchange = function(event) {
var file = event.target.files[0];
file.arrayBuffer().then(function(buffer) {
window.parent.postMessage({action: 'storeBlob',
blob: {
name: file.name,
type: file.type,
buffer: buffer,
}
}, '*');
}).catch(function(e) {
console.log('error', e);
});
};
input.click();
},
paste(event) {
var items = (event.clipboardData || event.originalEvent.clipboardData).items;
for (let item of items) {
var file = item.getAsFile();
if (file) {
file.arrayBuffer().then(function(buffer) {
window.parent.postMessage({
action: 'storeBlob',
blob: {
name: file.name,
type: file.type,
buffer: buffer,
},
}, '*');
});
event.preventDefault();
break;
}
}
}
}
});
window.parent.postMessage('ready', '*');
});

4
apps/cory/ssb/vue-material-theme-default-dark.css Normal file
View File

File diff suppressed because one or more lines are too long

6
apps/cory/ssb/vue-material.js Normal file
View File

File diff suppressed because one or more lines are too long

6
apps/cory/ssb/vue-material.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

12014
apps/cory/ssb/vue.js Normal file
View File

File diff suppressed because it is too large Load Diff

2
src/main.c
View File

@ -285,8 +285,8 @@ static int _tf_command_export(const char* file, int argc, char* argv[])
{ {
const char* k_export[] = { const char* k_export[] = {
"/~cory/apps", "/~cory/apps",
"/~cory/index",
"/~cory/docs", "/~cory/docs",
"/~cory/ssb",
}; };
for (int i = 0; i < _countof(k_export); i++) for (int i = 0; i < _countof(k_export); i++)
{ {