/**
 * fullscreengridr logic
 *
 * Build full screengrid and navigation
 *
 * 1. We measure the viewport size and resize the div's accordingly
 * 2. We position the divs absolute in the columns allowed
 * 3. We add a resize event which handles the resizing of the viewport
 * 4. We set the navigational controls
 *
 * @author: Dadog
 * @latest revison: 10.10.2010
 *
 */

(function($) {
	$.fn.fullscreengridr = function(options) {

		// Set default values
		var defaults = {
			columns: 4,
			wrapperClass: 'page',
			wrapperWidth: 0,
			wrapperHeight: 0,
			wrapperResize: true,
			navigationId: 'grid-navigation',
			menuClass: 'goto',
			page:0
		};
		
		var options = $.extend({}, defaults, options);

		return this.each(function() {
			
			// Set need vars
			var $this = $(this);
			var divs = $('div.' + options.wrapperClass, $this);
			var navWrapper = $('#' + options.navigationId);
			var upArrow = $('#move-up', navWrapper);
			var rightArrow = $('#move-right', navWrapper);
			var downArrow = $('#move-down', navWrapper);
			var leftArrow = $('#move-left', navWrapper);
			var i = 0; // column count
			var k = 0;
			var pages;
			var crow = 0; // Current row
			var ccol = 0; // Current col
			var rows = Math.round(divs.size() / options.columns);
			var viewportWidth;
			var viewportHeight;
			
			function init()
			{
				if(options.wrapperResize) { $(window).bind('smartresize', function() { resizeWrappers(options.wrapperWidth, options.wrapperHeight); }) }
				// Resize wrappers
				resizeWrappers(options.wrapperWidth, options.wrapperHeight);
				// INIT NAVIGATION
				initNav();
				// INIT MENU'S
				initMenu();
			}
			
			function initMenu()
			{
				$('.' + options.menuClass).click(function(e) { gotopage($(this)); e.preventDefault(); });
			}
			
			function initNav()
			{
				upArrow.click(function(e) {
					e.preventDefault();
					if(crow > 0) crow--;
					goto();
				});
				
				downArrow.click(function(e) {
					e.preventDefault();
					if(crow < rows) crow++;
					goto();
				});
				
				rightArrow.click(function(e) {
					e.preventDefault();
					if(ccol < (options.columns - 1)) ccol++;
					goto();
				});
				
				leftArrow.click(function(e) {
					e.preventDefault();
					if(ccol > 0) ccol--;
					goto();
				});
				// Set nav
				setNav();
			}
			
			function setNav()
			{
				if(crow == 0) { upArrow.addClass('disabled'); } else { upArrow.removeClass('disabled'); }
				if(crow >= rows) { downArrow.addClass('disabled'); } else { downArrow.removeClass('disabled'); }
				if(ccol == 0) { leftArrow.addClass('disabled'); } else { leftArrow.removeClass('disabled'); }
				if(ccol >= (options.columns-1)) { rightArrow.addClass('disabled'); } else { rightArrow.removeClass('disabled'); }
			}
			
			function goto()
			{
				var x = viewportWidth * ccol;
				var y = viewportHeight * crow;
				$this.animate({ left:0-x, top:0-y}, 250);
				setNav();
			}
			
			function gotopage(el) {
				$('div.active', $this).removeClass('active');
				var target = $(el.attr('href'));
				var x = target.data('pos').left;
				var y = target.data('pos').top;
				ccol = target.data('pos').col;
				crow = target.data('pos').row;
				setNav();
				target.addClass('active');
				$this.animate({ left:0-x, top:0-y}, 1000);
			}
			
			function resizeWrappers(width, height)
			{
				// Set viewport vars!
				viewportWidth = $(window).width();
				viewportHeight = window.innerHeight ? window.innerHeight : $(window).height();
				// Reset i & k
				var i = 0;
				var k = 0;
				divs.each(function() {
					// Check column count
					if(i > (options.columns - 1)) { i = 0; k++; }
					// Set w & h, x & y
					var w = (width == 0) ? viewportWidth : width;
					var h = (height == 0) ? viewportHeight : height;
					var x = w * i;
					var y = h * k;
					// Set css
					$(this).css({position:'absolute', top:y, left:x, width:w, height:h});
					// Save new offset
					$(this).data('pos', {left:x, top:y, col:i, row:k});
					i++;
				});
				// Set containing div!
				$this.css({top:0-(crow * viewportHeight),left:0-(ccol * viewportWidth)});
			}
			init();
		});
	}
})(jQuery);

/*
 * smartresize: debounced resize event for jQuery
 *
 * Copyright (c) 2009 Louis-Rémi Babé
 * Licensed under the GPL license.
 * http://docs.jquery.com/License
 *
 */
(function($) {

var event = $.event,
	resizeTimeout;
	
	event.special[ "smartresize" ] = {
		setup: function() {
			$( this ).bind( "resize", event.special.smartresize.handler );
		},
		teardown: function() {
			$( this ).unbind( "resize", event.special.smartresize.handler );
		},
		handler: function( event, execAsap ) {
			// Save the context
			var context = this,
				args = arguments;
		
			// set correct event type
	        event.type = "smartresize";
		
			if(resizeTimeout)
				clearTimeout(resizeTimeout);
			resizeTimeout = setTimeout(function() {
				jQuery.event.handle.apply( context, args );
			}, execAsap === "execAsap"? 0 : 100);
		}
	}

	$.fn.smartresize = function( fn ) {
		return fn ? this.bind( "smartresize", fn ) : this.trigger( "smartresize", ["execAsap"] );
	};
})(jQuery);
