// ****************************************
// ***        global variable          ****
// ****************************************
var hauteur;
var largeur;

//enter
var ow_enter;
var oh_enter;
var ox_enter;
var oy_enter;

// *************************************************
// ****       generic functions that enable     ****
// ****          elements configuration         ****
// *************************************************

//basic elements
function elem_config(id_str,id_margin,id_padding,id_position,id_top,
id_left,id_width,id_height,id_backgroundColor,id_color,id_scroll){

if(id_margin          != "ignore") document.getElementById(id_str).style.margin          = id_margin         ;
if(id_padding         != "ignore") document.getElementById(id_str).style.padding         = id_padding        ;
if(id_position        != "ignore") document.getElementById(id_str).style.position        = id_position       ; 
if(id_top             != "ignore") document.getElementById(id_str).style.top             = id_top            ;
if(id_left            != "ignore") document.getElementById(id_str).style.left            = id_left           ;
if(id_width           != "ignore") document.getElementById(id_str).style.width           = id_width          ;
if(id_height          != "ignore") document.getElementById(id_str).style.height          = id_height         ;
if(id_backgroundColor != "ignore") document.getElementById(id_str).style.backgroundColor = id_backgroundColor;
if(id_color           != "ignore") document.getElementById(id_str).style.color           = id_color          ;
if(id_scroll          != "ignore") document.getElementById(id_str).style.overflow        = id_scroll         ;

}

//buttons elements
function button_config(id_str,content_str,id_borderStyle,id_cursor,id_fontWeight,id_textAlign,id_fontSize){

document.getElementById(id_str).style.borderStyle       = id_borderStyle    ;
document.getElementById(id_str).style.cursor            = id_cursor         ;
document.getElementById(id_str).style.textAlign         = id_textAlign      ;

document.getElementById(content_str).style.fontWeight   = id_fontWeight     ;
document.getElementById(content_str).style.textAlign    = id_textAlign      ;
document.getElementById(content_str).style.fontSize     = id_fontSize       ;
document.getElementById(content_str).style.cursor       = id_cursor         ;

}



