// Variables générales de configuration (s'appliquent à toutes les périodes)
var hauteur= 100;				// Hauteur de l'illustration
var zH= 15;						// hauteur d'une zone
var inter= 5;					// interligne entre zones
var bgcolor='#fcfddf';			// couleur de fond du menu

var btn_left= 300;				// Position des boutons par rapport au bord droit
var btn_top= 245;				// Position des boutons par rapport au bas de l'écran

// Initialisation des éléments
var basepers= new Array();
var basilus= new Array();
var img_illus= "";
var texte_legende= "";
var scrolltimer= "";
var pas_scroll= 1;
var timer_on= 1;

var N = (document.getElementById) ? 0 : 1;

if (N) {
    document.write('<layer id= "logo" left= '+((screen.width/2)-300)+' top= 33 width= 700><img src="Images/'+titre+'" width="700" height="40"></layer>');
} else {

    document.write('<img src="/Images/fondtitre.gif" id="titre" style="position: absolute; left: '+((screen.width/2)-345)+'; top: 15;" />');

    // Boutons enfoncés
    document.write('<div id="btn_on" style="position: absolute; left: '+(screen.width-btn_left)+'px; top: '+(screen.height-btn_top)+'px; width: 130px; height: 40px; white-space: nowrap;">');
    document.write('<img id="btn1" src="Images/btn1_chrono.gif" style= "position: relative; top: 0; visibility: hidden;">');
    document.write('<img id="btn2" src="Images/btn2_chrono.gif" style= "position: relative; top: 0; visibility: hidden;">');
    document.write('<img id="btn3" src="Images/btn3_chrono.gif" style= "position: relative; top: 0; visibility: hidden;">');
    document.write('<img id="btn4" src="Images/btn4_chrono.gif" style= "position: relative; left: -24px; top: 0; visibility: hidden;">');
    document.write('<img id="btn5" src="Images/btn5_chrono.gif" style= "position: relative; left: -24px; top: 0; visibility: hidden;">');
    document.write('<img id="btn6" src="Images/btn3_chrono.gif" style= "position: relative; left: -91px; top: 0; visibility: hidden;">');
    document.write('<img id="btn_hp2" src="Images/btn_hp2.gif" alt="Son" style= "position: relative; left: -47px; top: 20px; visibility: hidden;">');
    document.write('<img id="btn_p2" src="/Images/btn_nobtn.gif" alt="Période précédente" style= "position: relative; left: -164px; top: 20px; visibility: hidden;">');
    document.write('<img id="btn_s2" src="/Images/btn_nobtn.gif" alt="Période suivante" style= "position: relative; left: -164px; top: 20px; visibility: hidden;">');
    document.write('</div>');

    // Boutons relevés
	document.write('<div id="btn_off" style="position: absolute; left: '+(screen.width-btn_left)+'px; top: '+(screen.height-btn_top)+'px; width: 130px; height: 40px; white-space: nowrap;">');
    document.write('<img id="btn11" src="Images/btn11_chrono.gif" alt="Début de la période" style= "" onmousedown="btn_down(btn1);" onmouseup="btn_up(btn1);">');
    document.write('<img id="btn12" src="Images/btn12_chrono.gif" alt="Reculer" style= "" onmousedown="btn_down(btn2);" onmouseup="btn_up(btn2);">');
    document.write('<img id="btn13" src="Images/btn13_chrono.gif" alt="Arrêter" style= "visibility: visible;" onmousedown="btn_down(btn3);" onmouseup="btn_up(btn3);">');
    document.write('<img id="btn14" src="Images/btn14_chrono.gif" alt="Avancer" style= "position: relative; left: -24px; visibility: hidden;" onmousedown="btn_down(btn4);" onmouseup="btn_up(btn4);">');
    document.write('<img id="btn15" src="Images/btn15_chrono.gif" alt="Fin de la période" style= "position: relative; left: -24px;" onmousedown="btn_down(btn5);" onmouseup="btn_up(btn5);">');
    document.write('<img id="btn16" src="Images/btn13_chrono.gif" alt="Arrêter" style= "position: relative; left: -91px; visibility: hidden;" onmousedown="btn_down(btn6);" onmouseup="btn_up(btn6);">');
    document.write('<img id="btn_hp" src="Images/btn_hp.gif" alt="Couper le son" style= "position: relative; left: -47px; top: 20px;" onmousedown="btn_down(btn_hp2);" onmouseup="btn_up(btn_hp2);">');
    document.write('<br><img id="btn_p" src="/Images/btn_nobtn.gif" alt="Période précédente" style= "" onmousedown="btn_down(btn_p2);" onmouseup="btn_up(btn_p2);">');
    document.write('<img id="btn_s" src="/Images/btn_nobtn.gif" alt="Période suivante" style= "" onmousedown="btn_down(btn_s2);" onmouseup="btn_up(btn_s2);">');
	document.write('</div>');


   	// Préchargement des illustrations
    document.write('<div style="visibility: hidden">');
    for (x=1; x<baseillus.length; x++) {
        document.write('<img src="/' + baseillus[x][1] + '" style="position: absolute; top: 0; left: 0;">');
    }
    document.write('</div>');

    // Positionnement des illustrations
	if (document.all) {
    	document.write('<div id="illustration" style="position: absolute; left: 20px; top: ' + hauteur + 'px; z-index: 1; filter: progid:DXImageTransform.Microsoft.Fade(Overlap=1.00);">');
//        document.write('<div id="legende" style="width: 100%; text-align: center; font-size: 14px; white-space: nowrap;"></div><br>');
        document.write('<img id="URL_image" src=""></div>');
	} else {
    	document.write('<div id="illustration" style="position: absolute; left: 20px; top: ' + hauteur + 'px; z-index: 1;">');
//        document.write('<div id="legende" style="width: 100%; text-align: center; font-size: 14px; white-space: nowrap;"></div><br>');
        document.write('<img id="URL_image" src=""></div>');
    }
}

