Update mobile menu

Getting the mobile menu system to work with foundation
foundation is opening and closing the menu and the script
in arrowMenu.js is setting up the mobile menu nav and deals
with opening and closing the current ul li structure for the
page is on.

diff --git a/libjs/arrowMenu.js b/libjs/arrowMenu.js
index c56fba7..3e5aa3e 100644 (file)
--- a/libjs/arrowMenu.js
+++ b/libjs/arrowMenu.js
@@ -17,7 +17,7 @@ function setMobileNav() {
              // Toggle the close button to a menu button.
              $(this).css('background', 'url(' + media_base_url + 'assets/menu.png) 0 0 no-repeat');
              // Show the menu.
-             $('#mobilenav').css("display", "none");
+             //$('#mobilenav').css("display", "none");
         }
         menuCounter++;
     });
@@ -52,7 +52,24 @@ function setArrows() {
     });
 }
 
+function setNav() {
+       /* Close all. */
+       $('#mobilenav ul ul').addClass('closed');
+
+       /* Find the current anchor. */
+       var currentAnchor = $('#mobilenav ul').find('.current').eq(0);
+       /* Open all the current anchor's parents. */
+       currentAnchor.parents('ul').removeClass('closed');
+       currentAnchor.parents('ul').addClass('open');
+       /* Open the current anchor's children. */
+       if(currentAnchor.siblings('ul').length > 0) {
+               currentAnchor.siblings('ul').eq(0).removeClass('closed');
+               currentAnchor.siblings('ul').eq(0).addClass('open');
+       }
+}
+
 $(function(){
 
     setMobileNav();
+    setNav();
 })
\ No newline at end of file

diff --git a/templates/template.html b/templates/template.html
index 1fa66e7..d1008a5 100644 (file)
--- a/templates/template.html
+++ b/templates/template.html
@@ -156,7 +156,12 @@
 <script src="{mediaBaseURL:h}libjs/foundation/foundation.topbar.js"></script>
 {bottomScripts:h}
 <script>
-$(document).foundation();
+$(document).foundation({
+    offcanvas: {
+        open_method: 'move',
+        close_on_click: false
+    }
+});
 </script>
 </body>
 </html>