var boxCounter = 0;
var boxImgCounter = new Array(); // image counter
var Imgs = new Array(); // 2D array  with image filesnames
var Heights = new Array(); // 2D array with heights
var Widths = new Array(); // 2D array with Widths

function getImgID(box,img){
	for (var i=0;i < boxImgCounter[box]; i++)
	{
		if( Imgs[box][i] == img)
			return i;
	}
}

function imgNext(box,img){
	// get image info
	id=getImgID(box,img);
	id++;
	hideImg();
	showBoxImg(box,Imgs[box][id],Widths[box][id],Heights[box][id]);
}

function imgPrev(box,img){
	// get image info
	id=getImgID(box,img);
	id--;
	hideImg();
	showBoxImg(box,Imgs[box][id],Widths[box][id],Heights[box][id]);
}

function addBox(boxID)
{
	boxImgCounter[boxID] = 0;
	Imgs[boxID] = new Array();
	Heights[boxID] = new Array();
	Widths[boxID] = new Array();
	boxCounter++;
}

function BoxAddImg(box,img,imgw,imgh)
{
	// set picture dimentions
	box=parseInt(box);
	Heights[box][boxImgCounter[box]]=imgh;
	Widths[box][boxImgCounter[box]]=imgw;
	Imgs[box][boxImgCounter[box]]=img;
	boxImgCounter[box]++;
}

function showBoxImg(box,img,imgw,imgh)
{
	// get client dimentions
	width = document.viewport.getDimensions().width;
	wheight = document.viewport.getDimensions().height;
	
	$('imgBlanket').style.height=wheight + "px";
	$('imgBlanket').style.width=width + "px";
	$('imgBlanket').style.display='block';
	
	var left = (width - imgw) / 2;
	var top = (wheight - imgh) / 2;
	
	if(left < 12) left=12;
	if(top < 12) top=12;
	
	// get image id
	id=getImgID(box,img);
	//del
	var txt='<a href="javascript:hideImg();"><img id="imgPopupClose" src="images/del.png" alt="" title="Close" /></a>';
	// prev
	if(id > 0)
		txt +='<a href="javascript:imgPrev(' + box + ',\'' + img + '\');"><img id="imgPopupPrev" src="images/1leftarrow.png" alt="" title="Prev" /></a>';
	// next
	if(id < (boxImgCounter[box] - 1))
		txt +='<a href="javascript:imgNext(' + box + ',\'' + img + '\');"><img id="imgPopupNext" src="images/1rightarrow.png" alt="" title="Next" /></a>';
	// image
	txt += '<a href="javascript:hideImg();"><img src="' + img + '" alt="" width="100%" border="0" /></a>';
	
	$('imgPopup').innerHTML=txt;
	$('imgPopup').style.width=imgw + 'px';
	$('imgPopup').style.height=imgh + 'px';
	$('imgPopup').style.left=left + 'px';
	$('imgPopup').style.top=top + 'px';
	//$('imgPopup').click(function() { hideImg(); });
	$('imgPopup').style.display='block';
}

function showImg(img,imgw,imgh)
{
	// get client dimentions
	width = document.viewport.getDimensions().width;
	wheight = document.viewport.getDimensions().height;
	
	$('imgBlanket').style.height=wheight + "px";
	$('imgBlanket').style.width=width + "px";
	$('imgBlanket').style.display='block';
	
	var left = (width - imgw) / 2;
	var top = (wheight - imgh) / 2;
	
	if(left < 12) left=12;
	if(top < 12) top=12;
	
	var txt='<a href="javascript:hideImg();"><img id="imgPopupClose" src="images/del.png" alt="" title="Close" /></a>';
	txt = txt + '<a href="javascript:hideImg();"><img src="' + img + '" alt="" width="100%" border="0" /></a>';
	
	$('imgPopup').innerHTML=txt;
	$('imgPopup').style.width=imgw + 'px';
	$('imgPopup').style.height=imgh + 'px';
	$('imgPopup').style.left=left + 'px';
	$('imgPopup').style.top=top + 'px';
	//$('imgPopup').click(function() { hideImg(); });
	$('imgPopup').style.display='block';
}


function hideImg(){
	$('imgBlanket').style.display='none';
	$('imgPopup').style.display='none';
}

/**
 * Function : dump()
 * Arguments: The data - array,hash(associative array),object
 *    The level - OPTIONAL
 * Returns  : The textual representation of the array.
 * This function was inspired by the print_r function of PHP.
 * This will accept some data as the argument and return a
 * text that will be a more readable version of the
 * array/hash/object that is given.
 * Docs: http://www.openjs.com/scripts/others/dump_function_php_print_r.php
 */
function dump(arr,level) {
	var dumped_text = "";
	if(!level) level = 0;
	
	//The padding given at the beginning of the line.
	var level_padding = "";
	for(var j=0;j<level+1;j++) level_padding += "    ";
	
	if(typeof(arr) == 'object') { //Array/Hashes/Objects 
		for(var item in arr) {
			var value = arr[item];
			
			if(typeof(value) == 'object') { //If it is an array,
				dumped_text += level_padding + "'" + item + "' ...\n";
				dumped_text += dump(value,level+1);
			} else {
				dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n";
			}
		}
	} else { //Stings/Chars/Numbers etc.
		dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
	}
	return dumped_text;
}