Progress toward viewing user profile pages.

git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@3737 ed5197a5-7fde-0310-b194-c3ffbd925b24
This commit is contained in:
Cory McWilliams 2022-01-07 01:52:47 +00:00
parent 49ffd1055e
commit ae84f69025
6 changed files with 82 additions and 47 deletions

View File

@ -1 +1 @@
{"type":"tildefriends-app","files":{"app.js":"&og7bNeqxTfUqVTdtPsrJTjirJxyE3xDQYp0Pj7KmL2U=.sha256","index.html":"&dyJyLJJqx+qcGXY9CYLY6Jxj/T/ZK+Z8ARa8MhLVhJI=.sha256","vue-material.js":"&K5cdLqXYCENPak/TCINHQhyJhpS4G9DlZHGwoh/LF2g=.sha256","tf-user.js":"&EuejzX/iNHsGkscTHJHeJ8YXukGb31KE8YGUMonXJB0=.sha256","tf-message.js":"&oQggZN26PtRi4Ce9HY8TKVJ9jRrYWLRE5tN+3yHwEJE=.sha256","tf.js":"&27+G0/I9PyIu7zl2yk8jesy6uEI1ZJlax0u5enVDdUw=.sha256","commonmark.min.js":"&5x6ek3tFrKTZX6hXNNyFsjmhvrjmWpUkwuuaiyVV1Us=.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"}}
{"type":"tildefriends-app","files":{"app.js":"&l8lBRLBokCaXK/v4sF5qMgQHGqizkMjY8ady4FYaD0U=.sha256","index.html":"&ayK1muTik0h4UYNvT0QNm0WrygVrL8kxBoEyrQkHyHs=.sha256","vue-material.js":"&K5cdLqXYCENPak/TCINHQhyJhpS4G9DlZHGwoh/LF2g=.sha256","tf-user.js":"&fXhPpneuYuseoaYk25ODN3QecFAeOfuMOZd98OgvjsQ=.sha256","tf-message.js":"&oQggZN26PtRi4Ce9HY8TKVJ9jRrYWLRE5tN+3yHwEJE=.sha256","tf.js":"&EgrrFfINhqFL/Kj8qkJwH/DHTLrZ8CxhHDBxZjcyjUY=.sha256","commonmark.min.js":"&5x6ek3tFrKTZX6hXNNyFsjmhvrjmWpUkwuuaiyVV1Us=.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"}}

View File

