ImgViewer = function()
{
	this.ie = ( /msie/i.test(navigator.userAgent) && !/opera/i.test(navigator.userAgent) );

	this.progress = new Image();
	this.progress.src = 'progress.gif';
//	document.write('<div id="galleryDiv" style="position:absolute;top:0;left:0;width:100%;height:100%;z-index:20;background-image:url(\'blank.gif\');visibility:hidden"></div>');
//	this.mainEl = document.getElementById('galleryDiv');
	this.mainEl = ImgViewer.createElement('div');

	this.mainEl.imgViewer = this;
	this.mainEl.onclick = ImgViewer.imgOnClickHandler;
	var ms = this.mainEl.style;
	
	ms.position = 'absolute';
	ms.top = '0';
	ms.left = '0';
	ms.height = '100%';
	ms.width = '100%';
	ms.zIndex = '20';
	ms.backgroundImage = 'url(img/blank.gif)';
	ms.visibility = 'hidden';
	ms.textAlign = 'center';
	//ms.cursor = 'default';

	this.img = ImgViewer.createElement('img',this.mainEl);
	this.img.style.margin = 'auto 20px auto 20px';
	this.img.style.border = '1px #9f4418 solid';
	this.img.style.cursor = 'pointer';
	this.img.onclick = ImgViewer.imgOnClickHandler;
	this.img.imgViewer = this;
	

	this.imgCreated = false;
	
	// gallery viewer
	this.galEl = ImgViewer.createElement('div');
	this.galEl.imgViewer = this;
	//this.galEl.onclick = ImgViewer.imgOnClickHandler;
	var gs = this.galEl.style;

	gs.position = 'absolute';
	gs.top = '0';
	gs.left = '0';
	gs.height = '100%';
	gs.width = '100%';
	gs.zIndex = '21';
	gs.backgroundImage = 'url(img/blank.gif)';
	gs.visibility = 'hidden';
	gs.textAlign = 'center';
	//gs.cursor = 'default';

	this.imgCreated = false;

	var tbl = ImgViewer.createElement('table',this.galEl);
	tbl.style.width = document.body.clientWidth;
	tbl.style.height = document.body.clientHeight;
	var tb = ImgViewer.createElement('tbody',tbl);
	var tr = ImgViewer.createElement('tr',tb);
	tr.style.height = document.body.clientHeight;
	this.tdL = ImgViewer.createElement('td',tr);
	var tdLs = this.tdL.style;
	tdLs.textAlign = 'right';
	tdLs.verticalAlign = 'middle';
	tdLs.width = (document.body.clientWidth - 620)/2 + 'px';
	tdLs.height = document.body.clientHeight+"px";

	this.prevBtn = ImgViewer.createElement('img', this.tdL);
	var ps = this.prevBtn.style;
	ps.border = '1px #9f4418 solid';
	ps.cursor = 'pointer';
	this.prevBtn.onclick = ImgViewer.navOnClickHandler;
	this.prevBtn.imgViewer = this;

	this.tdM = ImgViewer.createElement('td',tr);
	var tdMs = this.tdM.style;
	tdMs.textAlign = 'center';
	tdMs.verticalAlign = 'middle';
	tdMs.width = '620px';
	tdMs.height = document.body.clientHeight+"px";

	this.galImg = ImgViewer.createElement('img',this.tdM);
	this.galImg.style.margin = 'auto 20px auto 20px';
	this.galImg.style.border = '1px  #9f4418 solid';
	this.galImg.style.cursor = 'pointer';
	this.galImg.onclick = ImgViewer.imgOnClickHandler;
	this.galImg.imgViewer = this;

	this.txtEl = ImgViewer.createElement('div',this.tdM);
	this.txtEl.style.padding = '20px 20px 20px 20px';
	this.txtEl.imgViewer = this;

	this.tdR = ImgViewer.createElement('td',tr);
	var tdRs = this.tdR.style;
	tdRs.textAlign = 'left';
	tdRs.verticalAlign = 'middle';
	tdRs.width = (document.body.clientWidth - 620)/2 + 'px';
	tdRs.height = document.body.clientHeight+"px";

	this.nextBtn = ImgViewer.createElement('img', this.tdR);
	var ns = this.nextBtn.style;
	ns.margin = 'auto auto auto 20px';
	ns.border = '1px #9f4418 solid';
	ns.cursor = 'pointer';
	this.nextBtn.onclick = ImgViewer.navOnClickHandler;
	this.nextBtn.imgViewer = this;

	this.galCreated = false;

	if (this.ie)
	{
		ms.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="black_layer0.png", sizingMethod="scale")';
		gs.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="black_layer0.png", sizingMethod="scale")';
	}
	else
	{
	    ms.backgroundImage = 'url(black_layer0.png)'
	    gs.backgroundImage = 'url(black_layer0.png)'
	}
	
	this.preloadedImg = new Image();
	this.preloadedImg.imgViewer = this;
	this.galImages = new Array();
	this.galThumbs = new Array();
	this.galInfos = new Array();
}

