Work in progress making the account picker actually work.

git-svn-id: https://www.unprompted.com/svn/projects/tildefriends/trunk@3946 ed5197a5-7fde-0310-b194-c3ffbd925b24

apps/cory/ssb.json

@@ -1 +1 @@
-{"type":"tildefriends-app","files":{"app.js":"&WHHdzbI7ug6XNIzyU52SndurkPDXfxkXdTAIglF76QU=.sha256","index.html":"&VkJWaTAZIuKQJQ95D9f52Sp3VH6Y9y58e2db2nSEF+I=.sha256","vue-material.js":"&K5cdLqXYCENPak/TCINHQhyJhpS4G9DlZHGwoh/LF2g=.sha256","tf-user.js":"&smJOHGgIsKwQXeEJD3VbHX4A+vhr1Se54WlSHUP/Km8=.sha256","tf-message.js":"&7M+IUC+xHyc306xRrJcx3TnYpONYLlgCsF80m2M2ws4=.sha256","tf.js":"&taJiSGBI+GveYXLKQRggNnmz2VhHsGwx+e4Zp56Glfg=.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":"&MPINm55jkpz2rrNbwsYl09PKGvbgL3nwgBy6CMQkSnw=.sha256","style.css":"&qegBNCrVUihxffRUxGFuG/6u+0Y6d18zHtfNHBZtZ04=.sha256"}}
+{"type":"tildefriends-app","files":{"app.js":"&bblne6t8jCLxRO/NJ9LhacmC/mjvx69xAyGsOVAOteI=.sha256","index.html":"&n/Mu7Li41ZG0KdR5LYDtFtOmihzmYEwSOMMLmYxupPU=.sha256","vue-material.js":"&K5cdLqXYCENPak/TCINHQhyJhpS4G9DlZHGwoh/LF2g=.sha256","tf-user.js":"&smJOHGgIsKwQXeEJD3VbHX4A+vhr1Se54WlSHUP/Km8=.sha256","tf-message.js":"&uMXQxfJ3eeVE6Ta2LMAvb0XA1KztMTD4pApYnfBc1Nc=.sha256","tf.js":"&zp+cfNNYTis1pDucbaK6Uoq8qn2pNt1grmWg7bSfv+s=.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":"&MPINm55jkpz2rrNbwsYl09PKGvbgL3nwgBy6CMQkSnw=.sha256","style.css":"&qegBNCrVUihxffRUxGFuG/6u+0Y6d18zHtfNHBZtZ04=.sha256"}}

apps/cory/ssb/app.js

@@ -6,7 +6,6 @@ const k_votes_max = 20;
 var g_ready = false;
 var g_selected = null;
 let g_whoami = null;
-let g_hash = null;
 
 var g_blocking_cache = {};
 var g_following_cache = {};
