Correction action-script.js.
This commit is contained in:
xdrm-brackets
parent
0cd68d7fbb
commit
544e5464c8
|
|
@ -1,4 +1,216 @@
|
|||
/* [-1] On recupere la liste des pages
|
||||
/* [0] Initialisation des variables en local
|
||||
=========================================================*/
|
||||
var DOM = {
|
||||
WRAPPER: $('WRAPPER'),
|
||||
HEADER: $('HEADER'),
|
||||
MENUSIDE: $('MENU-SIDE'),
|
||||
CONTAINER: $('CONTAINER')
|
||||
};
|
||||
var pageManager;
|
||||
|
||||
|
||||
// On cree une instance de l'api
|
||||
api = new APIClass('/api/');
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [1] Toggle du sub-menu-side <-> navigation
|
||||
===========================================*/
|
||||
function navSubMenu(subsection){
|
||||
/* [1] Format du param
|
||||
------------------------------------------------*/
|
||||
// Contient l'element courant
|
||||
var current = document.querySelector('#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') ? document.querySelector('#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) ? document.querySelector('#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 = document.querySelectorAll('#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 la section associee
|
||||
var targetSection = document.querySelector('#CONTAINER > section[data-sublink="'+target.getData('sublink')+'"]');
|
||||
if( targetSection != null )
|
||||
targetSection.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
|
||||
===========================================*/
|
||||
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 gere la navigation du sous-menu (si defini, utilise)
|
||||
var subSectionExists = pageManager.vars.length >= 1 && document.querySelector('#CONTAINER > section[data-sublink="'+pageManager.vars[0]+'"]') != null;
|
||||
if( subSectionExists ) // Si le lien du menu associe existe
|
||||
navSubMenu(pageManager.vars[0]); // on charge la page associee
|
||||
else // sinon
|
||||
navSubMenu(null); // on charge le lien par defaut
|
||||
|
||||
|
||||
// GESTION DE LA NAVIGATION DU SOUS-MENU
|
||||
// si le sous-menu existe
|
||||
var smenu = document.querySelector('#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');
|
||||
}, false);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [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
|
||||
=========================================================*/
|
||||
pageManagerClass.prototype.ajax('/f/json/menu/conf', function(pagelistSerialized){
|
||||
// On initialise la liste des pages
|
||||
|
|
@ -11,219 +223,10 @@ pageManagerClass.prototype.ajax('/f/json/menu/conf', function(pagelistSerialized
|
|||
for( var i = 0 ; i < pagelistObject.length; i++ )
|
||||
pagelist.push( pagelistObject[i]['attributes']['data-link'] );
|
||||
|
||||
|
||||
|
||||
|
||||
DOM = {
|
||||
WRAPPER: $('WRAPPER'),
|
||||
HEADER: $('HEADER'),
|
||||
MENUSIDE: $('MENU-SIDE'),
|
||||
CONTAINER: $('CONTAINER')
|
||||
};
|
||||
|
||||
|
||||
|
||||
/* [0] Instanciation
|
||||
===========================================*/
|
||||
var pageManager = new pageManagerClass();
|
||||
/* (1) On initialisa pageManager */
|
||||
pageManager = new pageManagerClass();
|
||||
pageManager.setPage(null, '/view', DOM.CONTAINER, pagelist );
|
||||
|
||||
var api = new APIClass('/api/');
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [1] Toggle du sub-menu-side <-> navigation
|
||||
===========================================*/
|
||||
function navSubMenu(subsection){
|
||||
/* [1] Format du param
|
||||
------------------------------------------------*/
|
||||
// Contient l'element courant
|
||||
var current = document.querySelector('#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') ? document.querySelector('#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) ? document.querySelector('#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 = document.querySelectorAll('#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 la section associee
|
||||
var targetSection = document.querySelector('#CONTAINER > section[data-sublink="'+target.getData('sublink')+'"]');
|
||||
if( targetSection != null )
|
||||
targetSection.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
|
||||
===========================================*/
|
||||
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 gere la navigation du sous-menu (si defini, utilise)
|
||||
var subSectionExists = pageManager.vars.length >= 1 && document.querySelector('#CONTAINER > section[data-sublink="'+pageManager.vars[0]+'"]') != null;
|
||||
if( subSectionExists ) // Si le lien du menu associe existe
|
||||
navSubMenu(pageManager.vars[0]); // on charge la page associee
|
||||
else // sinon
|
||||
navSubMenu(null); // on charge le lien par defaut
|
||||
|
||||
|
||||
// GESTION DE LA NAVIGATION DU SOUS-MENU
|
||||
// si le sous-menu existe
|
||||
var smenu = document.querySelector('#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');
|
||||
}, false);
|
||||
}
|
||||
|
||||
}navMenu(pageManager.page);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [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);
|
||||
|
||||
|
||||
}, 'GET')
|
||||
/* (2) On charge la premiere page */
|
||||
navMenu(pageManager.page);
|
||||
}, 'GET');
|
||||
Loading…
Reference in New Issue