/**
 * 	Date			: May 13, 2009
 *		Author		: Paul Warelis
 *		Copyright	: Dine.TO (www.dine.to)
 *		Description	: Slider control for movie showtimes
 *
 *		Content is in .timeSlideContent span
 */

(function($) {

	$.fn.timeSlide = function(keepStructure) {

		return this.each(function() {
			var $this = $(this);
			
			var wrapContent = typeof keepStructure != "undefined";
			if (!wrapContent) {
				$this.html("<div class='arrow'><img src='images/movies/right.png'></div>\
								<div class='timeSlideWrap'><div class='timeSlideContent'>&nbsp;</div></div>\
								<div class='arrow'><img src='images/movies/left.png'></div>");
			}
			if($.browser.msie) { // IE fix
				$this.find(".timeSlideContent").css("display", "block");
			}
			// Set everthing's size
			var kids = $this.children();
			var wraper = kids.eq(1);	// timeSlideWrap div
			wraper.width($this.width() - (2*kids.eq(0).outerWidth()));

			wraper.mousemove($.fn.timeSlide.handleMouseMove);
			$this.mouseleave($.fn.timeSlide.handleMouseLeave);
			
			if (wrapContent) {
				setArrows($this);

				if ($this.hasClass("buyTickets")) {
					$this.find(".showtimeContainer span")
							.click($.fn.timeSlide.buyTickets)
							.simpletip({
						   	fixed: true,
								position: "top",
								offset: [0, -15],
								showTime: 0,
								hideEffect: "none",
								baseClass: "timetooltip",
								onBeforeShow: buildTooltip
						   });
				}
			}

		});
		
	};

	// Loads new content into the scroll container
	$.fn.loadShowtimes = function(theaterId, movieId, dayOffset) {
		return this.each(function() {
			var target = this;
			$(this).find(".timeSlideContent").html("<img src='images/indicator.gif'>");
			// Hide both arrows
			$(this).find(".arrow img").hide();
			$.post(ajaxFile, {
					action		: "loadDayShowtimes",
					theaterId	: theaterId,
					movieId		: movieId,
					dayOffset	: dayOffset
				}, function (data) {
					var $this = $(target);
					
					if (errorDetected(data)) return;

					var content = $this.find(".timeSlideContent").html(data.showtimeListHtml);
					setArrows($this);
					if ($this.hasClass("buyTickets")) {
						$this.find(".showtimeContainer span").click($.fn.timeSlide.buyTickets)
						.simpletip({
					   	fixed: true,
							position: "top",
							offset: [0, -15],
							showTime: 0,
							hideEffect: "none",
							baseClass: "timetooltip",
							onBeforeShow: buildTooltip
					   });
					}
				},
			"json");
		});
	};

	function buildTooltip() {
		var timeEl = this.getParent();
		var api = timeEl.simpletip();
		var day = $(timeEl).parents(".buyTickets").next().find("span").html();

		var max = $(timeEl).html().indexOf("<");
		var timeOnly = $(timeEl).html().substr(0, max);

		api.update("<b>Buy tickets online</b><br/>"+day+" at "+timeOnly);
	}

	$.fn.timeSlide.buyTickets = function() {
		var $this = $(this);
		var max = this.innerHTML.indexOf("<");
		var timeOnly = this.innerHTML.substr(0, max);
		
		var details = $this.get(0).id.split("_");
		var houseId = details[0].replace("t", "");
		var filmId = details[1].replace("m", "");
		var sDate = details[2].replace("d", "");
		var ticketTime = formatTicketTime(timeOnly);
		
		// build the movietickets.com link
		var link = "http://www.movietickets.com/purchase.asp?afid=dineto&house_id="+ houseId +"&movie_id="+ filmId;
		link += "&perfd="+ sDate +"&perft="+ ticketTime;

		window.open(link, "_blank");
		return;
	};

	function formatTicketTime(timeStr) {
		var a = timeStr.split(":");
		var hours = Number(a[0]);
		var minutes = Number(a[1].substr(0,2));
		
		var pmFlag = a[1].substr(2) == "pm";
		if (hours == 12) hours = 0;
		
		if (pmFlag == false) {
			if (hours < 3) hours += 24;
		} else {
			hours += 12;
		}
		// pad minutes with zeros
		if (minutes < 10) minutes = "0" + minutes;
		timeStr = hours + ":" + minutes;
		return timeStr;
	};

	// Update the margin-left property to scroll
	$.fn.timeSlide.handleMouseMove = function(event) {

		var $this = $(this);
		var boxWidth = $this.outerWidth();
		var content = $this.children();
		var contentWidth = content.outerWidth();

		if (contentWidth <= boxWidth) return;

		var xOffset = event.pageX - $this.offset().left +1;
		var threshold = 30;
		var kids = $this.parent().children();

		if (xOffset < threshold) {
			xOffset = 0;
		} else if (xOffset > boxWidth - threshold) {
			xOffset = contentWidth-boxWidth;
		} else {
			var scrollPercent = Math.round(100*(xOffset-threshold) / (boxWidth-(2*threshold)));
			xOffset = Math.round((contentWidth - boxWidth)*scrollPercent/100);
		}
		
		content.css("margin-left", -xOffset);
		if (xOffset == 0) {	// All the way left
			kids.eq(0).children().show();
			kids.eq(2).children().hide();
		} else if (xOffset >= contentWidth-boxWidth) {	// All the way right
			kids.eq(0).children().hide();
			kids.eq(2).children().show();
		} else {	// In between
			kids.eq(0).children().show();
			kids.eq(2).children().show();
		}
		
	};

	$.fn.timeSlide.handleMouseLeave = function() {
		var $this = $(this);
		var kids = $this.children();
		var content = kids.eq(1).children();

		if (content.outerWidth() <= kids.eq(1).outerWidth()) return;

		content.css("margin-left", 0);
		kids.eq(0).children().show();
		kids.eq(2).children().hide();
	};

	function setArrows($this) {
		var kids = $this.children();

		var content = $this.find(".timeSlideContent");
		// If content is longer than the view, show the right arrow
		if (content.outerWidth() > $this.outerWidth()) {
			kids.eq(0).children().show(); // 0 = right arrow (they be floating right)
		}
	}

})(jQuery);

