/*
Gateway  rollovers
*/

/* Rollover Manager Singleton */

function RolloverManager(){}

RolloverManager.HERO = $("#right-1 div:eq(0)");

RolloverManager.restore = function(element, rolloverImage){
    RolloverManager.HERO.css("display","block");
    element.css("display","none");
    element.css("background-color","#d1e0b7");
}

RolloverManager.displayRolloverTarget =  function(element, rolloverImage){
 var p = Util.getPosition('right-1');
 element.css("background","url(" + rolloverImage.attr("src") + ")");

 /**
  * The following code is to allow the rollover background to be fixed during scrolling.  Unfortunately
  * there is a cross-browser difference on how this is done.  It is the default behavior for firefox.
  * For ie, we need to add the css attribute "background-attachment: fixed".
  **/
 if(Util.isIE) {
    if(Util.isIE7P) {
      /**
       * In addition, ie7 fix the background with respect to the page rather than the element.  As such
       * we offset the background image so it starts where the slot resides 
       **/
      element.css("background-position", eval(p.x) + "px " + eval(p.y-document.documentElement.scrollTop) + "px"); 
    } else {
      element.css("height","303px");
      element.css("width","295px");
    } 
    element.css("background-attachment","fixed");
 }

 element.css("display","block");
 RolloverManager.HERO.css("display","none");
 element.css("top",eval(p.y));
 element.css("left",eval(p.x));
}



// Gets  all the slots  on center-1 that we know are rollovers, returns an array
// getting all the slots dynamically lets schedulers
// change the number of slots at will, as long as the classes of the divs are the same
// rollovers will still work
// rolloverBgImages contains the list of background image to use during the rollover
// currently, it's looking for them under div's with class gatewayHeroRolloverImage

var numberOfRollovers = $("#center-1 .asinItem ul ").length;

var slotsTargets =[];
var slots=[];
var rolloverBgImages=[];
var slotNames 


for (var i=0;i<numberOfRollovers;i++){
// couldn't figure out how to use closures with jquery
// building arrays  by hand
slots[i] = ".asinItem:eq("+eval(i)+")";
slotsTargets[i] = ".asinItem ul:eq("+eval(i)+")";
rolloverBgImages[i] = ".gatewayHeroRolloverImage img:eq("+eval(i)+")";
}


// creating rollover code at runtime
var  s = new StringBuffer();

for (var i=0;i<numberOfRollovers;i++){
    s.append(" $(\""+slots[i]+"\").hover(");
    s.append(" function() { ");   
    s.append('$(this).css("background-color","#efefef");');
	if (Util.isIE && !(Util.isIE7P)) {
		s.append('$(this).css("height","61");');
	}
    s.append("RolloverManager.displayRolloverTarget($(\""+slotsTargets[i]+"\"),$(\""+rolloverBgImages[i]+"\")) },");
    s.append(" function(){");
    s.append('$(this).css("background-color","#d1e0b7");');
    s.append(" RolloverManager.restore($(\""+slotsTargets[i]+"\"),$(\""+rolloverBgImages[i]+"\"))}");
    s.append(");");
}



// creating script element to hold  rollover code
var headID = document.getElementsByTagName("head")[0];         

if (Util.isIE){
    var newScript = document.createElement('script');
	newScript.text = s.toString();
} else {
   var newScript = document.createElement('script');
    newScript.type = 'text/javascript';
	newScript.innerHTML = s.toString();
}

headID.appendChild(newScript);