forked from cory/tildefriends
Cory McWilliams
3464f1d189
git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@3958 ed5197a5-7fde-0310-b194-c3ffbd925b24
344 lines
9.5 KiB
JavaScript
344 lines
9.5 KiB
JavaScript
import * as tfrpc from '/static/tfrpc.js';
|
|
import * as tfshared from './tf-shared.js';
|
|
|
|
export var g_data = {
|
|
whoami: null,
|
|
selected: null,
|
|
identities: [],
|
|
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,
|
|
edit_profile_name: null,
|
|
edit_profile_description: null,
|
|
edit_profile_image: null,
|
|
post_text: null,
|
|
times: {},
|
|
};
|
|
|
|
var g_load_start = new Date();
|
|
var g_data_initial = JSON.parse(JSON.stringify(g_data));
|
|
|
|
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;
|
|
}
|
|
|
|
tfrpc.register(function clear() {
|
|
g_load_start = new Date();
|
|
g_data.loading = true;
|
|
Object.keys(g_data_initial).forEach(function(key) {
|
|
if (key != 'identities' && key != 'whoami' && key != 'selected') {
|
|
Vue.set(g_data, key, JSON.parse(JSON.stringify(g_data_initial[key])));
|
|
}
|
|
});
|
|
});
|
|
|
|
tfrpc.register(function set(key, value) {
|
|
g_data[key] = value;
|
|
});
|
|
|
|
tfrpc.register(function set_identities(value) {
|
|
if (JSON.stringify(g_data.identities) != JSON.stringify(value)) {
|
|
g_data.identities = value.map(x => x);
|
|
}
|
|
});
|
|
|
|
tfrpc.register(function push_users(users) {
|
|
for (let [id, user] of Object.entries(users)) {
|
|
Vue.set(g_data.users, id, Object.assign({}, g_data.users[id] || {}, user));
|
|
if (id == g_data.whoami) {
|
|
updateEditUser();
|
|
}
|
|
}
|
|
});
|
|
|
|
tfrpc.register(function push_posts(posts) {
|
|
for (let new_message of posts) {
|
|
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);
|
|
}
|
|
}
|
|
});
|
|
|
|
tfrpc.register(function push_votes(votes) {
|
|
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});
|
|
});
|
|
});
|
|
|
|
tfrpc.register(function push_following(following) {
|
|
for (let [id, users] of Object.entries(following)) {
|
|
if (!g_data.users[id]) {
|
|
Vue.set(g_data.users, id, {});
|
|
}
|
|
if (!g_data.users[id].following) {
|
|
Vue.set(g_data.users[id], 'following', {});
|
|
}
|
|
for (let user of users) {
|
|
Vue.set(g_data.users[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, id, true);
|
|
}
|
|
}
|
|
});
|
|
|
|
tfrpc.register(function push_blocking(id, blocking) {
|
|
if (!g_data.users[id]) {
|
|
Vue.set(g_data.users, id, {});
|
|
}
|
|
if (!g_data.users[id].blocking) {
|
|
Vue.set(g_data.users[id], 'blocking', {});
|
|
}
|
|
for (let user of blocking) {
|
|
Vue.set(g_data.users[id].blocking, user, true);
|
|
}
|
|
});
|
|
|
|
tfrpc.register(function add_unread(unread) {
|
|
g_data.unread += unread;
|
|
});
|
|
|
|
tfrpc.register(function ready(times) {
|
|
g_data.loading = false;
|
|
g_data.times = times;
|
|
});
|
|
|
|
window.addEventListener('load', function() {
|
|
Vue.use(VueMaterial.default);
|
|
var vue = new Vue({
|
|
el: '#app',
|
|
data: g_data,
|
|
watch: {
|
|
whoami: function(newValue, oldValue) {
|
|
tfrpc.rpc.refresh(newValue, this.selected, true);
|
|
},
|
|
selected: function(newValue, oldValue) {
|
|
let self = this;
|
|
setTimeout(function() { self.set_hash(); }, 100);
|
|
},
|
|
},
|
|
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() {
|
|
tfrpc.rpc.refresh(this.whoami, this.selected, 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() {
|
|
let hash = this.selected ?? '#';
|
|
window.parent.postMessage({
|
|
action: 'setHash',
|
|
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) {
|
|
if (context == 'profile') {
|
|
g_data.edit_profile_image = id;
|
|
} else {
|
|
g_data.post_text = `${g_data.post_text || ''}\n`;
|
|
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) {
|
|
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`;
|
|
Vue.set(g_data.mentions, id, {
|
|
link: id,
|
|
name: file.name,
|
|
type: file.type,
|
|
});
|
|
});
|
|
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;
|
|
}
|
|
},
|
|
create_identity() {
|
|
if (confirm("Are you sure you would like to create a new identity?")) {
|
|
tfrpc.rpc.createIdentity().then(function(id) {
|
|
alert(`Identity '${id}' created.`);
|
|
}).catch(function(e) {
|
|
alert('Error creating a new identity: ' + e);
|
|
});
|
|
}
|
|
},
|
|
}
|
|
});
|
|
tfrpc.rpc.ready();
|
|
}); |