var _contentDiv;
var _imgDivArray = [];

function windowSizeDidChange()
{
	width = document.body.offsetWidth;
	numCols = Math.floor( width / 190.0 );
	availForSpace = width - ( numCols * 180.0 );
	numRows = Math.ceil( _imgDivArray.length / numCols );
	
	space = availForSpace / ( numCols + 1 );
	
	_contentDiv.style.width = width;
	_contentDiv.style.height = ( ( 145.0 + space ) * numRows ) + space;
	
	x = space;
	y = space;
	col = 0;
	
	for ( i in _imgDivArray )
	{
		item = _imgDivArray[i];
		item.style.left = x+"px";
		item.style.top = y+"px";
		
		col++;
		x += (space + 180.0);
		if ( col == numCols )
		{
			col = 0;
			x = space;
			y += (space + 145.0);
		}
	}
		
}

function URLEncode(plaintext)
{
	// The Javascript escape and unescape functions do not correspond
	// with what browsers actually do...
	var SAFECHARS = "0123456789" +					// Numeric
					"ABCDEFGHIJKLMNOPQRSTUVWXYZ" +	// Alphabetic
					"abcdefghijklmnopqrstuvwxyz" +
					"-_.!~*'()";					// RFC2396 Mark characters
	var HEX = "0123456789ABCDEF";
 
	var encoded = "";
	for (var i = 0; i < plaintext.length; i++ ) {
		var ch = plaintext.charAt(i);
	    if (ch == " ") {
		    encoded += "+";				// x-www-urlencoded, rather than %20
		} else if (SAFECHARS.indexOf(ch) != -1) {
		    encoded += ch;
		} else {
		    var charCode = ch.charCodeAt(0);
			if (charCode > 255) {
				encoded += "+";
			} else {
				encoded += "%";
				encoded += HEX.charAt((charCode >> 4) & 0xF);
				encoded += HEX.charAt(charCode & 0xF);
			}
		}
	} // for
 
	return encoded;
}
 
function URLDecode(encoded)
{
   // Replace + with ' '
   // Replace %xx with equivalent character
   // Put [ERROR] in output if %xx is invalid.
   var HEXCHARS = "0123456789ABCDEFabcdef"; 
   var plaintext = "";
   var i = 0;
   while (i < encoded.length) {
       var ch = encoded.charAt(i);
	   if (ch == "+") {
	       plaintext += " ";
		   i++;
	   } else if (ch == "%") {
			if (i < (encoded.length-2) 
					&& HEXCHARS.indexOf(encoded.charAt(i+1)) != -1 
					&& HEXCHARS.indexOf(encoded.charAt(i+2)) != -1 ) {
				plaintext += unescape( encoded.substr(i,3) );
				i += 3;
			} else {
				plaintext += "%[ERROR]";
				i++;
			}
		} else {
		   plaintext += ch;
		   i++;
		}
	} // while
	return plaintext;
};

function didLoadImages(images)
{
		
	_contentDiv = document.createElement( "div" );
	_contentDiv.style.width = "0px";
	_contentDiv.style.height = "0px";
	_contentDiv.style.position = "absolute";
	_contentDiv.style.left = "0px";
	_contentDiv.style.top = "0px";
	document.body.appendChild( _contentDiv );
	
	rep = images.republicImages;
	for ( v in rep )
	{
		obj = rep[v];
		path = obj.path;
		name = URLDecode(obj.name);

		divObj = document.createElement( "div" );
		divObj.style.width = "180px";
		divObj.style.height = "145px";
		divObj.style.position = "absolute";
		divObj.style.left = "60px";
		divObj.style.top = "0px";
		divObj.style.borderStyle = "none"; 
		
		imgObj = document.createElement( "img" );
		imgObj.src = path;
		imgObj.width = 80;
		imgObj.height = 115;
		imgObj.setAttribute( "class", "repImg" ); 
		imgObj.style.position = "absolute";
		imgObj.style.left = "50px";
		imgObj.style.top = "0px";
		divObj.appendChild( imgObj );
		
		txtDiv = document.createElement( "div" );
		txtDiv.style.width = "180px";
		txtDiv.style.height = "25px";
		txtDiv.style.position = "absolute";
		txtDiv.style.left = "0px";
		txtDiv.style.top = "120px";
		txtDiv.style.borderStyle = "none"; 
		txtDiv.style.lineHeight = "25px";
		txtDiv.style.textAlign = "center";
		txtDiv.style.color = "rgb(255,255,255)";
		txtDiv.style.fontFamily = "helvetica";
		txtDiv.style.fontSize = "12px";
		txtDiv.style.whiteSpace = "no-wrap"
		txtDiv.innerHTML = name;
		divObj.appendChild( txtDiv );

		_imgDivArray.push(divObj);
		_contentDiv.appendChild( divObj );

	}

	windowSizeDidChange();
}

window.onresize = windowSizeDidChange;