/*!
 * jQuery EPGWall - v0.0.1
 * http://www.nextrek.net/
 *
 * Copyright 2013, Diego 'Kernel78' Ruega
 *
 * Dual licensed under the MIT and GPL v2 licenses:
 * http://www.opensource.org/licenses/mit-license.php
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * jQuery("#epg-live").epgwall({channels:['live_streaming']});
 * jQuery("#epg-Rai1").epgwall({channels:['Rai 1']});
 * jQuery("#epg-RaiTutti").epgwall({channels:['Rai%']});
 */

(function($, window, undefined)
{
	$.fn.epgwall = function(settings)
	{
		/**
		 * settings and configuration data
		 * @var array
		 */
		var configuration = {
			channels : null,
			centerTimeline : true,

			// general
			bind : "event", // event, load, etc..
			threshold : 300,
			fallbackHeight : 400,
			visibleOnly : true, // load EPG only if element is visible

			// attribute
			attribute : "epgwall-status",

			// delay
			delay : -1, // amount of time before window.load to delay loading

			// show-effect
			effect : "show",
			effectTime : 0,

			// user-callback
			beforeLoad : null,
			afterLoad : null,

			minutes_to_pixels : 8,
			horizontal_scrolling_in_minutes : 60,

			timeline_height : 43,
			single_channel_height : 32,
			floating_left_panel_width : 150,

			blockCSS : {
				css : {
					border : 'none',
					padding : '15px',
					backgroundColor : '#000',
					'-webkit-border-radius' : '10px',
					'-moz-border-radius' : '10px',
					opacity : .5,
					color : '#fff'
				}
			}
		}

		// overwrite configuration with custom user settings
		if (settings) $.extend(configuration, settings);

		// all given items by jQuery selector
		var items = this;

		// on first page load get initial images
		if (configuration.bind == "load")
		{
			$(window).load(function()
			{
				_init();
			});
		}

		// if event driven don't wait for page loading
		else if (configuration.bind == "event")
		{
			_init();
		}

		/**
		 * nextrek2Unix
		 * 
		 * from a nextrek timestamp (format YYYYMMDDHHmmSS) returns a Unix timestamp in minutes
		 * 
		 * @return long
		 */
		function nextrek2unix(timestamp)
		{
			return (new Date(timestamp.substr(0, 4), timestamp.substr(4, 2)-1, timestamp.substr(6, 2), timestamp.substr(8, 2), timestamp.substr(10, 2), 0, 0).getTime()) / (60 * 1000);
		}

		/**
		 * unix2date
		 * 
		 * from a timestamp in minutes  returns a Date object
		 * 
		 * @return Date
		 */
		function unix2date(timestamp)
		{
			return new Date(timestamp * (60 * 1000));
		}

		function loadOneEPG(element)
		{
			if ((!element.attr(configuration.attribute) || (element.attr(configuration.attribute) == "need-refresh")) && (!configuration.visibleOnly || element.is(":visible")))
			{
				element.attr(configuration.attribute, "loading");

				// trigger function before loading image
				if (configuration.beforeLoad) configuration.beforeLoad(element);

				element.empty();
				element.block(configuration.blockCSS);

				var params = null;
				
				if (configuration.channels != null) {
					params = { channels : configuration.channels };
				}
				
				$.ajax({
					url : "get_epg.php",
					dataType : 'json',
					data : params,
					success : function(data, stato)
					{
						element.attr(configuration.attribute, "loaded");
						element.unblock();

						var left_floating_panel = $('<div class="lista_canali" style="width:' + configuration.floating_left_panel_width + 'px"></div>');

						var top_cursor = configuration.timeline_height;
						
						// calc timeline extends
						var last_timestamp = 0;
						var first_timestamp = null;

						for (var canale in data)
						{
							var programmi = data[canale];

							var div_canale = $('<div class="canale" style="top:' + top_cursor + 'px;height:' + configuration.single_channel_height + 'px"></div>');

							var div_infobox = $('<div class="infobox" style="top:' + top_cursor + 'px"><img src="logo/' + canale + '.png"/></div>');

							top_cursor += configuration.single_channel_height;

							left_floating_panel.append(div_infobox);

							var reference_timestamp = nextrek2unix(programmi[0]['timestamp'].substr(0, 8) + "0000");
							if (first_timestamp == null) {
								first_timestamp = reference_timestamp;
							}
							
							var programma = programmi[programmi.length-1];
							var ts = nextrek2unix(programma['timestamp']) + programma['durata']*1;
							if (last_timestamp < ts)
							{
								last_timestamp = ts;
							}
							
							for ( var index in programmi)
							{
								var programma = programmi[index];
								var div_programma = $('<div class="programma"><span>' + programma['titolo'] + '</span></div>');
								var ts = nextrek2unix(programma['timestamp']);

								div_programma.css('left', configuration.floating_left_panel_width + ((ts - reference_timestamp) * configuration.minutes_to_pixels));

								div_programma.css('width', (programma['durata'] * configuration.minutes_to_pixels) - 1);

								div_canale.append(div_programma);
							}

							element.append(div_canale);
						}

						// append left_floating_panels
						element.append(left_floating_panel);

						var div_timeline = $('<div class="timeline"></div>');

						element.append(div_timeline);

						//* build timeline
						var weekday=['Domenica','Luned&igrave;','Marted&igrave;','Mercoled&igrave;','Gioved&igrave;','Venerd&igrave;','Sabato'];

						for ( var ts = reference_timestamp; ts < last_timestamp; ts += 30 )
						{
							var date = unix2date(ts);
							var left = configuration.floating_left_panel_width + ((ts - reference_timestamp) * configuration.minutes_to_pixels);
							var ore = date.getHours();
							var minuti = date.getMinutes();
							var HHMM = ("0" + ore).slice(-2) + ':' + ("0" + minuti).slice(-2);
							
							classe = '';
							if (minuti !=0) {
								classe = ' minuti'
							} else {
								var giorno = date.getDate();

								giorno += ' ' + weekday[date.getDay()];
								
								var div_giorno = $('<div class="giorno" style="left:' + left + 'px">' + giorno + '</div>');
								div_timeline.append(div_giorno);
							}
							
							var div_ora = $('<div class="ora' + classe + '" style="left:' + left + 'px">' + HHMM + '</div>');
							div_timeline.append(div_ora);
						}
						
						var right = configuration.floating_left_panel_width + ((30 + last_timestamp - reference_timestamp) * configuration.minutes_to_pixels);
						div_timeline.css('height', configuration.timeline_height);
						div_timeline.css('width', right);
						$('.canale',element).each(function()
						{
							$(this).css('width', right);
						});
						
						if (configuration.centerTimeline) {
							
							var now = parseInt((new Date().getTime()) / (60*1000));
							var real_width = parseInt($(element).css('width'));
							var right = configuration.floating_left_panel_width + ((now - reference_timestamp) * configuration.minutes_to_pixels) - parseInt(real_width/2);
							$(element).animate({scrollLeft : right});

						}

						// trigger function after loading image
						if (configuration.afterLoad) configuration.afterLoad(element);
					},
					error : function(richiesta, stato, errori)
					{
						//element.attr(configuration.attribute, "loaded");
						//element.unblock();
						//alert("E' evvenuto un errore. Il stato della chiamata: "+stato);
						// trigger function after loading image
						//if (configuration.afterLoad) configuration.afterLoad(element);
					}
				});
			}
		}
		
		/**
		 * lazyLoad()
		 * 
		 * check and load all needed EPGs
		 * 
		 * @return void
		 */
		function lazyLoad()
		{
			items.each(function()
			{
				loadOneEPG( $(this) );
			});
		}

		/**
		 * reloadEPG()
		 *
		 * request to reload EPG
		 *
		 * @return void
		 */
		// plugin method for request 
		$.fn.reloadEPG = function(opts)
		{
			return this.each(function()
			{
				_reloadEPG($(this), opts);
			});
		};
		function _reloadEPG(element, opts)
		{
			element.attr(configuration.attribute, "need-refresh");
			element.stop(); // stop eventually running animation
			loadOneEPG( element );
		}

		/**
		 * _init()
		 *
		 * initialize lazy plugin
		 * bind loading to events or set delay time to load all EPGs at once
		 *
		 * @return void
		 */
		function _init()
		{
			/*
			 * bind left and right scrollers
			 */
			items.each(function()
			{
				var element = $(this);

				function startRightScrolling()
				{
					// continually increase scroll position
					if (element.attr(configuration.attribute) == "loaded") {
						element.animate({scrollLeft : '+=' + (configuration.minutes_to_pixels * configuration.horizontal_scrolling_in_minutes)}, startRightScrolling);
					}
				}

				function startLeftScrolling()
				{
					// continually increase scroll position
					if (element.attr(configuration.attribute) == "loaded") {
						element.animate({scrollLeft : '-=' + (configuration.minutes_to_pixels * configuration.horizontal_scrolling_in_minutes)}, startLeftScrolling);
					}
				}

				function stopScrolling()
				{
					// stop increasing scroll position
					element.stop();
				}

				var div_parent = element.parents('div:eq(0)');

				$(div_parent.find('.next')).mousedown(startRightScrolling).mouseup(stopScrolling).mouseout(stopScrolling);

				$(div_parent.find('.prev')).mousedown(startLeftScrolling).mouseup(stopScrolling).mouseout(stopScrolling);

				/*
				 * Bind a scroll listner to the left_floating_div
				 */
				var container = $(element);
				container.scroll(function()
				{
					$(element.find('.lista_canali')).css('left', container.scrollLeft());
					$(element.find('.timeline')).css('top', container.scrollTop());
				});
			});

			// if delay time is set load all images at once after delay time
			if (configuration.delay >= 0)
			{
				setTimeout(lazyLoad, configuration.delay);
			}

			// if no delay is set
			if (configuration.delay < 0)
			{
				// bind lazy load functions to scroll and resize event
				//$(window).bind("scroll", _throttle(configuration.throttle, lazyLoadImages));
				//$(window).bind("resize", _throttle(configuration.throttle, lazyLoadImages));

				// load initial images
				lazyLoad();
			}
		}

		/**
		 * _isInLoadableArea(element)
		 * 
		 * try to allocate current viewport height of the browser
		 * uses fallback option when no height was found
		 * 
		 * @param jQuery element
		 * @return integer
		 */
		function _isInLoadableArea(element)
		{
			var top = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;

			if ((top + _getActualHeight() + configuration.threshold) > (element.offset().top + element.height()))
			{
				return true;
			}

			return false;
		}

		/**
		 * _getActualHeight()
		 * 
		 * try to allocate current viewport height of the browser
		 * uses fallback option when no height is found
		 * 
		 * @return integer
		 */
		function _getActualHeight()
		{
			if (window.innerHeight)
			{
				return window.innerHeight;
			}

			if (document.documentElement && document.documentElement.clientHeight)
			{
				return document.documentElement.clientHeight;
			}

			if (document.body && document.body.clientHeight)
			{
				return document.body.clientHeight;
			}

			if (document.body && document.body.offsetHeight)
			{
				return document.body.offsetHeight;
			}

			return configuration.fallbackHeight;
		}

		/**
		 * _throttle(delay, call)
		 * 
		 * helper function to throttle down event triggering
		 * 
		 * @param integer delay
		 * @param object function call
		 * @return function object
		 */
		function _throttle(delay, call)
		{
			var _timeout;
			var _exec = 0;

			function callable()
			{
				var elapsed = +new Date() - _exec;

				function run()
				{
					_exec = +new Date();
					call.apply();
				}
				;

				_timeout && clearTimeout(_timeout);

				if (elapsed > delay || !configuration.enableThrottle)
				{
					run();
				}
				else
				{
					_timeout = setTimeout(run, delay - elapsed);
				}
			}

			return callable;
		}

		return this;
	}

})(jQuery, window);