var items;
var carousel_position = 0;
var xOffset = 0
var beltWidth = 0;
var carouselWidth = 0;
var mouseNavInterval;
var moveDuration = 2;
var mouseCoord;
var carouselPosLeft;
var carouselPosRight; 
var carousel_active = false;
var posInDiv;
var scrollPercent;
var PreviousText = "Previous";
var PreviousTextAr = "السابق";
var NextText = "Next";
var NextTextAr = "التالي";
var CloseWindowText = "Close window";
var CloseWindowTextAr = "إغلاق";
var IsEnglish = true;

  
Event.observe(window, "load", AddCompanyLinks);

function AddCompanyLinks()
{
    var companyLinks = $$('a.companyOverlay');
    for(i=0; i<companyLinks.length; i++)
    {
        Event.observe(companyLinks[i], 'click', this.ShowCompanyLink.bindAsEventListener(companyLinks[i]), false);  
    } 
    
    var pageUrl = window.location + "";
    if(pageUrl.indexOf("/ar/")!=-1){
     IsEnglish = false; 
     CloseWindowText = CloseWindowTextAr;
    }
}

function ShowCompanyLink(e)
{
    showOverlay(this.href,this.href);    
    Event.stop(e);  
}


function initCarousel(carouselId, moveTime, boolTrackMouse, width, height){

    var pageUrl = window.location + "";
    
    if(pageUrl.indexOf("/ar/")!=-1){ 
        PreviousText = PreviousTextAr;
        NextText = NextTextAr;    
        CloseWindowText = CloseWindowTextAr;
        IsEnglish = false;
    }

    moveDuration = moveTime;
    carouselWidth = width;
     
    items = $$('#Carousel div.item');    
   // for(i = 0; i<items.length; i++)
   // {
   //     beltWidth = beltWidth + items[i].clientWidth;                
   // }     
   // if(beltWidth==0){ 
     
        for(i = 0; i<items.length; i++)
        { 
            if(items[i].innerHTML.indexOf("_mw.")!=-1)
                beltWidth = beltWidth + 110; // double up
            beltWidth = beltWidth + 110;
        }          
   // }
    $('Belt').setStyle({ width: beltWidth + 100 + 'px'});  
    $('Carousel').setStyle("height:"+height+"px !important; overflow:hidden !important; position:absolute; z-index:100; ");
    $('Carousel').addClassName("enabled");
    $('CarouselFix').setStyle("height:" + height + "px");
     
     
    if(boolTrackMouse){ 
        var IE = document.all?true:false;
        if (!IE) document.captureEvents(Event.MOUSEMOVE)
        document.onmousemove = getMouseCoordinates;
        
        $('Carousel').observe('mouseover',function(){startMouseNav();});
        $('Carousel').observe('mouseout',function(){stopMouseNav();});    
    }
    if(items.length>5 || beltWidth > 460 )
    {
        if(pageUrl.indexOf("/ar/")!=-1){ 
            $("CarouselNav").innerHTML = '<div class="prev" id="CarouselLinkPrev"><a href="javascript:moveLeft()" class="arrowRight">' + PreviousText + '</a></div><div class="next"  id="CarouselLinkNext"><a href="javascript:moveRight()" class="arrowLeft">' + NextText + '</a></div>';
        }
        else{
            $("CarouselNav").innerHTML = '<div class="prev" id="CarouselLinkPrev"><a href="javascript:moveLeft()" class="arrowLeft">' + PreviousText + '</a></div><div class="next"  id="CarouselLinkNext"><a href="javascript:moveRight()" class="arrowRight">' + NextText + '</a></div>';
        }
        
        try{
         $("CarouselLinkPrev").style.visibility="hidden";
        }catch(ex){}
    }
}

function moveLeft(){ 
    if(carousel_position>0)
    {        
        $("CarouselLinkNext").style.visibility="visible";
        var moveX = items[carousel_position-1].clientWidth;
        new Effect.MoveBy('Belt', 0, moveX, {duration:moveDuration, queue: {position:'end', scope: 'carouselScope'},  afterFinish: doMouseNav});
         
        carousel_position= carousel_position-1;
        xOffset = xOffset + moveX;
    }
    if(carousel_position<=0)
    {
    
       try{
         $("CarouselLinkPrev").style.visibility="hidden";
        }catch(ex){}
    }    
}

