restructure components dir, start work on one-up view

firehose/components/Firehose.jsx

@@ -1,6 +1,6 @@
 var React = require("react");
-var Header = require ("./Header.jsx");
-var FirehoseEditor = require("./FirehoseEditor.jsx");
+var Header = require ("./header/Header.jsx");
+var FirehoseEditor = require("./views/FirehoseEditor.jsx");
 
 var Firehose = React.createClass({
   getInitialState: function() {

firehose/components/shared/FeatureMake.jsx

@@ -0,0 +1,27 @@
+var React = require("react");
+
+var FeatureMake = React.createClass({
+  getInitialState: function() {
+    return {
+      featured: this.props.featured
+    };
+  },
+  onClick: function() {
+    this.props.onClick();
+  },
+  render: function() {
+    var featureClass = "make-feature-toggle fa fa-4 ";
+
+    if ( this.state.featured ) {
+      featureClass += "fa-star";
+    } else {
+      featureClass += "fa-star-o";
+    }
+
+    return (
+      <i className={featureClass} onClick={this.onClick}></i>
+    );
+  }
+});
+
+module.exports = FeatureMake;

firehose/components/shared/Navigate.jsx

@@ -0,0 +1,31 @@
+var React = require("react");
+
+var Navigate = React.createClass({
+  getInitialState: function() {
+    var delta = +this.props.delta;
+    if (typeof delta !== "number" || delta === 0) {
+      delta = 1;
+    }
+    return {
+      delta: delta
+    };
+  },
+  onNavigate: function() {
+    this.props.onNavigate(this.state.delta);
+  },
+  render: function() {
+    var navigationClass = "firehose-make-nav fa fa-4 ";
+
+    if ( this.state.delta > 0 ) {
+      navigationClass += "fa-arrow-right";
+    } else {
+      navigationClass += "fa-arrow-left";
+    }
+
+    return (
+      <i className={navigationClass} onClick={this.onNavigate}></i>
+    );
+  }
+});
+
+module.exports = Navigate;

firehose/components/shared/Trash.jsx

@@ -0,0 +1,11 @@
+var React = require("react");
+
+var Trash = React.createClass({
+  render: function() {
+    return (
+      <i className="firehose-trash-make fa fa-trash fa-4" on></i>
+    );
+  }
+});
+
+module.exports = Trash;

firehose/components/views/MakeDetails.jsx

@@ -0,0 +1,29 @@
+var React = require("react");
+var Trash = require("../shared/Trash.jsx");
+var FeatureMake = require("../shared/FeatureMake.jsx");
+var Navigation = require("../shared/Navigate.jsx");
+
+var MakeDetails = React.createClass({
+  onNavigate: function(delta) {
+    console.log( delta );
+  },
+  render: function() {
+    return (
+      <div>
+        <div>AVATAR</div>
+        <div>
+          <span>TITLE</span>
+          <span>AuthorLink</span>
+        </div>
+        <div>
+          <Trash />
+          <FeatureMake />
+          <Navigation onNavigate={this.onNavigate} delta="-1"/>
+          <Navigation onNavigate={this.onNavigate} delta="1" />
+        </div>
+      </div>
+    );
+  }
+});
+
+module.exports = MakeDetails;

firehose/components/views/MakePreview.jsx

@@ -0,0 +1,11 @@
+var React = require("react");
+
+var MakePreview = React.createClass({
+  render: function() {
+    return (
+      <iframe src="https://chrisdecairos.ca" className="make-preview"></iframe>
+    );
+  }
+});
+
+module.exports = MakePreview;

firehose/components/views/OneUpView.jsx

@@ -0,0 +1,16 @@
+var React = require("react");
+var MakeDetails = require("./MakeDetails.jsx");
+var MakePreview = require("./MakePreview.jsx");
+
+var OneUpView = React.createClass({
+  render: function() {
+    return (
+      <div>
+        <MakeDetails />
+        <MakePreview />
+      </div>
+    );
+  }
+});
+
+module.exports = OneUpView;