@@ -399,6 +398,7 @@ tfrpc.register(async function ready() {
 	let identities = await ssb.getIdentities();
 	await tfrpc.rpc.set_identities(identities);
 	g_ready = true;
+	refresh_internal(g_whoami, g_selected, true);
 });
 
 tfrpc.register(async function store_blob(blob) {
@@ -441,19 +441,20 @@ async function updateSequences(db) {
 	return changes;
 }
 
-let g_refresh_limit = 5;
-
-async function refresh_internal(whoami, selected) {
-	if (typeof(whoami) !== 'string') {
+async function refresh_internal(whoami, selected, force) {
+	if (!g_ready) {
 		return;
 	}
-	if (whoami !== g_whoami || selected !== g_selected) {
-		await app.localStorageSet('whoami', whoami);
+	let hash = selected || undefined;
+	if (whoami !== g_whoami || selected !== g_selected || force) {
 		g_whoami = whoami;
 		g_selected = selected;
 	} else {
 		return;
 	}
+	if (typeof(whoami) !== 'string') {
+		return;
+	}
 	var timing = [];
 	timing.push({name: 'start', time: new Date()});
 	g_following_cache = {};
@@ -472,12 +473,7 @@ async function refresh_internal(whoami, selected) {
 	timing.push({name: 'blocked', time: new Date()});
 	var all_followed = await followingDeep(db, [whoami], 2, blocked);
 	timing.push({name: 'all_followed', time: new Date()});
-	let actual_selected = selected ? selected : all_followed;
-	let hash = selected && selected.length == 1 ? selected[0] : null;
-	if (hash !== g_hash) {
-		g_hash = hash;
-		await tfrpc.rpc.set_hash(hash);
-	}
+	let actual_selected = (selected ? [selected] : all_followed) ?? [];
 	await Promise.all([
 		tfrpc.rpc.set('whoami', whoami),
 		tfrpc.rpc.set('broadcasts', await ssb.getBroadcasts()),
@@ -486,9 +482,9 @@ async function refresh_internal(whoami, selected) {
 	]);
 	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]};
+	if (selected && selected.startsWith('%')) {
+		var m = await getPosts(db, [selected]);
+		m = m.length ? m[0] : {id: selected};
 		ids = await getRelatedPostIds(db, m, all_followed, k_posts_max);
 	} else {
 		ids = await getRecentPostIds2(db, whoami, actual_selected, (new Date()).valueOf() - (24 * 60 * 60 * 1000));
@@ -550,7 +546,7 @@ async function refresh_internal(whoami, selected) {
 	for (let t of timing) {
 		times[t.name] = (t.time - (previous || t).time) / 1000.0 + ' s';
 		previous = t;
-	}
+	}times.total = (new Date() - timing[0].time) / 1000.0 + ' s';
 	await tfrpc.rpc.ready(times);
 }
 
@@ -567,8 +563,8 @@ ssb.addEventListener('message', async function(id) {
 	}
 });
 
-tfrpc.register(async function refresh(whoami, selected) {
-	return refresh_internal(whoami, selected);
+tfrpc.register(async function refresh(whoami, selected, force) {
+	return refresh_internal(whoami, selected, force);
 });
 
 tfrpc.register(async function createIdentity() {
@@ -601,8 +597,14 @@ core.register('message', async function(m) {
 			await ssb.appendMessageWithIdentity(g_whoami, m.message.appendMessage);
 		}
 	} else if (m.event == 'hashChange') {
-		let selected = m.hash.length  > 1 ? [m.hash.substring(1)] : null;
-		await refresh_internal(g_whoami, selected);
+		let hash = m.hash.length  > 1 ? m.hash.substring(1) : null;
+		if (hash) {
+			let parts = hash.split(':');
+			let changed = g_whoami !== parts[0] || g_selected !== parts[1];
+			g_whoami = parts[0];
+			g_selected = parts[1];
+			await refresh_internal(g_whoami, g_selected, changed);
+		}
 	} else if (m.event == 'focus' || m.event == 'blur') {
 		/* Shh. */
 	} else {

apps/cory/ssb/index.html

@@ -46,7 +46,7 @@
 									<div>Welcome, <tf-user :id="whoami"></tf-user></div>
 									<div>
 										<md-field>
-											<md-select v-model="whoami" name="whoami" id="whoami" :change="refresh()">
+											<md-select v-model="whoami" name="whoami" id="whoami">
 												<md-option v-for="identity in identities" v-bind:key="identity" :value="identity">{{identity}}</md-option>
 											</md-select>
 										</md-field>
@@ -58,8 +58,8 @@
 									</div>
 								</md-app-toolbar>
 								<md-app-content>
-									<span v-if="load_time">
-										Loaded in {{load_time}} seconds.
+									<span v-if="times?.total">
+										Loaded in {{times.total}}.
 										<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>
@@ -110,7 +110,7 @@
 								</md-card-actions>
 							</md-card>
 
-							<md-button v-if="selected" class="md-raised md-primary" style="margin: 1em" @click="set_hash(null)">
+							<md-button v-if="selected" class="md-raised md-primary" style="margin: 1em" @click="selected = null">
 								<md-icon>home</md-icon> Home
 							</md-button>
 

apps/cory/ssb/tf-message.js

@@ -65,7 +65,10 @@ Vue.component('tf-message', {
 			}
 		},
 		show_message: function() {
-			window.parent.postMessage({action: 'setHash', hash: this.message.id}, '*');
+			window.parent.postMessage({
+				action: 'setHash',
+				hash: tf.g_data.whoami + ':' + this.message.id,
+			}, '*');
 		},
 		expand_image: function(event) {
 			var div = document.createElement('div');

apps/cory/ssb/tf.js

@@ -2,7 +2,8 @@ import * as tfrpc from '/static/tfrpc.js';
 import * as tfshared from './tf-shared.js';
 
 export var g_data = {
-	whoami: null,
+	whoami: undefined,
+	selected: undefined,
 	identities: [],
 	connections: [],
 	messages: [],
@@ -20,11 +21,9 @@ export var g_data = {
 	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: {},
 };
@@ -38,18 +37,11 @@ function updateEditUser() {
 	g_data.edit_profile_image = g_data.users[g_data.whoami] ? g_data.users[g_data.whoami].image : null;
 }
 
-tfrpc.register(function set_hash(hash) {
-	g_data.selected = hash;
-	if (g_data.selected == g_data.whoami) {
-		updateEditUser();
-	}
-});
-
 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') {
+		if (key != 'identities' && key != 'whoami' && key != 'selected') {
 			Vue.set(g_data, key, JSON.parse(JSON.stringify(g_data_initial[key])));
 		}
 	});
@@ -63,9 +55,6 @@ tfrpc.register(function set_identities(value) {
 	if (JSON.stringify(g_data.identities) != JSON.stringify(value)) {
 		g_data.identities = value.map(x => x);
 	}
-	if (!g_data.whoami && value.length) {
-		g_data.whoami = value[0];
-	}
 });
 
 tfrpc.register(function push_users(users) {
@@ -178,7 +167,6 @@ tfrpc.register(function add_unread(unread) {
 });
 
 tfrpc.register(function ready(times) {
-	g_data.load_time = (new Date() - g_load_start) / 1000;
 	g_data.loading = false;
 	g_data.times = times;
 });
@@ -188,6 +176,16 @@ window.addEventListener('load', function() {
 	var vue = new Vue({
 		el: '#app',
 		data: g_data,
+		watch: {
+			whoami: function(newValue, oldValue) {
+				let self = this;
+				setTimeout(function() { self.set_hash(); }, 100);
+			},
+			selected: function(newValue, oldValue) {
+				let self = this;
+				setTimeout(function() { self.set_hash(); }, 100);
+			},
+		},
 		methods: {
 			post_message: function() {
 				var message = {
@@ -219,7 +217,7 @@ window.addEventListener('load', function() {
 			},
 			markdown: tfshared.markdown,
 			refresh: function() {
-				tfrpc.rpc.refresh(g_data.whoami);
+				tfrpc.rpc.refresh(this.whoami, this.selected, true);
 			},
 			add_app_to_mentions: function(app) {
 				Vue.set(g_data.mentions, g_data.apps[app], {
@@ -263,8 +261,14 @@ window.addEventListener('load', function() {
 					window.parent.postMessage({appendMessage: {type: "contact", blocking: false, contact: id}}, '*');
 				}
 			},
-			set_hash(hash) {
-				window.parent.postMessage({action: 'setHash', hash: hash ? hash : '#'}, '*');
+			set_hash() {
+				let hash = this.whoami && this.selected ?
+						this.whoami + ':' + this.selected :
+						(this.whoami ? this.whoami : '#');
+				window.parent.postMessage({
+					action: 'setHash',
+					hash: hash,
+				}, '*');
 			},
 			attach(context) {
 				var input = document.createElement('input');