function moveRight(){ 
    if(xOffset-carouselWidth>10-beltWidth && carousel_position<(items.length-1))
    {
        $("CarouselLinkPrev").style.visibility="visible";
        
        var moveX = items[carousel_position].clientWidth;
        new Effect.MoveBy('Belt', 0, -moveX, { duration:moveDuration, queue: {position:'end', scope: 'carouselScope'},  afterFinish: doMouseNav});
                 
        carousel_position++;  
        xOffset = xOffset - moveX;
    }
    if(!(xOffset-carouselWidth>10-beltWidth && carousel_position<(items.length-1)))
    {    
        try{
            $("CarouselLinkNext").style.visibility="hidden";
        }catch(ex){}
    }
}
 
function startMouseNav(){ 
     carousel_active = true; 
     
     var ua = navigator.userAgent.toLowerCase();
     if (ua.indexOf('safari/') != -1){
        mouseNavInterval = setTimeout("doMouseNav()",200);
     }
     else{
        mouseNavInterval = setTimeout("doMouseNav()",moveDuration*1000);
     }
}

function stopMouseNav(){
   carousel_active = false;;
   clearTimeout(mouseNavInterval);
}


function doMouseNav(){     
    clearTimeout(mouseNavInterval);
    if(carousel_active){           
        mousePercent = scrollPercent;
        
        if(mousePercent>1){mousePercent=1;}
        if(mousePercent<0){mousePercent=0;}    
       
        if(mousePercent>0.6){/*moveDuration=1-mousePercent + 0.18; */    moveLeft(); }
        if(mousePercent<0.4){ /*moveDuration=mousePercent + 0.18; */      moveRight();  }        
            
   }
}

function getMouseCoordinates(e)
{
    if (document.layers) { 
        xMousePos = e.pageX;  
    } else if (document.all) { 
        xMousePos = window.event.x+document.body.scrollLeft; 
        } else if (document.getElementById) { 
        xMousePos = e.pageX; 
    } 
     
    mouseCoord = xMousePos;     
    posInDiv = carouselWidth-(mouseCoord-$('Carousel').offsetLeft);    
    var IE = document.all?true:false;
    if (IE) {
        posInDiv = posInDiv - xOffset -  $('Carousel').offsetLeft ;
    }
    if(posInDiv<0){posInDiv = 0;}
    if(posInDiv>carouselWidth){posInDiv = carouselWidth;}     
    scrollPercent = posInDiv / carouselWidth;    
}
  
 
// OVERLAY FUNCTIONS
 
 
var overlayActive = false;
 
function showOverlay(pageID,pageLink)
{
    if(!overlayActive)  
    {
        overlayActive = true;
        addBlockOut(); 
        
        var lang="en";
        if(!IsEnglish)
        {
            lang="ar";
        }
        
    new Ajax.Request('/templates/SubEntityAjaxOutput.aspx?pg='+pageID +"&lang=" + lang, {
        onSuccess: function(transport) { 
            var json = transport.responseText.evalJSON(true);    
          
            addOverlay(generateOverlayHtml(json));  
            TrackExternalCarousel();         
        }
    });             
     
     try
     {
        pageTracker._trackPageview(pageLink); 
     }
     catch(e){}
     
     
    }
    return false;        
} 
function hideOverlay()
{    
    new Effect.Fade("CarouselOverlay", { duration: 0.3, afterFinish: function(){        
        removeOverlay();
        removeBlockOut();
        overlayActive = false;    
    }    
    });
}

function addOverlay(html){   
 
    var overlayDiv = document.createElement('div');    
    overlayDiv.id = "CarouselOverlay";    
    overlayDiv.innerHTML = html;   
    overlayDiv.style.visibility = "hidden";
    document.getElementsByTagName('body')[0].appendChild(overlayDiv);          
    
    var xPos =  $("Main").cumulativeOffset()[0] + ($("Main").clientWidth/2) - (overlayDiv.clientWidth/2);
    
    if (IsEnglish && !(navigator.appVersion.indexOf("Mac")!=-1 && navigator.userAgent.indexOf("Firefox")!=-1)) 
    {
        sifr_carousel_h2_intro();   
    }
    overlayDiv.style.left = xPos + "px";
    overlayDiv.style.top = getScroll() + 120 + "px";
    overlayDiv.style.visibility = "visible";
    overlayDiv.style.display = "none"; 
    new Effect.Appear("CarouselOverlay", { duration: 1.5});    
     
}

function updateOverlay(html){   
 
    new Effect.Fade("CarouselOverlay", { duration: 0.3, afterFinish: function(){    
        var overlayDiv =  $("CarouselOverlay");    
        overlayDiv.innerHTML = html;     
        new Effect.Appear("CarouselOverlay", { duration: 0.3, afterFinish: function(){sifr_carousel_h2_intro(); } });     
    }    
    });   
}

