/**
 * Namespace "StuffBrowser"
 * @class StuffBrowser
 * @author jorn@info.nl
 * 
 * --------------------------
 * @desc This is the base namespace for the StuffBrowser / Product browser
 *       on the personal homepage.
 * It is organised in the following manner (and load order):
 * 
 * StuffBrowser (this file) - Var init & added tab functionality (above the standard infoTabs plugin)
 * StuffBrowser.Ajax     - (defined in footer-javascript.js)
 * StuffBrowser.View     - Stores item layout and handles view changes
 * StuffBrowser.Paginate - Handles clicking Previous, Next and the paginating dots
 * StuffBrowser.Card     - Functions that parse JSON data to HTML
 * 
 * 
 * Terminology:
 * - A TAB is the highest element in the hierarchy, all tabs are identical (in functionality).
 * - A tab's content can be VIEWed in 3 different ways. This is set by classname on the tab element.
 * - The view determines how many ITEMs will be visible, and how they are marked up.
 * - The content of a tab is put in CARDs. 1 card can hold a certain amount of items. If there are
 *   too many items to be displayed in 1 card, more will be used. The maximum number of cards can be set
 *   in the StuffBrowser settings. 3 cards will result in the 'middle' card and 1 card on each side
 *   of it. This is called a SPREAD of 1. If you are at the first card, the active card will 
 *   only have a card on it's right).
 * - The cards are bundled in the CARD-HOLDER div. This div is animated for the sliding effect.
 *  
 * - FLOW: All stuffbrowser functionality starts with clicking a tab. Then the default view is
 *   filled by the appropriate cards. On pageload, the infoTabs plugin triggers a click event on
 *   the default tab.
 */
StuffBrowser = function($){
	/**
	 * Stores max cards per view, sorted by tab
	 */
	var max_cards = {
		// tab: [views]
		0: [0, 0, 0],
		1: [0, 0, 0],
		2: [0, 0, 0]
	};
	
	var current_tab = [];
	
	function bindTabEvents()
	{
		$('#stufftabs > .tabs-container a').each(function(i, elem){ // use each so we can store tab index in current_tab
			$(elem).bind('click.StuffBrowser', function(){
				StuffBrowser.tabClicked = true;
				
				current_tab = [$(this).attr('href'), i];
				StuffBrowser.Paginate.setCardHolder(current_tab[0]); // sets target to be filled with data
				StuffBrowser.Card.setProductSource(); // use the JSON for want/have/had
				
				// retrieve products if they are not set yet
				if( StuffBrowser.products[current_tab[1]] < 1 )
					Base.Ajax.getStuffList(current_tab[1], -1, -1, afterStuffReceived);
				else
					afterStuffReceived();
				
				return false; // cancel link action
			});
		});
	}
	
	function afterStuffReceived()
	{
		$('#stuff-browser > .select-view:eq('+ StuffBrowser.View.getCurrent() +')').trigger('click');
		StuffBrowser.tabClicked = false;
		StuffBrowser.ajax_content_received[current_tab[1]] = true;
	}
	
	return {
		tabClicked: false, // internal check to determine wether view should be reloaded or just show the hidden content
		
		// Stuffbrowser settings
		default_view: 0,  // 0 = first
		default_card: 1,  // 1 = first. Default card to show when changing tabs/view
		load_cards: 3,     // nr of cards to load. Minimum is 3 which loads the middle card and 1 on each side
		card_width: 700,
		slide_speed: 500, // slide speed of cards
		
		// default message to show when there's no stuff. This should always be overwritten in footer-javascript.ftl
		nostuff_message: 'You have no stuff in this list',
		
		// Set DEFAULT TAB in init function
		
		// products [want, have, had]
		products: [[], [], []], // is filled on tabclick by Base.Ajax
		ajax_content_received: [false, false, false], // only need to collect content once
		
		/**
		 * Return jQuery selector for the current tab
		 * @param {Bool} rtn_index Return tab index instead of jQuery selector
		 */
		getCurrentTab: function(rtn_index){
			if( typeof rtn_index == 'undefined' || !rtn_index )
				return current_tab[0]; // return string
			return current_tab[1]; // return index
		},
		
		/**
		 * Retrieve the nr of last card for current tab & view
		 */
		getLastCardNr: function()
		{
			return max_cards[current_tab[1]][StuffBrowser.View.getCurrent()];
		},
		
		/**
		 * Init the display 'kwicks' in the first view
		 * 
		 * @param {String} card Bind event to specific card only
		 */
		initKwicks: function(card_nr)
		{
			var items = $(current_tab[0] +' .card'+ card_nr +' .item');
			var maxWidth = 355;
			
			switch( items.length ){
				case 0:
					return;
				
				case 1:
				case 2: // change css so the items are fully visible
					items.each(function(){
						$(this).children('div').css('left', 0);
						$(this).css('width', '347px');
					});
					return;
				
				case 3:
					var offset = (700 - (items.length * parseInt(items.eq(0).css('width')))) / 2;
					items.parent().css('left', offset +'px');
					break;
			}
			
			$(current_tab[0] +' .card'+ card_nr +' .itemlist').kwicks({
				max: maxWidth,
				spacing: 5,
				event: 'mouseenter',
				rightOffset: 0,
				contentAdjust: -30
			});
		},
		
		/**
		 * Initialize this Class
		 */
		init: function(){
			if( $('#stuff-browser').length != 1 ) return false;
			
			if( !StuffBrowser.list_count ) // TODO: REMOVE BEFORE GOING LIVE
				alert('StuffBrowser.list_count not set in footer-javascript');
			
			current_tab = ['#stuff-want', 0]; // SET DEFAULT TAB HERE
			
			// Init child classes
			StuffBrowser.View.init();
			StuffBrowser.Paginate.init();
			StuffBrowser.Card.init();
			
			// Calculate max cards
			var tabs = $('#stufftabs > .tabs-container span');
			$.each(StuffBrowser.list_count, function(t){
				for( var v = 0; v < 3; v++ ){ // 3 = nr of views
					max_cards[t][v] = Math.ceil(StuffBrowser.list_count[t] / StuffBrowser.View.getViewData(v).max_items) || 1;
				}
				tabs.eq(t).append(StuffBrowser.list_count[t]); // add number of products to tab (minus 1 because count doesn't work right when logged in...)
			});
			
			// The infoTabs plugin triggers click on the default tab. This will load the cards
			bindTabEvents();
			$('#stufftabs').infoTabs({tabContentSeletor:'div'});
			
			// Last priority init
			StuffBrowser.Tooltip.init();
		}
	};
}(jQuery);

/* Initialize this class */
Base.register(StuffBrowser.init);