/Main.js
/* Copyright 2011 The Dominion of Awesome
 * See COPYING for licensing information */
enyo.kind({
	name: "Main",
	kind: "Pane",
	components: [
		{kind: "ApplicationEvents", onWindowActivated: "windowActivated", onWindowDeactivated: "windowDeactivated"},
		{name: "mainView", kind: "VFlexBox", components: [
			{name: "hacksCarousel", kind: "Carousel", flex: 1, onGetLeft: "getLeft", onGetRight: "getRight", onScroll: "scrolling", onScrollStart: "startScroll", onScrollStop: "stopScroll"},
			{name: "info", kind: "HFlexBox", className: "info", align: "center", style: "opacity: 0", onclick: "infoFade", components: [
				{className: "wrench", onclick: "openPreferences"},
				{name: "hacksListSelector", kind: "ListSelector", popupAlign: "left", onChange: "selectHack", style: "width: 200px"},
				{kind: "Spacer"},
				{name: "notice", className: "notice"}
			]},
			{name: "noPrefsDialog", kind: "ModalDialog", caption: "No Preferences", components: [
				{kind: "Button", content: "Okay", onclick: "closeNoPrefsDialog"}
			]}
		]},
		{name: "preferencesView", kind: "HackPreferences", onClose: "savePreferences"}
	],
	hacksList: [
		{name: "Labyrinth", kind: "Labyrinth"},
		{name: "Nimbus", kind: "Nimbus"},
		{name: "HexaSpinner", kind: "HexaSpinnerHack"},
		{name: "Landscape", kind: "Landscape"},
		{name: "Munch", kind: "Munch"},
		{name: "Orbit", kind: "Orbit"},
		{name: "Pixelfade", kind: "Pixelfade"},
		//{name: "Swarm", kind: "Swarm"},       // crashy
		//{name: "Spinner.CGA", kind: "XSpinnerCGA"}, // no webfont support
		{name: "Spinner", kind: "XSpinner"}
	],
	create: function() {
		this.inherited(arguments);
		try {
			this.index = parseInt(localStorage.getItem('hack.index'));
			if (!this.index)
				this.index = 0;
		} catch(e) {
			enyo.log("Could not load last hack index");
			this.index = 0;
		}
		this.lastScrollPos = 0;
		this.$.hacksCarousel.setCenterView(this.getHack(this.index));
	},
	ready: function() {
		var displayList = [];
		for (var i = 0; i < this.hacksList.length; i++) {
			displayList.push({
				caption: this.hacksList[i].name,
				value: i
			});
		}
		this.$.hacksListSelector.setItems(displayList);
		this.$.hacksListSelector.setValue(this.index);
		this.startHack();
		window.addEventListener('resize', this.resizeHack.bind(this), false);
		this.setNotice('Swipe for more...');
	},
	setNotice: function(notice) {
		this.$.notice.setContent(notice);
		this.infoFade();
	},
	infoFade: function() {
		this.$.info.setStyle('opacity: 1');

		clearTimeout(this.noticeTimer);
		this.noticeTimer = setTimeout(function() {
			this.$.info.setStyle('opacity: 0');
			setTimeout(function() {
				this.$.notice.setContent('');
			}.bind(this), 600);
		}.bind(this), 5000);
	},
	openPreferences: function() {
		var view = this.$.hacksCarousel.fetchView('center');

		var meta = view.getPreferencesMetadata();
		if (meta.length) {
			view.stop();
			var values = view.getPreferences();
			this.$.preferencesView.load(this.hacksList[this.index].name, meta, values);
			this.selectView(this.$.preferencesView);
		} else {
			this.$.noPrefsDialog.openAtCenter();
		}
	},
	savePreferences: function(inSender, prefs) {
		var view = this.$.hacksCarousel.fetchView('center');
		if (prefs == null) {
			enyo.log("Clearing prefs");
			view.resetPreferences(prefs);
			this.selectHack(this, this.index);
		} else {
			enyo.log("Saving prefs: " + JSON.stringify(prefs));
			view.setPreferences(prefs);
			view.start();
		}
		this.back();
	},
	windowActivated: function() {
		this.startHack();
	},
	windowDeactivated: function() {
		this.stopHack();
	},
	selectHack: function(inSender, inValue) {
		this.stopHack();
		this.index = inValue;
		this.lastScrollPos = 0;
		this.$.hacksCarousel.setCenterView(this.getHack(this.index));
		// For some reason, setCenterView above fires the startScroll
		// event without a subsequent stopScroll event.  To work around
		// this, we defer the start until later.
		setTimeout(function() { this.startHack() }.bind(this), 20);
	},
	startHack: function(direction) {
		var view = this.$.hacksCarousel.fetchView(direction || 'center');
		//enyo.log('starting view ' + view);
		if (view)
			view.start();
		try {
			localStorage.setItem('hack.index', this.index);
		} catch(e) {
			enyo.log("Could not set hack index");
		}
	},
	stopHack: function(direction) {
		var view = this.$.hacksCarousel.fetchView(direction || 'center');
		//enyo.log('stopping view ' + view);
		if (view)
			view.stop();
	},
	resizeHack: function() {
		var view = this.$.hacksCarousel.fetchView('center');
		if (view)
			view.resize(window.innerWidth, window.innerHeight);
		var view = this.$.hacksCarousel.fetchView('left');
		if (view)
			view.resize(window.innerWidth, window.innerHeight);
		var view = this.$.hacksCarousel.fetchView('right');
		if (view)
			view.resize(window.innerWidth, window.innerHeight);
	},
	hackHidden: function(direction) {
		var view = this.$.hacksCarousel.fetchView(direction);
		//enyo.log('view ' + view + ' hidden');
		if (view)
			view.hidden();
	},
	getHack: function(index) {
		return {kind: this.hacksList[index].kind};
	},
	getLeft: function(inSender, inSnap) {
		if (inSnap && this.index > 0) {
			this.index--;
			this.$.hacksListSelector.setValue(this.index);
			this.hackHidden('right');
			this.infoFade();
		}
		if (this.index == 0)
			return null;
		else
			return this.getHack(this.index - 1);
	},
	getRight: function(inSender, inSnap) {
		if (inSnap && this.index < this.hacksList.length) {
			this.index++;
			this.$.hacksListSelector.setValue(this.index);
			this.hackHidden('left');
			this.infoFade();
		}
		if (this.index == this.hacksList.length - 1)
			return null;
		else
			return this.getHack(this.index + 1);
	},
	scrolling: function(inSender) {
		if (inSender.scrollLeft == 0 || inSender.scrollLeft == inSender.getBoundaries().right)
			this.startHack();
	},
	startScroll: function(inSender) {
		this.stopHack();
	},
	stopScroll: function(inSender) {
		this.lastScrollPos = this.$.hacksCarousel.scrollLeft;
		this.startHack();
	},
	closeNoPrefsDialog: function() {
		this.$.noPrefsDialog.close();
	}
});