/* BI-LO Image Fader
 * BY  : Aaron Bowers
 * DATE: 02/12/2007
 */

//********* DO NOT EDIT OR DELETE THIS BELOW
/*function MultiDimensionalArray(iRows,iCols) {
	var i;
	var j;
	var a = new Array(iRows);
	for (i=0; i < iRows; i++) {
		a[i] = new Array(iCols);
		for (j=0; j < iCols; j++) {
			a[i][j] = "";
		}
	}
	return(a);
} */
//********* DO NOT EDIT OR DELETE THIS ABOVE
 
 
//* * * GLOBAL VARIABLES

//#### IMAGE OBJ ARRAY NUMBER 1
var aryImages1 = new Array(); //Image array placehoder for images
//*** (*more can be added; just follow current format below)
//* Image 1
aryImages1[0] = new Image();//258,396
aryImages1[0].src = "/logos/images/bilo/bilo_super_242_142.jpg";
//* Image 2
aryImages1[1] = new Image();//290,400
aryImages1[1].src = "/logos/images/home/walters.gif";
//* Image 3
aryImages1[2] = new Image();//290,400
aryImages1[2].src = "/logos/images/common/sh_bakery_299_170.jpg";
//* Image 4
aryImages1[3] = new Image();//290,400
aryImages1[3].src = "/logos/images/home/foodmax.gif";
//* Image 5
aryImages1[4] = new Image();//290,400
aryImages1[4].src = "/logos/images/home/jj_polois.gif";
//* Image 7
aryImages1[5] = new Image();//290,400
aryImages1[5].src = "/logos/images/common/sh_deli_traditions_436_187.jpg";
//* Image 8
aryImages1[6] = new Image();//290,400
aryImages1[6].src = "/logos/images/home/bilo_charities.gif";
//* Image 9
aryImages1[7] = new Image();//290,400
aryImages1[7].src = "/logos/images/home/bonus_value_card.gif";
//* Image 10
aryImages1[8] = new Image();//290,400
aryImages1[8].src = "/logos/images/home/brunos.gif";
//* Image 11
aryImages1[9] = new Image();//290,400
aryImages1[9].src = "/logos/images/home/drugstore.gif";
//* Image 12
aryImages1[10] = new Image();//290,400
aryImages1[10].src = "/logos/images/home/foodworld.gif";
//* Image 13
aryImages1[11] = new Image();//290,400
aryImages1[11].src = "/logos/images/home/gold_star.gif";



//*** (^)
//


//#### MAIN IMAGE PLACE HOLDER
var CURRENT_IMAGE_ARRAY;
//
var curImgNum = 0;//current image to be displayed (image array element pos)
var curImgCtr = 0;//current image counter (image array element pos)
//
var TimeoutId = NaN; //interval execution ID ( use 'clearinterval( TimeoutId );' to stop execution of code that is executed with TimeoutId= setInterval('code',millisec);)
var INTERVAL_SPAN = 4250;//9000
var FADEOUT_SPAN = 2000;//900
var FADEIN_SPAN = 2500;//1150
//
var prevImgStr = "";
var bRandomizeImages = false;
//var bProcessing= false;



//* * * METHODS/FUNCTIONS

/* setCurrentImageArray: Sets the image array object CURRENT_IMAGE_ARRAY to the specific image object to be used
 * Arguments:
 *		index	=	index (number) of the array of image data to be used ; image arrays must be precreated in script (above)
 *
 * WILL NEED TO ADD THE case #: STATEMENTS AND SET THE CURRENT_IMMAGE_ARRAY VAR AS NEW IMAGE ARRAY OBJECTS ARE CREATED (ABOVE)
 */
function setCurrentImageArray( index ) {
	switch( index ) {
		case 1:
			CURRENT_IMAGE_ARRAY= aryImages1;
			break;
		case 2:
			CURRENT_IMAGE_ARRAY= aryImages2;
			break;
	}
}


function randomlySortCurrentImageArray() {
	//setTimeout("CURRENT_IMAGE_ARRAY.sort( function() { return 0.5 - Math.random(); } )",FADEIN_SPAN);
	CURRENT_IMAGE_ARRAY.sort( function() { return 0.5 - Math.random(); } ); 
}

