IE4 = (document.all) ? 1 : 0;

if (typeof window.register_onload == 'undefined') {
	window.multi_onload = function() {
		for (var i=0; i<window.onloads.length; i++) {
			var loader = window.onloads[i];
			loader();
		}
	}
	window.register_onload = function(handler) {
		if (!window.onloads) window.onloads = new Array();
		if (handler==window.multi_onload) return;
		
		window.onloads[window.onloads.length] = handler;
		window.onload = multi_onload;
	}
}

PhotoViewer.prototype.click_dot = function() {
	var pv = this.owner;
	pv.set_active_image(this);
}
PhotoViewer.prototype.click_next = function() {
	var pv = this.owner;
	var newindex = (pv.activeindex<pv.dots.length-1) ? pv.activeindex+1 : 0;
	pv.set_active_image(pv.dots[newindex]);
}
PhotoViewer.prototype.click_prev = function() {
	var pv = this.owner;
	var newindex = (pv.activeindex>0) ? pv.activeindex-1 : pv.dots.length-1;
	pv.set_active_image(pv.dots[newindex]);
}


PhotoViewer.prototype.build_container = function() {

	//this.container.style.position = 'relative';
	
	var dotwidth = 18;
	var dotheight = 22;
	var nextprevwidth = 60;
	var nextprevtoppad = 0;
	
	this.dotbox = document.createElement('div');
	this.dotbox.style.width = (dotwidth * this.images.length + nextprevwidth*2) + 'px';
	this.dotbox.style.height = (dotheight+0)+'px';
	this.dotbox.style.backgroundColor = this.backgroundcolor;
	this.dotbox.style.border = '1px solid '+this.bordercolor;
	this.dotbox.style.textAlign = 'left';
	this.dotbox.style.overflow = 'hidden';
	this.dotbox.style.MozUserSelect = 'none';
	this.dotbox.onselectstart = function() { return false; }
	
	
	var goprev = document.createElement('div');
	goprev.onmouseup = this.click_prev;
	goprev.style.width = nextprevwidth + 'px';
	goprev.style.height = dotheight+'px';
	goprev.style.position = 'relative';
	goprev.style.left = '0px';
	goprev.style.top = '0px';
	goprev.style.paddingTop = nextprevtoppad+'px';
	goprev.style.textAlign = 'center';
	goprev.innerHTML = '<img align="absmiddle" src="/themes/images/photo-prev.gif" alt="" /> Prev';
	goprev.style.cursor = 'pointer';
	goprev.owner = this;
	this.dotbox.appendChild(goprev);	
	
	this.dots = new Array();
	
	for (i=0; i<this.images.length; i++) {
		var dot = document.createElement('img');
		dot.src = '/themes/images/photo-dot-off.gif';
		dot.onmouseup = this.click_dot;
		dot.imgurl = this.images[i];
		dot.owner = this;
		dot.dotindex = i;
		dot.style.position = 'relative';
		dot.style.height = dotheight+'px';
		dot.style.width = dotwidth+'px';
		dot.style.left = nextprevwidth+'px';
		dot.style.top = '-'+(dotheight+nextprevtoppad)+'px';
		dot.style.cursor = 'pointer';
		this.dots[i] = dot;
		this.dotbox.appendChild(dot);
	}
	
	var gonext = document.createElement('div');
	gonext.onmouseup = this.click_next;
	gonext.innerHTML = 'Next <img align="absmiddle" src="/themes/images/photo-next.gif" alt="" />';
	gonext.style.width = nextprevwidth + 'px';
	gonext.style.height = dotheight+'px';
	gonext.style.position = 'relative';
	gonext.style.left = nextprevwidth+(dotwidth*this.images.length)+'px';
	gonext.style.top = '-'+(dotheight*2+nextprevtoppad)+'px';
	gonext.style.paddingTop = nextprevtoppad+'px';
	gonext.style.textAlign = 'center';
	gonext.style.cursor = 'pointer';
	gonext.owner = this;
	this.dotbox.appendChild(gonext);
		
	this.container.appendChild(this.dotbox);

	/*
	// scrap this later when we've turned off borders on the divs
	var debugremoveborders = 0;// IE4 ? 2 : 6;

	
	var containerwidth = ( this.visibleimages * (this.imagewidth+this.imagespacing) + this.imagespacing + (this.scrolltabwidth*2) );
	var displayheight = this.imageheight + (this.imagespacing*2);
	
	this.container.style.width = containerwidth + 'px';
	this.container.style.height = ( displayheight + this.instructionsheight ) + 'px';
	//this.container.style.backgroundColor = 'red';
	this.container.style.overflow = 'hidden';
	//this.container.style.position = 'relative';
	//this.container.style.border = '1px solid '+this.bordercolor;
	
	this.scrollleft = document.createElement('div');
	this.scrollleft.style.width = this.scrolltabwidth + 'px';
	this.scrollleft.style.height = displayheight + 'px';
	this.scrollleft.style.backgroundImage = 'url(/themes/images/scroller-left.gif)';
	this.setfloat(this.scrollleft,'left');
	this.scrollleft.onclick = this.scroll_images_left;
	this.container.appendChild(this.scrollleft);
	
	this.imagewindow = document.createElement('div');
	this.imagewindow.style.position = 'relative';
	this.imagewindow.style.width = ( containerwidth - (this.scrolltabwidth*2) - debugremoveborders ) + 'px';
	this.imagewindow.style.height =  displayheight + 'px';
	this.imagewindow.style.backgroundColor = this.backgroundcolor;
	this.imagewindow.style.overflow = 'hidden';

	//this.imagewindow.style.border = '1px solid red';
	this.setfloat(this.imagewindow,'left');
	this.container.appendChild(this.imagewindow);

	this.scrollright = document.createElement('div');
	this.scrollright.style.width = this.scrolltabwidth + 'px';
	this.scrollright.style.height =  displayheight + 'px';
	this.scrollright.style.backgroundImage = 'url(/themes/images/scroller-right.gif)';
	this.setfloat(this.scrollright,'left');
	this.scrollright.onclick = this.scroll_images_right;
	this.container.appendChild(this.scrollright);
	
	
	this.instructions = document.createElement('div');
	this.instructions.style.height = this.instructionsheight + 'px';
	this.instructions.style.clear = 'both';
	this.instructions.style.paddingTop = '5px';
	this.instructions.style.width = '100%';
	this.instructions.style.fontFamily = 'Tahoma';
	this.instructions.style.fontSize = '10px';
	this.instructions.style.color = '#888888';
	this.instructions.style.textAlign = 'center';
	this.instructions.innerHTML = "Use the arrows to view all available images. Click any image for larger view.";
	this.container.appendChild(this.instructions);
	
	this.platform = document.createElement('div');
	this.platform.style.height =  displayheight + 'px';
	this.platform.style.width = ( this.images.length * (this.imagewidth+this.imagespacing) + this.imagespacing ) + 'px';
	this.imagewindow.appendChild(this.platform);
	
	this.add_images();
	
	if (this.usezoom) {
		var containerpos = this.layer_get_pos(this.container);

		//this.zoomimage = document.createElement('img');
		this.zoomimage = new Image(this.imagewidth,this.imageheight);
		this.zoomimage.style.position = 'absolute';
//		this.zoomimage.style.top = (this.container.offsetTop + this.imagespacing) + 'px';
//		this.zoomimage.style.left = this.container.offsetLeft + ( this.imagespacing*2 + 3 + Math.floor(this.visibleimages / 2) * (this.imagewidth+this.imagespacing) ) + 'px'

		this.calculate_zoom_image_position();

		//this.zoomimage.src = 'http://cam.lan.blitzaffe.com/testpattern.png';
		this.zoomimage.style.border = '1px solid '+this.activebordercolor;
				
		//this.zoomimage.style.backgroundColor = 'red';
		this.zoomimage.onclick = this.set_active_image;
		
		var containerparent = this.container.parentNode;
		containerparent.insertBefore(this.zoomimage,this.container.nextSibling);	
	}
	
	this.zoom_center(true);
	*/
	
	this.set_active_image(this.dots[0]);
}

