image = new Image(); 
image.src = "/tl_files/vkz/images/bg_nav_hover.png";

jQuery.noConflict();

jQuery(document).ready(function($) {
	
	var zindexnr = 100;
	var dragging = false;
	
	var topnavHeight = $('#topnav ul').height();
	var subnavHeight = $('#subnav ul').height();
	
	var navHeight = Math.max( topnavHeight, subnavHeight ) + 30 ;
	var boxes = [];
	boxes[0] = {'x':0, 'y':0, 'width':300, 'height':navHeight};
	
	// Place all stickits at a random position	
	$(".stickit").each(function (i) {
		
		var w = 230; //$(this).width();
		var h = 160; //$(this).height();
		
		var width = 900 - w - 120;
		var height = 600 - h;
		
		var offsetWidth = 0;// $(document).width() / 2 - (900/2);
		var offsetHeight = 0;//210;
		
		var counter = 0;
		do {
			var x = Math.round(Math.random() * width) + 120;
			var y = Math.round(Math.random() * height );
			counter++;
		} while( !testPosition(x, y, w, h, boxes) && counter < 100 );
		
		boxes[i+1] = {'x':x, 'y':y, 'width':w, 'height':h};
		
		var cssObj = {};//getTransformCssObject( getRotDegrees() ); 
		cssObj.left = x + offsetWidth;
		cssObj.top = y + offsetHeight;
		cssObj['z-index'] = ++zindexnr;	
		cssObj.position = 'absolute';
		$(this).css(cssObj);
		
	});
	
	
	
	// Make the stickit draggable
	$(".stickit").draggable({
		start: function(event, ui) {
			dragging = true;
			zindexnr++;
			var cssObj = { 'z-index' : zindexnr };
			$(this).css(cssObj);
		},
		stop: function(event, ui) {
			var cssObj = {};//getTransformCssObject( getRotDegrees() ); 
			$(this).css(cssObj);
			dragging = false;
		}
	});
	
	$('.closebox').click(function( e ) {
		$(this).parent().parent().hide();
	});
	
	$('.stickit .container').click(function( e ) {
		location.href = $('.stickit-link', this).attr('href');;
	}); 
	
	//==============================================================
	// H E L P E R  F U N C T I O N S
	
	// Gets a random value betwen minVal and maxVal
	function randomXToY( minVal, maxVal ) {
		var randVal = minVal+(Math.random()*(maxVal-minVal));
		return Math.round(randVal);
	}
	
	
	function testPosition(x, y, w, h, boxes) {
		
		for ( var i in boxes ) {
			var b = boxes[i];
			if (
				((b.x <= x && b.x + b.width >= x) || 
				(b.x <= x+w && b.x + b.width >= x+w)) && (
				(b.y <= y && b.y + b.height >= y) || 
				(b.y <= y+h && b.y + b.height >= y+h) )) {
				
				return false;
			}
			
		}
		
		return true;
	}
	
	
	// Gets random rotation degrees
	function getRotDegrees() {
		if( Math.round(Math.random()) == 1 ) {
			var rotDegrees = randomXToY(345, 360); // rotate left
		} else {
			var rotDegrees = randomXToY(0, 15); // rotate right
		}
		return rotDegrees;
	}
	
	// Gets a css object containig the rotation settings
	function getTransformCssObject( rotDegrees ) {
		var cssObj = { 
			'-webkit-transform' : 'rotate('+ rotDegrees +'deg)',  // webkit only
			'tranform' : 'rotate('+ rotDegrees +'deg)' };         // CSS3
		return cssObj;
	}
	
});