function calculateNextImageIndex() {
	if( bRandomizeImages ) {
		//alert("calculateNextImageIndex : RANDOM !");//### DEBUG
		randomlySortCurrentImageArray();
		
		//DO NOT ALLOW US TO DISPLAY THE SAME IMAGE BACK TO BACK
		if( prevImgStr == CURRENT_IMAGE_ARRAY[ curImgNum ].src )
			curImgNum= 1;
		else
			curImgNum= 0;
		
		//increment
		curImgCtr++;
		//check to make sure we do not go outside the bounds of the CURRENT_IMAGE_ARRAY
		if( curImgCtr >= CURRENT_IMAGE_ARRAY.length ) curImgCtr= 0;
	}
	else {
		//alert("calculateNextImageIndex : IN SERIES !");//### DEBUG
		//increment
		curImgNum++;
		//check to make sure we do not go outside the bounds of the CURRENT_IMAGE_ARRAY
		if( curImgNum >= CURRENT_IMAGE_ARRAY.length ) curImgNum= 0;
		curImgCtr= curImgNum;
	}
	
	//alert("CURRENT_IMAGE_ARRAY.length : " + CURRENT_IMAGE_ARRAY.length);//### DEBUG
	//alert(curImgCtr + " ctr ; " + curImgNum + " num");//### DEBUG
}


/* initRunFader: Initializes tags, first imag, and divs and sets up Interval Execution of 'runFader'
 * Arguments:
 *		image_array_index	=	index (number) of the array of image data to be used ; image arrays must be precreated in script (above)
 *		randomize_images	=	(optional: default value is false) boolean to set up to randomize images shown
 *		image_styles		=	(optional) style data for the image tags
 */
function initAndRunFader( image_array_index, randomize_images, image_styles ) {
	//set images to be used
	setCurrentImageArray( image_array_index );
	
	//check for optional argument randomize_images
	if( typeof randomize_images != "undefined" ) {
		if( randomize_images ) {
			bRandomizeImages= true;
			//randomlySortCurrentImageArray();
			CURRENT_IMAGE_ARRAY.sort( function() { return 0.5 - Math.random(); } );
			//always use first image
			curImgNum= 0;
		}
		else bRandomizeImages= false;
	}
	else bRandomizeImages= false;

	//check for optional argument image_styles
	if( typeof image_styles != "undefined" ) {
		var IMG_STYLE;
		if( image_styles == null || image_styles == "" ) IMG_STYLE= "";
		else {
			IMG_STYLE= "  style=\"" + image_styles + "\"";
		}
		
		//print out Div Tags with the passed in style in the Image tags; to use in showing and hiding images 
		document.write("<div id=\"div1\" style=\"display: none\"><img id=\"img1\" alt=\"\" align=\"bottom\"" + IMG_STYLE + " /></div><div id=\"div2\" style=\"display: none\"><img id=\"img2\" alt=\"\" align=\"bottom\"" + IMG_STYLE + " /></div>");
	}
	else {
		//print out Div Tags to use in showing and hiding images
		document.write("<div id=\"div1\" style=\"display: none\"><img id=\"img1\" alt=\"\" align=\"bottom\" /></div><div id=\"div2\" style=\"display: none\"><img id=\"img2\" alt=\"\" align=\"bottom\" /></div>");
	}
	
	//create access vars to pass to the runFader methods
	var Div1Id = "div1", Img1Id = "img1", Div2Id = "div2", Img2Id = "img2";

	
	//set Image
	document.getElementById(Img1Id).src = CURRENT_IMAGE_ARRAY[ 0 ].src;
	//init opacity for fade in
	setOpacity(Img1Id, 0);
	//show image via setting the div's display style to inline
	document.getElementById(Div1Id).style.display = 'inline';
	
	//fade in image
	fadeIn(Img1Id,FADEIN_SPAN);
	
	//set to run main fader functions
	TimeoutId = setTimeout("runFaderStart('" + Div1Id + "', '" + Img1Id + "', '" + Div2Id + "', '" + Img2Id + "')",INTERVAL_SPAN);
	
	//set up next image index
	calculateNextImageIndex();
}


/* runFaderStart & runFaderEnd: contunoiusly fade out imgs, hide, swap, display, and then fade them back in (& call next step/function to run)
 * Arguments:
 *		Div1Id	=	ID attr of the first DIV tag that hides and shows the first IMG tag
 *		Img1Id	=	ID attr of the first IMG tag
 *		Div2Id	=	ID attr of the second DIV tag that hides and shows the second IMG tag
 *		Img2Id	=	ID attr of the second IMG tag
 */
