/*
 * sponsorsRotate.js
 * (c) 2010 Bear Peak Software, LLC
 */

/*
		Global Variables
		
		Implementation Note: This code adds two variables to the global name space.
		Global variables start with "biff" and are intentionally long to avoid
		possible conflicts with other JavaScript code or libraries. 
 */

/*
		***   CONFIGURATION:  BIFF Sponsors Image Rotation    ***
		
		The following JavaScript statement defines the configuration details.
		In terms of JavaScript, the variable below defines an array of objects, 
		where each object has two properties: filename and durationSeconds.
		
		Each object defines an image file to display and the number of seconds
		that the image will be displayed. The order of the objects is the order
		in which the images are shown.
		
		property filename: is the name of an image file that is relative to the
		website root directory. The image format can be any standard HTML image 
		format, such as jpg, gif, or png.
		
		property durationSeconds: the number of seconds the image is displayed.
		This time does not include the fadein / fadeout time.
		Floating point values, such as 3.5, are allowed.
		
		The count, or total images, does not have to be configured. It is 
		determined by the length of the array.
		
		Example
		
			var biffSponsorsRotateConfiguration = [
				{filename: "images/sponsors1.jpg",  durationSeconds: 5},
				{filename: "images/sponsors2.jpg",  durationSeconds: 4},
				{filename: "images/sponsors3.jpg",  durationSeconds: 3}
			];
	
		Important Notes
		
		The last object in the array DOES NOT have a comma at the end.
		This is the only code that needs to be configured.
 */
var biffSponsorsRotateConfiguration = [
	{filename: "images/sponsorimages/sponsors1.jpg",  durationSeconds: 6},
	{filename: "images/sponsorimages/sponsors2.jpg",  durationSeconds: 5},
	{filename: "images/sponsorimages/sponsors3.jpg",  durationSeconds: 5},
	{filename: "images/sponsorimages/sponsors4.jpg",  durationSeconds: 4},
	{filename: "images/sponsorimages/sponsors5.jpg",  durationSeconds: 4},
	{filename: "images/sponsorimages/sponsors6.jpg", durationSeconds: 4},
	{filename: "images/sponsorimages/sponsors7.jpg", durationSeconds: 4},
	{filename: "images/sponsorimages/sponsors8.jpg",  durationSeconds: 3},
	{filename: "images/sponsorimages/sponsors9.jpg",  durationSeconds: 3},
	{filename: "images/sponsorimages/sponsors10.jpg",  durationSeconds: 3},
	{filename: "images/sponsorimages/sponsors11.jpg",  durationSeconds: 3}
	     // last item, NO COMMA!
];

/* the image rotate state object */
var biffSponsorsImageRotate = null;

// register the init function to run when the page is loaded
registerEvent(window, "load", initBiffSponsorsImageRotate);

// init function
function initBiffSponsorsImageRotate() {
  //log("initBiffSponsorsImageRotate: number of image files: " + biffSponsorsRotateConfiguration.length);
	
	// create the biffSponsorsImageRotate object
  biffSponsorsImageRotate = new BiffSponsorsImageRotate("sponsorsImg", biffSponsorsRotateConfiguration);
	
  // check for biffSponsorsImageIndex cookie
  var cks = document.cookie;
  var i = cks.indexOf("biffSponsorsImageIndex=");
  if (i != -1) {
    i += "biffSponsorsImageIndex=".length;
    var end = cks.indexOf(";", i);
    if (end == -1)
      end = cks.length;
    biffSponsorsImageRotate.i = Number(cks.substring(i, end));
  }
	
	// assign the first image
	biffSponsorsImageRotate.img.src = biffSponsorsImageRotate.config[biffSponsorsImageRotate.i].filename;
  
	// get the sponsors element and register for mouseover & mouseout
  var sponsors = document.getElementById("sponsors");
  if (sponsors) {
    registerEvent(sponsors, "mouseover", sponsorsCaptionOn);
    registerEvent(sponsors, "mouseout", sponsorsCaptionOff);
  }
  
	// start the timer to run the rotation
  setTimeout(biffSponsorsImageRotate.rotate, biffSponsorsImageRotate.duration());  
	
	// prefetch all images
	var w = 758;
	var h = 68;
	var firstImg = document.getElementById("sponsorsImg");
	if (firstImg) {
		w = firstImg.width;
		h = firstImg.height;
	}
	for (var i = 0; i < biffSponsorsRotateConfiguration.length; i++) {
		var img = new Image(w, h);
		img.src = biffSponsorsRotateConfiguration[i].filename;
	}
}

// constructor
function BiffSponsorsImageRotate(imageId, configuration) {
  this.state = 0;
  this.i = 0;
  this.intv = 66; // milliseconds, 50 ms (20 fps) is very smooth
  this.img = document.getElementById(imageId);
  this.img.style.opacity = 1.0;
	this.config = configuration;
  this.n = configuration.length;
}

// set the next image
BiffSponsorsImageRotate.prototype.setNextImg = function() {
  this.i = (this.i + 1) % this.n;
  this.img.src = this.config[this.i].filename;
  document.cookie = "biffSponsorsImageIndex=" + this.i + ";max-age=" + 300;
}

// run a "rotation": fadeout image, set next image, fadein image
/*
	implementation note: this function is called from a timer, so
	it runs in the context of the the main window and so the "this"
	object is the window, not the BiffSponsorsImageRotate object. 
 */
BiffSponsorsImageRotate.prototype.rotate = function() {
  //log("rotate: i=" + biffSponsorsImageRotate.i + " state="  + biffSponsorsImageRotate.state);

	var ir = biffSponsorsImageRotate;
  var nextIntv = ir.intv;

  switch (ir.state) {
  
  case 0:
    if (fadeoutElement(ir.img, 0.05)) {
			ir.setNextImg();
      ir.state = 1;
    }
    break;
		
	case 1:
    if (fadeinElement(ir.img, 0.05)) {
      nextIntv = ir.duration();
      ir.state = 0;
    }
    break;
  }
  
  setTimeout(ir.rotate, nextIntv);
}

BiffSponsorsImageRotate.prototype.duration = function() {
	var milliSeconds = this.config[this.i].durationSeconds * 1000;
	return milliSeconds;
}

function sponsorsCaptionOn(e) {
  var caption = document.getElementById("sponsorsCaption");
  if (caption)
    caption.style.visibility = "visible";
}

function sponsorsCaptionOff(e) {
  var caption = document.getElementById("sponsorsCaption");
  if (caption)
    caption.style.visibility = "hidden";
}