positionIt = function() {
	if( document.getElementById ) {
		// Get a reference to divTest and measure its width and height.
		var div = document.getElementById( "inner" );
		var wrapper = document.getElementById( "wrapper" );
		var divHeight = div.offsetHeight ? div.offsetHeight :  div.style.height ? parseInt( div.style.height ) : 0;
		
		// Calculating setX and setX so the div will be centered in the viewport.
		var setY = ( getViewportHeight() - divHeight ) / 2;
		
		// If setX or setY have become smaller than 0, make them 0.
		if( setY < 0 ) setY = 0;
		
		// Position the div in the center of the page and make it visible.
		// div.style.top = setY + "px";
		div.style.width = getViewportWidth() + "px";
		wrapper.style.width = getViewportWidth() + "px";
		div.style.visibility = "visible";
	}
};

getViewportWidth = function() {
	var width = 0;
	if( document.documentElement && document.documentElement.clientWidth ) {
		width = document.documentElement.clientWidth;
	}
	else if( document.body && document.body.clientWidth ) {
		width = document.body.clientWidth;
	}
	else if( window.innerWidth ) {
		width = window.innerWidth - 18;
	}
	return width;
};

getViewportHeight = function() {
	var height = 0;
	if( document.documentElement && document.documentElement.clientHeight ) {
		height = document.documentElement.clientHeight;
	}
	else if( document.body && document.body.clientHeight ) {
		height = document.body.clientHeight;
	}
	else if( window.innerHeight ) {
		height = window.innerHeight - 18;
	}
	return height;
};
				
function ranNumValuefunction(maxnum,images){
	var A=[], min= 1;
	while(images+1 > min) A.push(min++)
	A.sort(function(){
		return .5- Math.random()
	});
	return A;
};

function generateCubes () {
	var cols = Math.floor((getViewportWidth() - 984) / 194);
	var bgposition = 984 + (194 * cols);
	var total_cubes = (cols * 2);
	var	images_available = 12;
	var cube_order = ranNumValuefunction(total_cubes,images_available);
	var counter = 0;
	var i=0;
	output = '';
	for (j=0;j<=1;j++) {
		for (i=1;i<=cols;i++) {
			output += '<div class="cubes cube' + cube_order[counter] + '"></div>';
			counter++;
		}
		output += "<ins></ins>";
	};
	document.getElementById('right').innerHTML = output;
	document.getElementById('inner').style.backgroundPosition = bgposition + "px 35px";

};

function runFunctions() {
	positionIt();
	generateCubes();
}
window.onload = runFunctions;
window.onresize = runFunctions;