﻿// JScript File - Element_Transition
  var elems = [];
	var Btn_location = [];
	var Img_URL = [];
var _URL_Target="";
    var cur_element = '';
    var next_element = '';
    var t_timer = '';
    var f_timer = '';
    var t_timeout = '';
    var f_timeout = '';
    var passed_once = false;

    function opacity(div1, div2, opacStart, opacEnd, millisec) {//debugger;
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;
    var e = 100;
    
    passed_once = true;
    
    for(i = opacStart; i <= opacEnd; i++) {
        e = e - 1;
        f_timeout = setTimeout('changeOpac(' + i + ',' + e + ')',(timer * speed));
        timer++;
        }
  
        document.getElementById(elems[next_element]).style.zIndex = 10;
        document.getElementById(elems[cur_element]).style.zIndex = 1;
    }
    
    //change the opacity for different browsers
    function changeOpac(opacity1, opacity2) {//debugger;
        
        var object1 = document.getElementById(elems[cur_element]).style;
        var object2 = document.getElementById(elems[next_element]).style;
        
        object1.opacity = (opacity2 / 100);
        object1.MozOpacity = (opacity2 / 100);
        object1.KhtmlOpacity = (opacity2 / 100);
        object1.filter = 'alpha(opacity=' + opacity2 + ')';
        
        object2.opacity = (opacity1 / 100);
        object2.MozOpacity = (opacity1 / 100);
        object2.KhtmlOpacity = (opacity1 / 100);
        object2.filter = 'alpha(opacity=' + opacity1 + ')';
        }
    
    function setTransition(elements, location, URL, targetlist, fadeTimer, transTimer) {//debugger;
        elems = elements.split(';');
		Btn_location = location.split(';');
		Img_URL = URL.split(';');
        _URL_Target = targetlist.split(';');
		f_timer = fadeTimer;
        t_timer = transTimer;
        cur_element = 0 ;
        next_element = 1;
        t_timeout = setInterval('setElements()',t_timer);
        }
       
   function setElements() {//debugger;
        if (passed_once == true){
            cur_element = next_element;
            next_element = next_element + 1;
			if (next_element == elems.length){
                next_element = 0;
                }
			}

		//change background Image
		for (var i=0;i<=elems.length - 1;i++)
		{
		     if (elems[i] == elems[next_element])
		     {	
                        var cur_image_pos = next_element+1;
			var NumImgID = "Num_" + cur_image_pos;
			document.getElementById(NumImgID).src= "/assets/images/Billboard/"+cur_image_pos+"_On.png";
                     }  
               }
		// reset numbers
		for (var i=1;i<5;i++)
		{
                      if (i != (next_element+1))
		      {	
                             var old_image_pos = i;
			     var NumImgID = "Num_" + old_image_pos;
			     document.getElementById(NumImgID).src= "/assets/images/Billboard/"+old_image_pos+".png";
                      }
		}

		document.getElementById("slide1a").style.backgroundImage = "url(/assets/images/Billboard/"+elems[next_element]+")";
		
		var temp = new Array();
		temp = Btn_location[next_element].split(',');
		document.getElementById("Num_Billboard").style.marginLeft = temp[0]+"px";
		document.getElementById("Num_Billboard").style.marginTop = temp[1]+"px";
		
		document.getElementById("Num_Billboard_Link").href = Img_URL[next_element];
		document.getElementById("Num_Billboard_Link").target = _URL_Target[next_element];
		//document.getElementById("DIV_Billboard_map").innerHTML = "<area shape=\"rect\" id=\"Slide_Btn\" coords=\""+Btn_location[next_element]+"\" href=\""+Img_URL[next_element]+"\" alt=\"\">"; 

		passed_once = true;
        }
        
        
    function buttonChanger(clicked_name){
        var new_element = '';
		clicked_name = clicked_name.replace(".jpg","")
		for (i=0;i<=elems.length - 1;i++){
            
            if (elems[i].indexOf(clicked_name) > -1){
                new_element = i;
                } 
            }

		//change background Image
		for (var i=0;i<=elems.length - 1;i++)
		{
		     if (elems[i] == elems[next_element])
		     {	
                        var cur_image_pos = next_element+1;
			var NumImgID = "Num_" + cur_image_pos;
			document.getElementById(NumImgID).src= "/assets/images/Billboard/"+cur_image_pos+"_On.png";
                     }  
               }
		// reset numbers
		for (var i=1;i<5;i++)
		{
                      if (i != (next_element+1))
		      {	
                             var old_image_pos = i;
			     var NumImgID = "Num_" + old_image_pos;
			     document.getElementById(NumImgID).src= "/assets/images/Billboard/"+old_image_pos+".png";
                      }
		}

		document.getElementById("slide1a").style.backgroundImage = "url(/assets/images/Billboard/"+elems[next_element]+")";
		
		var temp = new Array();
		temp = Btn_location[next_element].split(',');
		document.getElementById("Num_Billboard").style.marginTop = temp[0]+"px";
		document.getElementById("Num_Billboard").style.marginLeft = temp[1]+"px";
		document.getElementById("Num_Billboard_Link").href = Img_URL[next_element];
		document.getElementById("Num_Billboard_Link").target = _URL_Target[next_element];
		//document.getElementById("DIV_Billboard_map").innerHTML = "<area shape=\"rect\" id=\"Slide_Btn\" coords=\""+Btn_location[new_element]+"\" href=\""+Img_URL[new_element]+"\" alt=\"\">";
		
        clearInterval(t_timeout);
        cur_element = next_element;
        next_element = new_element;
        passed_once = false;
        setElements();
        t_timeout = setInterval('setElements()',t_timer);     
        }
