//borrowed functions from my library
function createEvent(evt,target,handler) {
if(this.createEvent.arguments.length!=3) {return false;}
  try {if(window.addEventListener){target.addEventListener(evt, handler, false);} else {target.attachEvent('on'+evt,handler);}} catch(e) 
  {if(document.all) {this.jalert("Cannot create event '"+evt+"':"+e.number+":"+e.description);} else {this.jalert("Cannot create event '"+evt+"'\n"+e);}}
}
//end of borrowed functions

//setTimeout("alert('hello')",1250);

//createEvent('load',window,initialize); //i prefer to use this rather than disturb any other script that may be using onload event

createEvent('load',window,waitandload);



var images=new Array();  //images array
var icache=new Array();  //images cache
var slide_pos=-1; //variable for keeping the current position
var links; //will later hold array for the navigation links

/* This function delays the image sildeshow start */
function waitandload()
{
	setTimeout(initialize,6000);
}

function initialize() {
//we want to read the images specified in the config into a  1 x 3 dimensional array
try {

	
for(key in slide_config.imageList[0]) {images[images.length]=slide_config.imageList[0][key].split("|");}

//let's check if the right #ids are in the html document
if(!document.getElementById(slide_config.title)) {alert("'"+slide_config.title+"' is missing.");return;}
if(!document.getElementById(slide_config.image)) {alert("'"+slide_config.image+"' is missing.");return;}
if(!document.getElementById(slide_config.navigator)) {alert("'"+slide_config.navigator+"' is missing.");return;}
//i almost forgot to check  if the config contain any image
if(images.length==0) {alert("There is no image in the config!");return;}
//now that there is at least an image present, let's just try to cache the images to make them load faster
for(i=0;i<images.length;i++) {
icache[i]=new Image();
icache[i].src=slide_config.imageFolder+images[i][0];
}


//so far so good. so let's find the navigation links in the slideshow
links=document.getElementById(slide_config.navigator).getElementsByTagName("A");
if(links.length!=3) {alert("Ehm, i was told to expect 3 links - i quit!");return;}
//time to create handlers for the links
links[0].onclick=function() {doaction("prev");}  //previous link
links[1].onclick=function() {doaction("play");}  //play/pause link
links[2].onclick=function() {doaction("next");}  //next link

//so far, we have encountered no issues, so lets go!
doaction("start");  //this will kick off the match.

} catch(err) {
alert("There is an error in your slideshow configuration!\n" + err.description); return;
}
return;
}

function doaction(action) {
switch(action) {
case "start":
//alert("Start Offf");  //will run only once
//since this will run only once, let's make best use of it
with(document.getElementById(slide_config.image)) {  //selects the slide image
//apply the configurational settings for image dimensions
//style.width=slide_config.imageWidth+"px";  
//style.height=slide_config.imageHeight+"px";

style.width = "282px";
style.height = "225px";
}
//let's  check the autoplay options
if(slide_config.autoplay) {
links[1].innerHTML="Pause";
} else {
links[1].innerHTML="Play";
}

//it is time to start showing images. Let's simulate the click next event
slide_pos = 0;
fade_query();
renderImage();
break;

case "next":
//alert("Move next");
slide_pos = slide_pos+1 <icache.length ? slide_pos+1 : 0;
renderImage();
break;

break;
case "prev":
slide_pos = slide_pos-1 < 0 ? icache.length-1 : slide_pos-1;
renderImage();
break;
case "play":
//alert("play/Pause");
//tweak config
with(links[1]) {
 if(innerHTML=="Play") {
 innerHTML="Pause";
 this.slide_config.autoplay=true;
 return doaction('next');
 } else {
 innerHTML="Play";
 this.slide_config.autoplay=false;
 }
}

break;
}
return;
}

function renderImage() {fade('out');}

var auto_timer;
function fade_query() {

//switch image
document.getElementById(slide_config.title).innerHTML=images[slide_pos][1];
with(document.getElementById(slide_config.image)) {
src=icache[slide_pos].src;
parentNode.href=images[slide_pos][2]; //setup the external website
}

if(last_fade=='out') {fade("in");}
else {
 if(slide_config.autoplay) {
   clearInterval(auto_timer);
   auto_timer=setTimeout("doaction('next');",slide_config.speed);
  }
}

}

var init_fade=false; var last_fade='in';
function fade(type) {
	last_fade=type;
	if (type=="out"&&init_fade!=false){init_fade=true;
		fadet(0,0);
	} else {
		fadet(1,0);
	}
if(!init_fade) {
 init_fade=true;
 last_fade="in";
}
	
}

var fade_busy;
var fade_timer;
function fadet(t, n) {
if(fade_busy) {clearTimeout(fade_timer)}  //to avoid blinking effect
var image=document.getElementById(slide_config.image); 
//var title=document.getElementById(slide_config.title);
if(t==1) {
	with(image) {
		style.opacity = (.1*n);
		style.filter = 'alpha(opacity = '+(10*n)+')';
		style.color = "rgb(" + (250-25*n) + ", " + (250-25*n) + ", " + (250-25*n) + ")";
	}
/*	with(title) {
		style.opacity = (.1*n);
		style.filter = 'alpha(opacity = '+(10*n)+')';
		style.color = "rgb(" + (250-25*n) + ", " + (250-25*n) + ", " + (250-25*n) + ")";
	}*/
	} else {
	  with(image) {
		style.opacity = (1-.1*n);
		style.filter = 'alpha(opacity = '+(100-10*n)+')';
		style.color = "rgb(" + (25*n) + ", " + (25*n) + ", " + (25*n) + ")";
	  }
/*	  with(title) {
		style.opacity = (1-.1*n);
		style.filter = 'alpha(opacity = '+(100-10*n)+')';
		style.color = "rgb(" + (25*n) + ", " + (25*n) + ", " + (25*n) + ")";
	  }*/
	}
	if(n<10) {
		fade_busy=true; //setup flag
		fade_timer=setTimeout("fadet("+t+", "+(n+1)+")", 100);
	} else {fade_busy=false;fade_query();}
}