// +------------------------------------------------------------------------+
// | Affichage des image en plein �cran
// +------------------------------------------------------------------------+
// | Javascript
// | 
// | @author                 Xuan Nguyen <xuxu.fr@gmail.com>
// | @version                 1.81
// | Last update            2007/06/06
// |
// | Licensed under the Creative Commons Attribution 3 License - http://creativecommons.org/licenses/by-sa/3.0/
// +------------------------------------------------------------------------+

//Distance en pixel entre le haut de l'image et le top.
var margin_top = 40;
//Distance en pixel entre la droite de l'image et le right si l'image d�passe du body initial.
var margin_right = 40;
//Distance en pixel entre le bas de l'image et le bottom si l'image d�passe du body initial.
var margin_bottom = 40;
//Distance en pixel entre la gauche de l'image et le right si l'image d�passe du body initial.
var margin_left = 40;
// Tableau comprenant les groupes d'images
var splash_groups = new Array();
// Tableau comprenant les liens splashed
var splash_as = new Array();
// Tableau comprenant les titles des liens
var splash_titles = new Array();
//Variable contenant le timeout
var slide_timeout;
//Variable contenant le timeout de la disparition de la notification de play/pause
var slide_timeout_notification;
//Dur�e timeout pour le slide
var slide_timeout_value = 4000;
//Groupe courant
var current_group;
//Position actuelle de l'image dans le groupe
var current_position;
//Flag is true si slide
var is_sliding = false;

var obj_groupe_vignettes = false;

// -----------------------------------------------------------------------------------
//  Affiche l'image concern�e en plein �cran
function splash_image(a) {
    //On r�cup�re l'indice
    obj_body = document.getElementsByTagName('body').item(0);
    //Ini la variable current_group le groupe de cette image si celle ci est group�e
    rel_attr = new String(a.getAttribute('rel'));
    val = rel_attr.replace('splash.image|', '');
    splash_id = (a.getAttribute('class')) ? new String(a.getAttribute('class').match(new RegExp(/splash[0-9]+$/))) : '';
    if (val != 'splash.image' && splash_groups[val].length > 0) {
        current_group = val;
        current_position = in_array(splash_groups[val], splash_id);
    }
    else {
        current_group = current_position = '';
    }
    if (!document.getElementById('splash_screen')) {
		
		//On cache le bloc contenant les drapeaux qui ne serait pas masquer à cause de son z-index
		document.getElementById('drapeau').style.display = 'none';
		
        //Cr�ation du fond
        obj_splash_screen = document.createElement('a');
        obj_splash_screen.setAttribute('id', 'splash_screen');
        obj_splash_screen.setAttribute('title', 'Close the splash');
        array_page_size = getPageSize();
        obj_splash_screen.style.width = '100%';
        obj_splash_screen.style.height = array_page_size[1]+'px';
        obj_splash_screen.onclick = function() {  
			splash_bye(); 
			//On réaffiche le bloc contenant les drapeaux
			document.getElementById('drapeau').style.display = 'block';
			return false;
		 }
        obj_body.appendChild(obj_splash_screen);
    
        //Cr�ation du container image et du loading
        obj_content = document.createElement('div');
        obj_content.setAttribute('id', 'image_content');
        obj_content.style.width = '200px';
        obj_content.style.height = '200px';
        obj_content.className = 'ajax-loading';
        obj_body.appendChild(obj_content);
    
        //Positionnement
        array_page_scroll = getPageScroll();
        array_page_size = getPageSize();
        obj_content.style.top = array_page_scroll[1]+margin_top+'px';
        obj_content.style.left = array_page_size[0]/2-(parseInt(obj_content.style.width)/2)+'px';
    }
    else {
        obj_splash_screen = document.getElementById('splash_screen');
        obj_content = document.getElementById('image_content');
        obj_content.removeChild(document.getElementById('splash_img'));
        obj_content.className = 'ajax-loading';
    }

    //Supprime le title_content
    if (document.getElementById('title_content')) {
        obj_title = document.getElementById('title_content');
        //Supprime la navigation si elle existe
        if (document.getElementById('splash_previous')) {
            obj_title.removeChild(document.getElementById('splash_previous'));
            obj_title.removeChild(document.getElementById('splash_next'));
            if (document.getElementById('splash_notification')) { obj_content.removeChild(document.getElementById('splash_notification')); }
            what = (is_sliding) ? 'splash_pause' : 'splash_play';
            obj_title.removeChild(document.getElementById(what));
        }
        obj_body.removeChild(obj_title);
        
    }

    //Charge l'image
    ini_image(a);
}

