var _dropinslideshowcount=0;

function dropinslideshow(imgarray, w, h, delay) {

	if ( typeof(_dropinslideshow_prototype_called) == 'undefined') {
		_dropinslideshow_prototype_called = true;
		dropinslideshow.prototype.createcontainer = createcontainer;
		dropinslideshow.prototype.populateh = populateh;
		dropinslideshow.prototype.animateslide = animateslide;
		dropinslideshow.prototype.setupnextslide = setupnextslide;
		dropinslideshow.prototype.rotateslide = rotateslide;
		dropinslideshow.prototype.init = init;
	}

	this.createcontainer(parseInt(w), parseInt(h));
	this.delay=delay;
	this.imgarray=imgarray;
	var preloadimages=[];
	for (var i=0; i<imgarray.length; i++) {
		preloadimages[i]=new Image();
		preloadimages[i].src=imgarray[i][0];
	}
	this.animatestartpos=parseInt(h)*(-1); //Starting "top" position of an image before it drops in
	this.slidedegree=10; //Slide degree (> is faster)
	this.slidedelay=30; //Delay between slide animation (< is faster)
	this.activecanvasindex=0; //Current "active" canvas- Two canvas DIVs in total
	this.curimageindex=0;
	this.zindex=5;
	this.isMouseover=0;
	this.init();

	function createcontainer(w, h) {
		var tmp = '<div id="_dropslide" style="position:relative; width:'+w+'px; height:'+h+'px; overflow:hidden">';
		tmp += '<div style="position:absolute; width:'+w+'px; height:'+h+'px; top:0;"></div>';
		tmp += '<div style="position:absolute; width:'+w+'px; height:'+h+'px; top:-'+h+'px;"></div>';
		tmp += '</div>';
		document.write(tmp);
		var slideshowref=document.getElementById("_dropslide");
		slideshowref.onmouseover=function(){dropinslideshow.isMouseover=1};
		slideshowref.onmouseout=function(){dropinslideshow.isMouseover=0};
		this.canvases=[];
		this.canvases[0] = slideshowref.childNodes[0];
		this.canvases[1] = slideshowref.childNodes[1];
	}

	function populateh(holder, imageindex) {
		//var tmp = '<img src="'+this.imgarray[imageindex][0]+'" alt="'+this.imgarray[imageindex][1]+'" />';
		var newImage = document.createElement("img");
		newImage.src = this.imgarray[imageindex][0];
		newImage.alt = this.imgarray[imageindex][1];
		holder.innerHTML = '';
		holder.appendChild(newImage);
	}

	function animateslide() {
		if (this.curimagepos<0) {
			this.curimagepos=this.curimagepos+this.slidedegree;
			this.activecanvas.style.top=this.curimagepos+"px";
		} else {
			clearInterval(this.animatetimer);
			this.activecanvas.style.top=0;
			this.setupnextslide();
			setTimeout(function(){dropinslideshow.rotateslide()}, this.delay);
		}
	}

	function setupnextslide() {
		this.activecanvasindex=(this.activecanvasindex==0)? 1 : 0;
		this.activecanvas=this.canvases[this.activecanvasindex];
		this.activecanvas.style.top=this.animatestartpos+"px";
		this.curimagepos=this.animatestartpos;
		this.activecanvas.style.zIndex=(++this.zindex);
		this.curimageindex=(this.curimageindex<this.imgarray.length-1)? this.curimageindex+1 : 0;
		this.populateh(this.activecanvas, this.curimageindex);
	}

	function rotateslide() {
		if (this.isMouseover)
			setTimeout(function(){dropinslideshow.rotateslide()}, 50);
		else
			this.animatetimer=setInterval(function(){dropinslideshow.animateslide()}, this.slidedelay);
	}

	function init() {
		this.populateh(this.canvases[this.activecanvasindex], 0);
		this.setupnextslide();
		setTimeout(function(){dropinslideshow.rotateslide()}, this.delay);
	}

}