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

function EventCalendarView() {
	
	var _self = this;

	//-------------------------------
	// Constants
	//-------------------------------
	
	_self.DISPLAY_DATA = "display_data";
	_self.SORT = "sort_data";
	
	_self.ELEMENT_WIDTH = 150;
	
	//-------------------------------
	// Properties
	//-------------------------------
	
	_self.container = new Object();
	
	var _elements;
	var _view;
	var _current;
	var _previousPgBtn;
	var _id;
	var _w;
	
	//-------------------------------
	// Constructor
	//-------------------------------
	
	$(function() {
		
		$(_self).bind(_self.DISPLAY_DATA, onDisplayData);
		
		init();
	});
	
	//-------------------------------
	// Public Methods
	//-------------------------------
	
	_self.deploy = function(data) {
		_elements = new Array();
		
		$.each(data, function(i, item){
			_view = new String();
			
			_view += "<ul><h1><span>" + item.Order + "</span></h1>";
			
			$.each(item.Events.event, function(i, content){
				_view += "<li><a href='" + content.url + "'>" + ((content.day != null) ? "<span class='day'>" + content.day + "</span> " : "") + content.title + "</a></li>";
			});
			
			_view += "</ul>";
			
			_elements[i] = { "content" : _view, "order" : item.Order };
		});
		
		$(_self).trigger(_self.DISPLAY_DATA);
	}

	
	//-------------------------------
	// Private Methods
	//-------------------------------
	
	function init() {
		var previous;
	
		$(".sort").click(function() {
			$(previous).removeClass("selected");
			$(this).addClass("selected");
			previous = $(this);
			
			$(_self).trigger(_self.SORT, $(this));
		});
		
		previous = $(".sort").eq(0).addClass("selected");
		
		$("#btn-prev").click(function() {
			(_id > 0) ? _id-- : _id = _elements.length - 1;
			shift($(".pager-button").eq(_id));
		});
		
		$("#btn-next").click(function() {
			(_id < _elements.length - 1) ? _id++ : _id = 0;
			shift($(".pager-button").eq(_id));
		});
	}
	
	function shift(target) {
		var xPos = (_id <  _elements.length - 6) ? _id * -_self.ELEMENT_WIDTH: (_elements.length - 6) * -_self.ELEMENT_WIDTH;
			
		$(_self.container).stop().animate({
			marginLeft: xPos
		}, 1000 );
		
		$("#slider").slider('option', 'value', Math.abs((_id / (_elements.length - 1)) * 100));
		
		$(_previousPgBtn).removeClass("selected");
		_previousPgBtn = $(target).addClass("selected");
	}

	//-------------------------------
	// Listeners
	//-------------------------------
	
	function onDisplayData(event) {
		$(_self.container).html("").css("margin-left", 0);
		$("#pagination").html("");
		$("#slider").slider('option', 'value', 0);
		$(_self.container).css("margin-left", 0);
		if(_elements.length > 6) $("#slider").slider('enable');
		else $("#slider").slider('disable');
		_id = 0;
		
		$.each(_elements, function(i, element) {
			var pgBtn = new String();
			pgBtn += "<a class='pager-button' id='" + i + "'>" + element.order + "</a>";
			
			$(_self.container).append(element.content);
			$("#pagination").append(pgBtn);
		});
		
		$(_self.container).append("<div class='clear'></div>");
		
		_w = _elements.length * _self.ELEMENT_WIDTH;

		$("#slider").slider({
			slide: function(event, ui) {
				$(_self.container).css("margin-left", - ui.value * (_w - (_self.ELEMENT_WIDTH * 6)) * 0.01);
			}
		});
		
		$(".pager-button").click(function(){
			_id = parseInt($(this).attr("id"));
			
			shift($(this));
	    });
	    
	    _previousPgBtn = $(".pager-button").eq(0).addClass("selected");
	    
		$(_self.container).css("width", _w);
	}
	
	//-------------------------------
	// Getters/Setters
	//-------------------------------
	
	function Field(val){
	    var value = val;
	   
	    this.__defineGetter__("value", function(){
	        return value;
	    });
	   
	    this.__defineSetter__("value", function(val){
	        value = val;
	    });
	}
}