function removeOverlay(html){
    $("CarouselOverlay").remove();
}


function addBlockOut()
{ 
    var blockOutDiv = document.createElement('div');    
    blockOutDiv.id = "CarouselBlockOut";

	blockOutDiv.style.height=getPageHeight()+"px"; 
			 
    var body = document.getElementsByTagName('body')[0];
	body.appendChild(blockOutDiv);
	
	Event.observe(blockOutDiv, 'click', this.hideOverlay.bindAsEventListener(this), false);
     
}
function removeBlockOut()
{ 
    new Effect.Opacity('CarouselBlockOut', { 
      duration: 0.2,
      transition: Effect.Transitions.linear,
      from: 0.7, 
      to: 0,
      afterFinish: function(){
        $("CarouselBlockOut").remove();
      }
    });
    
}

function generateOverlayHtml(json)
{
    // header
    html = '<div class="header"><a href="javascript: hideOverlay()" class="iconClose" >' + CloseWindowText +'</a></div>';    
    
    // content
    html+= '<div class="content clearfix">';
    html+= '<div class="image"><img src="'+ json.image + '" alt="' + json.title + '" title="' + json.title + '" /></div>';
    html+= '<div class="details">' +  json.description + "</div></div>";
    
    // logos    
    if(json.subEntities.length>0)
    {         
        html+= '<div class="logos">';
        
        if(json.introduction != null ){
            html+= '<h3>'+ json.introduction + '</h3>';      
        }
        
        for(i=0; i<json.subEntities.length; i++)
        {
            var iconClass = "IconSmall";
            if(json.subEntities[i].icon.indexOf("_mw.")!=-1){
                iconClass = "IconDouble";
            }        
        
           //html+= '<a href="#" onclick="return showOverlay(\''+json.subEntities[i].link+'\')"><img src="'+ json.subEntities[i].icon + '" alt="'+json.subEntities[i].title+'" title="'+json.subEntities[i].title+'" /></a>';
           //html+= '<a href="#" onclick="return false" class="' + iconClass + '" ><img src="'+ json.subEntities[i].icon + '" alt="'+json.subEntities[i].title+'" title="'+json.subEntities[i].title+'" /></a>';
           html+= '<img src="'+ json.subEntities[i].icon + '" alt="'+json.subEntities[i].title+'" title="'+json.subEntities[i].title+'"  class="' + iconClass + '" />';
       
        }
        html+= '</div>';
    }    
     
    return html;
}

function getScroll()
{

    if(typeof(window.pageYOffset) == 'number') {        	
    	return window.pageYOffset;
  	} else if(document.body && (document.body.scrollLeft || document.body.scrollTop)) {	       
    	return document.body.scrollTop;
	} else if(document.documentElement) {
    	return document.documentElement.scrollTop;
  	}
  	return 0;
}


function getPageHeight(){
    var yScroll;
     
		if (window.innerHeight && window.scrollMaxY) {	 
			yScroll = window.innerHeight + window.scrollMaxY;
		} else if (document.body.scrollHeight > document.body.offsetHeight){  
			yScroll = document.body.scrollHeight;
		} else {  
			yScroll = document.body.offsetHeight;
		} 
		var windowHeight;
		if (self.innerHeight) {	 
			windowHeight = self.innerHeight;
		} else if (document.documentElement && document.documentElement.clientHeight) { 
		 
			windowHeight = document.documentElement.clientHeight;
		} else if (document.body) {  
			windowHeight = document.body.clientHeight;
		}	 
		if(yScroll < windowHeight){
			yScroll = windowHeight;
		}  	 
		return yScroll		
}

function getPageWidth(){
 
    var yScroll;
     
		if (window.innerWidth && window.scrollMaxY) {	 
			yScroll = window.innerWidth + window.scrollMaxY;
		} else if (document.body.scrollWidth > document.body.offsetWidth){  
			yScroll = document.body.scrollWidth;
		} else {  
			yScroll = document.body.offsetWidth;
		} 
		var windowWidth;
		if (self.innerWidth) {	 
			windowWidth = self.innerWidth;
		} else if (document.documentElement && document.documentElement.clientWidth) { 
		 
			windowWidth = document.documentElement.clientWidth;
		} else if (document.body) {  
			windowWidth = document.body.clientWidth;
		}	 
		if(yScroll < windowWidth){
			yScroll = windowWidth;
		}  	 
		return yScroll		
}