diff --git a/client/js/lounge.js b/client/js/lounge.js index 01048e4b..ac2fc6db 100644 --- a/client/js/lounge.js +++ b/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"); diff --git a/client/js/socket-events/init.js b/client/js/socket-events/init.js index 009f7a1a..11d8b3e6 100644 --- a/client/js/socket-events/init.js +++ b/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; diff --git a/client/js/utils.js b/client/js/utils.js index e972425e..e9f73090 100644 --- a/client/js/utils.js +++ b/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,