zeromq · cryptoquick · Jul 29, 2020 · Aug 1, 2020 · Aug 1, 2020 · Aug 4, 2020
diff --git a/.gitignore b/.gitignore
@@ -6,3 +6,5 @@ node_modules/
 .nyc_output/
 GL/
 coverage
+*.tsbuildinfo
+*.log
diff --git a/example/chat/.gitignore b/example/chat/.gitignore
@@ -0,0 +1,3 @@
+node_modules
+lib
+dist
diff --git a/example/chat/.prettierrc b/example/chat/.prettierrc
@@ -0,0 +1,8 @@
+{
+  "bracketSpacing": true,
+  "semi": false,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "arrowParens": "always",
+  "proseWrap": "never"
+}
diff --git a/example/chat/package-lock.json b/example/chat/package-lock.json
diff --git a/example/chat/package.json b/example/chat/package.json
@@ -0,0 +1,47 @@
+{
+  "name": "jszmq-chat",
+  "main": "index.js",
+  "author": "Hunter Trujillo <[email protected]>",
+  "private": true,
+  "license": "MPL-2.0",
+  "scripts": {
+    "start": "npm run build && npm run server",
+    "server": "node lib/api",
+    "clean": "rm -rf lib && rm -rf dist",
+    "build-ts": "ttsc -p tsconfig.json",
+    "build-web": "webpack --config lib/webpack.js",
+    "build-prod": "NODE_ENV=production npm run build",
+    "build": "npm run clean && npm run build-ts && npm run build-web",
+    "livereload": "livereload dist/main.js",
+    "watch-ts": "ttsc --incremental -w -p tsconfig.json",
+    "watch-web": "nodemon -w lib/web -w lib/shared -x 'npm run build-web'",
+    "watch-server": "nodemon -w lib/api -w lib/shared lib/api/index.js",
+    "watch": "NODE_ENV=development concurrently 'npm run watch-ts' 'npm run watch-web' 'npm run watch-server' 'npm run livereload'"
+  },
+  "devDependencies": {
+    "@zerollup/ts-transform-paths": "^1.7.18",
+    "concurrently": "^5.2.0",
+    "livereload": "^0.9.1",
+    "nodemon": "^2.0.4",
+    "prettier": "^2.0.5",
+    "ttypescript": "^1.5.10",
+    "typescript": "^3.9.7",
+    "webpack": "^4.44.0",
+    "webpack-cli": "^3.3.12"
+  },
+  "dependencies": {
+    "@types/express": "^4.17.7",
+    "@types/node": "^14.0.27",
+    "@types/react": "^16.9.43",
+    "@types/react-dom": "^16.9.8",
+    "buffer": "^5.6.0",
+    "csstips": "^1.2.0",
+    "csx": "^10.0.1",
+    "cuid": "^2.1.8",
+    "express": "^4.17.1",
+    "jszmq": "file:../..",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1",
+    "typestyle": "^2.1.0"
+  }
+}
diff --git a/example/chat/src/api/html.ts b/example/chat/src/api/html.ts
@@ -0,0 +1,18 @@
+export const HTML = (env?: string) => `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Chat Example</title>
+</head>
+<body>
+  <div id="root"></div>
+  <script src="/main.js"></script>${
+    env === 'development'
+      ? `<script>
+    document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')
+  </script> `
+      : ''
+  }
+</body>
+</html>`
diff --git a/example/chat/src/api/index.ts b/example/chat/src/api/index.ts
@@ -0,0 +1,60 @@
+import * as path from 'path'
+import * as http from 'http'
+import * as express from 'express'
+import { Pub, Sub } from 'jszmq'
+
+import { HTML } from 'api/html'
+import {
+  encodeActionEvent,
+  decodeActionEvent,
+  formatPrefix,
+  Topic,
+  Endpoint,
+  PORT,
+  endpoint,
+} from 'shared'
+
+const { NODE_ENV } = process.env
+
+// HTTP Server
+const app = express()
+
+const dist = path.resolve(__dirname, '..', '..', 'dist')
+
+const serveFile = (file: string, mime: string) =>
+  app.get(file, (_req, res) => {
+    res.set({ 'Content-Type': mime })
+    res.sendFile(path.join(dist, file), mime)
+  })
+
+serveFile('/main.js', 'text/javascript')
+
+app.get('*', (req, res) => {
+  const { path } = req
+  console.info(path)
+  res.send(HTML(NODE_ENV))
+})
+
+const server = http.createServer(app)
+
+// ZeroMQ Connections
+const pub = new Pub()
+const sub = new Sub()
+
+pub.bind(endpoint.browser, server)
+
+sub.subscribe(formatPrefix(Endpoint.Server, Topic.Chat_Message))
+sub.bind(endpoint.server, server)
+
+// Relay Browser Events
+sub.on('message', (msg: Buffer) => {
+  const { endpoint, topic, payload } = decodeActionEvent(msg)
+  if (endpoint === Endpoint.Server && topic === Topic.Chat_Message) {
+    pub.send(encodeActionEvent(Endpoint.Browser, topic, payload))
+  }
+})
+
+// Run Server
+server.listen(PORT, () => {
+  console.info('listening on port', PORT)
+})
diff --git a/example/chat/src/shared/index.ts b/example/chat/src/shared/index.ts
@@ -0,0 +1,51 @@
+import { Buffer } from 'buffer'
+
+// Endpoints
+export const PORT = process.env.EXPRESS_PORT || 3000
+
+export const endpoint = {
+  browser: `ws://localhost:${PORT}/browser`,
+  server: `ws://localhost:${PORT}/server`
+}
+
+// Serialization
+export enum Topic {
+  Chat_Message = 'chat/message',
+}
+
+export enum Endpoint {
+  Browser = 'Browser',
+  Server = 'Server',
+}
+
+export interface ActionEvent<T> {
+  endpoint: Endpoint
+  topic: Topic
+  payload: T
+}
+
+export const formatPrefix = (endpoint: Endpoint, topic: Topic) =>
+  Buffer.from(JSON.stringify([endpoint, topic])).slice(0, -2) // removes "] for topic generalization
+
+export const encodeActionEvent = <T>(
+  endpoint: Endpoint,
+  topic: Topic,
+  payload: T,
+) => JSON.stringify([endpoint, topic, payload])
+
+export const decodeActionEvent = <T>(msg: Buffer): ActionEvent<T> => {
+  const [endpoint, topic, payload] = JSON.parse(msg.toString('utf-8')) as [
+    Endpoint,
+    Topic,
+    T,
+  ]
+  return { endpoint, topic, payload }
+}
+
+// Message Types
+export interface ChatMessage {
+  id: string
+  user: string
+  text: string
+  time: number
+}