(ml5717) Added peer.js npm install

.pre-commit-config.yaml

@@ -4,10 +4,10 @@ repos:
     hooks:
       - id: trailing-whitespace
   - repo: https://github.com/prettier/prettier
-    rev: ""
+    rev: "1.18.2"
     hooks:
       - id: prettier
   - repo: https://github.com/pre-commit/mirrors-eslint
-    rev: ""
+    rev: "v6.5.1"
     hooks:
       - id: eslint

README.md

 # drawing-app
 
-CRDT-based p2p Drawing Application
\ No newline at end of file
+CRDT-based p2p Drawing Application
+
+## Set up
+
+### Install
+
+```
+> npm install
+```
+
+### Build
+
+```
+> npm run build
+```
+
+### Run the server
+
+```
+> node server.js &
+```
+
+### Run the static client
+
+```
+> npm start
+```
+
+### Open in browser
+
+Using a modern browser that supports WebRTC, like a recent version of Chrome or Firefox, open several windows of [http://localhost:12345](http://localhost:12345).
+
+## License
+
+MIT

package.json

@@ -4,13 +4,20 @@
   "description": "CRDT-based p2p Drawing Application",
   "main": "index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "build": "webpack src/app.js -o public/js/app.js",
+    "start": "http-server -c-1 -p 12345 public"
   },
-  "repository": {
-    "type": "git",
-    "url": "https://gitlab.doc.ic.ac.uk/sweng-group-15/drawing-app.git"
+  "dependencies": {
+    "http-server": "^0.11.1",
+    "peer": "git+https://github.com/peers/peerjs-server.git",
+    "peerjs": "^1.1.0",
+    "y-array": "^10.1.4",
+    "y-memory": "^8.0.9",
+    "y-text": "^9.5.1",
+    "yjs": "^12.3.3"
   },
-  "author": "sweng-group-15",
-  "license": "MIT",
-  "devDependencies": {}
+  "devDependencies": {
+    "webpack": "^4.41.0",
+    "webpack-cli": "^3.3.9"
+  }
 }

server.js

+const PeerServer = require("peer").PeerServer
+
+const port = process.env.PORT || 3000
+
+const options = {
+  port: port,
+  path: "/api",
+  debug: true
+}
+
+const server = PeerServer(options, server => {
+  const host = server.address().address
+  const port = server.address().port
+
+  console.log(
+    "Started PeerServer on %s, port: %s, path: %s",
+    host,
+    port,
+    options.path || "/"
+  )
+})
+
+server.on("connection", client => {
+  console.log(`Client connected: ${client.getId()}`)
+})
+
+server.on("disconnect", client => {
+  console.log(`Client disconnected: ${client.getId()}`)
+})

src/app.js

+const Y = require("yjs")
+require("y-memory")(Y)
+require("y-array")(Y)
+require("y-text")(Y)
+require("./y-webrtc")(Y)
+
+Y({
+  db: {
+    name: "memory"
+  },
+  connector: {
+    name: "webrtc",
+    host: "localhost",
+    port: 3000,
+    path: "/api"
+  },
+  share: {
+    textfield: "Text"
+  }
+}).then(y => {
+  y.share.textfield.bind(document.getElementById("textfield"))
+})

src/y-webrtc/LICENSE

+The MIT License (MIT)
+
+Copyright (c) 2014 Kevin Jahns <kevin.jahns@rwth-aachen.de>.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

src/y-webrtc/index.js

+/* global Y */
+"use strict"
+
+var {
+  peerjs: { Peer }
+} = require("peerjs")
+
+function extend(Y) {
+  class WebRTC extends Y.AbstractConnector {
+    constructor(y, options) {
+      if (options === undefined) {
+        throw new Error("Options must not be undefined!")
+      }
+
+      options.role = "slave"
+      super(y, options)
+      this.webrtcOptions = options
+
+      this.connect()
+    }
+
+    connect() {
+      var peer = new Peer({
+        host: this.webrtcOptions.host,
+        port: this.webrtcOptions.port,
+        path: this.webrtcOptions.path
+      })
+
+      peer.on("open", function(id) {
+        console.log("My peer ID is: " + id)
+      })
+    }
+
+    disconnect() {
+      super.disconnect()
+    }
+
+    reconnect() {
+      super.reconnect()
+    }
+
+    send(/*uid, message*/) {}
+
+    broadcast(/*message*/) {}
+
+    isDisconnected() {
+      return false
+    }
+  }
+
+  Y.extend("webrtc", WebRTC)
+}
+
+module.exports = extend
+if (typeof Y !== "undefined") {
+  extend(Y)
+}

[Nayeem Rahman]

@ml5717 Weren't we going to do it on the server first? :(

EDIT: Ah, nm. That's what PeerServer is.

[Momo Langenstein]

@mnr17 You are partially correct. This code right now skips the “all messages through the server” phase - but purely as it doesn’t implement any actual data passing functionality of any kind yet and I wanted to see if this library can work (i.e. compile and give users a unique ID). My plan is to still add some p2p functionality using a central signalling server today, so we have something to work off when we try to add purely centralised communication (there is a XMPP extension for y-js).