add planet create modal & switching func

browser/main/Components/PlanetCreateModal.jsx

@@ -1,6 +1,8 @@
 var React = require('react/addons')
 var Catalyst = require('../Mixins/Catalyst')
 
+var PlanetActions = require('../Actions/PlanetActions')
+
 var PlanetStore = require('../Stores/PlanetStore')
 
 module.exports = React.createClass({
@@ -13,16 +15,39 @@ module.exports = React.createClass({
       planetName: ''
     }
   },
+  componentDidMount: function () {
+    React.findDOMNode(this.refs.name).focus()
+    this.unsubscribe = PlanetStore.listen(this.onListen)
+  },
+  componentWillUnmount: function () {
+    this.unsubscribe()
+  },
+  onListen: function (res) {
+    if (res.status === 'planetCreated') {
+      this.props.close()
+    }
+  },
   handleSubmit: function () {
-    console.log(this.state.planetName)
+    PlanetActions.createPlanet({
+      name: this.state.planetName
+    })
+  },
+  handleKeyDown: function (e) {
+    if (e.keyCode === 13 && e.metaKey) {
+      this.handleSubmit()
+      return
+    }
+    if (e.keyCode === 27) {
+      this.props.close()
+    }
   },
   stopPropagation: function (e) {
     e.stopPropagation()
   },
   render: function () {
     return (
-      <div onClick={this.stopPropagation} className='PlanetCreateModal modal'>
-        <input valueLink={this.linkState('planetName')} className='stripInput'/>
+      <div tabIndex='3' onKeyDown={this.handleKeyDown} onClick={this.stopPropagation} className='PlanetCreateModal modal'>
+        <input ref='name' valueLink={this.linkState('planetName')} className='nameInput stripInput' placeholder='Crate new Planet'/>
         <button onClick={this.handleSubmit} className='submitButton'>
           <i className='fa fa-check'/>
         </button>