perso("france", 340);
perso("proche", 240);
perso("lointain", 450);
echelle();
triillus();
defile();

// Gestion du défilement
function btn_down(obj) {
	obj.style.visibility="visible";
}

function btn_up(obj) {
	obj.style.visibility="hidden";
    if (obj.id=="btn1") {
        window.scrollBy(-document.body.scrollLeft,0);
    }
    if (obj.id=="btn2") {
        timer_on= 1;
        pas_scroll= -1;
        document.getElementById("btn14").style.visibility="visible";
    	document.getElementById("btn16").style.visibility="visible";
    }
	if (obj.id=="btn3") {
        timer_on= 0;
    	document.getElementById("btn14").style.visibility="visible";
    }
	if (obj.id=="btn4") {
        timer_on= 1;
        pas_scroll= 1;
        document.getElementById("btn12").style.visibility="visible";
		document.getElementById("btn13").style.visibility="visible";
        document.getElementById("btn14").style.visibility="hidden";
		document.getElementById("btn16").style.visibility="hidden";
	}
    if (obj.id=="btn5") {
        window.scrollBy(ppY*dEch*nEch,0);
    }
	if (obj.id=="btn6") {
        timer_on= 0;
		document.getElementById("btn12").style.visibility="visible";
		document.getElementById("btn16").style.visibility="hidden";
	}
	if (obj.id=="btn_p2") {
		document.location= avant;
	}
	if (obj.id=="btn_s2") {
		document.location= apres;
	}
	if (obj.id=="btn_hp2") {
    	if (document.getElementById("Player").settings.mute) {document.getElementById("Player").settings.mute= false;} else {document.getElementById("Player").settings.mute= true;}
	}
}

function freeze() {
	timer_on= 0;
	if (btn13.style.visibility="visible") {
    	btn13.style.visibility="hidden";
    	btn14.style.visibility="visible";
	}
	if (btn16.style.visibility="visible") {
    	btn16.style.visibility="hidden";
    	btn12.style.visibility="visible";
	}
}

function defile() {
	if (timer_on==1) window.scrollBy(pas_scroll,0);
    document.getElementById("illustration").style.left= document.body.scrollLeft + 20;
    document.getElementById("titre").style.left= document.body.scrollLeft + (screen.width/2) - 345;
    document.getElementById("btn_on").style.left= document.body.scrollLeft + screen.width - btn_left;
    document.getElementById("btn_off").style.left= document.body.scrollLeft + screen.width - btn_left;
     illustre();
}

