var HomePromoGroup = function() {
  /* Holds an array of promos, and a reference to the
  promo being currently displayed. An instance of this object can
  be used to control displaying a set of promos. */
  
  this.promos        = [];
  this.currentPromo  = '';
  
  this.addPromo = function(promo) {
    /* Add a promo to this HomePromoGroup. */
    this.promos.push(promo);
  }
  
  this.showFirstPromo = function() {
    /* Show the first promo in this HomePromoGroup. */
    if(this.promos.length <= 0) return;
    this.showPromo(0);
  }
  
  this.showPromo = function(idx) {
    /* Display the promo added to the HomePromoGroup at
    the given index. */
    if(idx < 0 || idx > this.promos.length - 1) return;
    
    this.currentPromo = this.promos[idx];    

    /* If the page has expanded then we
    should also expand the promo on showing it. */
    if((document.body.clientHeight ? 
        document.body.clientHeight : 
        window.innerHeight) > 800) {
      this.currentPromo.expand();
    } else {
      this.currentPromo.collapse();
    }
    
    /* Activate the correct radio button. */
    $('.radio_button').attr("src","/bc/_img/home/radio_btn.png");
    $('#radioImage'+idx).attr("src","/bc/_img/home/radio_btn_active.png");

    /* Render the promo. */
    this.currentPromo.display();  
  }
  
  this.showNextPromo = function() {
    var tIdx = this.currentPromo.idx + 1;
    if(tIdx >= this.promos.length) {
      tIdx = 0;
    }
    //alert(tIdx);
    this.showPromo(tIdx);  
  }
  
  this.showLastPromo = function() {
    var tIdx = this.currentPromo.idx - 1;
    if(tIdx < 0) {
      tIdx = this.promos.length - 1;     
    }
    this.showPromo(tIdx);  
  }
}

var HomePromo = function(image, link, idx, showFlash, textColor, ribbonColor) {
  this.idx        = idx;
  this.image      = "url(/media/home_promos/"+image+")";
  this.link       = link;  
  this.showFlash  = !((navigator.userAgent.match(/iPhone/i)) || 
                     (navigator.userAgent.match(/iPod/i))) && showFlash;
  this.lines      = [];
  this.flashText  = '';  
  // check for text and ribbon defaults
  if (!textColor){
	  this.textColor = "#FFFFFF";
  } else {
	  this.textColor = textColor;
  }
  if (!ribbonColor){
	  this.ribbonColor = "#FE0000";
  } else {
	  this.ribbonColor = ribbonColor;
  }
  this.textTable  = (this.showFlash ? '<div id="promoArea"></div>' : '');
  this.addLine    = function(lineText) {
    if(lineText == '') return;
    this.lines.push(lineText);
    this.flashText += lineText + "\n";
    this.textTable += '<table '+(this.showFlash ? 'style="display: none;"' : '')+'>' +                       
                      '<tr>' +
                      '<td class="mainImageText" align="right">' +
                      '<div id="imageTextDiv' + this.idx + '" class="imageTextDiv">' +
                      (this.showFlash ? '<div id="seo-text">' : '') +
                      lineText +
                      (this.showFlash ? '</div> ' : '') +
                      '</div>' +
                      '</td>'  +
                      '</tr>'  +
                      '</table>';  
  }
                 
  this.display = function() {
    /* Display Image */
    $('#mainImage').css('opacity',0.0);
    $('#mainImage').css('background-image',this.image);
    $('#mainImage').css('z-index',0);
    $('#everythingElse').css('z-index',1);    
    $('#mainImage').stop().animate({ opacity: 1.0 }, 1000);   
 
    /* Load Text Lines onto Image */
    $('#mainImageTextCell').html(this.textTable);
    
  
    /* Display as Flash if applicable. */
    if(this.showFlash) {
      if(this.flashText.substr(this.flashText.length-1,this.flashText.length-1) == "\n") {
        this.flashText = this.flashText.substr(0,this.flashText.length - 1); 
      }      	    

	    flashVars       = { text: this.flashText, url: this.link, ribbon: this.ribbonColor, textcolor: this.textColor };
      flashParams     = {	scale: "noscale", menu: "false", 
                          wmode: "transparent", allowScriptAccess: "always" };
      flashAttributes = {	id: 'home-swf',	name: 'home-swf' };
      expressInstall  = '_swf/expressinstall.swf';
      swfobject.embedSWF("_swf/RibbonText.swf", "promoArea", "971", "324", "10.0.0", 
                         expressInstall, flashVars, flashParams, flashAttributes);    	
      delete expressInstall; 
      delete flashVars; 
      delete flashParams; 
      delete flashAttributes;    
    }
  }
  
  this.expand = function() {
     $('#mainImage').css("height", "490px");
     $('#mainImageTextTable').css("height","490px");
     $('#toggleMainImageBtn').attr("src", "/bc/_img/home/collapse.png");
     $('#toggleMainImageBtn').attr("alt", "Collapse");
  }
  
  this.collapse = function() {
     $('#mainImage').css("height", "324px");
     $('#mainImageTextTable').css("height","324px");
     $('#toggleMainImageBtn').attr("src", "/bc/_img/home/expand.png");
     $('#toggleMainImageBtn').attr("alt", "Expand");  
  }
  
  this.toggleExpand = function() {
    if($('#mainImage').css("height") =="324px") {
      this.expand();
    } else {
      this.collapse();
    }
  }
  
  this.followLink = function() {
    top.location = this.link;
  }
}


