Option to completely hide left navbar (FR#92)

api/classes/organizr.class.php

@@ -440,6 +440,38 @@ class Organizr
 		return (isset($errorCodes[$error])) ? $errorCodes[$error] : $errorCodes[000];
 	}
 	
+	public function showTopBarHamburger()
+	{
+		if ($this->config['allowCollapsableSideMenu']) {
+			if ($this->config['sideMenuCollapsed']) {
+				return '<a class="toggle-side-menu" href="javascript:void(0)"><i class="ti-menu fa-fw"></i></a>';
+			} else {
+				return '<a class="toggle-side-menu hidden" href="javascript:void(0)"><i class="ti-menu fa-fw"></i></a>';
+			}
+		}
+		return '';
+	}
+	
+	public function showSideBarHamburger()
+	{
+		if ($this->config['allowCollapsableSideMenu']) {
+			if (!$this->config['sideMenuCollapsed']) {
+				return '<i class="hidden-xs ti-shift-left mouse"></i>';
+			}
+		}
+		return '<i class="ti-menu hidden-xs"></i>';
+	}
+	
+	public function showSideBarText()
+	{
+		if ($this->config['allowCollapsableSideMenu']) {
+			if (!$this->config['sideMenuCollapsed']) {
+				return '<span class="hide-menu hidden-xs" lang="en">Hide Menu</span>';
+			}
+		}
+		return '<span class="hide-menu hidden-xs" lang="en">Navigation</span>';
+	}
+	
 	public function auth()
 	{
 		if ($this->hasDB()) {
@@ -1777,46 +1809,9 @@ class Organizr
 					'help' => 'Used to set the description for SEO meta tags'
 				),
 			),
-			'Login Page' => array(
-				array(
-					'type' => 'input',
-					'name' => 'loginLogo',
-					'label' => 'Login Logo',
-					'value' => $this->config['loginLogo'],
-				),
-				array(
-					'type' => 'input',
-					'name' => 'loginWallpaper',
-					'label' => 'Login Wallpaper',
-					'value' => $this->config['loginWallpaper'],
-					'help' => 'You may enter multiple URL\'s using the CSV format.  i.e. link#1,link#2,link#3'
-				),
-				array(
-					'type' => 'switch',
-					'name' => 'useLogoLogin',
-					'label' => 'Use Logo instead of Title on Login Page',
-					'value' => $this->config['useLogoLogin']
-				),
-				array(
-					'type' => 'switch',
-					'name' => 'minimalLoginScreen',
-					'label' => 'Minimal Login Screen',
-					'value' => $this->config['minimalLoginScreen']
-				)
-			),
-			'Options' => array(
-				array(
-					'type' => 'switch',
-					'name' => 'alternateHomepageHeaders',
-					'label' => 'Alternate Homepage Titles',
-					'value' => $this->config['alternateHomepageHeaders']
-				),
-				array(
-					'type' => 'switch',
-					'name' => 'debugErrors',
-					'label' => 'Show Debug Errors',
-					'value' => $this->config['debugErrors']
-				),
+			'Side Menu' => array(
+				$this->settingsOption('switch', 'allowCollapsableSideMenu', ['label' => 'Allow Side Menu to be Collapsable']),
+				$this->settingsOption('switch', 'sideMenuCollapsed', ['label' => 'Side Menu Collapsed at Launch']),
 				array(
 					'type' => 'switch',
 					'name' => 'githubMenuLink',
@@ -1847,12 +1842,6 @@ class Organizr
 					'label' => 'Show Organizr Sign out & in Button on Sidebar',
 					'value' => $this->config['organizrSignoutMenuLink']
 				),
-				array(
-					'type' => 'switch',
-					'name' => 'easterEggs',
-					'label' => 'Show Easter Eggs',
-					'value' => $this->config['easterEggs']
-				),
 				array(
 					'type' => 'switch',
 					'name' => 'expandCategoriesByDefault',
@@ -1887,6 +1876,53 @@ class Organizr
 						)
 					)
 				),