// Création de l'échelle
function echelle() {
    for (x=0; x<nEch; x++) {
         if (N) {
             document.write("<LAYER CLASS='evenperso' top= 320 left="+ ((x*ppY*dEch)-(dEch/2)) +">"+ ((x*dEch)+debut) +"</LAYER>");
             document.write("<LAYER CLASS='evenperso' top= 320 left="+ (x*ppY*dEch) +">|</LAYER>");
             } else {
             if ((x*dEch)+debut>-850) {
	             document.write('<div style="left:'+ ((x*ppY*dEch)-(dEch/2)) +'px; width: 30px; top: 305px; white-space: nowrap; z-index: 3;">'+ ((x*dEch)+debut) +'</div>');
	             document.write('<div style="top: 320px; left:'+ (x*ppY*dEch) +'px; z-index: 3;">|</div>');
             }
         }
    }
}

function tribase(nombase, critere) {
    if (nombase=="france") basepers= basefr;
    if (nombase=="proche") basepers= basepro;
    if (nombase=="lointain") basepers= baseloin;
    var encore= true;
    while (encore) {
        encore= false;
        tempo= "";
        for (var x= 1; x < (basepers.length-1); x ++) {
            if (basepers[x][critere] > basepers[x+1][critere]) {
                tempo= basepers[x];
                basepers[x]= basepers[x+1];
                basepers[x+1]= tempo;
                encore= true;
            }
        }
    }
}

// Création des évènements
function perso(nombase, hauteur) {
    tribase(nombase,1);
    var zTop= hauteur;
    for (x=1; x<basepers.length; x++) {
    	mois= 0;
        if (basepers[x][5]==1) zTop= hauteur;
        if (basepers[x][2]!=0) mois= basepers[x][2]/12;
	    if (N) {
	        document.write('<layer class="perso" height='+ zH +' top='+ zTop +' left='+ ((basepers[x][1]-debut+mois)*ppY) +' width='+ ((basepers[x][2]-basepers[x][1])*ppY) +' bgcolor='+ basepers[x][3] +'>');
	        document.write('<a href="'+ basepers[x][4] +'">| '+ basepers[x][1] +' : '+ basepers[x][0] +'</A></layer>');
        } else {
	        document.write('<div style="height:'+ zH +'px; top:'+ zTop +'px; left:'+ ((basepers[x][1]-debut+mois)*ppY) +'px; white-space: nowrap; z-index: 3;">');
	        document.write('<a href="'+ basepers[x][4] +'" onclick="freeze();" style="background-color: '+ basepers[x][3] +';">');
	        if (basepers[x][1]>+2400) {
            	document.write('<b> ' + basepers[x][1] + ' </b>: ');
            } else {
	        	document.write('<b> </b>');
            }
            document.write(basepers[x][0] +'</a>&nbsp;</div>');
	    }
	    zTop+= zH + inter;
    }
}

// Gestion des images
function triillus(critere) {
	basilus= baseillus;
    var encore= true;
    while (encore) {
        encore= false;
        tempo= "";
        for (var x= 1; x < (basilus.length-1); x ++) {
            if (basilus[x][critere] > basilus[x+1][critere]) {
                tempo= basilus[x];
                basilus[x]= basilus[x+1];
                basilus[x+1]= tempo;
                encore= true;
            }
        }
    }
}

function illustre() {
	annee= Math.floor((document.body.scrollLeft+(screen.width/2))/ppY) + debut;
	for (x=1; x<baseillus.length; x++) {
		if (annee>basilus[x][0]) {
        	img_illus= basilus[x][1];
            texte_legende= basilus[x][2];
        }
	}
    if (document.getElementById("URL_image").src.indexOf(img_illus)==-1) {
    	if (document.all) document.getElementById("illustration").filters[0].apply();
		document.getElementById("URL_image").src= "/"+img_illus;
//        document.getElementById("legende").innerHTML= texte_legende;
		if (document.all) document.getElementById("illustration").filters[0].play();
    }
    setTimeout("defile()",8);
}