function gallery()
{
	var self = this;
	self.xhr = false;
	self.gallery = false;
	self.inner = false;

	self.image = false;
	self.num_images = 0;

	self.image_image = false;
	self.next = false;
	self.prev = false;
	self.close = false;
	self.counter = false;
	self.filename = false;
	self.caption = false;
	
	self.isGray = false;
	self.gray = false;
	self.opacity_level = 6; 

	self.init = function()
	{
		self.gallery = getById("gallery");

		// quick, display a spinner!
		var spin = create("div");
		spin.style.width = "400px";
		spin.style.height = "200px";
		spin.style.backgroundColor = "#eebbbb";

		var spin_img = create("img");
		spin_img.src = "js/indicator.gif";

		spin.appendChild( spin_img );
		spin.appendChild( _t("Loading...") );
		self.gallery.appendChild( spin );


		self.inner = getById("imageinner");
		self.image = getById("image");

		self.prev = getById("nav_prev");
		self.next = getById("nav_next");
		self.counter = getById("counter");
		self.filename = getById("filename");
		self.caption = getById("caption");

		self.close = getById("close_button");
		self.close.onclick = function() { self.closeImage(); };

		self.image_image = getById("image_image");

		self.gray = getById("gray");
	};

	self.fetch = function( tag )
	{
		self.xhr = createXHR();
		if(self.xhr === false)
			{ return false; }

		self.xhr.onreadystatechange = function()
		{
			if(self.xhr.readyState == 4)
			{
				if(self.xhr.status == 200)
					{ self.showImages( self.xhr.responseXML ); }
				else if( (self.xhr.status==408) || (self.xhr.status==504) )
					{ /* timeout */ }
				else
					{ /* something else bad */ }
			}
		};

		tag = encodeURIComponent( tag );
		var url = "image_gallery_list.php?iGallery="+tag+"&ts="+(new Date()).getTime();
 
		self.xhr.open("GET", url, 1);
		self.xhr.send(null);

	};

	self.showImages = function( imagesXML )
	{
		if(!imagesXML)
			{ return false; }

		var images = imagesXML.getElementsByTagName( 'item' );
		clearAll( self.gallery );

		self.num_images = getFirst(imagesXML, "gallery_item_count");

		var t_a, t_img, t_div, t_span, t_cap;
		var img;
		for(var i=0; i<images.length; i++)
		{
			img = images[i];	

			t_div = create("div");
			t_div.className = "thumbnail";

			t_img = create("img");
			t_img.src = getFirst( img, "thumbnail_URL" );	
	
			t_a = create("a");
			t_a.href="javascript:void(0);";
			t_a.filename = getFirst(img, "filename");
			t_a.caption = getFirst(img, "caption");
			if( !t_a.caption ) { t_a.caption = ''; }
			t_a.URL = getFirst(img, "URL");
			t_a.id = "img_"+i;
			t_a.onclick = function()
			{
				self.showImage( this.id );
			};
	
			t_a.appendChild(t_img);

			t_div.appendChild( t_a );	

			if( t_a.caption.length )
			{
				t_cap = create("p", false, _t(getFirst(img, "caption")));
				t_div.appendChild( t_cap );
			}

			self.gallery.appendChild( t_div );

			if( (i+1)%3 === 0 )
			{
				t_span = create("span");
				t_span.className="row";
				self.gallery.appendChild( t_span );	
			}
		}

	};

	self.closeImage = function()
	{
		self.image.style.display = "none";
		self.toIndicator();
		self.grayOut( false );
	};
	
	// show the item's details
	self.showImage = function( id )
	{
		var t = getById( id );

		var item_url = t.URL;
		self.filename.innerHTML = t.filename;
		self.caption.innerHTML = t.caption;

		if(!item_url)
			{ return; }

		self.counter.innerHTML = (parseInt( id.substring(4), 10 )+1) + " of "+self.num_images;

		if( parseInt( id.substring(4), 10 ) > 0 )
		{
			self.prev.pid = id;
			self.prev.onclick = function() 
			{
				self.toIndicator(); 
				var iid = parseInt( this.pid.substring(4), 10 ) - 1;
				self.showImage( "img_" + iid); 
			};	
		}
		else
		{
			// disable prev button
		}
	
		if( parseInt( id.substring(4), 10 ) < self.num_images-1 )		
		{
			self.next.pid = id;
			self.next.onclick = function()
			{
				self.toIndicator();
				var iid = parseInt( this.pid.substring(4), 10 ) + 1;
				self.showImage( "img_" + iid );
			};	
		}
		else
		{
			// disable next button
		}
	
		self.image.style.display = "block";

		// hack for IE6.  simply changing the src occasionally makes the image disappear.  adding a minor delay fixes it for some reason
		setTimeout( function() { self.image_image.src = item_url; }, 10 );

		self.positionImage();
		self.grayOut( true );
	};

	self.positionImage = function()
	{
		var dims = getInnerDims();
        	var scroll = getScrollPosition();
		var el_size = getElementSize( self.image );

		var x = Math.round( dims.x / 2 ) - ( el_size.x / 2) + scroll.x;
		var y = Math.round( dims.y / 2 ) - ( el_size.y / 2) + scroll.y;
		self.image.style.left = x+'px';
		self.image.style.top = y+'px';

	};

	self.positionGray = function()
	{
        	var scroll = getScrollPosition();
		var dims = getInnerDims();

		self.gray.style.top = scroll.y + 'px';
		self.gray.style.height = dims.y + 'px';
		self.gray.style.width = dims.x + 'px';

	}

	// based on ibox ( http://www.ibegin.com/blog/p_ibox.html )
	self.grayOut = function( bState )
	{
		if( bState===true && self.isGray===true )
			{ return; }

		if( bState===false)
		{
			self.gray.style.display = "none";
			self.isGray = false;
			return;
		}
		
		self.isGray= false;
		self.gray.style.opacity = 0;
		self.gray.style.filter = 'alpha(opacity=0)';

		for (var i=0;i<=self.opacity_level;i++) 
			{ setTimeout('setOpacity('+i+')',70*i); } // from quirksmode.org

		setOpacity = function (value)   
		{
			var gray = getById('gray');
			gray.style.opacity = value/10;
			gray.style.filter = 'alpha(opacity=' + value*10 + ')';

			if (value == self.opacity_level) { self.isGray = true; }
		};

		self.gray.style.display = "";
		self.positionGray();
	};

	self.toIndicator = function()
	{
		self.image_image.src = "js/indicator.gif";
	};

	self.init();	
}

window.onload = function()
{
	var g = new gallery();
	g.fetch( tag );

	window.onscroll = function() { g.positionImage(); g.positionGray(); };
	window.onresize = function() { g.positionImage(); g.positionGray(); };
};