var div, ImageCont, TextCont,ImageConts,TextConts,
ImageOpen = "<div class=\"cProductImages\">",
TextOpen = "<div class=\"cProductNames\">",
ImageClose = "</div>",TextClose = "</div>",
ImageTemplate = "<div class=\"cProductImage\"><a href=\"[namelink]-[type]-[id].aspx\"><img src=\"[image]\" alt=\"[name]\" height=\"83\" width=\"83\" /></a></div>",
TextTemplate = "<div class=\"cProductName\"><a href=\"[namelink]-[type]-[id].aspx\">[name]</a></div>",
count = 1000, 
countinrow = 5;
page = 1,
cnDis=false,cpDis=false;

/**
	The following methods were modified by langley as the paging requirement
**/

function GenerateImageLink(type, cp, i)
{
	return ImageTemplate
			.replace(/\[id\]/g, cp[i][0])
			.replace(/\[type\]/g, (type == "productLink" ? "product" : "Clearance-Item"))			
			.replace(/\[image\]/g, cp[i][1])
			.replace(/\[name\]/g, cp[i][2])
			.replace(/\[namelink\]/g, cp[i][2].replace(/\s/g, "-"));
}

function GenerateTextLink(type, cp, i)
{
	return TextTemplate
			.replace(/\[id\]/g, cp[i][0])
			.replace(/\[type\]/g, (type == "productLink" ? "product" : "Clearance-Item"))
			.replace(/\[image\]/g, cp[i][1])
			.replace(/\[name\]/g, cp[i][2])
			.replace(/\[namelink\]/g, cp[i][2].replace(/\s/g, "-"));
}

/** I'm done! **/

PopulateClearance = function(type) {
    //alert(cp);
	div = document.getElementById("InStockItems");
	
	if (cp == null || cp.length < 1 || div == null)
		return false;
	
	ImageCont="";
	ImageConts="";
	TextCont="";
	TextConts="";
	productCont="";
	
	for (var i = 0; i < cp.length && i < count ; i++)
	{
		
		ImageCont = GenerateImageLink(type, cp, i);
		 // ImageTemplate.replace(/\[id\]/, cp[i][0]).replace(/\[type\]/g, pageType).replace(/\[image\]/, cp[i][1]).replace(/\[name\]/, cp[i][2]).replace(/\[namelink\]/g, cp[i][2].replace(/\s/g, "-"));
		TextCont = GenerateTextLink(type, cp, i);
		 //TextTemplate.replace(/\[id\]/, cp[i][0]).replace(/\[image\]/, cp[i][1]).replace(/\[name\]/, cp[i][2]).replace(/\[namelink\]/g, cp[i][2].replace(/\s/g, "-"));
		
		ImageConts += ImageCont;
		TextConts  += TextCont;
		var j =i + 1;
	
			if(j % countinrow == 0)
			{
					
				div.innerHTML += ImageOpen + ImageConts + ImageClose + TextOpen + TextConts + TextClose;
				ImageConts="";
				TextConts="";
			}
			else if(j== cp.length)
			{
				div.innerHTML += ImageOpen + ImageConts + ImageClose + TextOpen + TextConts + TextClose;
			}
		
	}
	
	CheckCButtons();
	return true;
}

CheckCButtons = function()
{
	var next = document.getElementById("cNext").childNodes[0],
		prev = document.getElementById("cPrev").childNodes[0];
	
	if (cp.length <= count)
	{
		next.src="images/btn_next_dis.gif";
		prev.src="images/btn_prev_dis.gif";
		cnDis=true;
		cpDis=true;
	}
	
	if (page == 1)
	{
		prev.src="images/btn_prev_dis.gif";
		next.src="images/btn_next.gif";
		cpDis=true;
		cnDis=false;
	}
	
	if (page > 1)
	{
		prev.src="images/btn_previous.gif";
		cpDis=false;
	}
	if ((page*count) >= cp.length)
	{
		next.src="images/btn_next_dis.gif";
		cnDis=true
	}
	else
	{
		next.src="images/btn_next.gif";
		cnDis=false;
	}
}


