// 
//  crown-whatson.js
//  Crown What's On JavaScript
//  
//  Created by Victor Nguyen on 2009-08-22.
//  Copyright 2009 igloo digital. All rights reserved.
// 

// WhatsOn-specific functionality
Crown.WhatsOn = {
	
	NEXT_ID: 'btn_whatson_browser_nav_next',
	PREV_ID: 'btn_whatson_browser_nav_prev',
	TODAY_ID: 'btn_whatson_browser_nav_today',
	
	EVENTS_WRAPPER_ID: 'whatson_browser_events_wrapper', // surrounding overflown element that scrolls child holder element
	EVENTS_HOLDER_ID: 'whatson_browser_events_holder',
	EVENTS_GROUP_CLASS: 'whatson_browser_events_group',
	EVENTS_GROUP_CLASS_ERROR: 'whatson_browser_events_group_error',
	EVENTS_GROUP_GARBAGE_ID: 'whatson_browser_events_group_garbage',
	UPDATE_NEXT_HOLDER: 'whatson_browser_events_next',
	UPDATE_PREV_HOLDER: 'whatson_browser_events_prev',
	
	LOADING_ID: 'loading_whatson_browser_nav',
	
	SCROLL_DURATION: 700,
	
	AJAX_URL: '/ajax/whatson-date/', // path of events ajax request, modify this to integrate, pieced together in Crown.WhatsOn.Scroller.updateEvents
	AJAX_ERROR_MSG: 'Sorry! There was a problem getting events for that date.<br />Please refresh the page and try again.',
	
	IsAnimating: false,
	
	init: function () {
		Crown.WhatsOn.VideoPlayer.init();
		if ($('#' + Crown.WhatsOn.EVENTS_WRAPPER_ID).val() == null) { return false; } // checks if event browser exists
		
		$('#' + Crown.WhatsOn.LOADING_ID).hide();
		Crown.WhatsOn.Dates.init();
		Crown.WhatsOn.Scroller.init();
		Crown.WhatsOn.DatePicker.init();
		Crown.WhatsOn.CategoryDropDown.init();
		
		$('#' + Crown.WhatsOn.NEXT_ID).click(function(){
			if (Crown.WhatsOn.IsAnimating == true) { return false; };
			Crown.WhatsOn.Scroller.scrollHolder('next');
			Crown.WhatsOn.Scroller.updateEvents(Crown.WhatsOn.Dates.Next_Formatted, $('#' + Crown.WhatsOn.UPDATE_NEXT_HOLDER));
			Crown.WhatsOn.Dates.setActive(Crown.WhatsOn.Dates.Next);
			return false;
		});
		
		$('#' + Crown.WhatsOn.PREV_ID).click(function(){
			if (Crown.WhatsOn.IsAnimating == true) { return false; };
			Crown.WhatsOn.Scroller.scrollHolder('prev');
			Crown.WhatsOn.Scroller.updateEvents(Crown.WhatsOn.Dates.Prev_Formatted, $('#' + Crown.WhatsOn.UPDATE_PREV_HOLDER));
			Crown.WhatsOn.Dates.setActive(Crown.WhatsOn.Dates.Prev);
			return false;
		});
		
		$('#' + Crown.WhatsOn.TODAY_ID).click(function(){
			if (Crown.WhatsOn.IsAnimating == true) { return false; };
			if (Crown.WhatsOn.Dates.Active > Crown.WhatsOn.Dates.TODAY) {
				// console.log('active is later than today');
				Crown.WhatsOn.Scroller.scrollHolder('prev');
				Crown.WhatsOn.Scroller.updateEvents(Crown.WhatsOn.Dates.TODAY_FORMATTED, $('#' + Crown.WhatsOn.UPDATE_PREV_HOLDER));
			} else {
				// console.log('active is earlier than today');
				Crown.WhatsOn.Scroller.scrollHolder('next');
				Crown.WhatsOn.Scroller.updateEvents(Crown.WhatsOn.Dates.TODAY_FORMATTED, $('#' + Crown.WhatsOn.UPDATE_NEXT_HOLDER));
			}
			Crown.WhatsOn.Dates.setActive(Crown.WhatsOn.Dates.TODAY);
			return false;
		});
	},
	
	Dates: {
		
		SERVERDATE_ID: 'crown_server_date',
		
		NEXTPREV_INCREMENT: 3,
		
		TODAY_SERVER: {
			DATE: null,
			MON: null,
			YEAR: null
		},
		
		TODAY: null,
		TODAY_FORMATTED: null,
		
		Active: null,
		Active_Formatted: null,
		
		Next: null,
		Next_Formatted: null,
		
		Prev: null,
		Prev_Formatted: null,
		
		init: function () { // init all date vars on first load ...
			Crown.WhatsOn.Dates._setToday();
			Crown.WhatsOn.Dates.setActive(Crown.WhatsOn.Dates.TODAY);
		},
		
		setActive: function (dateobj) { // runs when next, prev or today are clicked
			Crown.WhatsOn.Dates.Active = dateobj;
			Crown.WhatsOn.Dates.Active_Formatted = Crown.WhatsOn.Dates._formatDate(dateobj);
			// console.log('active: ', Crown.WhatsOn.Dates.Active_Formatted);

			// set next and prev dates based on active date ...
			Crown.WhatsOn.Dates._setNext();
			Crown.WhatsOn.Dates._setPrev();

			// hide back to today button if active date == today's date
			if (Crown.WhatsOn.Dates.Active_Formatted == Crown.WhatsOn.Dates.TODAY_FORMATTED) {
				$('#' + Crown.WhatsOn.TODAY_ID).hide();
			} else {
				$('#' + Crown.WhatsOn.TODAY_ID).show();
			}

			// update datepicker with active date
			// (possibly do not init this on load so 'Jump to date' default text is displayed until user interacts with the datepicker?)
			Crown.WhatsOn.DatePicker.updateActiveDate(dateobj);
		},
		
		_setToday: function () { // sets today's date, run once on init
			Crown.WhatsOn.Dates._setTodayFromServer();
			var today = new Date(Crown.WhatsOn.Dates.TODAY_SERVER.YEAR, Crown.WhatsOn.Dates.TODAY_SERVER.MON, Crown.WhatsOn.Dates.TODAY_SERVER.DATE);
			Crown.WhatsOn.Dates.TODAY = today;
			Crown.WhatsOn.Dates.TODAY_FORMATTED = Crown.WhatsOn.Dates._formatDate(today);
			// console.log('today: ', Crown.WhatsOn.Dates.TODAY);
			// console.log('today: ', Crown.WhatsOn.Dates.TODAY_FORMATTED);
		},
		
		_setTodayFromServer: function () {
			var server_date = $('#' + Crown.WhatsOn.Dates.SERVERDATE_ID).attr('value');
			Crown.WhatsOn.Dates.TODAY_SERVER.DATE = server_date.split('/')[0];
			Crown.WhatsOn.Dates.TODAY_SERVER.MON = parseInt(server_date.split('/')[1], 10) - 1;
			Crown.WhatsOn.Dates.TODAY_SERVER.YEAR = server_date.split('/')[2];
			// console.log(server_date.split('/')[0]);
			// console.log(parseInt(server_date.split('/')[1], 10));
			// console.log(server_date.split('/')[2]);
		},

		_setNext: function (today) {
			var next = new Date(Crown.WhatsOn.Dates.Active);
			next.setDate(next.getDate() + Crown.WhatsOn.Dates.NEXTPREV_INCREMENT);
			Crown.WhatsOn.Dates.Next = next;
			Crown.WhatsOn.Dates.Next_Formatted = Crown.WhatsOn.Dates._formatDate(next);
			// console.log('next: ', Crown.WhatsOn.Dates.Next_Formatted);
		},

		_setPrev: function (today) {
			var prev = new Date(Crown.WhatsOn.Dates.Active);
			prev.setDate(prev.getDate() - Crown.WhatsOn.Dates.NEXTPREV_INCREMENT);
			Crown.WhatsOn.Dates.Prev = prev;
			Crown.WhatsOn.Dates.Prev_Formatted = Crown.WhatsOn.Dates._formatDate(prev);
			// console.log('prev: ', Crown.WhatsOn.Dates.Prev_Formatted);
		},

		_formatDate: function (dateobj) { // takes a Date() object and returns a 'dd-mm-yyyy' string for passing into Crown.WhatsOn.Scroller.updateEvents() 
			var date = dateobj.getDate();
			date = (date < 10) ? '0' + date : date;
			var mon = (dateobj.getMonth());
			mon = mon + 1;
			mon = (mon < 10) ? '0' + mon : mon;
			var year = dateobj.getFullYear();
			var formatted_date = date + '-' + mon + '-' + year;
			return formatted_date;
		}
		
	},
	// end Dates
		
	
	Scroller: {
		
		WRAPPER_EL: null,
		HOLDER_EL: null,
		GROUP_WIDTH: null,
		
		Scroll_Value: null,
		
		init: function () {
			Crown.WhatsOn.Scroller.WRAPPER_EL = $('#' + Crown.WhatsOn.EVENTS_WRAPPER_ID);
			Crown.WhatsOn.Scroller.HOLDER_EL = $('#' + Crown.WhatsOn.EVENTS_HOLDER_ID);
			Crown.WhatsOn.Scroller.GROUP_WIDTH = $('.' + Crown.WhatsOn.EVENTS_GROUP_CLASS).outerWidth();		
		},
		
		
		// still should roll scrollHolder() and updatesEvents() into one as they are always run together ...
		// the problem is prepareevent function creates target div before ajax request goes out
		// the solution is to have prepareevent return target and pass to ajax request BANG
		scrollHolder: function (direction) {
			// set loading state
			Crown.WhatsOn.IsAnimating = true;
			$('#' + Crown.WhatsOn.LOADING_ID).show();

			// tag event group that's scrolling away
			Crown.WhatsOn.Scroller.HOLDER_EL.children('.' + Crown.WhatsOn.EVENTS_GROUP_CLASS).attr('id', Crown.WhatsOn.EVENTS_GROUP_GARBAGE_ID);

			// prepare event group area
			Crown.WhatsOn.Scroller._prepareEventGroup(direction);
			
			// scroll holder into position
			Crown.WhatsOn.Scroller.WRAPPER_EL.scrollTo(Crown.WhatsOn.Scroller.Scroll_Value, Crown.WhatsOn.SCROLL_DURATION, {
				axis:'x',
				onAfter: Crown.WhatsOn.Scroller._resetEventGroup
			});

		},
		
		updateEvents: function (date_param, area_to_update) {
			$.ajax({
			  url: Crown.WhatsOn.AJAX_URL + date_param + '.html', // pieces together ajax request, modify this to integrate
			  cache: true,
			  success: function(html){
			    area_to_update.replaceWith(html);
			  },
				error: function() {
					area_to_update.replaceWith(Crown.WhatsOn.Scroller._createErrorHTML());
				}
			});
		},
		
		_createErrorHTML: function () {
			var error_msg = $('<div></div>')
				.addClass(Crown.WhatsOn.EVENTS_GROUP_CLASS)
				.addClass(Crown.WhatsOn.EVENTS_GROUP_CLASS_ERROR)
				.append(Crown.WhatsOn.AJAX_ERROR_MSG);
			return error_msg;
		},
		
		_prepareEventGroup: function (direction) { // create new element (depending on scroll direction) for ajax reponse to load into
			if (direction == 'next') {
				Crown.WhatsOn.Scroller.HOLDER_EL.append('<div class="'+ Crown.WhatsOn.EVENTS_GROUP_CLASS +'" id="'+ Crown.WhatsOn.UPDATE_NEXT_HOLDER +'"></div>');
				Crown.WhatsOn.Scroller.Scroll_Value = Crown.WhatsOn.Scroller.GROUP_WIDTH;
			} else if (direction == 'prev') {
				Crown.WhatsOn.Scroller.HOLDER_EL.prepend('<div class="'+ Crown.WhatsOn.EVENTS_GROUP_CLASS +'" id="'+ Crown.WhatsOn.UPDATE_PREV_HOLDER +'"></div>');
				Crown.WhatsOn.Scroller.WRAPPER_EL.scrollTo(Crown.WhatsOn.Scroller.GROUP_WIDTH, {axis:'x'});
				Crown.WhatsOn.Scroller.Scroll_Value = '0';
			}			
		},
		
		_resetEventGroup: function () { // remove event group that scrolled out of view and reset scroll position of holder
			Crown.WhatsOn.Scroller.HOLDER_EL.children('#' + Crown.WhatsOn.EVENTS_GROUP_GARBAGE_ID).remove();
			Crown.WhatsOn.Scroller.WRAPPER_EL.scrollTo('0', {axis:'x'});
			Crown.WhatsOn.IsAnimating  = false;
			$('#' + Crown.WhatsOn.LOADING_ID).hide();
		}
		
	},
	// end Scroller
	
	
	DatePicker: {
		
		FORM_ID: 'form_whatson_browser_nav_date',
		DATEFIELD_ID: 'whatson_browser_nav_date',
		DATEFIELD_VALUE_ID: 'whatson_browser_nav_date_formatted',
		
		MONTH_NAMES: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
		DAY_NAMES: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
		
		init: function () {			
			var date_field = $('#' + Crown.WhatsOn.DatePicker.DATEFIELD_ID);
			var date_value = $('#' + Crown.WhatsOn.DatePicker.DATEFIELD_VALUE_ID);
			date_field.datepicker({
				// dateFormat: 'dd/mm/yy',
				dateFormat: 'DD, d M yy',
				showAnim: 'slideDown',
				duration: 250,
				firstDay: 1,
				altField: date_value, // set date in alternative format in hidden input value (so it can be compared with other dates in this object)
				altFormat: 'dd-mm-yy',
				constrainInput: true
			});
			
			$('#' + Crown.WhatsOn.DatePicker.FORM_ID).submit(Crown.WhatsOn.DatePicker._goToDate);
		},
		
		updateActiveDate: function (active_date) {
			// $('#' + Crown.WhatsOn.DatePicker.DATEFIELD_ID).attr({value: this._convertDateToDateRequest(active_date).join('/')});
			$('#' + Crown.WhatsOn.DatePicker.DATEFIELD_ID).attr({value: this._getFormattedDateFromDateObj(active_date)});
			$('#' + Crown.WhatsOn.DatePicker.DATEFIELD_VALUE_ID).attr({value: this._convertDateToDateRequest(active_date).join('-')});
		},
		
		_getFormattedDateFromDateObj: function (dateobj) {
			var day = Crown.WhatsOn.DatePicker.DAY_NAMES[dateobj.getDay()];
			var date = dateobj.getDate();
			var mon = Crown.WhatsOn.DatePicker.MONTH_NAMES[dateobj.getMonth()];
			var year = dateobj.getFullYear();
			return day + ', ' + date + ' ' + mon + ' ' + year;
		},
		
		_createDateFromDatePicker: function (datepicker_date) {
			var year = datepicker_date.split('-')[2];
			var mon = parseInt(datepicker_date.split('-')[1], 10) - 1;
			var date = datepicker_date.split('-')[0];
			var date_new = new Date(year, mon, date);
			// console.log('picked date', date_new);
			return date_new;
		},
		
		_goToDate: function () {
			if (Crown.WhatsOn.IsAnimating == true) { return false; };
			
			var date_picked = Crown.WhatsOn.DatePicker._createDateFromDatePicker($('#' + Crown.WhatsOn.DatePicker.DATEFIELD_VALUE_ID).attr('value'));
			
			// if equal, do nothing
			if (Crown.WhatsOn.DatePicker._convertDateToDateRequest(date_picked).join('-') == Crown.WhatsOn.DatePicker._convertDateToDateRequest(Crown.WhatsOn.Dates.Active).join('-')) {
				// console.log('SAME!!!!!!!');
				return false;
			}
			
			if (Crown.WhatsOn.Dates.Active > date_picked) {
				// console.log('picked date going backward');
				Crown.WhatsOn.Scroller.scrollHolder('prev');
				Crown.WhatsOn.Scroller.updateEvents($('#' + Crown.WhatsOn.DatePicker.DATEFIELD_VALUE_ID).attr('value'), $('#' + Crown.WhatsOn.UPDATE_PREV_HOLDER));
				Crown.WhatsOn.Dates.setActive(date_picked);
			} else {
				// console.log('picked date going forward');
				Crown.WhatsOn.Scroller.scrollHolder('next');
				Crown.WhatsOn.Scroller.updateEvents($('#' + Crown.WhatsOn.DatePicker.DATEFIELD_VALUE_ID).attr('value'), $('#' + Crown.WhatsOn.UPDATE_NEXT_HOLDER));
				Crown.WhatsOn.Dates.setActive(date_picked);
			}
			
			return false;
		},
		
		_convertDateToDateRequest: function (dateobj) {
			var date = dateobj.getDate();
			date = (date < 10) ? '0' + date : date;
			var mon = (dateobj.getMonth()) + 1;
			// console.log('datepicker month', mon);
			mon = (mon < 10) ? '0' + mon : mon;
			var year = dateobj.getFullYear();
			return [date,mon,year];
		}
		
	},
	// end DatePicker
	
	
	CategoryDropDown: {
		
		FORM_ID: 'form_whatson_browser_nav_category',
		SELECT_ID: 'whatson_browser_nav_category',
		EXCLUDE_VALUE: 'exclude', // value of select[option] to exclude when submitting form
		
		init: function () {
			$('#' + Crown.WhatsOn.CategoryDropDown.FORM_ID).submit(function(){
				var location = $('#' + Crown.WhatsOn.CategoryDropDown.SELECT_ID).find(':selected').val();
				if (location == Crown.WhatsOn.CategoryDropDown.EXCLUDE_VALUE) return false;
				window.location = location;
				return false;
			});
		}
		
	},
	// CategoryDropDown

	VideoPlayer: {
		
		SWF_PATH: '/library/flash/whatson/videoplayer.swf',
		BUTTON_CLASS: 'btn_ent_play_video',
		NOFLASH_HTML: '<div class="ent_noflash">To view video, please download and install the free <a href="http://www.adobe.com/go/getflashplayer" target="_blank">Adobe Flash Player</a></div>',
		
		FLV_PATH: '',
		
		Embedded: false,
		
		init: function () {
			Crown.WhatsOn.VideoPlayer.Embedded = false;

			$('.' + Crown.WhatsOn.VideoPlayer.BUTTON_CLASS).click(function() {
				Crown.WhatsOn.VideoPlayer._scrollIntoView(Crown.WhatsOn.VideoPlayer._getHolderId($(this)));
				if (Crown.WhatsOn.VideoPlayer.Embedded == true) { return false; }
				Crown.WhatsOn.VideoPlayer._embed(Crown.WhatsOn.VideoPlayer._getHolderId($(this)), Crown.WhatsOn.VideoPlayer._getVars($(this)));
				return false;
			});
			
		},
		
		_getHolderId: function (link) {
			var holder_id = link.attr('href').split('#').slice(1);
			if (Crown.Common.isEmpty(holder_id)) {
				return null;
			} else {
				return holder_id;
			}
		},
		
		_getVars: function (link) {
			return link.attr('rel');
		},
		
		_disableParentLink: function (holder_id) {
			var direct_parent = $('#' + holder_id).parent('a');
			if (!(direct_parent.val() == null)) {
				direct_parent.click(function(){ return false; });
			}
		},
		
		_embed: function (holder_id, video_var) {
			
			if ((Crown.Common.isEmpty(holder_id)) || (Crown.Common.isEmpty(video_var))) { return false; }
			
			var flashvars = {
				'path': Crown.WhatsOn.VideoPlayer.FLV_PATH,
				'flv': video_var
			};

			var params = {
				allowScriptAccess: "always",
				wmode: 'opaque',
				allowFullScreen: 'true'
			};

			var attributes = {

			};

			swfobject.embedSWF(Crown.WhatsOn.VideoPlayer.SWF_PATH, holder_id, "587", "315", Crown.Common.Flash.MIN_VERSION, Crown.Common.Flash.EXPRESSINSTALL_PATH, flashvars, params, attributes, Crown.WhatsOn.VideoPlayer._embedCallBack);

			Crown.WhatsOn.VideoPlayer.Embedded = true;
		},
		
		_scrollIntoView: function (holder_id) {
			$(document).scrollTo($('#' + holder_id), 500, {axis:'y', offset:-58});
		},
		
		_embedCallBack: function (e) {
			if ((e.success == false) && (Crown.WhatsOn.VideoPlayer.Embedded == false)) {
				$('.' + Crown.WhatsOn.VideoPlayer.BUTTON_CLASS).after(Crown.WhatsOn.VideoPlayer.NOFLASH_HTML);
			} else {
				Crown.WhatsOn.VideoPlayer._disableParentLink(e.id);
			}
		}
		
	}	
};


// on domready
$(document).ready(function(){
	Crown.WhatsOn.init();
});