var DOM, pageManager, api, Notification; /* [1] Toggle du sub-menu-side <-> navigation ===========================================*/ var navSubMenu = function(subsection){ /* [1] Format du param ------------------------------------------------*/ // Contient l'element courant var current = $('#MENU-SIDE > span[data-link='+pageManager.page+'] + div.sub > span[data-sublink="'+pageManager.vars[0]+'"]'); // Contiendra l'element cible var target = null; // si @subsection est un element, on le prends target = (subsection instanceof Element) ? subsection : null; // Si string, on trouve l'element correspondant target = (typeof subsection == 'string') ? $('#MENU-SIDE > span[data-link='+pageManager.page+'] + div.sub > span[data-sublink="'+subsection+'"]') : target; // Si rien trouve, on prend le premier element correspondant a la premiere page target = (target == null) ? $('#MENU-SIDE > span[data-link='+pageManager.page+'] + div.sub > span[data-sublink]') : 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 cache les sections visibles var visibleSections = $$('#CONTAINER > section[data-sublink].active'); for( var i = 0 ; i < visibleSections.length ; i++ ) visibleSections[i].remClass('active'); // On active le nouveau if( target != null ){ target.addClass('active'); // On affiche les sections associées var targetSections = $$('#CONTAINER > section[data-sublink="'+target.getData('sublink')+'"]'); for( var i = 0 ; i < targetSections.length ; i++ ) targetSections[i].addClass('active'); } /* [3] Gestion de pageManager ------------------------------------------------*/ // Si element, on recupere le data-link var page = null; // Si erreur, on retourne FALSE if( !target.getData('sublink') ) return false var mustRefresh = pageManager.vars[0] != target.getData('sublink'); // On met a jour la variable page-manager si data-link trouve pageManager.vars[0] = target.getData('sublink'); if( mustRefresh ) // navMenu(pageManager.page); pageManager.updateURL(); }; /* [4] Toggle du side-menu <-> navigation ===========================================*/ var navMenu = function(section){ /* [1] Format du param ------------------------------------------------*/ // Contient l'element courant var current = $('#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') ? $('#WRAPPER > #MENU-SIDE > span[data-link="'+section+'"]') : target; // Si rien trouve, on prend le premier element correspondant a la premiere page target = target || $('#WRAPPER > #MENU-SIDE > span[data-link="'+pageManager.pagelist[0]+'"]'); // 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 current && current.remClass('active'); // On active le nouveau target && 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 var handlerX = function(){ // On gere la navigation du sous-menu (si defini, utilise) var subSectionExists = pageManager.vars.length >= 1 && $('#CONTAINER > section[data-sublink="'+pageManager.vars[0]+'"]') != null; // 1. Si le lien du menu associe existe -> on charge la page associee // 2. Sinon -> on charge le lien par defaut subSectionExists ? navSubMenu(pageManager.vars[0]) : navSubMenu(null); // GESTION DE LA NAVIGATION DU SOUS-MENU // si le sous-menu existe var smenu = $('#MENU-SIDE > span[data-link='+pageManager.page+'] + div.sub'); if( smenu != null ) smenu.addEventListener('click', function(e){ var target = e.target; while( target != document.body && !target.getData('sublink') ) target = target.parentNode; if( target.getData('sublink') ) navSubMenu(target); }, false); // On retire l'icone de chargement DOM.HEADER.remClass('loading'); }; /* (x) Si première ou changement de page, on charge la nouvelle */ pageManager.page != target.getData('link') && pageManager.setPage( target.getData('link') ); // Si on a `pageManager.activeXHR`, on met le handler, sinon on lance pageManager.activeXHR ? pageManager.activeXHR.addEventListener('loadend', handlerX, false) : handlerX.call(); } }; /* [0] Initialisation des variables en local =========================================================*/ DOM = { WRAPPER: $('body > #WRAPPER'), HEADER: $('body > #WRAPPER > #HEADER'), MENUSIDE: $('body > #WRAPPER > #MENU-SIDE'), CONTAINER: $('body > #WRAPPER > #CONTAINER') }; // On cree une instance de l'api api = new APIClass('/api/'); // On crée une instance du gestionnaire des notifications var Notification = new NotificationClass( $('#notification-container') ); // Temps d'une notification : ~4s Notification.defaultTimeout = 4000; // Définition des codes d'erreurs Notification.errorCodes = { '-1': 'Erreur de réseau, veuillez recharger la page et réessayer', 0: 'Erreur interne', 1: 'Erreur interne', 2: 'Erreur interne', 3: 'Le fichier est introuvable', 4: 'Erreur interne', 5: 'Erreur interne', 6: 'Erreur interne', 7: 'Erreur interne', 8: 'Erreur interne', 9: 'Certaines données sont manquantes', 10: 'Erreur interne', 11: 'Erreur interne', 12: 'Erreur interne', 13: 'Erreur interne', 14: 'Erreur interne', 15: 'Erreur interne', 16: 'Vous n\'avez pas la permission d\'effectuer cette action', 17: 'Le téléchargement a échoué', 18: 'Le fichier est invalide (format incorrect)' }; // On définit qu'on veut utiliser le 'sessionStorage' lsi.setStorage(localStorage); /* [5] 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); /* [6] Gestion du rechargement de page =========================================================*/ function reload(){ navMenu( pageManager.page ); } /* [7] Gestion du toggle de la page de login =========================================================*/ var LOGIN = { show: document.getElementById('user-data'), hide: document.getElementById('login-close'), page: document.getElementById('LOGIN') }; /* (1) Gestion de l'affichage de la page de login */ LOGIN.show.addEventListener('click', function(e){ LOGIN.page.className = 'active'; }, false); /* (2) Gestion de la fermeture de la page de login */ LOGIN.hide.addEventListener('click', function(e){ LOGIN.page.className = ''; }, false); /* [7] On recupere la liste des pages et on lance pageManager =========================================================*/ api.send({path:'download/menu'}, function(response){ // si erreur if( response.ModuleError !== 0 ) return; // On initialise la liste des pages pagelist = []; // On recupere chaque page for( var i = 0 ; i < response.menu.length; i++ ) pagelist.push( response.menu[i].attributes['data-link'] ); /* (1) On initialisa pageManager */ pageManager = new pageManagerClass(); pageManager.setPage(null, '/view', DOM.CONTAINER, pagelist, null ); /* (2) On charge la premiere page */ navMenu(pageManager.page); });