// -----------------------------------------------------------------------------------
//  Charge l'image
function ini_image(a) {
    //Objet image pour r�cup�rer la taille de l'image
    img = new Image();
    img.src = a.href;

    //Si l'image n'est pas encore charg�e
    if (!img.complete) {
        img.onload = function() {
            image_display(a);
        }
    }
    //Si l'image a d�j� �t� charg�e une fois
    else {
        image_display(a);
    }
}

// -----------------------------------------------------------------------------------
// Affiche l'image
function image_display(a) {
    obj_body = document.getElementsByTagName('body').item(0);
    obj_content = document.getElementById('image_content');
    obj_splash_screen = document.getElementById('splash_screen');
    
    //Cr�ation image
    obj_image = document.createElement('img');
    obj_image.setAttribute('id', 'splash_img');
    obj_image.onclick = function() {  
			splash_bye(); 
			//On réaffiche le bloc contenant les drapeaux
			document.getElementById('drapeau').style.display = 'block';
			return false;
		 }
    obj_content.appendChild(obj_image);

    //Resize du container de l'image
    obj_content.style.width = img.width+'px';
    obj_content.style.height = img.height+'px';

    //Replacement du container de l'image
    array_page_scroll = getPageScroll();
    array_page_size = getPageSize();
    obj_content.style.top = array_page_scroll[1]+margin_top+'px';
    obj_content.style.left = array_page_size[0]/2-(parseInt(img.width)/2)+'px';

    //On affiche l'image
    obj_content = document.getElementById('image_content');
    obj_content.className = '';
    obj_image.setAttribute('src', a.href);
    obj_image.style.display = 'block';
   	
    //Cr�ation container title
    obj_close = document.createElement('span');
    obj_close.setAttribute('id', 'splash_close');
		obj_lien = document.createElement('a');
		obj_close.appendChild(obj_lien);
		obj_lien.setAttribute('href','#');
		obj_lien.setAttribute('id','splash_lien_close');
		obj_lien.innerHTML = "Close";
	obj_close.onclick = function() {  
			splash_bye(); 
			//On réaffiche le bloc contenant les drapeaux
			document.getElementById('drapeau').style.display = 'block';
			return false;
		 }
    obj_content.appendChild(obj_close);
	
	//Cr�ation container title
    /*obj_close = document.createElement('a');
    obj_close.setAttribute('id', 'splash_close');
    obj_text_close = document.createTextNode("Close");
    obj_close.appendChild(obj_text_close);
    obj_close.onclick = function() { splash_bye(); return false; }
    obj_content.appendChild(obj_close);*/

	//Cr�ation container title
    obj_title = document.createElement('div');
    obj_title.setAttribute('id', 'title_content');
    obj_body.appendChild(obj_title);
    obj_title.style.width = (isie()) ? obj_image.offsetWidth+'px' : img.width+'px';
    obj_title.style.top = array_page_scroll[1]+margin_top+(parseInt(obj_content.style.height))+20+'px';
    obj_title.style.left = array_page_size[0]/2-(parseInt(obj_content.style.width)/2)+'px';

    //Libell� position
    str_position = (current_group != '') ? 'Image '+(current_position+1)+' sur '+splash_groups[current_group].length+' :' : '';
    obj_text = document.createTextNode(str_position);
    obj_title.appendChild(obj_text);

    //Description
    obj_description = document.createElement('div');
    obj_description.setAttribute('id', 'splash_description');
    obj_title.appendChild(obj_description);
    splash_id = (a.getAttribute('class')) ? new String(a.getAttribute('class').match(new RegExp(/splash[0-9]+$/))) : '';
    obj_text = document.createTextNode(splash_titles[splash_id]);
    obj_description.appendChild(obj_text);

    //Resize le fond si l'image est trop grande
    array_page_size = getPageSize();
    total_width = margin_left+parseInt(obj_content.style.width)+margin_right;
    if (total_width > array_page_size[0]) { obj_splash_screen.style.width = total_width+'px'; obj_content.style.left = margin_left+'px'; obj_title.style.left = margin_left+'px'; };
    total_height = margin_top+parseInt(obj_content.style.top)+parseInt(obj_image.height)+parseInt(obj_title.offsetHeight)+margin_bottom;
    if (total_height > array_page_size[1]) { obj_splash_screen.style.height = total_height+'px'; };

    //Initialise la navigation si l'image fait partie d'un groupe
    ini_nav(a);
}