// ****************************************
// *** the start function is called at ****
// *** page load. Initialize all       ****
// ****************************************
function start(){

document.getElementById("container").style.width     = '100%'    ;
document.getElementById("container").style.height    = '100%'    ;
document.getElementById('enter_content').style.textDecoration = 'none';
document.getElementById('enter_content').onfocus=function(){this.blur()}

// ---------------------------------------
// ----------- size detection ------------
// ---------------------------------------

if(window.innerWidth){ // FireFox
     
      largeur  = 0.99*screen.width - 0*((1024-screen.width)/screen.width) ;
      hauteur  = 0.78*screen.height - 133*((768-screen.height)/screen.height);
}
else if(document.body){//internet explorer
        
      largeur  = 0.977*screen.width-30*((1024-screen.width)/screen.width) ;
      hauteur  = 0.775*screen.height-133*((768-screen.height)/screen.height);
}



// ------------------------------------------------------
// ---------initialize elements properties --------------
// ------------------------------------------------------ 


//container (body)
elem_config("container","0px","0px","absolute","0px","0px",largeur + "px",hauteur + "px","white","ignore","ignore");


//top
elem_config("top","0px","0px","absolute","0px","0px",largeur + "px",0.03*hauteur + "px","#2f70b7","#2f70b7","hidden");


//frame
elem_config("middle","0px","0px","absolute",0.03*hauteur + "px","0px",largeur + "px",0.94*hauteur + "px","ignore","ignore","hidden");
document.getElementById("middle").style.backgroundImage    = 'url("background5.jpg")';
document.getElementById("middle").style.backgroundPosition = 'center';
document.getElementById("middle").style.backgroundRepeat   = 'no-repeat';
//document.getElementById("middle").style.overflow           = 'auto';


//bottom
elem_config("bottom","0px","0px","absolute",0.97*hauteur + "px","0px",largeur + "px",0.03*hauteur + "px","#2f70b7","#fff","hidden");
document.getElementById("bottom").style.fontSize           = '12px';
document.getElementById("bottom").style.textAlign          = 'center';
document.getElementById("bottom").style.visibility	   = 'hidden';


//CIFCEA
elem_config("CIFCEA","0px","0px","absolute",0.02*hauteur + "px", "0px",0.9*largeur + "px",0.1*hauteur + "px","transparent","#e35508","ignore");
document.getElementById("CIFCEA").style.textAlign   = 'center';
document.getElementById("CIFCEA").style.marginRight = 0.05*largeur + 'px';
document.getElementById("CIFCEA").style.marginLeft  = 0.05*largeur + 'px';


//flash0
elem_config("flash0","0px","0px","absolute",0.15*hauteur + "px","0px",largeur + "px",0.08*hauteur + "px","ignore","#e35508","hidden");
document.getElementById("flash0").style.fontWeight    = 'bold';
document.getElementById("flash0").style.textAlign     = 'center';
document.getElementById("flash0").style.fontSize      = '1.5em';

//flash1->ex flash 3
//elem_config("bottom1_show","0px","0px","absolute",0.8*hauteur + "px","0px",largeur + "px",0.1*hauteur + "px","ignore","#e35508","hidden");
//document.getElementById("bottom1_show").style.fontWeight    = 'bold';
//document.getElementById("bottom1_show").style.textAlign     = 'center';
//document.getElementById("bottom1_show").style.fontSize      = '1.2em';

//flash2
elem_config("right_show","0px","0px","absolute",0.8*hauteur + "px","0px",largeur + "px",0.1*hauteur + "px","ignore","#e35508","hidden");
document.getElementById("right_show").style.fontWeight    = 'bold';
document.getElementById("right_show").style.textAlign     = 'center';
document.getElementById("right_show").style.fontSize      = '1.2em';
document.getElementById("right_show").style.visibility    = 'hidden';

//flash1 (was flash 3 config)
elem_config("bottom1_show","0px","0px","absolute",0.8*hauteur + "px","0px",largeur + "px",0.1*hauteur + "px","ignore","#e35508","hidden");
document.getElementById("bottom1_show").style.fontWeight    = 'bold';
document.getElementById("bottom1_show").style.textAlign     = 'center';
document.getElementById("bottom1_show").style.fontSize      = '1.2em';
document.getElementById("bottom1_show").style.visibility    = 'hidden';

//flash4
elem_config("bottom2_show","0px","0px","absolute",0.8*hauteur + "px","0px",largeur + "px",0.1*hauteur + "px","ignore","#e35508","hidden");
document.getElementById("bottom2_show").style.fontWeight    = 'bold';
document.getElementById("bottom2_show").style.textAlign     = 'center';
document.getElementById("bottom2_show").style.fontSize      = '1.2em';
document.getElementById("bottom2_show").style.visibility    = 'hidden';

//flash5
elem_config("enter_show","0px","0px","absolute",0.8*hauteur + "px","0px",largeur + "px",0.1*hauteur + "px","ignore","#e35508","hidden");
document.getElementById("enter_show").style.fontWeight    = 'bold';
document.getElementById("enter_show").style.textAlign     = 'center';
document.getElementById("enter_show").style.fontSize      = '1.2em';
document.getElementById("enter_show").style.visibility    = 'hidden';


//message1
elem_config("enter_flash","0px","0px","absolute",0.3*hauteur + "px",0.42*largeur + "px",0.15*largeur + "px",0.1*hauteur + "px","ignore","#1600a4","hidden");
elem_config("enter_content","0px","0px","absolute",0.33*hauteur + "px",0.42*largeur + "px",0.15*largeur + "px",0.08*hauteur + "px","ignore","#1600a4","hidden");
button_config("enter_flash","enter_content","outset","pointer","bold","center","1.2em");
//enter
ow_enter = 0.15*largeur;
oh_enter = 0.1*hauteur;
oy_enter = 0.3*hauteur;
ox_enter = 0.42*largeur;


//message2 (ex message 3  config)
elem_config("bottom1_flash","0px","0px","absolute",0.3*hauteur + "px",0.05*largeur + "px",0.16*largeur + "px",0.16*hauteur + "px","ignore","#1600a4","hidden");
elem_config("bottom1_content","0px","7px","absolute",0.35*hauteur + "px",0.05*largeur + "px",0.15*largeur + "px",0.09*hauteur + "px","ignore","#1600a4","hidden");
button_config("bottom1_flash","bottom1_content","outset","crosshair","bold","center","1.08em");

//message3
//elem_config("bottom1_flash","0px","0px","absolute",0.5*hauteur + "px",0.275*largeur + "px",0.16*largeur + "px",0.16*hauteur + "px","ignore","#1600a4","hidden");
//elem_config("bottom1_content","0px","7px","absolute",0.537*hauteur + "px",0.275*largeur + "px",0.15*largeur + "px",0.1*hauteur + "px","ignore","#1600a4","hidden");
//button_config("bottom1_flash","bottom1_content","outset","crosshair","bold","center","1.08em");

//message4
elem_config("bottom2_flash","0px","0px","absolute",0.55*hauteur + "px",0.41*largeur + "px",0.17*largeur + "px",0.16*hauteur + "px","ignore","#1600a4","hidden");
elem_config("bottom2_content","0px","7px","absolute",0.575*hauteur + "px",0.41*largeur + "px",0.16*largeur + "px",0.12*hauteur + "px","ignore","#1600a4","hidden");
button_config("bottom2_flash","bottom2_content","outset","crosshair","bold","center","1.08em");

//message 5
elem_config("right_flash","0px","0px","absolute",0.3*hauteur + "px",0.79*largeur + "px",0.16*largeur + "px",0.16*hauteur + "px","ignore","#1600a4","hidden");
elem_config("right_content","0px","7px","absolute",0.345*hauteur + "px",0.79*largeur + "px",0.15*largeur + "px",0.1*hauteur + "px","ignore","#1600a4","hidden");
button_config("right_flash","right_content","outset","crosshair","bold","center","1.08em");


}

