fix #63: add a new side menu with categories

templates/js/script.php

@@ -1,3 +1,17 @@
+<?php
+
+$display = 'default';
+
+if ($_['always-displayed']) {
+    $display = 'always-displayed';
+} elseif ($_['big-menu']) {
+    $display = 'big-menu';
+} elseif ($_['side-with-categories']) {
+    $display = 'side-with-categories';
+}
+
+?>
+
 (function() {
     var sideMenuContainer = jQuery('<div id="side-menu-container">')
     var sideMenuOpener = jQuery('<button class="side-menu-opener"></button>')
@@ -6,8 +20,10 @@
     var html = jQuery('html')
     var isTouchDevice = window.matchMedia("(pointer: coarse)").matches
 
-    <?php if ($_['big-menu']): ?>
+    <?php if ($display === 'big-menu'): ?>
         sideMenu.attr('data-bigmenu', '1')
+    <?php elseif ($display === 'side-with-categories'): ?>
+        sideMenu.attr('data-sidewithcategories', '1')
     <?php endif; ?>
 
     var targetBlankApps = <?php echo json_encode($_['target-blank-apps']) ?>;
@@ -25,7 +41,7 @@
                 sideMenuOpener.removeClass('hide')
             }
 
-            <?php if ($_['always-displayed'] && !$_['big-menu']): ?>
+            <?php if ($display === 'always-displayed'): ?>
                 if (apps.length === 0) {
                     html.removeClass('side-menu-always-displayed');
                 } else {
@@ -33,7 +49,7 @@
                 }
             <?php endif; ?>
         <?php else: ?>
-            <?php if ($_['always-displayed'] && !$_['big-menu']): ?>
+            <?php if ($display === 'always-displayed'): ?>
                 if (apps.length === 0) {
                     html.removeClass('side-menu-always-displayed');
                 } else {
@@ -61,7 +77,7 @@
             }
         }
 
-        <?php if ($_['opener-hover'] || ($_['always-displayed'] && !$_['big-menu'])): ?>
+        <?php if ($_['opener-hover'] || $display === 'always-displayed'): ?>
             var sideMenuMouseLeave = function() {
                 sideMenu
                     .removeClass('open')
@@ -97,7 +113,7 @@
             sideMenu.find('.side-menu-app.active a').focus()
         })
 
-        <?php if ($_['always-displayed'] && !$_['big-menu']): ?>
+        <?php if ($display === 'always-displayed'): ?>
             sideMenuOpener.on('click', function() {
                 sideMenu.toggleClass('open')
             })
@@ -138,7 +154,7 @@
         <?php require_once __DIR__.'/_topMenuApps.js'; ?>
     <?php endif; ?>
 
-    <?php if ($_['always-displayed'] && !$_['big-menu']): ?>
+    <?php if ($display === 'always-displayed'): ?>
         <?php require_once __DIR__.'/_alwaysDisplayed.js'; ?>
     <?php endif; ?>
 })();