// -----------------------------------------------------------------------------------
//  Affiche la navigation si l'image fait partie d'un groupe
function ini_nav(a) {
    clearTimeout(slide_timeout);
    obj_title = document.getElementById('title_content');

    //Check si l'image fait partie d'un groupe
    rel_attr = new String(a.getAttribute('rel'));
    val = rel_attr.replace('splash.image|', '');

    if (splash_groups[val] && document.getElementById('splash_img')) {
        //Cr�ation de l'objet splash_previous
        obj_previous = document.createElement('a');
        obj_previous.setAttribute('id', 'splash_previous');
        obj_previous.setAttribute('title', 'Jump to the previous image');
        obj_previous.onmouseover = function() { obj_previous.className = 'over'; }
        obj_previous.onmouseout = function() { obj_previous.className = ''; }
        obj_previous.onclick = function() { splash_previous(); }
        obj_title.appendChild(obj_previous);

        //Cr�ation de l'objet splash_next
        obj_next = document.createElement('a');
        obj_next.setAttribute('id', 'splash_next');
        obj_next.setAttribute('title', 'Jump to the next image');
        obj_next.onmouseover = function() { obj_next.className = 'over'; }
        obj_next.onmouseout = function() { obj_next.className = ''; }
        obj_next.onclick = function() { splash_next(); }
        obj_title.appendChild(obj_next);
        
        if(!obj_groupe_vignettes)
        {
            //Cr�ation de l'objet groupe_vignettes si il n'a pas d�j� �t� cr��.
            obj_groupe_vignettes = document.createElement('div');
            obj_groupe_vignettes.setAttribute('id', 'splash_groupe_vignettes');
            obj_groupe_vignettes.style.top = array_page_scroll[1]+margin_top+(parseInt(obj_content.style.height))+100+'px';
            obj_groupe_vignettes.style.left = array_page_size[0]/2-((splash_groups[current_group].length*100)/2)+'px';
            obj_vignette = new Array();
            for(cptVignettes=0; cptVignettes<splash_groups[current_group].length; ++cptVignettes)
            {
                obj_vignette[cptVignettes] = document.createElement('a');
                obj_vignette[cptVignettes].setAttribute('id', 'splash_vignette');
                obj_vignette[cptVignettes].className = 'splash_vignette';
                //obj_vignette[cptVignettes].setAttribute('title', 'Jump to the this picture');
                obj_vignette[cptVignettes].onmouseover = new Function('obj_vignette['+cptVignettes+'].setAttribute("id", "splash_vignetteOver")');
                obj_vignette[cptVignettes].onmouseout = new Function('obj_vignette['+cptVignettes+'].setAttribute("id", "splash_vignette")');
                obj_vignette[cptVignettes].onclick = new Function('splash_image(splash_as[splash_groups[current_group]['+cptVignettes+']]);');
                
                obj_imageVignette = document.createElement('img');
                obj_imageVignette.src = splash_as[splash_groups[current_group][cptVignettes]];
                obj_imageVignette.width = 100;
                obj_imageVignette.height = 100;
                obj_vignette[cptVignettes].appendChild(obj_imageVignette);
                obj_groupe_vignettes.appendChild(obj_vignette[cptVignettes]);
            }
            obj_body.appendChild(obj_groupe_vignettes);
        }
        
        //Cr�ation de l'objet slide_play
        var obj_play = document.createElement('a');
        if (!is_sliding) {
            obj_play.setAttribute('id', 'splash_play');
            obj_play.setAttribute('title', 'Start the slide');
        }
        else {
            obj_play.setAttribute('id', 'splash_pause');
            obj_play.setAttribute('title', 'Pause the slide');
        }
        obj_play.onclick = function() { splash_pause(); }
        obj_play.onmouseover = function() { obj_play.className = 'over'; }
        obj_play.onmouseout = function() { obj_play.className = ''; }
        obj_title.appendChild(obj_play);

        //
        if (is_sliding) { slide_timeout = window.setTimeout(splash_next, slide_timeout_value); }
    }
}


// -----------------------------------------------------------------------------------
// To previous image
function splash_previous() {
    current_position = (current_position-1 < 0) ? splash_groups[current_group].length-1 : current_position-1;
    splash_image(splash_as[splash_groups[current_group][current_position]]);
}