/* Home Promos. */
var promoGroup = new HomePromoGroup();
var promoCycle = '';
var stopCycle  = function() { clearInterval(promoCycle); }

$(document).ready(function() {
  promoGroup.showFirstPromo();
  promoCycle = setInterval("promoGroup.showNextPromo()",8000);  
});

/* Read the URL for the iso country code and iso language code.
The URL should be in the format:
http://<server>/<iso_country>/<iso_language>/bc/<page_and_params>. */
function readURL() {
  var chunks      = (top.location+'').split("/");
  var isoCountry  = chunks[3];
  var isoLanguage = chunks[4];

  setCookie('iso_country', isoCountry);
  setCookie('iso_language',isoLanguage);
}

function setCookie(c_name,value) {
  var exdate=new Date();
  exdate.setDate(exdate.getDate()+(20*365));
  document.cookie=c_name+ "=" +escape(value)+";expires="+exdate.toGMTString()+"; path=/; domain=.specialized.com";
}

readURL();

/* Mini Promos. */
function mouseOverMiniImage(borderImage){
    var redBorderImage = document.getElementById(borderImage);
    if(redBorderImage.style.visibility=="hidden"){
        redBorderImage.style.visibility="visible";
    }
}

function mouseOutMiniImage(borderImage){
    var redBorderImage = document.getElementById(borderImage);
    if(redBorderImage.style.visibility=="visible"){
      redBorderImage.style.visibility="hidden";
    }
}

/* Call outs. */

function findPos(obj) {
    var curleft = curtop = 0;
    if (obj.offsetParent){
      curleft = obj.offsetLeft
      curtop  = obj.offsetTop
      while (obj = obj.offsetParent){
        curleft += obj.offsetLeft
        curtop  += obj.offsetTop
      }
    }
    return [curleft,curtop];
}

function highlightLink(linkObj){
    linkObj.style.color = "#FF0000";
}

function unhighlightLink(linkObj){
    linkObj.style.color = "#666666";
}

function hideCallout(){
    document.getElementById("twitterCallout").style.display  = "none";
    document.getElementById("facebookCallout").style.display = "none";
}

function showCallout(targetDiv, targetText){
    hideCallout();
    // find out the top and left where we want to display the callout
    var coors = findPos(document.getElementById(targetText));
    // display the callout
    document.getElementById(targetDiv).style.left    = (coors[0]+60)+"px";
    document.getElementById(targetDiv).style.top     = (coors[1]-35)+"px";
    document.getElementById(targetDiv).style.display = "block";
}

function moveoutCalloutDIV(event){
    var toElement   = (event.relatedTarget ? event.relatedTarget : 
                      (event.toElement     ? event.toElement     :
                      null));

    if (!toElement || toElement.tagName !="A") {
      hideCallout();
    }
}