var body = document.getElementsByTagName("body")[0];
var BTNheader_icon = document.getElementById('header_icon');
var BTNclose_icon = document.getElementById('close_icon');
var BTNhaut = document.getElementById('haut');
var Pinfo = document.getElementById('info');
/**
* Pour l'ajax tableau contenant les titres des pages.
* @ return tab valueleur des titres des pages selon id de l'url.
**/
var tab=new Array;
   tab["UbuntuDriverGraphic"]="Ubunutu driver graphique";
   tab["PartageFichier"]="Partage de fichiers";
   tab["conky"]="Conky";
   tab["vracubuntu"]="Astuces Ubuntu";
   tab["opticode"]="Optimisation web";
   tab["mobileouscreen"]="PHP: Mobile ou PC?";
   tab["parafluide"]="CSS:hyphens";
   tab["optimg"]="Optimiser les images web";
   tab["mini"]="Minifier son code";
   tab["optijquery"]="Jquery rapide";
   tab["java"]="JS vs JQuery";
   tab["jsvar"]="Var dans Listener";
   tab["tablette"]="Tablette";
   tab["info"]="Information";
   tab["contact"]="Contact";
// GESTION DE BOUTON DU MENU
BTNheader_icon.addEventListener("click", togglemenu, false);
BTNclose_icon.addEventListener("click", togglemenu, false);
BTNhaut.addEventListener("click", EnHaut, false);
// afficher/cacher le menu
function togglemenu(event) {
        event.preventDefault();
        event.stopPropagation();
        if (body.classList) {
         body.classList.toggle('with--sidebar');
        } else {
         var classes = body.className.split(' ');
         var existingIndex = classes.indexOf('with--sidebar');

         if (existingIndex >= 0)
                classes.splice(existingIndex, 1);
         else
                classes.push('with--sidebar');

         body.className = classes.join(' ');
        }
}
// Menu Listener sur h2 des menu -> fonction déploier le sous menu attenant.
document.addEventListener('click', function(event) {
    var el = event.target;
        if (el.className === 'h2menu') {
                do {
                        if (el.classList.contains('h2menu')) {toggleh2menu(el);}
                        else break;
                } while (el = el.parentNode);
        }
}, false);
// Replier/Déployer les sous menu des h2 du menu
function toggleh2menu(az) {
        var Dis = az.nextElementSibling;
        if (Dis.classList) {
                Dis.classList.toggle('ul2menuslide');
        }
}
// EFFET SUMMARY SUR ARTICLE DANS PAGE LOADER EN AJAX
// CAR JAVASCRIPT NE FONCTIONNE PAS SUR LES PAGES AJAX OBLIGE SINON À RELOADER
document.addEventListener('click', function(event) {
    var el = event.target;
        if (el.className === 'summary') {
                do {
                        if (el.classList.contains('summary')) {togglesum(el);}
                        else break;
                } while (el = el.parentNode);
        }
}, false);
// FONCTION AJOUTER/SUPPRIMER CLASS .HIDDEN ET PIVOTER .ICON-PLAY
// Complément de la fontion précédente
function togglesum(az) {
        var Dis = az.nextElementSibling;
        var mySVG = az.querySelector('.icon-play');
        if (Dis.classList) {
                // faire pivoter l'icone triangle dans h2.summary svg-> .icon-playrot
                if (mySVG.hasClass('icon-play')){mySVG.toggleClass('icon-playrot');}
                Dis.classList.toggle('sumslide');
        }
}

