リアルタイム(SocketIO)実装 / Markdown style改善

browser/main/Components/AddMemberModal.jsx

@@ -7,8 +7,6 @@ var Hq = require('../Services/Hq')
 
 var KeyCaster = require('../Mixins/KeyCaster')
 
-var UserStore = require('../Stores/UserStore')
-
 var getOptions = function (input, callback) {
   Hq.searchUser(input)
     .then(function (res) {
@@ -58,7 +56,6 @@ module.exports = React.createClass({
         })
         .then(function (res) {
           console.log(res.body)
-          UserStore.Actions.addMember(res.body)
           this.props.close()
         }.bind(this))
         .catch(function (err) {

browser/main/Components/CodeDeleteModal.jsx

@@ -25,7 +25,7 @@ module.exports = React.createClass({
   },
   submit: function () {
     var planet = this.props.planet
-    Hq.destroyCode(planet.userName, planet.name, this.props.code.localId)
+    Hq.destroyCode(planet.Owner.name, planet.name, this.props.code.localId)
       .then(function (res) {
         PlanetStore.Actions.destroyCode(res.body)
         this.props.close()

browser/main/Components/CodeForm.jsx

@@ -15,14 +15,14 @@ var getOptions = function (input, callback) {
   Hq.searchTag(input)
     .then(function (res) {
       callback(null, {
-          options: res.body.map(function (tag) {
-            return {
-              label: tag.name,
-              value: tag.name
-            }
-          }),
-          complete: false
-        })
+        options: res.body.map(function (tag) {
+          return {
+            label: tag.name,
+            value: tag.name
+          }
+        }),
+        complete: false
+      })
     })
     .catch(function (err) {
       console.log(err)
@@ -88,18 +88,18 @@ module.exports = React.createClass({
       return tag.value
     })
     if (this.props.code == null) {
-      Hq.createCode(planet.userName, planet.name, this.state.code)
+      Hq.createCode(planet.Owner.name, planet.name, this.state.code)
         .then(function (res) {
           var code = res.body
           PlanetStore.Actions.updateCode(code)
           this.props.close()
-          this.props.transitionTo('codes', {userName: planet.userName, planetName: planet.name, localId: code.localId})
+          this.props.transitionTo('codes', {userName: planet.Owner.name, planetName: planet.name, localId: code.localId})
         }.bind(this))
         .catch(function (err) {
           console.error(err)
         })
     } else {
-      Hq.updateCode(planet.userName, planet.name, this.props.code.localId, this.state.code)
+      Hq.updateCode(planet.Owner.name, planet.name, this.props.code.localId, this.state.code)
         .then(function (res) {
           var code = res.body
           PlanetStore.Actions.updateCode(code)

browser/main/Components/HomeNavigator.jsx

@@ -94,15 +94,18 @@ module.exports = React.createClass({
     var params = this.getParams()
 
     if (this.state.currentUser == null) {
-      return (
-        <div className='HomeNavigator'>
-        </div>
-      )
+      return null
     }
 
-    var planets = (this.state.currentUser.Planets.concat(this.state.currentUser.Teams.reduce(function (planets, team) {
-      return team.Planets == null ? planets : planets.concat(team.Planets)
-    }, []))).map(function (planet, index) {
+    var planets = this.state.currentUser.Planets.map(function (planet) {
+      planet.userName = this.state.currentUser.name
+      return planet
+    }.bind(this)).concat(this.state.currentUser.Teams.reduce(function (_planets, team) {
+      return _planets.concat(team.Planets == null ? [] : team.Planets.map(function (planet) {
+        planet.userName = team.name
+        return planet
+      }))
+    }, [])).map(function (planet, index) {
       return (
         <li userName={planet.userName} planetName={planet.name} key={planet.id} className={params.userName === planet.userName && params.planetName === planet.name ? 'active' : ''}>
           <Link to='planet' params={{userName: planet.userName, planetName: planet.name}}>

browser/main/Components/LogoutModal.jsx

@@ -2,6 +2,8 @@
 
 var React = require('react')
 
+var socket = require('../Services/socket')
+
 var KeyCaster = require('../Mixins/KeyCaster')
 
 module.exports = React.createClass({
@@ -23,6 +25,8 @@ module.exports = React.createClass({
   logout: function () {
     localStorage.removeItem('currentUser')
     localStorage.removeItem('token')
+    socket.reconnect()
+
     this.props.transitionTo('login')
     this.props.close()
   },

browser/main/Components/NoteDeleteModal.jsx

@@ -25,7 +25,7 @@ module.exports = React.createClass({
   },
   submit: function () {
     var planet = this.props.planet
-    Hq.destroyNote(planet.userName, planet.name, this.props.note.localId)
+    Hq.destroyNote(planet.Owner.name, planet.name, this.props.note.localId)
       .then(function (res) {
         PlanetStore.Actions.destroyNote(res.body)
         this.props.close()

browser/main/Components/NoteForm.jsx

@@ -16,14 +16,14 @@ var getOptions = function (input, callback) {
   Hq.searchTag(input)
     .then(function (res) {
       callback(null, {
-          options: res.body.map(function (tag) {
-            return {
-              label: tag.name,
-              value: tag.name
-            }
-          }),
-          complete: false
-        })
+        options: res.body.map(function (tag) {
+          return {
+            label: tag.name,
+            value: tag.name
+          }
+        }),
+        complete: false
+      })
     })
     .catch(function (err) {
       console.log(err)
@@ -89,18 +89,18 @@ module.exports = React.createClass({
     })
 
     if (this.props.note == null) {
-      Hq.createNote(planet.userName, planet.name, this.state.note)
+      Hq.createNote(planet.Owner.name, planet.name, this.state.note)
         .then(function (res) {
           var note = res.body
           PlanetStore.Actions.updateNote(note)
           this.props.close()
-          this.props.transitionTo('notes', {userName: planet.userName, planetName: planet.name, localId: note.localId})
+          this.props.transitionTo('notes', {userName: planet.Owner.name, planetName: planet.name, localId: note.localId})
         }.bind(this))
         .catch(function (err) {
           console.error(err)
         })
     } else {
-      Hq.updateNote(planet.userName, planet.name, this.props.note.localId, this.state.note)
+      Hq.updateNote(planet.Owner.name, planet.name, this.props.note.localId, this.state.note)
         .then(function (res) {
           var note = res.body
           PlanetStore.Actions.updateNote(note)

browser/main/Components/PlanetArticleList.jsx

@@ -18,7 +18,6 @@ module.exports = React.createClass({
       return function (e) {
         var params = this.getParams()
 
-        document.getElementById('articleEditButton').focus()
         this.transitionTo('codes', {
           userName: params.userName,
           planetName: params.planetName,
@@ -31,7 +30,6 @@ module.exports = React.createClass({
       return function (e) {
         var params = this.getParams()
 
-        document.getElementById('articleEditButton').focus()
         this.transitionTo('notes', {
           userName: params.userName,
           planetName: params.planetName,

browser/main/Components/PlanetCreateModal.jsx

@@ -51,7 +51,7 @@ module.exports = React.createClass({
           PlanetStore.Actions.update(planet)
 
           if (this.props.transitionTo != null) {
-            this.props.transitionTo('planetHome', {userName: planet.userName, planetName: planet.name})
+            this.props.transitionTo('planetHome', {userName: planet.Owner.name, planetName: planet.name})
           }
 
           this.props.close()

browser/main/Components/PlanetHeader.jsx

@@ -46,7 +46,7 @@ module.exports = React.createClass({
   },
   render: function () {
     var currentPlanetName = this.props.currentPlanet.name
-    var currentUserName = this.props.currentPlanet.userName
+    var currentUserName = this.props.currentPlanet.Owner.name
 
     return (
       <div className='PlanetHeader'>

browser/main/Components/PlanetSettingModal.jsx

@@ -14,7 +14,9 @@ module.exports = React.createClass({
     planet: React.PropTypes.shape({
       name: React.PropTypes.string,
       public: React.PropTypes.bool,
-      userName: React.PropTypes.string
+      Owner: React.PropTypes.shape({
+        name: React.PropTypes.string
+      })
     })
   },
   getInitialState: function () {
@@ -59,7 +61,7 @@ module.exports = React.createClass({
     var planet = this.props.planet
 
     this.setState({profileFormStatus: 'sending', profileFormError: null}, function () {
-      Hq.updatePlanet(planet.userName, planet.name, this.state.planet)
+      Hq.updatePlanet(planet.Owner.name, planet.name, this.state.planet)
         .then(function (res) {
           var planet = res.body
           console.log(planet)
@@ -103,7 +105,7 @@ module.exports = React.createClass({
     var planet = this.props.planet
 
     this.setState({deleteSubmitStatus: 'sending'}, function () {
-      Hq.destroyPlanet(planet.userName, planet.name)
+      Hq.destroyPlanet(planet.Owner.name, planet.name)
         .then(function (res) {
           var planet = res.body
 
@@ -166,12 +168,12 @@ module.exports = React.createClass({
     )
   },
   renderPlanetDeleteTab: function () {
-    var disabled = !this.state.deleteConfirmation.match(new RegExp('^' + this.props.planet.userName + '/' + this.props.planet.name + '$'))
+    var disabled = !this.state.deleteConfirmation.match(new RegExp('^' + this.props.planet.Owner.name + '/' + this.props.planet.name + '$'))
 
     return (
       <div className='planetDeleteTab tab'>
-        <p>Are you sure to destroy <strong>'{this.props.planet.userName + '/' + this.props.planet.name}'</strong>?</p>
-        <p>If you are sure, write <strong>'{this.props.planet.userName + '/' + this.props.planet.name}'</strong> to input below and click <strong>'{this.state.randomDeleteText}'</strong> button.</p>
+        <p>Are you sure to destroy <strong>'{this.props.planet.Owner.name + '/' + this.props.planet.name}'</strong>?</p>
+        <p>If you are sure, write <strong>'{this.props.planet.Owner.name + '/' + this.props.planet.name}'</strong> to input below and click <strong>'{this.state.randomDeleteText}'</strong> button.</p>
         <input valueLink={this.linkState('deleteConfirmation')} placeholder='userName/planetName'/>
         <div className='formConfirm'>
           <button disabled={disabled} onClick={this.handleDeletePlanetClick}>{this.state.randomDeleteText}</button>

browser/main/Components/TeamCreateModal.jsx

@@ -3,6 +3,7 @@
 var React = require('react/addons')
 
 var Hq = require('../Services/Hq')
+var socket = require('../Services/socket')
 
 var LinkedState = require('../Mixins/LinkedState')
 var KeyCaster = require('../Mixins/KeyCaster')
@@ -48,6 +49,7 @@ module.exports = React.createClass({
 
           currentUser.Teams.push(team)
           localStorage.setItem('currentUser', JSON.stringify(currentUser))
+          socket.reconnect(currentUser)
           UserStore.Actions.update(currentUser)
 
           if (this.props.transitionTo != null) {

browser/main/Components/TeamSettingsModal.jsx

@@ -43,12 +43,9 @@ module.exports = React.createClass({
     close: React.PropTypes.func
   },
   getInitialState: function () {
-    var team = this.props.team
     return {
       currentTab: 'teamInfo',
-      team: {
-        profileName: team.profileName
-      },
+      team: this.props.team,
       userSubmitStatus: null,
       member: {
         name: '',
@@ -65,17 +62,10 @@ module.exports = React.createClass({
     }
   },
   onUserChange: function (res) {
-    var member
     switch (res.status) {
-      case 'memberAdded':
-        member = res.data
-        if (member.TeamMember.TeamId === this.props.team.id) {
-          this.forceUpdate()
-        }
-        break
-      case 'memberRemoved':
-        member = res.data
-        if (member.TeamMember.TeamId === this.props.team.id) {
+      case 'userUpdated':
+        var user = res.data
+        if (user.id === this.props.team.id) {
           this.forceUpdate()
         }
         break
@@ -116,8 +106,7 @@ module.exports = React.createClass({
           role: this.state.member.role
         })
         .then(function (res) {
-          UserStore.Actions.addMember(res.body)
-          this.setState({updatingMember: false})
+          this.setState({updatingMember: false, team: res.body})
         }.bind(this))
         .catch(function (err) {
           console.error(err)
@@ -135,8 +124,7 @@ module.exports = React.createClass({
             role: role
           })
           .then(function (res) {
-            UserStore.Actions.addMember(res.body)
-            this.setState({updatingMember: false})
+            this.setState({updatingMember: false, team: res.body})
           }.bind(this))
           .catch(function (err) {
             console.error(err)
@@ -153,8 +141,7 @@ module.exports = React.createClass({
             userName: memberName
           })
           .then(function (res) {
-            UserStore.Actions.removeMember(res.body)
-            this.setState({updatingMember: false})
+            this.setState({updatingMember: false, team: res.body})
           }.bind(this))
           .catch(function (err) {
             console.error(err)
@@ -212,7 +199,7 @@ module.exports = React.createClass({
   renderMembersTab: function () {
     var currentUser = JSON.parse(localStorage.getItem('currentUser'))
 
-    var members = this.props.team.Members.map(function (member) {
+    var members = this.state.team.Members.map(function (member) {
       var isCurrentUser = currentUser.id === member.id
       return (
         <tr>