ImgViewer.prototype.showImage = function(idx)
{
	if (!this.imgCreated)
	{
	    document.body.appendChild(this.mainEl);
	}
	this.reposition();
	this.mainEl.style.visibility = 'visible';
	this.preloadedImg.src = idx;
	this.preloadedImg.onload = ImgViewer.imgOnLoadHandler;
	this.img.src = 'progress.gif';
	this.img.style.marginTop = ((document.body.clientHeight - this.img.height)/2) + 'px';
	this.img.style.visibility = 'visible';
	this.img.style.borderWidth = '0px';
	if (this.preloadedImg.complete) {
		this.img.src = this.preloadedImg.src;
		this.img.style.marginTop = ((document.body.clientHeight - this.img.height)/2) + 'px';
		this.img.style.borderWidth = '1px';
	}
}

ImgViewer.prototype.addGalImage = function(thumb, img, info)
{
	var i = this.galImages.length;
	this.galThumbs[i] = thumb;
	this.galImages[i] = img;
	this.galInfos[i] = (typeof info != 'undefined')?info:'';

}

ImgViewer.prototype.reposition = function()
{
	var top = '0px';
	var w = '0px';
	var h = '0px';
	if (document.body.scrollTop)
	{
		top = document.body.scrollTop + 'px';
		w = document.body.clientWidth;
		h = document.body.clientHeight;
	}
	else
	{
		top = document.documentElement.scrollTop + 'px';
		w = document.documentElement.clientWidth;
		h = document.documentElement.clientHeight;
	}
	this.mainEl.style.top = top;
	this.galEl.style.top = top;

	
	this.tdL.style.width = (w - 620)/2 + 'px';
	this.tdL.style.height = h + 'px';

	this.tdM.style.height = h + 'px';

	this.tdR.style.width = (w - 620)/2 + 'px';
	this.tdR.style.height = h + 'px';
}

ImgViewer.prototype.showGalImage = function(idx)
{
	this.reposition();
	if (!this.galCreated)
	{
	    document.body.appendChild(this.galEl);
	}

	if (idx > 0)
	{
	    this.prevBtn.src = this.galThumbs[idx-1];
		this.prevBtn.imgIdx = idx-1;
		this.prevBtn.style.visibility = 'visible';
	}
	else
	{
	    this.prevBtn.style.visibility = 'hidden';
		this.prevBtn.imgIdx = -1;
	}

	if (idx+1 < this.galImages.length)
	{
	    this.nextBtn.src = this.galThumbs[idx+1];
		this.nextBtn.imgIdx = idx+1;
	this.nextBtn.style.visibility = 'visible';
	}
	else
	{
	    this.nextBtn.style.visibility = 'hidden';
		this.nextBtn.imgIdx = -1;
	}
	this.txtEl.innerHTML = this.galInfos[idx];
	this.preloadedImg.src = this.galImages[idx];
	this.galEl.style.visibility = 'visible';
	if (this.preloadedImg.complete) {
		this.galImg.src = this.preloadedImg.src;
		this.galImg.style.borderWidth = '1px';
	} else {
		this.preloadedImg.onload = ImgViewer.galImgOnLoadHandler;
		this.galImg.src = 'progress.gif';
		this.galImg.style.borderWidth = '0px';
	}
}

ImgViewer.navOnClickHandler = function()
{
	if (this.imgIdx < 0)
	{
	    return;
	}
	this.imgViewer.showGalImage(this.imgIdx);
}

ImgViewer.imgOnClickHandler = function()
{
	this.imgViewer.mainEl.style.visibility = 'hidden';
	this.imgViewer.galEl.style.visibility = 'hidden';
	this.imgViewer.img.style.visibility = 'hidden';
	this.imgViewer.img.src = '';
	this.imgViewer.prevBtn.style.visibility = 'hidden';
	this.imgViewer.nextBtn.style.visibility = 'hidden';
}

ImgViewer.imgOnLoadHandler = function()
{
	this.imgViewer.img.src = this.imgViewer.preloadedImg.src;
	this.imgViewer.img.style.marginTop = ((document.body.clientHeight - this.imgViewer.img.height)/2) + 'px';
	this.imgViewer.img.style.borderWidth = '1px';
}

ImgViewer.galImgOnLoadHandler = function()
{
	var iv = this.imgViewer;
	iv.galImg.src = iv.preloadedImg.src;
	iv.galImg.style.borderWidth = '1px';
}

ImgViewer.createElement = function(type, parent) {
	var el = null;
	if (document.createElementNS) {
		// use the XHTML namespace; IE won't normally get here unless
		// _they_ "fix" the DOM2 implementation.
		el = document.createElementNS("http://www.w3.org/1999/xhtml", type);
	} else {
		el = document.createElement(type);
	}
	if (typeof parent != "undefined") {
		parent.appendChild(el);
	}
	return el;
}