// API SVG AJOUT SUPPRESSION CLASS pour function togglesum()
// Sourc: http://toddmotto.com/hacking-svg-traversing-with-ease-addclass-removeclass-toggleclass-functions/
// hasClass API
SVGElement.prototype.hasClass = function (className) {
  return new RegExp('(\\s|^)' + className + '(\\s|$)').test(this.getAttribute('class'));
};
// addClass API
SVGElement.prototype.addClass = function (className) {
  if (!this.hasClass(className)) {
    this.setAttribute('class', this.getAttribute('class') + ' ' + className);
  }
};
// removeClass API
SVGElement.prototype.removeClass = function (className) {
  var removedClass = this.getAttribute('class').replace(new RegExp('(\\s|^)' + className + '(\\s|$)', 'g'), '$2');
  if (this.hasClass(className)) {
    this.setAttribute('class', removedClass);
  }
};
// toggleClass API
SVGElement.prototype.toggleClass = function (className) {
  if (this.hasClass(className)) {
    this.removeClass(className);
  } else {
    this.addClass(className);
  }
};
// CHARGEMENT DE DOCUMENT EN AJAX
function loadHTMLDoc(urlD) {
var url = "./articles/"+urlD+".html";
//alert(url);
frame = document.getElementById('site-content');
var request;
request = new XMLHttpRequest();
request.open('GET', url, true);
request.setRequestHeader("Content-Type","text/html;charset=UTF-8");
//request.setRequestHeader('Cache-Control', 'no-cache');
request.onload = function() {
  if (request.status >= 200 && request.status < 400){
    // Succès!
        body.classList.remove('with--sidebar');// faire disparaître le menu et remettre le document.
        if(history.pushState) {history.pushState(null, null,histPush);}// Changer l'url dans le navigateur.
        frame.innerHTML=request.responseText;
        document.title= tab[urlD];// Changer le titre du document.
        window.scrollTo(0, 0);
  } else {
    // Érreur
        window.location="./erreur.html";
  }
};
request.onerror = function() {
  // There was a connection error of some sort
  window.location="./erreur.html";
};
request.send();
}
// METTRE UN ÉCOUTEUR SUR LES LIENS DU MENU
function addOnClick()
{
        var x = document.querySelectorAll('#Sec1 ul li a');
        for(var i=0;i<x.length;i++){
                x[i].addEventListener('click', function(e) {
                hrefSearch =parseQuery(this.getAttribute("href"));
                histPush= this.getAttribute("href");
                //alert(hrefSearch);
                loadHTMLDoc(hrefSearch);
                e.preventDefault();
                }, false);
        }
}
// RETOURNE LA PAGE DU LIEN
function parseQuery(qstr){
  var a = qstr.split('?id=');
  return a[1];
}
// Controle si la hauteur du document est supérieure àcelle de la fenêtre
function hasVerticalScroll(){
var h = document.getElementById('header').offsetHeight+ document.getElementById('site-content').offsetHeight+ document.getElementById('footersite').offsetHeight;
        if(h > window.innerHeight===true) {
                document.getElementById('Lateral').style.display = 'block';
        }
        else{
                document.getElementById('Lateral').style.display = 'none';
        }
}
// fonctions au chargement de la page scroll top
function EnHaut(event){
        event.preventDefault();
        event.stopPropagation();
        window.scrollTo(0,0);
}
function getPosition(element) {
    var xPosition = 0;
    var yPosition = 0;
  
    while(element) {
        xPosition += (element.offsetLeft - element.scrollLeft + element.clientLeft);
        yPosition += (element.offsetTop - element.scrollTop + element.clientTop);
        element = element.offsetParent;
    }
    var z = "x:"+ xPosition+", y:"+ yPosition;
        return z;
}
function Ou(){
        Pinfo.innerHTML = getPosition( document.getElementById('site-content') );
}
function start() {
/* Utilisation de hasVerticalScroll() dans un timer et rrafraichit tout les 50 */
setInterval( function(){ hasVerticalScroll(); }, 50);
addOnClick();// DÉCLENCHER L'ÉCOUTEUR SUR LES LIENS DU MENU
Ou();
}
window.onload = start();
window.onresize = this.resize;
document.addEventListener('touchstart', handleTouchStart, false);        
document.addEventListener('touchmove', handleTouchMove, false);

var xDown = null;                                                        
var yDown = null;                                                        
/** Pour les mobiles & Co swipe horizontal
**      De Gauche vers droite affiche le menu à nouveau le cache
**      De Droite vers Gauche scroll vers le haut
**/
function handleTouchStart(evt) {                                         
    xDown = evt.touches[0].clientX;                                      
    yDown = evt.touches[0].clientY;                                      
};                                                

function handleTouchMove(evt) {
    if ( ! xDown || ! yDown ) {
        return;
    }

    var xUp = evt.touches[0].clientX;                                    
    var yUp = evt.touches[0].clientY;

    var xDiff = xDown - xUp;
    var yDiff = yDown - yUp;

    if ( Math.abs( xDiff ) > Math.abs( yDiff ) ) {/*most significant*/
        if ( xDiff > 0 ) {
            /* left swipe */window.scrollTo(0,0);
        } else {
            /* right swipe alert('Menu');*/togglemenu(evt);
        }                       
    } else {
        if ( yDiff > 0 ) {
            /* up swipe */
        } else {
            /* down swipe */
        }                                                                 
    }
    /* reset values */
    xDown = null;
    yDown = null;                                             
};