Contact Modal追加

browser/main/Containers/MainContainer.jsx

@@ -1,5 +1,7 @@
 /* global localStorage */
 
+var ipc = require('ipc')
+
 var React = require('react/addons')
 var ReactRouter = require('react-router')
 var RouteHandler = ReactRouter.RouteHandler
@@ -8,35 +10,45 @@ var State = ReactRouter.State
 
 var Hq = require('../Services/Hq')
 
+var Modal = require('../Mixins/Modal')
+
 var UserStore = require('../Stores/UserStore')
 
-// function fetchPlanet (planet) {
-//   return Hq.fetchPlanet(planet.userName, planet.name)
-//     .then(function (res) {
-//       var _planet = res.body
-//       _planet.userName = planet.userName
-//
-//       _planet.Snippets = _planet.Snippets.map(function (snippet) {
-//         snippet.type = 'snippet'
-//         return snippet
-//       })
-//
-//       _planet.Blueprints = _planet.Blueprints.map(function (blueprint) {
-//         blueprint.type = 'blueprint'
-//         return blueprint
-//       })
-//
-//       localStorage.setItem('planet-' + _planet.id, JSON.stringify(_planet))
-//       console.log('planet-' + _planet.id + ' fetched')
-//     })
-//     .catch(function (err) {
-//       console.error(err)
-//     })
-// }
+var ContactModal = require('../Components/ContactModal')
+
+function fetchPlanet (userName, planetName) {
+  Hq.fetchPlanet(userName, planetName)
+    .then(function (res) {
+      var planet = res.body
+
+      planet.Codes.forEach(function (code) {
+        code.type = 'code'
+      })
+
+      planet.Notes.forEach(function (note) {
+        note.type = 'note'
+      })
+
+      console.log('planet-' + planet.id + ' fetched!')
+      localStorage.setItem('planet-' + planet.id, JSON.stringify(planet))
+    })
+    .catch(function (err) {
+      console.error(err)
+    })
+}
 
 module.exports = React.createClass({
-  mixins: [State, Navigation],
+  mixins: [State, Navigation, Modal],
+  getInitialState: function () {
+    return {
+      updateAvailable: false
+    }
+  },
   componentDidMount: function () {
+    ipc.on('update-available', function (message) {
+      this.setState({updateAvailable: true})
+    }.bind(this))
+
     if (this.isActive('root')) {
       if (localStorage.getItem('currentUser') == null) {
         this.transitionTo('login')
@@ -49,9 +61,19 @@ module.exports = React.createClass({
 
     Hq.getUser()
       .then(function (res) {
-        console.log(res.body)
-        localStorage.setItem('currentUser', JSON.stringify(res.body))
-        UserStore.Actions.update(res.body)
+        var user = res.body
+        localStorage.setItem('currentUser', JSON.stringify(user))
+        UserStore.Actions.update(user)
+
+        user.Planets.forEach(function (planet) {
+          fetchPlanet(planet.userName, planet.name)
+        })
+        user.Teams.forEach(function (team) {
+          team.Planets.forEach(function (planet) {
+            fetchPlanet(planet.userName, planet.name)
+          })
+        })
+
       })
       .catch(function (err) {
         if (err.status === 401) {
@@ -63,9 +85,19 @@ module.exports = React.createClass({
         console.error(err)
       }.bind(this))
   },
+  updateApp: function () {
+    ipc.send('update-app', 'Deal with it.')
+  },
+  openContactModal: function () {
+    this.openModal(ContactModal)
+  },
   render: function () {
     return (
       <div className='Main'>
+        {this.state.updateAvailable ? (
+        <button onClick={this.updateApp} className='appUpdateButton'><i className='fa fa-cloud-download'/> Update available!</button>
+        ) : null}
+        <button onClick={this.openContactModal} className='contactButton'><i className='fa fa-paper-plane-o'/></button>
         <RouteHandler/>
       </div>
     )

browser/main/Containers/PlanetContainer.jsx

@@ -9,42 +9,17 @@ var PlanetNavigator = require('../Components/PlanetNavigator')
 var PlanetArticleList = require('../Components/PlanetArticleList')
 var PlanetArticleDetail = require('../Components/PlanetArticleDetail')
 
+var Hq = require('../Services/Hq')
+
 var Modal = require('../Mixins/Modal')
 var ArticleFilter = require('../Mixins/ArticleFilter')
-
-var Hq = require('../Services/Hq')
+var Helper = require('../Mixins/Helper')
 
 var UserStore = require('../Stores/UserStore')
 var PlanetStore = require('../Stores/PlanetStore')
 
-function deleteItemFromTargetArray (item, targetArray) {
-  targetArray.some(function (_item, index) {
-    if (_item.id === item.id) {
-      targetArray.splice(index, 1)
-      return true
-    }
-    return false
-  })
-
-  return targetArray
-}
-
-function updateItemToTargetArray (item, targetArray) {
-  var isNew = !targetArray.some(function (_item, index) {
-    if (_item.id === item.id) {
-      targetArray.splice(index, 1, item)
-      return true
-    }
-    return false
-  })
-
-  if (isNew) targetArray.push(item)
-
-  return targetArray
-}
-
 module.exports = React.createClass({
-  mixins: [ReactRouter.Navigation, ReactRouter.State, Modal, Reflux.listenTo(UserStore, 'onUserChange'), Reflux.listenTo(PlanetStore, 'onPlanetChange'), ArticleFilter],
+  mixins: [ReactRouter.Navigation, ReactRouter.State, Modal, Reflux.listenTo(UserStore, 'onUserChange'), Reflux.listenTo(PlanetStore, 'onPlanetChange'), ArticleFilter, Helper],
   propTypes: {
     params: React.PropTypes.object,
     planetName: React.PropTypes.string
@@ -111,7 +86,7 @@ module.exports = React.createClass({
       case 'codeUpdated':
         code = res.data
         if (code.PlanetId === this.state.planet.id) {
-          this.state.planet.Codes = updateItemToTargetArray(code, this.state.planet.Codes)
+          this.state.planet.Codes = this.updateItemToTargetArray(code, this.state.planet.Codes)
 
           this.setState({planet: this.state.planet})
         }
@@ -119,7 +94,7 @@ module.exports = React.createClass({
       case 'noteUpdated':
         note = res.data
         if (note.PlanetId === this.state.planet.id) {
-          this.state.planet.Notes = updateItemToTargetArray(note, this.state.planet.Notes)
+          this.state.planet.Notes = this.updateItemToTargetArray(note, this.state.planet.Notes)
 
           this.setState({planet: this.state.planet})
         }
@@ -127,7 +102,7 @@ module.exports = React.createClass({
       case 'codeDestroyed':
         code = res.data
         if (code.PlanetId === this.state.planet.id) {
-          this.state.planet.Codes = deleteItemFromTargetArray(code, this.state.planet.Codes)
+          this.state.planet.Codes = this.deleteItemFromTargetArray(code, this.state.planet.Codes)
 
           if (this.refs.detail.props.article != null && this.refs.detail.props.article.type === code.type && this.refs.detail.props.article.localId === code.localId) {
             articleIndex = this.getFilteredIndexOfCurrentArticle()
@@ -151,7 +126,7 @@ module.exports = React.createClass({
       case 'noteDestroyed':
         note = res.data
         if (note.PlanetId === this.state.planet.id) {
-          this.state.planet.Notes = deleteItemFromTargetArray(note, this.state.planet.Notes)
+          this.state.planet.Notes = this.deleteItemFromTargetArray(note, this.state.planet.Notes)
 
           if (this.refs.detail.props.article != null && this.refs.detail.props.article.type === note.type && this.refs.detail.props.article.localId === note.localId) {
             articleIndex = this.getFilteredIndexOfCurrentArticle()

browser/main/Containers/UserContainer.jsx

@@ -18,6 +18,7 @@ var ProfileImage = require('../Components/ProfileImage')
 var EditProfileModal = require('../Components/EditProfileModal')
 var TeamSettingsModal = require('../Components/TeamSettingsModal')
 var PlanetCreateModal = require('../Components/PlanetCreateModal')
+var AddMemberModal = require('../Components/AddMemberModal')
 var TeamCreateModal = require('../Components/TeamCreateModal')
 
 var UserStore = require('../Stores/UserStore')
@@ -56,12 +57,29 @@ module.exports = React.createClass({
   onUserChange: function (res) {
     if (this.state.user == null) return
 
+    var member
     switch (res.status) {
       case 'userUpdated':
         if (this.state.user.id === res.data.id) {
           this.setState({user: res.data})
         }
         break
+      case 'memberAdded':
+        member = res.data
+        if (this.state.user.userType === 'team' && member.TeamMember.TeamId === this.state.user.id) {
+          this.state.user.Members = this.updateItemToTargetArray(member, this.state.user.Members)
+
+          this.setState({user: this.state.user})
+        }
+        break
+      case 'memberRemoved':
+        member = res.data
+        if (this.state.user.userType === 'team' && member.TeamMember.TeamId === this.state.user.id) {
+          this.state.user.Members = this.deleteItemFromTargetArray(member, this.state.user.Members)
+
+          this.setState({user: this.state.user})
+        }
+        break
     }
   },
   onPlanetChange: function (res) {
@@ -123,6 +141,7 @@ module.exports = React.createClass({
           this.setState({user: this.state.user})
           return
         }
+        break
     }
   },
   fetchUser: function (userName) {
@@ -143,7 +162,7 @@ module.exports = React.createClass({
     this.openModal(TeamSettingsModal, {team: this.state.user})
   },
   openAddUserModal: function () {
-
+    this.openModal(AddMemberModal, {team: this.state.user})
   },
   openTeamCreateModal: function () {
     this.openModal(TeamCreateModal, {user: this.state.user})
@@ -212,9 +231,10 @@ module.exports = React.createClass({
           <button onClick={this.openTeamSettingsModal} className='editProfileButton'>Team settings</button>
         </div>
         <div className='memberList'>
-          <div className='memberLabel'>{members.length} {members.length > 0 ? 'Members' : 'Member'}</div>
+          <div className='memberLabel'>{members.length} {members.length > 1 ? 'Members' : 'Member'}</div>
           <ul className='members'>
             {members}
+            {isOwner ? (<li><button onClick={this.openAddUserModal} className='addMemberButton'><i className='fa fa-plus-square-o'/> add Member</button></li>) : null}
           </ul>
         </div>
         <div className='planetList'>
@@ -271,6 +291,10 @@ module.exports = React.createClass({
       )
     }.bind(this))
 
+    var planetCount = userPlanets.length + user.Teams.reduce(function (sum, team) {
+        return sum + (team.Planets != null ? team.Planets.length : 0)
+      }, 0)
+
     return (
       <div className='UserContainer'>
         <div className='userProfile'>
@@ -284,16 +308,14 @@ module.exports = React.createClass({
           <button onClick={this.openEditProfileModal} className='editProfileButton'>Edit profile</button>) : null}
         </div>
         <div className='teamList'>
-          <div className='teamLabel'>{teams.length} {teams.length > 0 ? 'Teams' : 'Team'}</div>
+          <div className='teamLabel'>{teams.length} {teams.length > 1 ? 'Teams' : 'Team'}</div>
           <ul className='teams'>
             {teams}
             {isOwner ? (<li><button onClick={this.openTeamCreateModal} className='createTeamButton'><i className='fa fa-plus-square-o'/> Create new team</button></li>) : null}
           </ul>
         </div>
         <div className='planetList'>
-          <div className='planetLabel'>{userPlanets.length + user.Teams.reduce(function (sum, team) {
-              return sum + (team.Planets != null ? team.Planets.length : 0)
-            }, 0)} {userPlanets.length > 0 ? 'Planets' : 'Planet'}</div>
+          <div className='planetLabel'>{planetCount} {planetCount > 1 ? 'Planets' : 'Planet'}</div>
           <div className='planetGroup'>
             <div className='planetGroupLabel'>{user.profileName}</div>
             <ul className='planets'>