var xtend = require('xtend/mutable');
var React = require('react/addons');
var UI = require('./ui');
var Transition = require('./mixins/Transition');

/**
 * Touchstone App
 * ==============
 *
 * This function should be called with your app's views.
 *
 * It returns a Mixin which should be added to your App.
 */
function createApp (views) {
	return {
		mixins: [Transition],

		componentWillMount: function () {
			this.views = {};

			for (var viewName in views) {
				var view = views[viewName];
				this.views[viewName] = React.createFactory(view);
			}
		},

		childContextTypes: {
			currentView: React.PropTypes.string,
			app: React.PropTypes.object.isRequired
		},

		getChildContext: function () {
			return {
				currentView: this.state.currentView,
				app: this
			};
		},

		getCurrentView: function () {
			var viewsData = {};
			viewsData[this.state.currentView] = this.getView(this.state.currentView);
			var views = React.addons.createFragment(viewsData);
			return views;
		},

		getInitialState: function () {
			return {
				viewTransition: this.getCSSTransition()
			};
		},

		getView: function (key) {
			var view = views[key];
			if (!view) return this.getViewNotFound();

			var props = xtend({ key: key }, this.state.currentViewProps);

			if (this.getViewProps) {
				xtend(props, this.getViewProps());
			}

			return React.createElement(view, props);
		},

		getViewNotFound: function () {
			return (<UI.View>
				<UI.ViewContent>
					<UI.Feedback
						iconName="ion-alert-circled"
						iconType="danger"
						text={'Sorry, the view <strong>"' + this.state.currentView + '"</strong> is not available.'}
						actionText="Okay, take me home"
						actionFn={this.gotoDefaultView}
					/>
				</UI.ViewContent>
			</UI.View>);
		},

		showView: function (key, transition, props, state) {
			if (typeof transition === 'object') {
				props = transition;
				transition = 'none';
			}

			if (typeof transition !== 'string') {
				transition = 'none';
			}

			console.log('Showing view |' + key + '| with transition |' + transition + '| and props ' + JSON.stringify(props));

			var newState = xtend({
				currentView: key,
				currentViewProps: props || {},
				previousView: this.state.currentView,
				viewTransition: this.getCSSTransition(transition)
			}, state);

			this.setState(newState);
		}
	};
}

module.exports = createApp;

@@ -328,17 +328,20 @@
 ateApp (
-v
+argV
 iews) %7B%0A
@@ -345,101 +345,32 @@
  %7B%0A%09
-return %7B%0A%09%09mixins: %5BTransition%5D,%0A%0A%09%09componentWillMount: function () %7B%0A%09%09%09this.v
+var viewFactor
 ie
-w
 s = %7B%7D
-;
 %0A%0A
-%09%09
 %09for
@@ -391,17 +391,20 @@
  in 
-v
+argV
 iews) %7B%0A
 %09%09%09%09
@@ -399,18 +399,16 @@
 iews) %7B%0A
-%09%09
 %09%09var vi
@@ -408,25 +408,28 @@
 %09var view = 
-v
+argV
 iews%5BviewNam
@@ -436,21 +436,23 @@
 e%5D;%0A
-%09%09%09%09this.view
+%0A%09%09viewFactorie
 s%5Bvi
@@ -489,19 +489,120 @@
 view);%0A%09
-%09%09%7D
+%7D%0A%0A%09return %7B%0A%09%09mixins: %5BTransition%5D,%0A%0A%09%09componentWillMount: function () %7B%0A%09%09%09this.views = viewFactories;
 %0A%09%09%7D,%0A%0A%09
@@ -959,22 +959,18 @@
 w);%0A
+%0A
 %09%09%09
-var views =
+return
  Rea
@@ -1010,25 +1010,8 @@
 a);%0A
-%09%09%09return views;%0A
 %09%09%7D,
@@ -1159,16 +1159,24 @@
 w = view
+Factorie
 s%5Bkey%5D;%0A
@@ -1374,34 +1374,13 @@
 urn 
-React.createElement(
 view
-, 
+(
 prop

use the stored factories over createElement