Fix up login and initial window

client/components/App.vue

@@ -3,7 +3,7 @@
 		<Sidebar :overlay="$refs.overlay" />
 		<div id="sidebar-overlay" ref="overlay" @click="$root.setSidebar(false)" />
 		<article id="windows">
-			<router-view></router-view>
+			<router-view ref="window"></router-view>
 		</article>
 		<ImageViewer ref="imageViewer" />
 	</div>
@@ -21,9 +21,6 @@ export default {
 		Sidebar,
 		ImageViewer,
 	},
-	props: {
-		activeWindow: String,
-	},
 	computed: {
 		viewportClasses() {
 			return {

client/js/router.js

@@ -17,26 +17,21 @@ const RoutedChat = require("../components/RoutedChat.vue").default;
 const router = new VueRouter({
 	routes: [
 		{
+			name: "SignIn",
 			path: "/sign-in",
 			component: SignIn,
-			meta: {
-				isChat: false,
-				windowName: "SignIn",
-			},
 		},
 	],
 });
 
 router.afterEach((to) => {
-	if (!router.app.initialized) {
-		return;
+	if (router.app.initialized) {
+		router.app.closeSidebarIfNeeded();
 	}
 
-	router.app.closeSidebarIfNeeded();
-
-	if (!to.meta.isChat) {
+	if (to.name !== "RoutedChat") {
 		// Navigating out of a chat window
-		store.commit("activeWindow", to.meta.windowName);
+		store.commit("activeWindow", to.name);
 
 		if (store.state.activeChannel && store.state.activeChannel.channel) {
 			router.app.switchOutOfChannel(store.state.activeChannel.channel);
@@ -49,60 +44,34 @@ router.afterEach((to) => {
 function initialize() {
 	router.addRoutes([
 		{
-			path: "/sign-in",
-			component: SignIn,
-			meta: {
-				isChat: false,
-				windowName: "SignIn",
-			},
-		},
-		{
+			name: "Connect",
 			path: "/connect",
 			component: Connect,
-			meta: {
-				isChat: false,
-				windowName: "Connect",
-			},
 		},
 		{
+			name: "Settings",
 			path: "/settings",
 			component: Settings,
-			meta: {
-				isChat: false,
-				windowName: "Settings",
-			},
 		},
 		{
+			name: "Help",
 			path: "/help",
 			component: Help,
-			meta: {
-				isChat: false,
-				windowName: "Help",
-			},
 		},
 		{
+			name: "Changelog",
 			path: "/changelog",
 			component: Changelog,
-			meta: {
-				isChat: false,
-				windowName: "Changelog",
-			},
 		},
 		{
+			name: "NetworkEdit",
 			path: "/edit-network/:uuid",
 			component: NetworkEdit,
-			meta: {
-				isChat: false,
-				windowName: "NetworkEdit",
-			},
 		},
 		{
+			name: "RoutedChat",
 			path: "/chan-*",
 			component: RoutedChat,
-			meta: {
-				isChat: true,
-				windowName: "RoutedChat",
-			},
 		},
 	]);
 }

client/js/socket-events/init.js

@@ -1,10 +1,8 @@
 "use strict";
 
 const $ = require("jquery");
-const escape = require("css.escape");
 const socket = require("../socket");
 const webpush = require("../webpush");
-const sidebar = $("#sidebar");
 const storage = require("../localStorage");
 const constants = require("../constants");
 const {vueApp, initChannel} = require("../vue");
@@ -16,8 +14,6 @@ socket.on("init", function(data) {
 
 	$("#loading-page-message").text(store.state.currentUserVisibleError);
 
-	const previousActive = store.state.activeChannel && store.state.activeChannel.channel.id;
-
 	store.commit("networks", mergeNetworkData(data.networks));
 	store.commit("isConnected", true);
 	store.commit("currentUserVisibleError", null);
@@ -54,9 +50,23 @@ socket.on("init", function(data) {
 			window.removeEventListener("error", window.g_LoungeErrorHandler);
 			window.g_LoungeErrorHandler = null;
 		}
+
+		if (!vueApp.$route.name || vueApp.$route.name === "SignIn") {
+			const channel = store.getters.findChannel(data.active);
+
+			if (channel) {
+				vueApp.switchToChannel(channel.channel);
+			} else if (store.state.networks.length > 0) {
+				// Server is telling us to open a channel that does not exist
+				// For example, it can be unset if you first open the page after server start
+				vueApp.switchToChannel(store.state.networks[0].channels[0]);
+			} else {
+				// TODO: Use vue router
+				$("#footer .connect").trigger("click");
+			}
+		}
 	}
 
-	vueApp.$nextTick(() => openCorrectChannel(previousActive, data.active));
 	vueApp.synchronizeNotifiedState();
 
 	if (document.body.classList.contains("public")) {
@@ -67,44 +77,6 @@ socket.on("init", function(data) {
 	}
 });
 
-function openCorrectChannel(clientActive, serverActive) {
-	let target = $();
-
-	// Open last active channel
-	if (clientActive > 0) {
-		target = sidebar.find(`.chan[data-id="${clientActive}"]`);
-	}
-
-	// Open window provided in location.hash
-	if (target.length === 0 && window.location.hash) {
-		target = $(`[data-target="${escape(window.location.hash)}"]`).first();
-	}
-
-	// Open last active channel according to the server
-	if (serverActive > 0 && target.length === 0) {
-		target = sidebar.find(`.chan[data-id="${serverActive}"]`);
-	}
-
-	// Open first available channel
-	if (target.length === 0) {
-		target = sidebar.find(".chan").first();
-	}
-
-	// If target channel is found, open it
-	if (target.length > 0) {
-		target.trigger("click", {
-			replaceHistory: true,
-		});
-
-		return;
-	}
-
-	// Open the connect window
-	$("#footer .connect").trigger("click", {
-		pushState: false,
-	});
-}
-
 function mergeNetworkData(newNetworks) {
 	const collapsedNetworks = new Set(JSON.parse(storage.get("thelounge.networks.collapsed")));
 

client/js/vue.js

@@ -48,9 +48,9 @@ const vueApp = new Vue({
 			document.body.classList.add("is-apple");
 		}
 
-		document.addEventListener("visibilitychange", this.synchronizeNotifiedState());
-		document.addEventListener("focus", this.synchronizeNotifiedState());
-		document.addEventListener("click", this.synchronizeNotifiedState());
+		document.addEventListener("visibilitychange", this.synchronizeNotifiedState);
+		document.addEventListener("focus", this.synchronizeNotifiedState);
+		document.addEventListener("click", this.synchronizeNotifiedState);
 
 		// TODO: Hackfix because socket-events require vueApp somewhere
 		// and that breaks due to cyclical depenency as by this point vue.js