/* [-1] On attend le chargement du document =========================================================*/ // document.onload = function(){ DOM = { WRAPPER: $('WRAPPER'), HEADER: $('HEADER'), MENUSIDE: $('MENU-SIDE'), CONTAINER: $('CONTAINER') }; /* [0] Instanciation ===========================================*/ var pageManager = new pageManagerClass(); pageManager.setPage(null, '/view', DOM.CONTAINER, ['dashboard', 'input', 'analytics', 'charts', 'settings'] ); var api = new APIClass('/api/'); /* [1] Toggle du side-menu <-> navigation ===========================================*/ function navMenu(section){ /* [1] Format du param ------------------------------------------------*/ // Contient l'element courant var current = document.querySelector('#WRAPPER > #MENU-SIDE > span[data-link="'+pageManager.page+'"]'); // Contiendra l'element cible var target = null; // si @section est un element, on le prends target = (section instanceof Element) ? section : null; // Si string, on trouve l'element correspondant target = (typeof section == 'string') ? document.querySelector('#WRAPPER > #MENU-SIDE > span[data-link="'+section+'"]') : target; // Si rien trouve, on prend le premier element correspondant a la premiere page target = (target == null) ? document.querySelector('#WRAPPER > #MENU-SIDE > span[data-link="'+pageManager.pagelist[0]+'"]') : target; // Si le param n'est toujours pas bon, on retourne une erreur if( target == null ) return false; /* [2] Gestion de l'affichage de l'element ------------------------------------------------*/ // On desactive l'element courant if( current != null ) current.remClass('active'); // On active le nouveau if( target != null ) target.addClass('active'); /* [3] Gestion de pageManager ------------------------------------------------*/ // Si element, on recupere le data-link var page = null; // On charge la page si data-link trouve if( target.getData('link') ){ DOM.HEADER.addClass('loading'); // Animation de chargement pageManager.setPage( target.getData('link') ); pageManager.activeXHR.addEventListener('loadend', function(){ // On retire l'icone de chargement DOM.HEADER.remClass('loading'); }, false); } }navMenu(pageManager.page); /* [2] Gestion de la navigation (physique) ===========================================*/ DOM.MENUSIDE.addEventListener('click', function(e){ var target = e.target; // On remonte dans les parents au bon niveau while( target != document.body && !target.getData('link') ) target = target.parentNode; // Si on a trouve l'element, on l'utilise pour la page if( target.getData('link') ) navMenu(target.getData('link')); }, false); // }