////////////////////////////////////////////////////////////////////////////////
// BEGIN
//

	var winW = 630, winH = 460;

	// Window Size
	if( parseInt( navigator.appVersion ) > 3 )
	{
		if( navigator.appName == "Netscape" )
		{
			winW = window.innerWidth;
			winH = window.innerHeight;
		}
		if( navigator.appName.indexOf( "Microsoft" ) != -1 )
		{
			winW = document.body.offsetWidth;
			winH = document.body.offsetHeight;
		}
	}
	// -- Gallery --------------------------------------------------------------
	function showCanvas()
	{
		var canvas = document.createElement( "div" );
			canvas.id = "canvas";
			canvas.className = "canvas";
			//canvas.onclick = function() { hideCanvas(); }
			
		document.body.appendChild( canvas );
		//"showImage( 'images/gallery/<? echo $gallery['id']; ?>/<? echo $images[$i+$c]['id']; ?>.jpg', <? echo $images[$i+$c]['id']; ?> );
	}
	function hideCanvas()
	{
		var canvasElem = document.getElementById( "canvas" );
		document.body.removeChild( canvasElem );
	}
	function showImage( path, id )
	{
		// Canvas
		showCanvas();
		
		// Create Image
		var today = new Date();
		var time = today.getSeconds();
		var image = document.createElement( "img" );
			image.src = path + "?" + time.valueOf();
			image.onload = function()
			{				
				// Create container
				var container = document.createElement( "div" );
					container.id = "container";
					container.className = "posABS";
					container.style.backgroundColor = "#000000";
					
					// Position
					container.style.top = (winH - this.height) / 2;
					container.style.left = (winW - this.width) / 2;
					container.style.zIndex = "5";
					container.style.height = (this.height + 90) + "px";
					container.style.width = this.width + "px";
					container.style.padding = "2px";
				
				// Create NAME & DESCRIPTION
				var titleText = document.getElementById( "name_" + id ).value;
				var title = document.createElement( "div" );
					title.id = "title";
					title.className = "galleryText";
					title.innerHTML = titleText;
					
				var descText = document.getElementById( "desc_" + id ).value;
				var desc = document.createElement( "div" );
					desc.id = "desc";
					desc.className = "galleryText";
					desc.style.height = "50px";
					desc.innerHTML = descText;
					
				// Close Button
				var closeBtn = document.createElement( "div" );
					closeBtn.id = "closeBtn";
					closeBtn.className = "closeBtn";
					closeBtn.innerHTML = "X";
					closeBtn.onclick = function() { hideImage(); }
				
				// Append
				container.appendChild( this );
				container.appendChild( title );
				container.appendChild( desc );
				container.appendChild( closeBtn );
				document.body.appendChild( container );
			}
	}
	function hideImage()
	{
		// Hide Image
		var containerElem = document.getElementById( "container" );
		document.body.removeChild( containerElem );
		
		// Remove Canvas
		hideCanvas();
	}
	// ------------------------------------------------------------------------

//
// END
////////////////////////////////////////////////////////////////////////////////