Merge pull request #2235 from thelounge/xpaw/store-sidebar-visibility

Store visibility status of sidebar menus

client/js/lounge.js

@@ -32,18 +32,29 @@ $(function() {
 	const contextMenuContainer = $("#context-menu-container");
 	const contextMenu = $("#context-menu");
 
+	function storeSidebarVisibility(name, state) {
+		if ($(window).outerWidth() < utils.mobileViewportPixels) {
+			return;
+		}
+
+		storage.set(name, state);
+	}
+
 	$("#windows").on("click", function(e) {
 		const isOpen = slideoutMenu.isOpen();
 
-		if (isOpen || $(e.target).is(".lt")) {
+		if ((isOpen && $(window).outerWidth() < utils.mobileViewportPixels) || $(e.target).is(".lt")) {
 			slideoutMenu.toggle(!isOpen);
+			storeSidebarVisibility("thelounge.state.sidebar", !isOpen);
 		}
 	});
 
 	viewport.on("click", ".rt", function() {
-		const self = $(this);
-		viewport.toggleClass(self.prop("class"));
+		const isOpen = !viewport.hasClass("rt");
+
+		viewport.toggleClass("rt", isOpen);
 		chat.find(".chan.active .chat").trigger("keepToBottom");
+		storeSidebarVisibility("thelounge.state.userlist", isOpen);
 
 		return false;
 	});
@@ -364,7 +375,10 @@ $(function() {
 			}
 
 			utils.scrollIntoViewNicely(self[0]);
-			slideoutMenu.toggle(false);
+
+			if ($(window).outerWidth() < utils.mobileViewportPixels) {
+				slideoutMenu.toggle(false);
+			}
 		}
 
 		const lastActive = $("#windows > .active");

client/js/socket-events/init.js

@@ -42,12 +42,19 @@ socket.on("init", function(data) {
 
 		webpush.configurePushNotifications(data.pushSubscription, data.applicationServerKey);
 
+		slideoutMenu.enable();
+
+		const viewport = $("#viewport");
+
+		if ($(window).outerWidth() >= utils.mobileViewportPixels) {
+			slideoutMenu.toggle(storage.get("thelounge.state.sidebar") === "true");
+			viewport.toggleClass("rt", storage.get("thelounge.state.userlist") === "true");
+		}
+
 		$(document.body).removeClass("signed-out");
 		$("#loading").remove();
 		$("#sign-in").remove();
 
-		slideoutMenu.enable();
-
 		if (window.g_LoungeErrorHandler) {
 			window.removeEventListener("error", window.g_LoungeErrorHandler);
 			window.g_LoungeErrorHandler = null;

client/js/utils.js

@@ -8,6 +8,8 @@ var serverHash = -1; // eslint-disable-line no-var
 var lastMessageId = -1; // eslint-disable-line no-var
 
 module.exports = {
+	// Same value as media query in CSS that forces sidebars to become overlays
+	mobileViewportPixels: 768,
 	inputCommands: {collapse, expand, join},
 	findCurrentNetworkChan,
 	serverHash,