Make calls work

README.md

@@ -18,10 +18,19 @@ From git source:
 git clone https://github.com/jeremija/peer-calls.git
 cd peer-calls
 npm install
-npm run build
+
+# for production
 npm start
+npm run build
+
+# for development
+npm run start:watch
 ```
 
+To run a development version, type:
+
+
+
 If you successfully completed the above steps, your commandline/terminal should
 show that your node server is listening.
 

package.json

@@ -6,7 +6,7 @@
   "main": "src/index.js",
   "scripts": {
     "start": "node src/index.js",
-    "start:server": "nodemon src/index.js",
+    "start:server": "nodemon src/index.js --ignore build/ --ignore src/client",
     "start:watch": "chastifol [ npm run js:watch ] [ npm run css:watch ] [ npm run start:server ]",
     "watch": "",
     "build": "npm run css && npm run js",

src/client/__tests__/store-test.js

@@ -1,4 +1,4 @@
-window.localStorage = { debug: true }
+window.localStorage = { log: true }
 import logger from 'redux-logger'
 const store = require('../store.js')
 

src/client/actions/CallActions.js

@@ -23,9 +23,11 @@ export const init = () => dispatch => {
 export const connect = () => dispatch => {
   return new Promise(resolve => {
     socket.once('connect', () => {
-      dispatch(NotifyActions.warning('Connected to server socket'))
       resolve(socket)
     })
+    socket.on('connect', () => {
+      dispatch(NotifyActions.warning('Connected to server socket'))
+    })
     socket.on('disconnect', () => {
       dispatch(NotifyActions.error('Server socket disconnected'))
     })

src/client/components/Input.js

@@ -22,8 +22,10 @@ export default class Input extends React.Component {
     this.submit()
   }
   handleKeyPress = e => {
-    e.preventDefault()
-    e.key === 'Enter' && this.submit()
+    if (e.key === 'Enter') {
+      e.preventDefault()
+      this.submit()
+    }
   }
   submit = () => {
     const { notify } = this.props

src/client/components/__tests__/Input-test.js

@@ -54,6 +54,14 @@ describe('components/Input', () => {
         expect(peers.message.mock.calls).toEqual([[ message ]])
         expect(notify.mock.calls).toEqual([[ `You: ${message}` ]])
       })
+
+      it('does nothing when other key pressed', () => {
+        TestUtils.Simulate.keyPress(input, {
+          key: 'test'
+        })
+        expect(peers.message.mock.calls.length).toBe(0)
+        expect(notify.mock.calls.length).toBe(0)
+      })
     })
 
   })

src/client/index.js

@@ -1,5 +1,5 @@
 'use strict'
-import App from './components/App.js'
+import App from './containers/App.js'
 import React from 'react'
 import ReactDOM from 'react-dom'
 import store from './store.js'

src/client/peer/__tests__/handshake-test.js

@@ -25,7 +25,7 @@ describe('handshake', () => {
   describe('socket events', () => {
     describe('users', () => {
       it('add a peer for each new user and destroy peers for missing', () => {
-        handshake(socket, 'bla')
+        handshake({ socket, roomName: 'bla' })
 
         // given
         let payload = {
@@ -53,7 +53,7 @@ describe('handshake', () => {
       let data
       beforeEach(() => {
         data = {}
-        handshake(socket, 'bla')
+        handshake({ socket, roomName: 'bla' })
         socket.emit('users', {
           initiator: 'a',
           users: [{ id: 'a' }, { id: 'b' }]
@@ -88,7 +88,7 @@ describe('handshake', () => {
       let ready = false
       socket.once('ready', () => { ready = true })
 
-      handshake(socket, 'bla')
+      handshake({ socket, roomName: 'bla' })
 
       socket.emit('users', {
         initiator: 'a',

src/client/peer/handshake.js

@@ -7,7 +7,7 @@ import store from '../store.js'
 const debug = _debug('peercalls')
 const { dispatch } = store
 
-export default function init (socket, roomName, stream) {
+export default function handshake ({ socket, roomName, stream }) {
   function createPeer (user, initiator) {
     return peers.create({ socket, user, initiator, stream })
   }

src/client/store.js

@@ -2,7 +2,7 @@ import { create } from './middlewares.js'
 import reducers from './reducers'
 import { applyMiddleware, createStore } from 'redux'
 export const middlewares = create(
-  window.localStorage && window.localStorage.debug
+  window.localStorage && window.localStorage.log
 )
 
 export default createStore(

src/server/app.js

@@ -8,7 +8,7 @@ const app = express()
 const http = require('http').Server(app)
 const io = require('socket.io')(http)
 
-app.set('view engine', 'jade')
+app.set('view engine', 'pug')
 app.set('views', path.join(__dirname, '../views'))
 
 app.use('/res', express.static(path.join(__dirname, '../res')))

src/views/call.pug

@@ -8,12 +8,12 @@ html
     meta(name="apple-mobile-web-app-capable" content="yes")
     link(rel="apple-touch-icon" href="../res/icon.png")
     link(rel="icon" sizes="256x256" href="../res/icon.png")
-    link(rel="stylesheet" type="text/css" href="../css/main.css")
+    link(rel="stylesheet" type="text/css" href="../static/style.css")
 
   body.call
-    input#callId(type="hidden" value="#{callId}")
-    input#iceServers(type="hidden" value="#{JSON.stringify(iceServers)}")
+    input#callId(type="hidden" value=callId)
+    input#iceServers(type="hidden" value=JSON.stringify(iceServers))
 
     div#container
 
-    script(src='../js/index.js')
+    script(src='../static/index.js')

src/views/index.pug

@@ -9,10 +9,10 @@ html
     meta(name="apple-mobile-web-app-capable" content="yes")
     link(rel="apple-touch-icon" href="res/icon.png")
     link(rel="icon" sizes="256x256" href="res/icon.png")
-    link(rel="stylesheet" type="text/css" href="css/main.css")
+    link(rel="stylesheet" type="text/css" href="static/style.css")
 
   body
-    include ./_fork.jade
+    include ./_fork.pug
 
     div#container