import React from 'react';
import Main from './Main';
import createStateManager from './createStateManager';

var initialContent = 'Just add hashtags #primary\n\nCreate rich layouts just by typing #image #unsplash: dessert\n\nCreate fields #field\nAnd Buttons #button #primary\nBig and Small #button #small\n\nFeatures #link: @links.features\n\n@legal #small\n';

/*
	# shorthand #primary
	## shorthand #secondary
	### shorthand #tertiary

	#collected:(hash)
*/

var ingredients = [{
	id: 'links',
	type: 'json',
	variations: [{
		rawContent: '{"features": "https://icing.space/features"}'
	}]
}, {
	id: 'legal',
	type: 'text',
	variations: [{
		rawContent: 'Copyright Company Inc. 2016'
	}]
}];

var scenarios = [{
	links: 0,
	legal: 0
}];

export default React.createClass({
	displayName: 'App',
	componentWillMount: function componentWillMount() {
		var _props = this.props,
		    initialContent = _props.initialContent,
		    initialDestinationID = _props.initialDestinationID,
		    initialDestinationDevice = _props.initialDestinationDevice,
		    initialIngredients = _props.initialIngredients,
		    initialScenarios = _props.initialScenarios,
		    initialActiveScenarioIndex = _props.initialActiveScenarioIndex;


		this.stateManager = createStateManager({
			content: initialContent,
			ingredients: initialIngredients,
			destinationID: initialDestinationID,
			destinationDevice: initialDestinationDevice,
			scenarios: initialScenarios,
			activeScenarioIndex: initialActiveScenarioIndex
		});
	},
	render: function render() {
		return React.createElement(Main, { stateManager: this.stateManager });
	}
});