Team:NAIT Edmonton/js-mobile

/*Script functionality*/ $(document).ready(function() {

 //GLOBALS
 var nav_menu = $('.nav-menu');
 var nav_menu_wrap = $('.nav-menu-wrap');
 var nav_menu_background = $('.nav-menu-background');

 //toggle the active states
 function toggle_menu() {
   nav_menu_wrap.toggleClass('active');
   nav_menu_background.toggleClass('active');
 }

 //toggling activate state when interacting with elements
 $('.nav-menu-toggle, .nav-menu-background, .nav-menu .close').on('click', function() {
   toggle_menu();
 });

 //sets the height of the menu to be the same height as the body
 function set_menu_height() {
   var body_height = $('body').height();
   nav_menu.height(body_height);
 }
 set_menu_height();

 //if we change orientation or resize, reculate menu
 $(window).resize(function() {
   set_menu_height();
 })

 //INDENTING
 //go through the menu and add indenting 
 function add_menu_depth() {

   var menus = $('.menu');
   //set depth width to be 5% of the nav menu
   var pad_depth = (nav_menu.outerWidth() / 20);

   //if we have menus
   if (menus.length != 0) {
     $.each(menus, function() {
       var depth_count = $(this).parents('.menu').length + 1;
       var child_elements = $(this).find('li > a');

       $.each(child_elements, function() {
         $(this).css('padding-left', depth_count * pad_depth);
       });
     })
   }
 }
 add_menu_depth();

});