tildefriends/apps/cory/ssb/tf.js

334 lines
10 KiB
JavaScript

import * as tfrpc from '/static/tfrpc.js';
import * as tfshared from './tf-shared.js';
export 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,
edit_profile_image: 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;
g_data.edit_profile_image = g_data.users[g_data.whoami] ? g_data.users[g_data.whoami].image : 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;
if (blob.context == 'profile') {
g_data.edit_profile_image = blob.path.substring(1);
} else {
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) {
if (event.data.message === 'tfrpc') {
return;
}
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: tfshared.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,
image: g_data.edit_profile_image,
}
};
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(context) {
var input = document.createElement('input');
input.type = 'file';
input.onchange = function(event) {
var file = event.target.files[0];
file.arrayBuffer().then(function(buffer) {
let bin = Array.from(new Uint8Array(buffer));
return tfrpc.rpc.store_blob(bin);
}).then(function(id) {
g_data.post_text = `${g_data.post_text || ''}\n![${file.name}](${id})`;
Vue.set(g_data.mentions, id, {
link: id,
name: file.name,
type: file.type,
});
}).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;
}
}
},
human_size(bytes) {
if (typeof bytes == 'number') {
let value = bytes;
let unit = 'B';
const k_units = ['kB', 'MB', 'GB', 'TB'];
for (let u of k_units) {
if (value > 1024) {
value /= 1024;
unit = u;
}
}
return Math.round(value * 10) / 10 + ' ' + unit;
} else {
return bytes;
}
}
}
});
tfrpc.rpc.ready();
});