+			),
+			'Login Page' => array(
+				array(
+					'type' => 'input',
+					'name' => 'loginLogo',
+					'label' => 'Login Logo',
+					'value' => $this->config['loginLogo'],
+				),
+				array(
+					'type' => 'input',
+					'name' => 'loginWallpaper',
+					'label' => 'Login Wallpaper',
+					'value' => $this->config['loginWallpaper'],
+					'help' => 'You may enter multiple URL\'s using the CSV format.  i.e. link#1,link#2,link#3'
+				),
+				array(
+					'type' => 'switch',
+					'name' => 'useLogoLogin',
+					'label' => 'Use Logo instead of Title on Login Page',
+					'value' => $this->config['useLogoLogin']
+				),
+				array(
+					'type' => 'switch',
+					'name' => 'minimalLoginScreen',
+					'label' => 'Minimal Login Screen',
+					'value' => $this->config['minimalLoginScreen']
+				)
+			),
+			'Options' => array(
+				array(
+					'type' => 'switch',
+					'name' => 'alternateHomepageHeaders',
+					'label' => 'Alternate Homepage Titles',
+					'value' => $this->config['alternateHomepageHeaders']
+				),
+				array(
+					'type' => 'switch',
+					'name' => 'debugErrors',
+					'label' => 'Show Debug Errors',
+					'value' => $this->config['debugErrors']
+				),
+				array(
+					'type' => 'switch',
+					'name' => 'easterEggs',
+					'label' => 'Show Easter Eggs',
+					'value' => $this->config['easterEggs']
+				),
 				array(
 					'type' => 'input',
 					'name' => 'gaTrackingID',
@@ -4323,7 +4359,8 @@ class Organizr
 				'sandbox' => $this->config['sandbox'],
 				'expandCategoriesByDefault' => $this->config['expandCategoriesByDefault'],
 				'autoCollapseCategories' => $this->config['autoCollapseCategories'],
-				'autoExpandNavBar' => $this->config['autoExpandNavBar']
+				'autoExpandNavBar' => $this->config['autoExpandNavBar'],
+				'sideMenuCollapsed' => $this->config['allowCollapsableSideMenu'] && $this->config['sideMenuCollapsed']
 			),
 			'menuLink' => array(
 				'githubMenuLink' => $this->config['githubMenuLink'],

api/config/default.php

@@ -601,5 +601,7 @@ return [
 	'blacklisted' => '',
 	'blacklistedMessage' => 'You have been blacklisted from this site.',
 	'defaultRequestService' => 'ombi',
-	'easterEggs' => true
+	'easterEggs' => true,
+	'allowCollapsableSideMenu' => false,
+	'sideMenuCollapsed' => false
 ];

css/organizr.css

@@ -102,6 +102,19 @@ span.jsgrid-pager-page.jsgrid-pager-current-page.btn.btn-primary{
     }
 }
 
+@media screen and (min-width: 768px) {
+    #page-wrapper.sidebar-hidden {
+        margin: 0;
+        width: 100%;
+    }
+    .sidebar.sidebar-hidden {
+        display: none;
+    }
+    .navbar.sidebar-hidden {
+        padding-left: 0;
+    }
+}
+
 .tab1 { padding-left: 1em; }
 .tab2 { padding-left: 2em; }
 .tab3 { padding-left: 3em; }

index.php

@@ -80,6 +80,7 @@ $Organizr = new Organizr();
     <nav class="navbar navbar-default navbar-static-top m-b-0 animated slideInDown">
         <div class="navbar-header">
             <div class="top-left-part hidden-xs p-r-10">
+				<?php echo $Organizr->showTopBarHamburger(); ?>
                 <!-- Logo -->
                 <a class="logo" href="javascript:void(0)">
                     <!-- Logo text image you can use text also -->
@@ -126,8 +127,12 @@ $Organizr = new Organizr();
     <div class="navbar-default sidebar nav-bar-rtl" role="navigation">
         <div class="sidebar-nav">
             <div class="sidebar-head">
-                <h3><span class="open-close m-r-5"><i class="ti-menu hidden-xs"></i><i class="ti-close visible-xs"></i></span>
-                    <span class="hide-menu hidden-xs" lang="en">Navigation</span>
+                <h3>
+                    <span class="open-close m-r-5">
+                        <?php echo $Organizr->showSideBarHamburger(); ?>
+                        <i class="ti-close visible-xs"></i>
+                    </span>
+					<?php echo $Organizr->showSideBarText(); ?>
                     <span class="hide-menu hidden-sm hidden-md hidden-lg" id="side-logo"></span>
                 </h3>
             </div>

js/custom.js

@@ -1922,4 +1922,21 @@ $(document).on("change", ".overseerr-season", function () {
 	});
 	$('.submit-overseerr-seasons').attr('disabled', enableButtonDisabled);
 	$('.submit-overseerr-seasons').attr('data-seasons', requestedSeasons);
+});
+
+// Toggle Side Menu
+$(document).on('click', '.toggle-side-menu', function() {
+	toggleSideMenuClasses();
+	//$('.toggle-side-menu i').toggleClass('ti-shift-right ti-shift-left');
+	console.log($('.sidebar-head .hide-menu.hidden-xs'));
+	$('.sidebar-head .hide-menu.hidden-xs').text('Hide Menu');
+	$('.sidebar-head .open-close i').first().toggleClass('ti-menu ti-shift-left mouse');
+	$('.toggle-side-menu').toggleClass('hidden');
+});
+// Toggle Side Menu Other
+$(document).on('click', '.ti-shift-left.mouse', function() {
+	toggleSideMenuClasses();
+	//$('.toggle-side-menu i').toggleClass('ti-shift-right ti-shift-left');
+	$('.sidebar-head .open-close i').first().toggleClass('ti-menu ti-shift-left mouse');
+	$('.toggle-side-menu').toggleClass('hidden');
 });

js/functions.js

@@ -11142,6 +11142,16 @@ function setJournalMode(mode){
 		OrganizrApiError(xhr);
 	});
 }
+function toggleSideMenuClasses(){
+	$('#page-wrapper').toggleClass('sidebar-hidden');
+	$('.sidebar').toggleClass('sidebar-hidden');
+	$('.navbar').toggleClass('sidebar-hidden');
+}
+function sideMenuCollapsed(){
+	if(activeInfo.settings.misc.sideMenuCollapsed){
+		toggleSideMenuClasses();
+	}
+}
 function launch(){
 	console.info('https://docs.organizr.app/help/faq/migration-guide#version-2-0-greater-than-version-2-1');
 	organizrConsole('API V2 API','If you see a 404 Error for api/v2/launch below this line, you have not setup the new location block... See URL above this line', 'error');
@@ -11197,6 +11207,7 @@ function launch(){
 			        break;
 		        case "ok":
 			        loadAppearance(json.data.appearance);
+			        sideMenuCollapsed();
 			        if(activeInfo.user.locked == 1){
 				        buildLockscreen();
 			        }else{