/* jslint verified 2009.10.14 */
/*jslint browser: true, onevar: true, undef: true, white: false, eqeqeq: true, immed: true, cap: false  */
/*globals window, MMM, isset, noop, jQuery, $,
	doNav, pauseTour, selectFeature, selectDot, clickPrev, clickNext, next, prev, playTour, toggleTour, setNumDots */

MMM.Index = (function () {
	var nav = 'generalInfo', selectedDot = -1, selectedFeature = -1, numDots = 4,
		longAnimate = 750, shortAnimate = 250,
		features = ['Play', 'Music', 'Shows', 'Video', 'News', 'Discography', 'Twitter', 'Photos', 'More'],
		dotsPerFeature = [2, 3, 2, 2, 2, 3, 2, 3, 4],
		arrowClasses = ['play', 'music', 'shows', 'video', 'news', 'tab'],
		pane2, pane3,
		isAnimating = false, funcQueue = [], tourInterval, barInterval, barPct = 0;

	function setup() {
		pane2 = $('#pane2').removeClass('slidLeft');
		$('#tourPlay > div.progress').hide().progressbar({value: 0});
		$('#exploreStart').click(function (e) {
			if (!pane2.hasClass('slidLeft')) {
				e.preventDefault();
				pauseTour();
				doNav('explore');
				selectFeature(features[1], 1);  // skip "Play"
				playTour();
			}
			return false;
		});
		$('#exploreStartMap area').click(function (e) {
			e.preventDefault();
			pauseTour();
			doNav(nav === 'generalInfo' ? 'explore' : nav);

			var feature = $(this).attr('title'),
				featureIndex = jQuery.inArray(feature, features) >= 0;
			selectFeature(feature, featureIndex);
		});

		$('#tourDots div').click(function (e) {
			pauseTour();
			var index = this.id.match(/dot(\d)/)[1];
			selectDot(index);
		});

		$('#tourLeft').click(clickPrev);
		$('#tourRight').click(clickNext);

		$('#introNav span').click(function () {
			var id = this.id.match(/(.+)Link/)[1];
			doNav(id);
		});
		$('#startDemo').click(function () { doNav('explore'); });
		$('#startTour,#startTour2,#startTour3').click(function () { doNav('tour'); });
		$('#readAboutMe').click(function () { doNav('generalInfo'); });
		$('#tourPlay').click(toggleTour);

		selectFeature(features[0], 0);
		$('a[href$="#appsMenu"]').live('click', function (e) {
			$('#appsMenu').trigger('click');
		});
	}

	function doneAnimating() {
		isAnimating = false;
		var funcs = funcQueue.slice();
		funcQueue = [];
		jQuery.each(funcs, function (i) { if (jQuery.isFunction(this)) { this(); } });
	}

	function selectFeature(feature, featureIndex) {
		if (isAnimating) {
			funcQueue.push(function () { selectFeature(feature, featureIndex); });
		} else {
			if (featureIndex >= 0 && featureIndex !== selectedFeature) {
				selectedFeature = featureIndex;
				$('#tourSection').text(feature);
				$('#tourImageInner img').attr('src', '/img/tour/' + feature.toLowerCase() + '.png');
				setNumDots(dotsPerFeature[featureIndex]);
				selectDot(1, true /* skipAnimate */);
				var arrowClass = features[featureIndex].toLowerCase();
				$('#pane3')
					.removeClass(arrowClasses.join(' '))
					.addClass(jQuery.inArray(arrowClass, arrowClasses) >= 0 ? arrowClass : 'tab');
			}
		}
	}

	function clickNext() {
		pauseTour();
		next();
	}

	function next() {
		if (!isAnimating) {
			barPct = 0;
			$('#tourPlay > div.progress').fadeOut('fast', function () { $(this).progressbar('option', 'value', 0).fadeIn('fast'); });
			clearInterval(barInterval);
			barInterval = setInterval(updateProgress, 250);
			var featureIndex, dot = selectedDot + 1;
			if (dot > dotsPerFeature[selectedFeature]) {
				featureIndex = (selectedFeature === 0) ? 2 : selectedFeature + 1;  // go from "Play" to "Shows"
				if (featureIndex >= features.length) {
					featureIndex = 1;  // Skip play button
				}
				selectFeature(features[featureIndex], featureIndex);
			} else {
				selectDot(dot);
			}
		}
	}

	function clickPrev() {
		pauseTour();
		prev();
	}

	function prev() {
		if (isAnimating) {
			return;
		}

		var featureIndex, dot = selectedDot - 1;
		if (dot < 1) {
			featureIndex = selectedFeature - 1;
			if (featureIndex < 1) {
				featureIndex = features.length - 1;
			}
			selectFeature(features[featureIndex], featureIndex);
			selectDot(dotsPerFeature[featureIndex], true /* skipAnimate */);
		} else {
			selectDot(dot);
		}
	}

	function toggleTour() {
		if ($('#tourPlay').hasClass('pause')) {
			pauseTour();
		} else {
			playTour();
		}
	}

	function updateProgress() {
		barPct += 6;
		if (barPct > 100) {
			barPct = 100;
			clearInterval(barInterval);
			barInterval = 0;
		} else if (barPct < 0) { barPct = 0; }
		$('#tourPlay > div.progress').progressbar('option', 'value', barPct);
	}

	function playTour() {
		if (!tourInterval) {
			$('#tourPlay > div.progress').fadeIn('fast').progressbar('option', 'value', 0);
			tourInterval = setInterval(next, 5000);
			barInterval = setInterval(updateProgress, 250);
			$('#tourPlay').addClass('pause');
		}
	}

	function pauseTour() {
		clearInterval(tourInterval);
		clearInterval(barInterval);
		$('#tourPlay > div.progress').fadeOut('fast').progressbar('option', 'value', 0);
		tourInterval = barInterval = barPct = 0;
		$('#tourPlay').removeClass('pause');
	}

	function setNumDots(num) {
		numDots = num;
		$('#tourDots div').show();
		var i, dotSels = [];
		for (i = num + 1; i <= 4; ++i) { dotSels.push('#dot'+i); }
		if (dotSels.length > 0) { $(dotSels.join(',')).hide(); }
	}

	function doNav(id) {
		if (!isAnimating && id !== nav) {
			pauseTour();

			switch (id) {
				case 'generalInfo':
					isAnimating = true;
					$('#startHere').fadeIn(longAnimate);
					$('#readAboutMe').fadeOut(longAnimate);
					$('#paneHolder').animate({left:0}, longAnimate, 'swing', doneAnimating);
					pane2.animate({width: 300}, longAnimate, null, function () { pane2.removeClass('slidLeft'); });
					$('#tourNote').animate({paddingLeft: 0}, longAnimate);
					break;
				case 'explore':
				case 'tour':
					var animateDone = function () {
						if (id === 'tour') {
							selectFeature(features[1], 1);  // skip "Play"
							playTour();
						}
					};
					if (nav === 'generalInfo') {
						isAnimating = true;
						pane2.addClass('slidLeft').animate({width: 342}, longAnimate);
						$('#tourNote').animate({paddingLeft: 56}, longAnimate);
						$('#paneHolder').animate({left:'-504px'}, longAnimate, null, animateDone);
					} else {
						animateDone();
					}
					$('#startHere').fadeOut(longAnimate);
					$('#readAboutMe').fadeIn(longAnimate, doneAnimating);
					break;
			}

			$('#' + nav + 'Link').removeClass('selected');
			nav = id;
			$('#' + nav + 'Link').addClass('selected');
		}
	}

	function selectDot(index, skipAnimate) {
		if (isAnimating) {
			funcQueue.push(function () { selectDot(index, skipAnimate); });
		} else {
			if (index >= 1 && index <= numDots) {
				if (index !== selectedDot) {
					$('#dot' + selectedDot).removeClass('selected');
					selectedDot = Number(index);
					$('#dot' + selectedDot).addClass('selected');
				}

				var feature = features[selectedFeature],
					descIndex = feature + index,
					desc = MMM.TourDesc[descIndex],
					sectionNames = {'1': 'More', '2': 'More - Store', '3': 'More - Bio', '4': 'More - Sites'};
				$('#tourDescription').text(desc);

				if (feature === 'More') {
					$('#tourSection').text(sectionNames[index]);
				}

				if (skipAnimate) {
					$('#tourImageInner img').css({left: (-250 * (selectedDot-1)) + 'px'});
				} else {
					isAnimating = true;
					$('#tourImageInner img').animate({left: (-250 * (selectedDot-1)) + 'px'}, shortAnimate, 'swing', doneAnimating);
				}
			}
		}
	}

	$(document).ready(setup);
}());