// -----------------------------------------------------------------------------------
// To next image
function splash_next() {
    current_position = (current_position+1 == splash_groups[current_group].length) ? 0 : current_position+1;
    splash_image(splash_as[splash_groups[current_group][current_position]]);
}

// -----------------------------------------------------------------------------------
// Pause the slide (ou pas)
function splash_pause() {
    if (!is_sliding) {
        is_sliding = true;
        document.getElementById('splash_play').setAttribute('id', 'splash_pause'); 
        document.getElementById('splash_pause').setAttribute('title', 'Pause the slide');
        current_position = (current_position == splash_groups[current_group].length) ? 0 : current_position;
        slide_timeout = window.setTimeout(splash_next, slide_timeout_value/4);
    }
    else {
        is_sliding = false;
        document.getElementById('splash_pause').setAttribute('id', 'splash_play'); 
        document.getElementById('splash_play').setAttribute('title', 'Start the slide');
        clearTimeout(slide_timeout);
    }
}

// -----------------------------------------------------------------------------------
// Notification d'action
function notification() {
    clearTimeout(slide_timeout_notification);
    obj_content = document.getElementById('image_content');
    if (!document.getElementById('splash_notification')) {
        //Cr�ation du petit icone playing/paused
        obj_slide = document.createElement('a');
        obj_slide.setAttribute('id', 'splash_notification');
        obj_slide.setAttribute('title', 'Sliding (ou pas)');
        obj_content.appendChild(obj_slide);
        obj_slide.style.top = (parseInt(obj_content.style.height)/2)-25+'px'; //25 car largeur de l'image play/pause divis�e par 2
        obj_slide.style.left = (parseInt(obj_content.style.width)/2)-25+'px'; //25 car hauteur de l'image play/pause divis�e par 2
        obj_slide.style.width = '50px'; // 50 largeur de l'image play/pause
        obj_slide.style.height = '50px'; // 50 hauteur de l'image play/pause
    }
    else {
        obj_slide = document.getElementById('splash_notification');
    }
    if (is_sliding) {
        obj_slide.className = 'playing';
    }
    else {
        obj_slide.className = 'paused';
        slide_timeout_notification = setTimeout(splash_notification_bye, 2000);
    }
}

// -----------------------------------------------------------------------------------
// Slide notification
function splash_notification_bye() {
    if (document.getElementById('image_content')) {
        obj_content = document.getElementById('image_content');
        obj_content.removeChild(document.getElementById('splash_notification'));
    }
    clearTimeout(slide_timeout_notification);
}

// -----------------------------------------------------------------------------------
// Au revoir Splash
function splash_bye() {
    clearTimeout(slide_timeout);
    clearTimeout(slide_timeout_notification);
    is_sliding = false;
    obj_body = document.getElementsByTagName('body').item(0);
    obj_body.removeChild(document.getElementById('splash_screen'));
    obj_body.removeChild(document.getElementById('image_content'));
    if (document.getElementById('title_content')) { obj_body.removeChild(document.getElementById('title_content')); }
    if(obj_groupe_vignettes) { 
        obj_body.removeChild(obj_groupe_vignettes);
        obj_groupe_vignettes = false;
    }
}

// -----------------------------------------------------------------------------------
// Check la touche clavier enfonc�

//function key_check(e) {
//    if (document.getElementById('splash_img')) {
//        clearTimeout(slide_timeout);
//        what = (e == null) ? event.keyCode : e.which;
//        if (in_array(new Array(27, 38, 46, 88), what) >= 0) { //Esc, Suppr, fl�che haut, x
//            splash_bye();
//            return false;
//        }
//        if (splash_groups[current_group]) {
//            if (in_array(new Array(13, 32, 40), what) >= 0) { //Entr�e, espace, fl�che bas
//                splash_pause();
//                notification();
//                return false;
//            }
//            if (in_array(new Array(33, 37, 109), what) >= 0) { // Page Up , fl�che gauche, -
 //               splash_previous();
 //               return false;
 ////           }
 //           if (in_array(new Array(34, 39, 107), what) >= 0) { // Page Down, fl�che droite, +
 //               splash_next();
 //               return false;
 //           }
