multiplayer inu demo on 15/06/16

.gitignore

node_modules
npm-debug.log*

client.js

const inu = require('inu')
const html = inu.html
const pull = inu.pull
const pullKeys = require('pull-keys')
const ws = require('pull-ws-server')

const server = ws.connect('ws://localhost:9965')

const keyToDirection = {
  left: [-1, 0],
  down: [0, -1],
  right: [1, 0],
  up: [0, 1]
}

const app = {
  init: () => ({
    model: {
      position: [0, 0]
    },
    effect: 'listenToKeys'
  }),

  update: (model, action) => {
    switch (action.type) {
      case 'set':
        return { model: action.model }
      default:
        return { model: model }
    }
  },

  view: (model, dispatch) => {
    const position = model.position

    return html`
      <main>
        <div>
          position: ${JSON.stringify(position)}
        </div>
        <svg height="100%" width="100%" viewBox="0 0 100 100" preserveAspectRatio="none">
          <circle r=2 cx=${position[0]} cy=${100 - position[1]} />
        </svg>
      </main>
    `
  },

  run: (effect) => {
    pull(
      pullKeys({
        left: true,
        down: true,
        right: true,
        up: true
      }),
      pull.map((key) => {
        return {
          type: 'move',
          direction: keyToDirection[key]
        }
      }),
      pull.map(JSON.stringify),
      server.sink
    )

    return pull(
      server.source,
      pull.map((model) => {
        return JSON.parse(model)
      }),
      pull.map((model) => {
        return {
          type: 'set',
          model: model
        }
      })
    )
  }
}

const streams = inu.start(app)
const main = document.createElement('main')

const style = document.createElement('style')
style.textContent = 'html, body, main, svg { height: 100%; width: 100%; margin: 0; padding: 0; }'
document.head.appendChild(style)

document.body.appendChild(main)

pull(
  streams.views(),
  pull.drain((view) => {
    html.update(main, view)
  })
)

package.json

{
  "name": "inu-happy",
  "version": "0.0.0",
  "description": "fun inu times",
  "scripts": {
    "client": "budo client:bundle.js -d . --live -- -d",
    "server": "node-dev server",
    "start": "npm-run-all -p client server"
  },
  "browserify": {
    "transform": [
      "es2020"
    ]
  },
  "author": "Mikey <[email protected]> (http://dinosaur.os)",
  "license": "ISC",
  "devDependencies": {
    "budo": "^8.3.0",
    "node-dev": "^3.1.3"
  },
  "dependencies": {
    "es2020": "^1.1.6",
    "inu": "ahdinosaur/inu#run-all-streams",
    "npm-run-all": "^2.1.2",
    "pull-keys": "^1.0.0",
    "pull-pushable": "^2.0.0",
    "pull-ws-server": "^1.9.2"
  }
}

server.js

const ws = require('pull-ws-server')
const inu = require('inu')
const pull = inu.pull
const Pushable = require('pull-pushable')

const app = {
  init: () => ({
    model: {
      position: [0, 0]
    },
    effect: 'init'
  }),

  update: (model, action) => {
    switch (action.type) {
      case 'move':
        return {
          model: {
            position: move(model.position, action.direction)
          }
        }
      default:
        return { model: model }
    }
  },

  run: (effect, streams) => {
    const pushable = Pushable()

    const server = ws.createServer((client) => {
      console.log('client', client)

      pull(
        streams.models(),
        pull.map(JSON.stringify),
        client.sink
      )

      pull(
        client.source,
        pull.map((string) => {
          try {
            return JSON.parse(string)
          } catch (err) {
            return null
          }
        }),
        pull.filter(),
        pull.drain(pushable.push)
      )
    })

    server.listen(9965)

    return pushable
  }
}

const streams = inu.start(app)

pull(
  streams.models(),
  pull.log()
)

function move (position, direction) {
  return [
    position[0] + direction[0],
    position[1] + direction[1]
  ]
}