//FADE OUT RUNNER
function runFaderStart( Div1Id, Img1Id, Div2Id, Img2Id ) {
	if( (curImgCtr % 2) == 0 ) {//even
		//setup to use Div1 & Img1
		//fade out Img1
		fadeOut(Img2Id,FADEOUT_SPAN);
	}
	else {//odd
		//setup to use Div2 & Img2
		//fade out Img1
		fadeOut(Img1Id,FADEOUT_SPAN);
	}
	
	//alert("runFaderEnd(): again!");
	//* Call Next Step/Function: set to run end fader
	TimeoutId = setTimeout("runFaderEnd('" + Div1Id + "', '" + Img1Id + "', '" + Div2Id + "', '" + Img2Id + "')",FADEOUT_SPAN);
}
//SWAP SHOW AND FADE IN RUNNER
function runFaderEnd( Div1Id, Img1Id, Div2Id, Img2Id ) {
	if( (curImgCtr % 2) == 0 ) {//even	
		//hide image via div tag
		document.getElementById(Div2Id).style.display = 'none';
		
		//set next Image in Img2
		document.getElementById(Img1Id).src= CURRENT_IMAGE_ARRAY[ curImgNum ].src;
		prevImgStr= CURRENT_IMAGE_ARRAY[ curImgNum ].src; //for randomizer (trying not to display the previous image)
		
		//init opacity for fade in
		setOpacity(Img1Id, 0);
		//show image via setting the div's display style to inline
		document.getElementById(Div1Id).style.display = 'inline';
		
		//fade in Img2
		fadeIn(Img1Id,FADEIN_SPAN);
	}
	else {//odd
		//hide image via div tag
		document.getElementById(Div1Id).style.display = 'none';
		
		//set next Image in Img2
		document.getElementById(Img2Id).src= CURRENT_IMAGE_ARRAY[ curImgNum ].src;
		prevImgStr= CURRENT_IMAGE_ARRAY[ curImgNum ].src; //for randomizer (trying not to display the previous image)
		
		//init opacity for fade in
		setOpacity(Img2Id, 0);
		//show image via setting the div's display style to inline
		document.getElementById(Div2Id).style.display = 'inline';
		
		//fade in Img2
		fadeIn(Img2Id,FADEIN_SPAN);
	}
	
	//alert("runFaderStart(): again!");
	//* Call Next Step/Function: set to run again
	TimeoutId = setTimeout("runFaderStart('" + Div1Id + "', '" + Img1Id + "', '" + Div2Id + "', '" + Img2Id + "')",INTERVAL_SPAN);
	
	
	//set up next image index
	calculateNextImageIndex();
}


/*	stopFader(): stops the fader process that is set to run next from running
 *	Arguments: none
 */
function stopFader() {
	clearTimeout( TimeoutId );
}


/*	fadeIn: Fade image in
 *	Arguments:
 *		elemId	=	Image tags ID value
 *		mSec	=	Fade in transition in milliseconds
 */
function fadeIn( elemId, mSec ) {
	//create speed controllers
	var tmr = 0; //fade time modifier
	var spd = Math.round( mSec / 100 ); //fade speed modifier

	for( var cnt= 0; cnt <= 100; cnt++ ) {
	    setTimeout( "setOpacity('" + elemId + "'," + cnt + ")", ( tmr * spd ) );
	    tmr++;
	}
}


/*	fadeOut: Fade image out
 *	Arguments:
 *		elemId	=	Image tags ID value
 *		mSec	=	Fade out transition in milliseconds
 */
function fadeOut( elemId, mSec ) {
	//create speed controllers
	var tmr = 0; //fade time modifier
	var spd = Math.round( mSec / 100 ); //fade speed modifier

	for( var cnt= 100; cnt >= 0; cnt-- ) {
	    setTimeout( "setOpacity('" + elemId + "'," + cnt + ")", ( tmr * spd ) );
	    tmr++;//increment timer
	}
}


/*	setOpacity: Set the opacity of and image by its ID attr
 *	Browsers supported: IE, FF, Safari, Linux()
 *	Arguments:
 *		elemId       =	Image tags ID value
 *		opacityValue =	Numerical value from 0 to 100 (0 would be completly transparent)
 */
function setOpacity( elemId, opacityValue ) {
    var object= document.getElementById( elemId ).style;
    //CSS3 Standard
    object.opacity = ( opacityValue / 100 );
    //IE
    object.filter = "alpha(opacity=" + opacityValue + ")";
    //FF
    object.MozOpacity = ( opacityValue / 100 );
    //Linux Browser & Safari
    object.KhtmlOpacity = ( opacityValue / 100 );
}