//       }
//    }
//}

    
// -----------------------------------------------------------------------------------
// Initialise les liens concern�s
function ini_splash_images() {
    splash_groups = new Array();
    splash_as = new Array();
    splash_titles = new Array();
    as = document.getElementsByTagName('a');
    for (i=0; i<as.length; i++) {
        a = as[i];
        rel_attr = new String(a.getAttribute('rel'));
        if (rel_attr.match('splash.image')) {
            splash_id = 'splash'+i;
            klass = (a.getAttribute('class')) ? a.getAttribute('class')+' '+splash_id : splash_id;
            a.setAttribute('class', klass);
            a.onclick = function () { splash_image(this); return false; }
            val = rel_attr.replace('splash.image|', '');
            if (val != 'splash.image') {
                array = (!splash_groups[val] || typeof splash_groups[val] != 'object') ? new Array() : splash_groups[val];
                array[array.length] = splash_id;
                splash_groups[val] = array;
                splash_as[splash_id] = a;
            }
            splash_titles[splash_id] = (a.getAttribute('title')) ? a.getAttribute('title') : 'Image '+i;
            
        }
        
    }
    // -----------------------------------------------------------------------------------
    // On lance le check de la touche clavier enfonc�e
   // document.onkeydown = key_check;
}

// -----------------------------------------------------------------------------------
//  
// Fonctions annexes
//
// -----------------------------------------------------------------------------------

// -----------------------------------------------------------------------------------
// getPageScroll()
// Returns array with x,y page scroll values.
// Core code from - quirksmode.org
// Code by Lokesh Dhakar
function getPageScroll(){
    var yScroll;
    if (self.pageYOffset) {
        yScroll = self.pageYOffset;
    } else if (document.documentElement && document.documentElement.scrollTop){     // Explorer 6 Strict
        yScroll = document.documentElement.scrollTop;
    } else if (document.body) {// all other Explorers
        yScroll = document.body.scrollTop;
    }
    arrayPageScroll = new Array('',yScroll) 
    return arrayPageScroll;
}

// -----------------------------------------------------------------------------------
// getPageSize()
// Returns array with page width, height and window width, height
// Core code from - quirksmode.org
// Code by Lokesh Dhakar
// Edit for Firefox by pHaez
//
function getPageSize(){
    var xScroll, yScroll;
    if (window.innerHeight && window.scrollMaxY) {    
        xScroll = document.body.scrollWidth;
        yScroll = window.innerHeight + window.scrollMaxY;
    } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
        xScroll = document.body.scrollWidth;
        yScroll = document.body.scrollHeight;
    } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
        xScroll = document.body.offsetWidth;
        yScroll = document.body.offsetHeight;
    }
    var windowWidth, windowHeight;
    if (self.innerHeight) {    // all except Explorer
        windowWidth = self.innerWidth;
        windowHeight = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
        windowWidth = document.documentElement.clientWidth;
        windowHeight = document.documentElement.clientHeight;
    } else if (document.body) { // other Explorers
        windowWidth = document.body.clientWidth;
        windowHeight = document.body.clientHeight;
    }    
    // for small pages with total height less then height of the viewport
    if(yScroll < windowHeight){
        pageHeight = windowHeight;
    } else { 
        pageHeight = yScroll;
    }
    // for small pages with total width less then width of the viewport
    if(xScroll < windowWidth){    
        pageWidth = windowWidth;
    } else {
        pageWidth = xScroll;
    }
    arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) 
    return arrayPageSize;
}

// -----------------------------------------------------------------------------------
// Core code from - quirksmode.org
function addEvent(obj, evType, fn, useCapture){
    if (obj.addEventListener) {
        obj.addEventListener(evType, fn, useCapture);
        return true;
    }
    else if (obj.attachEvent){
        var r = obj.attachEvent("on"+evType, fn);
        return r;
    }
    else {
        alert("Handler could not be attached");
    }
}

// -----------------------------------------------------------------------------------
//  Check si val est pr�sent dans le tableau ar
// Last update 2007-04-03
// Code by Xuan NGUYEN
function in_array (ar, val) {
    if (ar.length == 0) { return -1; }
    for (i=0; i<ar.length; i++) {
        if (ar[i] == val) { return i; }
    }
    return -1;
}

// +------------------------------------------------------------------------+
// + isie()
// +------------------------------------------------------------------------+
function isie() {
    if (navigator.appName == 'Microsoft Internet Explorer') {
        var reg_exp = new RegExp('MSIE [0-9]*.[0-9]*', 'gi');
        var str = new String(navigator.appVersion);
        var result = new String(str.match(reg_exp));
        var array_version = result.split(' ');
        var version = array_version[1];
        return version;
    }
    else {
        return false;
    }
}

//Lance l'ini au chargement de la page
addEvent(window, 'load', ini_splash_images);