$(document).ready(function() {
	var viewsHovered = [],
		isDebugEnabled = false,
		$debugTooltip;

	$(".debugtemplate").each(function() {
		var $this = $(this),
			view = $this.data('view'),
			$next = $this.next();

		$next.data('view',view).addClass('debugtemplate');
		$this.remove();
	});

	$('.enableDebugMode').click(function(e) {
		e.preventDefault();
		if ( !isDebugEnabled ) {
			isDebugEnabled = true;
			$('body').append('<div id="debugMouseTooltip" style="z-index:200;position:absolute;width:auto;padding:5px;border:1px solid #ffffff;background:#000;color:#fff;"></div>');
			$debugTooltip = $("#debugMouseTooltip");

			$(".debugtemplate").each(function() {
				var $this = $(this),
					view = $this.data('view'),
					// $next = $this.next(),
					borderBackup;

				// Backupuje trenutni border u slucaju gasenja debug moda
				borderBackup = $this.css('border');
				$this.css('border','1px dashed #fff').data('view',view).data('borderBackup', borderBackup).addClass('debughover');
			});
		} else {
			isDebugEnabled = false;
			$("#debugMouseTooltip").remove();
			$('.debughover').each(function() {
				var $this = $(this),
					border = $this.data('borderBackup');

				$this.css('border', border).removeClass('debughover');
			});
		}
	});


	$('.debughover').live('mouseenter', function() {
		if (!isDebugEnabled) return false;
		var $this = $(this),
			view = $this.data('view');
		
		viewsHovered.push( view );
		populateDebugTooltip($debugTooltip, viewsHovered);
	});

	$('.debughover').live('mouseleave', function() {
		if (!isDebugEnabled) return false;
		var $this = $(this),
			view = $this.data('view'),
			index = viewsHovered.indexOf(view);

		if ( index != -1) {
			viewsHovered.splice(index,1);
		}

		populateDebugTooltip($debugTooltip, viewsHovered);
	});

	 $(document).mousemove(function(e) {
	 	if (!isDebugEnabled) return false;
        var debugPositionY = e.pageY; // - $(window).scrollTop(),
        	debugPositionX = e.pageX;

    	$debugTooltip.css('top',debugPositionY);
    	$debugTooltip.css('left',debugPositionX+10);
    });

});

function populateDebugTooltip( $element, dataArray ) {
	var i, tmp = "";

	tmp += "<b>Views stack:</b><br />"
	for (i=0; i<dataArray.length; i++) {
		tmp += (i+1) + ". " + (dataArray[i] + "<br />");
	}

	$element.html( tmp );
}