var strImgLoc = "/lib/images/";
var imgLoader = new Image();
var pl = 0;

imgLoader.src = strImgLoc+"preloader.gif";

objImage = new Image();
arrImages = new Array();

arrImages[0] = strImgLoc + "gal_sh_top.png";
arrImages[1] = strImgLoc + "gal_sh_bot.png";
arrImages[2] = strImgLoc + "gal_sh_bg.png";
arrImages[3] = strImgLoc + "gal_close_bt.png";
arrImages[4] = strImgLoc + "video_bg.png";
arrImages[5] = strImgLoc + "ie_vid_bg.gif"

for(intImg=0; intImg<=5; intImg++)
{
	objImage.src=arrImages[intImg];
}

var intImageCount = 0;

/**
 * Swap Image
 * This method loads the passed image in the main gallery image area
 * and applies some styling and positioning once loaded
 */
function swapImage(strLink, intNum)
{
	var objPlaceHolder = document.getElementById('placeHolder');

	while (objPlaceHolder.firstChild)
	{
		objPlaceHolder.removeChild(objPlaceHolder.firstChild);
	}

	var objImage = new Image();

	objImage.onload = function()
	{
		var intWidth  = objImage.width;
		var intHeight = objImage.height;

		decPadding = (440-intHeight)/2;

		objImage.id						= "curimage";
		objImage.style.display			= "none";

		var objBlanker = document.createElement("div");

		objBlanker.style.width		= "100%";
		objBlanker.style.margin		= "0 auto";
		objBlanker.style.background	= "#ffffff";

		objPlaceHolder.appendChild(objBlanker);
		objBlanker.appendChild(objImage);

		$("#curimage").fadeIn();
	}

	objImage.src=strLink.href;
	document.getElementById('imageno').innerHTML="Showing "+intNum+" of "+intImageCount;
}

/**
 * Build the gallery
 * This method adds the thumbnails with class noShow to the bottom
 * section of the gallery popup
 *
 * @param String strLink
 * @param String strImageURL
 */
function buildGallery(strLink, strImageURL)
{
	var objGalleryThumb = document.createElement('div');
	var objThumbImg		= document.createElement('img');

	objThumbImg.src=strImageURL;

	objGalleryThumb.setAttribute("title","image "+(intImageCount+1));
	objGalleryThumb.className = "galthumb";

	objGalleryThumb.onmouseover = function()
	{
		this.className = this.className.replace("galthumb","galthumb_ov");
	}

	objGalleryThumb.onmouseout = function()
	{
		this.className = this.className.replace("galthumb_ov","galthumb");
	}

	objGalleryThumb.onclick = function()
	{
		swapImage(strLink,this.title);
	}

	objGalleryThumb.appendChild(objThumbImg);

	document.getElementById('thumbHolder').appendChild(objGalleryThumb);
}


/**
 * Generic page function
 */
$(function()
{
	strHtml = 	'<div id="shadow">'+
				'<div id="galleryContainer">'+
				'<div id="galleryTop">'+
				'<a href="#" id="galleryClose" title="close" alt="close">close</a>'+
				'</div>'+
				'<div id="galleryArea">'+
				'<div id="placeHolder"></div>'+
				'<div id="thumbHolder"><p id="imageno"></p></div>'+
				'</div>'+
				'<div id="galleryBase"></div>'+
				'</div>'+
	 			'</div>';

	$("#container").append(strHtml);

	document.getElementById('galleryClose').onclick=function()
	{
		document.getElementById('galleryContainer').style.display="none";
	}

	var intImageNum = document.getElementById('imageno');
	var arrLinks 	= document.getElementById('container').getElementsByTagName("a");

	for (var i=0; i<arrLinks.length; i++)
	{
		if(arrLinks[i].className =="gallery")
		{
			arrLinks[i].onclick = function()
			{
				if($("#videoContainer"))
				{
					$("#videoContainer").remove();
				}

				document.getElementById('galleryContainer').style.display="block";

				swapImage(this,this.title);

				return false;
			};


			// if the class of the parent element (the Div) is 'noShow'
			// then build the gallery thumb for this icon
			// this basically just ignores the first Gallery icon which has a class of 'galleryThumbs'
			if (arrLinks[i].parentNode.className == 'noShow')
			{
				buildGallery(arrLinks[i], arrLinks[i].childNodes[0].src);
				intImageCount++;
			}
		}

		if(arrLinks[i].className =="video")
		{
			arrLinks[i].onclick = function()
			{
				loadVideo(this.href);
				return false;
			}
		}

		if(arrLinks[i].className =="rotator")
		{
			arrLinks[i].onclick = function()
			{
				loadRotator(this.href);
				return false;
			}
		}
	}

	//Check if we need another row
	if(intImageCount > 8)
	{
		document.getElementById('thumbHolder').style.height = 190 + "px";
	}

	//listen for keypress and close on escape
	document.onkeydown = function(e)
	{
        if (e == null)
        { // ie
          keycode = event.keyCode;
        }
        else
        { // mozilla
          keycode = e.which;
        }

		// keycode 27 = Esc
        if(keycode == 27)
        {
			var tehGallery 	= document.getElementById('galleryContainer');

	        if(tehGallery)
	        {
	        	tehGallery.style.display="none";
	        }

			if($("#videoContainer"))
			{
				$("#videoContainer").remove();
			}

			if($("#rotatorContainer"))
			{
				$("#rotatorContainer").remove();
			}
        }
	}
});


/**
 * This checks the url for a trigger to trigger a gallery on page load
 * Initially to force the Video playblack to run automatically
 * when coming linking from a targetted eblast
 */
$(function()
{
	var strEburl = new String(document.location); 
		if(strEburl.match(/playvid/))//Initial function tests for 'playvid' to trigger the video playback
		{
			var strQfc = strEburl.match(/\d+/);
			var strVideo = 'http://video.ebuyer.com/'+strQfc;
			loadVideo(strVideo);
		}
});