/**
 * OPACITY FADING
 */
var fadingTime = 1000;

function opacity(id, opacStart, opacEnd, millisec){
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;
    
    //determine the direction for the blending, if start and end are the same nothing happens
    if (opacStart > opacEnd) {
        for (i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')", (timer * speed));
            timer++;
        }
    }
    else 
        if (opacStart < opacEnd) {
            for (i = opacStart; i <= opacEnd; i++) {
                setTimeout("changeOpac(" + i + ",'" + id + "')", (timer * speed));
                timer++;
            }
        }
}

//change the opacity for different browsers
function changeOpac(opacity, id){

    var object;
    
    if (document.getElementById) { // this is the way the standards work
        object = document.getElementById(id).style;
    }
    else 
        if (document.all) { // this is the way old msie versions work
            object = document.all[id].style;
        }
        else 
            if (document.layers) { // this is the way nn4 works
                object = document.layers[id].style;
            }
    
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
}

function shiftOpacity(id, millisec){
    //if an element is invisible, make it visible, else make it visible
    if (document.getElementById(id).style.opacity == 0) {
        opacity(id, 0, 100, millisec);
    }
    else {
        opacity(id, 100, 0, millisec);
    }
}

function blendimage(divid, imageid, imagefile, millisec){
    var speed = Math.round(millisec / 100);
    var timer = 0;
    
    //set the current image as background
    document.getElementById(divid).style.backgroundImage = "url(" + document.getElementById(imageid).src + ")";
    
    //make image transparent
    changeOpac(0, imageid);
    
    //make new image
    document.getElementById(imageid).src = imagefile;
    
    //fade in image
    for (i = 0; i <= 100; i++) {
        setTimeout("changeOpac(" + i + ",'" + imageid + "')", (timer * speed));
        timer++;
    }
}

function currentOpac(id, opacEnd, millisec){
    //standard opacity is 100
    var currentOpac = 100;
    
    //if the element has an opacity set, get it
    if (document.getElementById(id).style.opacity < 100) {
        currentOpac = document.getElementById(id).style.opacity * 100;
    }
    
    //call for the function that changes the opacity
    opacity(id, currentOpac, opacEnd, millisec)
}

/**
 * OPACITY FADING - END
 */
/**
 * FUNCTIONS DEFINITIONS
 */
/**
 * making the div elements invisible
 */
function setGlobalOpacity(percentage){
    changeOpac(percentage, 'myphotos_fr');
    changeOpac(percentage, 'myvideos_fr');
    changeOpac(percentage, 'me_fr');
    changeOpac(percentage, 'mycontact_fr');
    changeOpac(percentage, 'menu_fr');
    changeOpac(percentage, 'footer_fr');
    changeOpac(percentage, 'myphotos_eng');
    changeOpac(percentage, 'myvideos_eng');
    changeOpac(percentage, 'me_eng');
    changeOpac(percentage, 'mycontact_eng');
    changeOpac(percentage, 'menu_eng');
    changeOpac(percentage, 'footer_eng');
    changeOpac(percentage, 'myphotos_es');
    changeOpac(percentage, 'myvideos_es');
    changeOpac(percentage, 'me_es');
    changeOpac(percentage, 'mycontact_es');
    changeOpac(percentage, 'menu_es');
    changeOpac(percentage, 'footer_es');
    changeOpac(percentage, 'myphotos_de');
    changeOpac(percentage, 'myvideos_de');
    changeOpac(percentage, 'me_de');
    changeOpac(percentage, 'mycontact_de');
    changeOpac(percentage, 'menu_de');
    changeOpac(percentage, 'footer_de');
}

/**
 * making the div elements invisible
 */
function globalToggle(){
    toggleLayer('myphotos_fr');
    toggleLayer('myvideos_fr');
    toggleLayer('me_fr');
    toggleLayer('mycontact_fr');
    toggleLayer('menu_fr');
    toggleLayer('footer_fr');
    toggleLayer('myphotos_eng');
    toggleLayer('myvideos_eng');
    toggleLayer('me_eng');
    toggleLayer('mycontact_eng');
    toggleLayer('menu_eng');
    toggleLayer('footer_eng');
    toggleLayer('myphotos_es');
    toggleLayer('myvideos_es');
    toggleLayer('me_es');
    toggleLayer('mycontact_es');
    toggleLayer('menu_es');
    toggleLayer('footer_es');
    toggleLayer('myphotos_de');
    toggleLayer('myvideos_de');
    toggleLayer('me_de');
    toggleLayer('mycontact_de');
    toggleLayer('menu_de');
    toggleLayer('footer_de');
}

/**
 * Switching language without changing page
 * @param {lcode} language code
 */
function switchLanguage(lcode){
    toggleLayer('menu_' + languagecode);
    toggleLayer('menu_' + lcode);
    toggleLayer('footer_' + languagecode);
    toggleLayer('footer_' + lcode);
    languagecode = lcode;
	
	if (elementOn){
		elementName = document.getElementById(elementOn).id.split('_');
		toggleLayer(elementOn);
		toggleLayer(elementName[0]+"_"+lcode);
		elementOn = elementName[0]+"_"+lcode;
	}
}

/**
 *
 * @param {Object} lcode
 */
function setUpLanguage(){
    if (languagecode) {
        toggleLayer('footer_' + languagecode);
        toggleLayer('menu_' + languagecode);
    }
    else {
        toggleLayer('footer_fr');
        toggleLayer('menu_fr');
		languagecode = "fr";
    }
}

/**
 * Make an element visible - fade
 * @param {Object} id
 */
function switchElementOn(id){
    if (elementOn) {
        if (elementOn == id) {
            switchElementOff(id);
            elementOn = null;
            return;
        }
        else {
            switchElementOff(elementOn);
        }
    }
    changeOpac(0, id);
    toggleLayer(id);
    opacity(id, 0, 100, fadingTime);
    elementOn = id;
}

/**
 *
 * @param {Object} id
 */
function switchElementOff(id){
    opacity(id, 100, 0, fadingTime);
    setTimeout("toggleLayer('" + id + "')", fadingTime);
}

/**
 * Make an element visible - no fade
 * @param {Object} whichLayer
 */
function toggleLayer(whichLayer){

    var elem, vis;
    if (document.getElementById) { // this is the way the standards work
        elem = document.getElementById(whichLayer);
    }
    else 
        if (document.all) { // this is the way old msie versions work
            elem = document.all[whichLayer];
        }
        else 
            if (document.layers) { // this is the way nn4 works
                elem = document.layers[whichLayer];
            }
    vis = elem.style;
    // if the style.display value is blank we try to figure it out here
    if (vis.display == "" && elem.offsetWidth != undefined && elem.offsetHeight != undefined) 
        vis.display = (elem.offsetWidth != 0 && elem.offsetHeight != 0) ? "block" : 'none';
    vis.display = (vis.display == "" || vis.display == "block") ? "none" : "block";
}