// ****************************************************
// *****     animations for buttons               *****
// ****************************************************




function show(button){


//global variable
var old_width;
var old_height;
var old_x;
var old_y;
var tmp_str;
var new_width;
var new_height;
var new_x;
var new_y;
var factor;

factor = 1.1;

//couleur du text
document.getElementById(button + "_content").style.color    = '#e35508';

//affichage des shows
//document.getElementById("left_show").style.visibility      = 'hidden';
document.getElementById("right_show").style.visibility     = 'hidden';
document.getElementById("bottom1_show").style.visibility   = 'hidden';
document.getElementById("bottom2_show").style.visibility   = 'hidden';
document.getElementById("enter_show").style.visibility     = 'hidden';

document.getElementById(button + "_show").style.visibility   = 'visible';
document.getElementById(button + "_flash").style.color       = '#e35508';


// augmentation de la taille des cadres

if(button=="enter"){

old_width  = ow_enter;
old_height = oh_enter;
old_x      = ox_enter;
old_y      = oy_enter;


new_width  = factor*old_width;
new_height = factor*old_height;

new_x =  (old_x + (1-factor)*(old_width)*0.5) ;
new_y =  (old_y + (1-factor)*(old_height)*0.5);

ow_enter = new_width;
oh_enter = new_height;
ox_enter = new_x;
oy_enter = new_y;

document.getElementById(button + "_flash").style.width  = new_width  + "px";
document.getElementById(button + "_flash").style.height = new_height + "px";
document.getElementById(button + "_flash").style.top    = new_y      + "px";
document.getElementById(button + "_flash").style.left   = new_x      + "px";

}




}

function unshow(button){


//global variable
var old_width;
var old_height;
var old_x;
var old_y;
var tmp_str;
var new_width;
var new_height;
var new_x;
var new_y;
var factor;

factor = 1/1.1;

document.getElementById(button + "_content").style.color    = '#1600a4';
document.getElementById(button + "_flash").style.color = '#1600a4';

// augmentation de la taille des cadres


if(button=="enter"){

old_width  = ow_enter;
old_height = oh_enter;
old_x      = ox_enter;
old_y      = oy_enter;


new_width  = factor*old_width;
new_height = factor*old_height;

new_x =  (old_x + (1-factor)*(old_width)*0.5) ;
new_y =  (old_y + (1-factor)*(old_height)*0.5);

ow_enter = new_width;
oh_enter = new_height;
ox_enter = new_x;
oy_enter = new_y;


document.getElementById(button + "_flash").style.width  = new_width + "px";
document.getElementById(button + "_flash").style.height = new_height + "px";
document.getElementById(button + "_flash").style.top    = new_y + "px";
document.getElementById(button + "_flash").style.left   = new_x + "px";

}

}