@ -3,6 +3,8 @@
const k_posts_max = 20;
const k_votes_max = 20;
var g_selected = null;
var g_following_cache = {};
var g_followers_cache = {};
var g_following_deep_cache = {};
@ -171,6 +173,13 @@ async function getRecentPostIds(db, id, ids, limit) {
}
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);
@ -231,7 +240,7 @@ async function getPosts(db, ids) {
}
async function ready() {
return refresh();
return refresh(g_selected);
}
ssb.addEventListener('broadcasts', async function() {
@ -243,51 +252,55 @@ core.register('onConnectionsChanged', async function() {
await app.postMessage({connections: connections});
});
async function refresh() {
async function refresh(selected) {
g_following_cache = {};
g_followers_cache = {};
g_following_deep_cache = {};
await app.postMessage({clear: true});
var whoami = await ssb.whoami();
var db = await database("ssb");
var all_followed = await followingDeep(db, [whoami], 2);
if (selected) {
g_selected = selected;
} else {
g_selected = all_followed;
}
await Promise.all([
app.postMessage({whoami: whoami}),
app.postMessage({broadcasts: await ssb.getBroadcasts()}),
app.postMessage({connections: await ssb.connections()}),
app.postMessage({apps: await core.apps()}),
followingDeep(db, [whoami], 2).then(function(f) {
return getRecentPostIds(db, whoami, [].concat([whoami], f), k_posts_max).then(async function(ids) {
var posts = await getPosts(db, ids);
var roots = posts.map(function(x) {
try {
return JSON.parse(x.content).root;
} catch {
return null;
}
});
roots = roots.filter(function(root) {
return root && posts.every(post => post.id != root);
});
var all_posts = [].concat(posts, await getPosts(db, roots));
await Promise.all(all_posts.map(x => app.postMessage({message: x})));
return Promise.all([].concat(f.map(function(id) {
return [
getVotes(db, id).then(function(votes) {
return app.postMessage({votes: votes});
}),
getAbout(db, id).then(function(user) {
return app.postMessage({user: {user: id, about: user}});
}),
following(db, id).then(function(following) {
return app.postMessage({following: {id: id, users: following}});
}),
followers(db, id).then(function(followers) {
return app.postMessage({followers: {id: id, users: followers}});
}),
];
})));
ssb.getBroadcasts().then(broadcasts => app.postMessage({broadcasts: broadcasts})),
ssb.connections().then(connections => app.postMessage({connections: connections})),
core.apps().then(apps => app.postMessage({apps: apps})),
getRecentPostIds(db, whoami, g_selected, k_posts_max).then(async function(ids) {
var posts = await getPosts(db, ids);
var roots = posts.map(function(x) {
try {
return JSON.parse(x.content).root;
} catch {
return null;
}
});
roots = roots.filter(function(root) {
return root && posts.every(post => post.id != root);
});
var all_posts = [].concat(posts, await getPosts(db, roots));
return Promise.all(all_posts.map(x => app.postMessage({message: x})));
}),
Promise.all([].concat(all_followed.map(function(id) {
return [
getVotes(db, id).then(function(votes) {
return app.postMessage({votes: votes});
}),
getAbout(db, id).then(function(user) {
return app.postMessage({user: {user: id, about: user}});
}),
following(db, id).then(function(following) {
return app.postMessage({following: {id: id, users: following}});
}),
followers(db, id).then(function(followers) {
return app.postMessage({followers: {id: id, users: followers}});
}),
];
}))),
]);
}
@ -304,6 +317,7 @@ ssb.addEventListener('message', async function(id) {
});
core.register('message', async function(m) {
print(JSON.stringify(m));
if (m.message == 'ready') {
await ready();
} else if (m.message) {
@ -312,7 +326,13 @@ core.register('message', async function(m) {
} else if (m.message.appendMessage) {
await ssb.appendMessage(m.message.appendMessage);
} else if (m.message.refresh) {
await refresh();
await refresh(g_selected);
}
} else if (m.event == 'hashChange') {
if (m.hash.length > 1) {
refresh([m.hash.substring(1)]);
} else {
refresh();
}
} else if (m.event == 'focus' || m.event == 'blur') {
/* Shh. */

View File

@ -39,7 +39,7 @@
<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-subheader>Users</md-subheader>
<md-list-item v-for="user in Object.keys(users).sort((x, y) => (users[x].name || x).localeCompare(users[y].name || y))" v-bind:key="'user-' + user"><tf-user v-bind:id="user"/></md-list-item>
<!-- <md-list-item v-for="user in Object.keys(users).sort((x, y) => (users[x].name || x).localeCompare(users[y].name || y))" v-bind:key="'user-' + user"><tf-user v-bind:id="user"/></md-list-item> -->
</md-list>
</md-app-drawer>
<md-app-toolbar class="md-secondary" v-show="unread > 0">
@ -74,12 +74,18 @@
<md-button class="md-raised md-primary" v-on:click="post_message()">Submit Post</md-button>
</md-card-actions>
</md-card>
<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 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>
</md-app-content>
</md-app>
</div>

View File

@ -12,6 +12,7 @@ Vue.component('tf-user', {
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];
},
set: function(newValue) {
@ -45,7 +46,7 @@ Vue.component('tf-user', {
window.parent.postMessage(message, '*');
},
show_user: function() {
this.show_user_dialog = true;
window.parent.postMessage({action: 'setHash', hash: this.id}, '*');
if (this.id == this.whoami) {
this.edit_profile_name = this.users[this.id].name;
this.edit_profile_description = this.users[this.id].description;

View File

@ -15,6 +15,7 @@ var g_data = {
reply_branch: null,
mentions: {},
unread: 0,
loading: true,
};
var g_data_initial = JSON.parse(JSON.stringify(g_data));
@ -94,11 +95,16 @@ function processMessages() {
g_data.votes[link][content.vote.expression].push({author: vote.author, value: content.vote.value});
});
} else if (key == 'clear') {
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.loading = false;
} else if (key == 'unread') {
g_data.unread += event.data.unread;
} else if (key == 'hash') {
console.log(event.data);
} else {
g_data[key] = event.data[key];
}
@ -114,6 +120,7 @@ window.addEventListener('message', function(event) {
setTimeout(processMessages, 250);
}
});
window.addEventListener('load', function() {
Vue.use(VueMaterial.default);
var vue = new Vue({

View File

@ -103,7 +103,6 @@ function trace() {
request.addEventListener("loadend", function() {
if (request.status == 200) {
/* The trace is loaded. */
console.log(typeof(request.response));
var perfetto = window.open('/perfetto/');
var done = false;
if (perfetto) {
@ -589,6 +588,8 @@ function message(event) {
var iframe = document.getElementById("iframe_" + event.data.name);
iframe.setAttribute("width", event.data.width);
iframe.setAttribute("height", event.data.height);
} else if (event.data && event.data.action == "setHash") {
window.location.hash = event.data.hash;
} else {
send({event: "message", message: event.data});
}