PhotoViewer.prototype.resize_image_viewer = function(e) {
	//alert(window.pviewer.display_image.offsetWidth+'x'+window.pviewer.display_image.offsetHeight);
	//alert(window.pviewer.container.style.height);
	window.pviewer.display.style.height = window.pviewer.display_image.offsetHeight+'px';
}

PhotoViewer.prototype.set_active_image = function(dot) {
	
	for (var i=0; i<this.dots.length; i++) {
		var ison = (i==dot.dotindex) ? 'on' : 'off';
		this.dots[i].src = '/themes/images/photo-dot-'+ison+'.gif';
	}
	
	// IE4 can't dynamically resize images when image.src is changed, so we have
	// to remove and re-add the image element
	if (IE4) {
		window.pviewer.display_image = new Image();
		window.pviewer.display_image.style.display = 'none';
		window.pviewer.display_image.onload = window.pviewer.resize_image_viewer;
		window.pviewer.display.appendChild(window.pviewer.display_image);
	}
	
	window.pviewer.display_image.src = dot.imgurl;
	window.pviewer.display_image.style.display = '';

	if (IE4) {
		var oldnode = window.pviewer.display.childNodes[0];
		window.pviewer.display.removeChild(oldnode);
	}
	
	this.activeindex = dot.dotindex;
	
//	window.pviewer.imagejustchanged = true;
	
}

function PhotoViewer(viewerelementid,displayelementid,imagenames) {
	window.pviewer = this;

	this.bordercolor = '#A0A0A0';
	this.backgroundcolor = 'white';

	this.container = document.getElementById(viewerelementid);
	this.images = imagenames;
	
	this.display = document.getElementById(displayelementid);
	this.display_image = new Image();
	this.display_image.style.display = 'none';
	this.display_image.onload = window.pviewer.resize_image_viewer;
	this.display.appendChild(window.pviewer.display_image);
	
	this.build_container();

//	window.onresize = this.startresize;
}