NextClearance = function(type){
	if (cp == null || cp.length < 1 || page*count > cp.length || div == null)
		return false;
		
	page++;
	ImageCont="";
	ImageConts="";
	TextCont="";
	TextConts="";
	productCont="";
	
	div.innerHTML ="";
	for (var i = count*(page-1); i < cp.length && i < count*page; i++)
	{
		ImageCont = GenerateImageLink(type, cp, i);
		 // ImageTemplate.replace(/\[id\]/, cp[i][0]).replace(/\[type\]/g, pageType).replace(/\[image\]/, cp[i][1]).replace(/\[name\]/, cp[i][2]).replace(/\[namelink\]/g, cp[i][2].replace(/\s/g, "-"));
		TextCont = GenerateTextLink(type, cp, i);
		 //TextTemplate.replace(/\[id\]/, cp[i][0]).replace(/\[image\]/, cp[i][1]).replace(/\[name\]/, cp[i][2]).replace(/\[namelink\]/g, cp[i][2].replace(/\s/g, "-"));
		
		ImageConts += ImageCont;
		TextConts  += TextCont;
		var j = i + 1;
		if(j % countinrow == 0)
		{
				
				div.innerHTML += ImageOpen + ImageConts + ImageClose + TextOpen + TextConts + TextClose;
				ImageConts="";
				TextConts="";

		}
		else if(j== cp.length)
		{
			div.innerHTML += ImageOpen + ImageConts + ImageClose + TextOpen + TextConts + TextClose;
		}
	}
	
	CheckCButtons();
	return false;
}

PreviousClearance = function(type){	
	if (page == 1 || cp == null || cp.length < 1 || div == null)
		return false;
		
	page--;
	ImageCont="";
	TextCont="";
	ImageConts="";
	TextConts="";
	div.innerHTML ="";
	for (var i = count*(page-1); i < cp.length && i < count*page; i++)
	{
		ImageCont = GenerateImageLink(type, cp, i);
		 // ImageTemplate.replace(/\[id\]/, cp[i][0]).replace(/\[type\]/g, pageType).replace(/\[image\]/, cp[i][1]).replace(/\[name\]/, cp[i][2]).replace(/\[namelink\]/g, cp[i][2].replace(/\s/g, "-"));
		TextCont = GenerateTextLink(type, cp, i);
		 //TextTemplate.replace(/\[id\]/, cp[i][0]).replace(/\[image\]/, cp[i][1]).replace(/\[name\]/, cp[i][2]).replace(/\[namelink\]/g, cp[i][2].replace(/\s/g, "-"));
		
		ImageConts += ImageCont;
		TextConts  += TextCont;
		var j =i + 1;
		if(j % countinrow == 0)
		{			
				div.innerHTML += ImageOpen + ImageConts + ImageClose + TextOpen + TextConts + TextClose;
				ImageConts="";
				TextConts="";

		}
	}
	
	CheckCButtons();
	return false;
}

HoverClearanceButtons = function(){
	if(document.getElementById("cNext") && document.getElementById("cPrev"))
	{
		var next=document.getElementById("cNext"),
			prev=document.getElementById("cPrev");
		
		next.onmouseover=function()
		{
			if (!cnDis)
			{
				next.childNodes[0].src="images/btn_next_o.gif";
			}
		}
		
		next.onmouseout=function()
		{
			if(!cnDis)
			{
				next.childNodes[0].src="images/btn_next.gif";
			}
		}
		
		prev.onmouseover=function()
		{
			if (!cpDis)
			{
				prev.childNodes[0].src="images/btn_previous_o.gif";
			}
		}
		
		prev.onmouseout=function()
		{
			if (!cpDis)
			{
				prev.childNodes[0].src="images/btn_previous.gif";
			}
		}
	}	
}