MMM.TourDesc = {
	Play1: "Feature your music in the app and we'll make it easy for fans to buy it, from songs to entire albums.",
	Play2: "Your lyrics have meaning. Share them with your fans.",
	Music1: "It's all about making and sharing your music. Create a playlist of your music for fans to listen to in "+
				"your app. Stream as much music as you like.",
	Music2: "Feature your music in the app and we'll make it easy for fans to buy it, from songs to entire albums.",
	Music3: "Your lyrics have meaning. Share them with your fans.",
	Shows1: "The best way to get fans to the gig is to make sure they know when and where you're playing.",
	Shows2: "Update show times, venues, links to purchase tickets, and other info to make sure your fans know where and "+
				"how to find you performing live.",
	Video1: "Feature your favorite videos front and center in your app. Feed directly from your YouTube channel. Have "+
				"your fans add videos to your app.",
	Video2: "You're in control. Add/delete videos from your YouTube channel and the app automatically updates.",
	News1: "Keep your fans in the loop.",
	News2: "It's as easy as piping in an RSS feed to get the whole story.",
	Discography1: "Give fans access to all of your albums, EPs, and singles. Sell all your music through the app.",
	Discography2: "Connect fans with your catalog, liner notes, album artwork, and lyrics by featuring them in your app.",
	Discography3: "Your catalog - complete and up-to-date.",
	Twitter1: "Your tweets. Your fans' tweets.",
	Twitter2: "Got something to say in 140 characters or less? Share it with fans here.",
	Photos1: "An image is worth 1,000 words... so create and share photo albums from your album artwork, tour pics, "+
				"and other stuff your fans will want to see.",
	Photos2: "We make the integration with Picasa and/or Flickr seamless, so it's easy to manage, update, and add to in "+
				"real time.",
	Photos3: "Sit back, watch a slide show while listening to tunes.",
	More1: "Wait, there's more! Feature just what you want on the homepage, with other stuff in \"More.\"",
	More2: "Pipe in a link to your merch store so fans can buy everything you're puttin' out.",
	More3: "To know you is to love you.",
	More4: "Link to all of your various websites and pages. Help fans get the content YOU want them to see."
};