"use strict";
var g_data = {
	whoami: null,
	connections: [],
	messages: [],
	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,
};

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 (root) {
				for (let message of g_data.messages) {
					if (root == message.id) {
						message.children.push(new_message);
						message.children.sort((x, y) => y.timestamp - x.timestamp);
						found = true;
					}
				}
			}
			var removed = {};
			for (let message of g_data.messages) {
				if (JSON.parse(message.content).root == new_message.id) {
					new_message.children.push(message);
					new_message.children.sort((x, y) => y.timestamp - x.timestamp);
					removed[message.id] = true;
				}
			}
			g_data.messages = g_data.messages.filter(x => !removed[x.id]);
			if (!found) {
				g_data.messages.push(new_message);
				g_data.messages.sort((x, y) => y.timestamp - x.timestamp);
			}
		} 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 == 'followers') {
			if (!g_data.users[event.data.followers.id]) {
				Vue.set(g_data.users, event.data.followers.id, {});
			}
			if (!g_data.users[event.data.followers.id].followers) {
				Vue.set(g_data.users[event.data.followers.id], 'followers', {});
			}
			for (let user of event.data.followers.users) {
				Vue.set(g_data.users[event.data.followers.id].followers, user, true);
			}
		} 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);
			}
		} 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;
		} 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 {
			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}, '*');
				document.getElementById('post_text').value = '';
				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: function(md) {
				if (!md) {
					return;
				}
				var reader = new commonmark.Parser({safe: true});
				var writer = new commonmark.HtmlRenderer();
				return writer.render(reader.parse(md));
			},
			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}}, '*');
				}
			},
			set_hash(hash) {
				window.parent.postMessage({action: 'setHash', hash: hash ? hash : '#'}, '*');
			},
		}
	});
	window.parent.postMessage('ready', '*');
});