//-------------------------------
// Class
//-------------------------------

function FeaturedContentView() {
	
	var _self = this;

	//-------------------------------
	// Constants
	//-------------------------------
	
	FeaturedContentView.prototype.CONTENT_SELECT = "content_select";
	FeaturedContentView.prototype.CONTROLS_CLICK = "controls_click";
	FeaturedContentView.prototype.GRID_APPENDED = "grid_appended";
	
	var LOAD_BUTTON = "load_button";
	var LOAD_COMPLETE = "load_complete";
	var APPEND_GRID = "append_grid";
	
	var GRID_WIDTH = 150;
	var GRID_HEIGHT = 100;
	
	//-------------------------------
	// Properties
	//-------------------------------
	
	var _view = $j("<ul class='buttons'></ul>");
	var _controls = $j("<ul class='controls'></ul>");
	
	var _data;
	
	var _grid = new Array();
	var _gPosX = 0;
	var _gPosY = 0;
	var _gWidth = 0;
	var _gCurrent = 0;
	
	var _featuredButtonArray = new Array();
	
	//-------------------------------
	// Constructor
	//-------------------------------
	
	$j(function(){
		$j(_self).bind(LOAD_BUTTON, onButtonLoad);
		$j(_self).bind(LOAD_COMPLETE, onLoadComplete);
		$j(_self).bind(APPEND_GRID, onGridAppend);
		$j(window).bind('resize', onWindowResize);
	
		_controls.append("<li class='previous'>Previous</li>");
		_controls.append("<li class='next'>Next</li>");
		
		$j("#featuredButtons").append(_controls);
		$j("#featuredButtons").append(_view);
		
		$j("li", _controls).bind("click", onControlsClick);
		
		for(var i = 0; i < 2; i++)
			$j(_self).trigger(APPEND_GRID);
		
	});
	
	//-------------------------------
	// Public Methods
	//-------------------------------
	
	_self.deploy = function(data) {
		_data = data;

		$j(_data).find("item").each(function(index) {
			var featuredButton = new FeaturedButtonView({data: this, index: index});
			_featuredButtonArray.push(featuredButton);
			$j(featuredButton).bind(featuredButton.BUTTON_CLICK, onButtonClick);
			if ( $j.browser.msie && $j.browser.version < 9 && index == 12)
				return false;
		});

		$j(_self).trigger(LOAD_BUTTON);
	}
	
	_self.animate = function(pos) {
		$j(_view).animate({"margin-left" : pos + "px"}, 1000);
	}
	
	//-------------------------------
	// Private Methods
	//-------------------------------
	
	function getGridPosition(button) {
		var column = 0;
		var row = 0;
		var width = 0;
		var previous;
		var position;
	
		$j(_grid).each(function(i, item) {
			var height = 0;
			
			if(item.length >= button.height) {
				
				for(var n = ((width > 0) ? row : 0); n < 4; n++) {
					if(height == 0) row = n;

					if(_grid[i].grid[n]) { height++; }
					//else if(!_grid[i].grid[n] && width > 0 && height > 0) { break; }
					else if(height >= button.height) { break; }
					else if(!_grid[i].grid[n] && height > 0) { height--; }
					
					//$j("#results").append("Grid :: Row : " + n + " | Column : " + i + " | Height : " + height + " | Index : " + _gCurrent + " | Grid Size : " + _grid.length + "<br/>" )
				}
			}
			
			if (width == 0) column = i;
			
			if(height >= button.height) {
				previous = height;
				width++;
			}
			
			if(height < button.height && width > 0) {
				width--;
			}
			else if(width == button.width) {
				position = {"row" : row, "column" : column};
				return false;
			}
		});

		for (var i = column; i < column + button.width; i++) {
			for(var n = row; n < row + button.height; n++) {
				_grid[i].grid[n] = 0;
			}
			
			var height = 0;
			for(var o = 0; o < _grid[i].grid.length; o++) {
				if(_grid[i].grid[o]) height++;
			}
			
			_grid[i].length = height;
		}

		
		return position;
	}

	//-------------------------------
	// Listeners
	//-------------------------------
	
	function onButtonLoad() {
		if(_gCurrent > 0) {
			if (_featuredButtonArray[_gCurrent - 1].x + _featuredButtonArray[_gCurrent - 1].width + _featuredButtonArray[_gCurrent].width >= _grid.length){
				for(var i = 0; i < _featuredButtonArray[_gCurrent].width; i++)
					$j(_self).trigger(APPEND_GRID);
				}
		}
	
		_view.append($j(_featuredButtonArray[_gCurrent].button));
		_view.width((_grid.length - 1)* GRID_WIDTH + "px");
		
		var position = getGridPosition(_featuredButtonArray[_gCurrent]);
		
		_featuredButtonArray[_gCurrent].x = position.column;
		$j(_featuredButtonArray[_gCurrent].button).css({"left" : position.column * GRID_WIDTH, "top" : position.row * GRID_HEIGHT});
		
		if ( $j.browser.msie && $j.browser.version < 9 )
			$j(_featuredButtonArray[_gCurrent].button).show();
		else $j(_featuredButtonArray[_gCurrent].button).fadeIn();
			
		_featuredButtonArray[_gCurrent].set();
		
		_gCurrent++;
		if(_gCurrent < _featuredButtonArray.length) $j(_self).trigger(LOAD_BUTTON);
		else if(_gCurrent == _featuredButtonArray.length) 
			$j(window).trigger('resize');
	}
	
	function onLoadComplete(event, image) {
		
	}
	
	function onGridAppend() {
		_grid.push({"length" : 4, "grid" : [1, 1, 1, 1]});
		
		$j(_self).trigger(_self.GRID_APPENDED);
	}
	
	function onButtonClick(event, index) {
		$j(_self).trigger(_self.CONTENT_SELECT, [$j.parseJSON($j(_data).find("item").eq(index).find("description").text())]);
	}
	
	function onControlsClick(event) {
		$j(_self).trigger(_self.CONTROLS_CLICK, [event.target]);
	}
	
	function onWindowResize(event, sWidth) {
		$j("#featuredButtons").width(($j("body").width()) + "px");
		//$j("body").append(($j(_view).width() + 100) + " | " + $j("#featuredButtons").width() + "<br/>");
		
		if($j(_view).width() > $j("#featuredButtons").width()) {
			$j(_controls).show();
		}
		else {
			$j(_controls).hide();
		}
		
		$j(_controls).css("left", $j(window).width() - $j(_controls).width() - 100 - ((sWidth) ? sWidth : 0));
	}
}