Compare commits

..

2 Commits

21 changed files with 2237 additions and 2 deletions

View File

@ -16,7 +16,7 @@ services:
excalidraw-room: excalidraw-room:
build: build:
context: ./excalidraw-room/. context: ./excalidraw-room
environment: environment:
# Collaboration WebSocket # Collaboration WebSocket
PORT: 3002 PORT: 3002

@ -1 +0,0 @@
Subproject commit 03ff435860b508d7cd9e005cfc90f7977ae2a593

View File

@ -0,0 +1,2 @@
PORT=
CORS_ORIGIN=

View File

@ -0,0 +1,3 @@
{
"extends": "@excalidraw/eslint-config"
}

View File

@ -0,0 +1,8 @@
version: 2
updates:
- package-ecosystem: npm
directory: /
schedule:
interval: weekly
day: sunday
time: "01:00"

View File

@ -0,0 +1,18 @@
name: Lint
on:
push:
jobs:
lint:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v1
- name: Setup Node.js 14.x
uses: actions/setup-node@v1
with:
node-version: 14.x
- name: Install dependencies
run: yarn --frozen-lockfile
- name: Lint
run: yarn test:other

View File

@ -0,0 +1,19 @@
name: Publish Docker
on:
push:
branches:
- master
jobs:
publish-docker:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: docker/build-push-action@v1
with:
username: ${{ secrets.DOCKER_USERNAME }}
password: ${{ secrets.DOCKER_PASSWORD }}
repository: excalidraw/excalidraw-room
tag_with_ref: true
tag_with_sha: true

View File

@ -0,0 +1,20 @@
name: Test & Build
on:
push:
jobs:
test:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v1
- name: Setup Node.js 14.x
uses: actions/setup-node@v1
with:
node-version: 14.x
- name: Install dependencies
run: yarn --frozen-lockfile
- name: Test and Build
run: |
yarn test:code
yarn build

108
excalidraw-room/.gitignore vendored Normal file
View File

@ -0,0 +1,108 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*
# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
*.lcov
# nyc test coverage
.nyc_output
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# TypeScript v1 declaration files
typings/
# TypeScript cache
*.tsbuildinfo
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variables file
.env
.env.test
.env.production
# parcel-bundler cache (https://parceljs.org/)
.cache
# Next.js build output
.next
# Nuxt.js build / generate output
.nuxt
dist
# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and *not* Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public
# vuepress build output
.vuepress/dist
# Serverless directories
.serverless/
# FuseBox cache
.fusebox/
# DynamoDB Local files
.dynamodb/
# TernJS port file
.tern-port
.DS_Store
dist

View File

@ -0,0 +1,13 @@
FROM node:12-alpine
WORKDIR /excalidraw-room
COPY package.json yarn.lock ./
RUN yarn
COPY tsconfig.json ./
COPY src ./src
RUN yarn build
EXPOSE 80
CMD ["yarn", "start"]

21
excalidraw-room/LICENSE Normal file
View File

@ -0,0 +1,21 @@
MIT License
Copyright (c) 2020 Excalidraw
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.

27
excalidraw-room/README.md Executable file
View File

@ -0,0 +1,27 @@
# Example of excalidraw collaboration server
Collaboration server for Excalidraw
If you need to use cluster mode with pm2. Checkout: https://socket.io/docs/v4/pm2/
If you are not familiar with pm2: https://pm2.keymetrics.io/docs/usage/quick-start/
# Development
- install
```sh
yarn
```
- run development server
```sh
yarn start:dev
```
# Start with pm2
```
pm2 start pm2.production.json
```

View File

@ -0,0 +1,39 @@
{
"dependencies": {
"@excalidraw/eslint-config": "1.0.1",
"@excalidraw/prettier-config": "1.0.2",
"@types/debug": "4.1.5",
"@types/express": "4.17.11",
"@types/node": "14.14.31",
"@typescript-eslint/eslint-plugin": "4.16.1",
"@typescript-eslint/parser": "4.16.1",
"cross-env": "^7.0.3",
"debug": "4.3.1",
"dotenv": "^10.0.0",
"eslint": "7.21.0",
"eslint-config-prettier": "8.1.0",
"eslint-plugin-prettier": "3.3.1",
"express": "4.17.1",
"prettier": "2.2.1",
"socket.io": "^4.6.1",
"ts-node-dev": "^1.1.8",
"typescript": "4.2.3"
},
"license": "MIT",
"main": "dist/index.js",
"name": "excalidraw-portal",
"prettier": "@excalidraw/prettier-config",
"scripts": {
"build": "tsc",
"fix:code": "yarn test:code --fix",
"fix:other": "yarn prettier --write",
"fix": "yarn fix:other && yarn fix:code",
"prettier": "prettier . --ignore-path=.gitignore",
"start": "node dist/index.js",
"start:dev": "cross-env NODE_ENV=development ts-node-dev --respawn --transpile-only src/index.ts",
"test:code": "eslint --ext .ts .",
"test:other": "yarn prettier --list-different",
"test": "yarn test:other && yarn test:code"
},
"version": "1.0.0"
}

14
excalidraw-room/pm2.json Normal file
View File

@ -0,0 +1,14 @@
{
"name": "excalidraw-collab-dev",
"script": "./dist/index.js",
"watch": ["src/"],
"ignore_watch": ["node_modules", "public"],
"autorestart": false,
"exec_mode": "fork_mode",
"instances": 1,
"env": {
"NODE_ENV": "development",
"TZ": "Europe/London"
},
"node_args": ["--inspect=127.0.0.1:9320"]
}

View File

@ -0,0 +1,15 @@
{
"name": "excalidraw-collab",
"script": "./dist/index.js",
"ignore_watch": ["node_modules", "public"],
"max_memory_restart": "4G",
"watch": false,
"wait_ready": true,
"log_date_format": "YYYY-MM-DD HH:mm Z",
"autorestart": true,
"exec_mode": "fork_mode",
"instances": 1,
"env": {
"NODE_ENV": "production"
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 139 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.8 KiB

153
excalidraw-room/src/index.ts Executable file
View File

@ -0,0 +1,153 @@
import debug from "debug";
import express from "express";
import http from "http";
import { Server as SocketIO } from "socket.io";
type UserToFollow = {
socketId: string;
username: string;
};
type OnUserFollowedPayload = {
userToFollow: UserToFollow;
action: "FOLLOW" | "UNFOLLOW";
};
const serverDebug = debug("server");
const ioDebug = debug("io");
const socketDebug = debug("socket");
require("dotenv").config(
process.env.NODE_ENV !== "development"
? { path: ".env.production" }
: { path: ".env.development" },
);
const app = express();
const port =
process.env.PORT || (process.env.NODE_ENV !== "development" ? 80 : 3002); // default port to listen
app.use(express.static("public"));
app.get("/", (req, res) => {
res.send("Excalidraw collaboration server is up :)");
});
const server = http.createServer(app);
server.listen(port, () => {
serverDebug(`listening on port: ${port}`);
});
try {
const io = new SocketIO(server, {
transports: ["websocket", "polling"],
cors: {
allowedHeaders: ["Content-Type", "Authorization"],
origin: process.env.CORS_ORIGIN || "*",
credentials: true,
},
allowEIO3: true,
});
io.on("connection", (socket) => {
ioDebug("connection established!");
io.to(`${socket.id}`).emit("init-room");
socket.on("join-room", async (roomID) => {
socketDebug(`${socket.id} has joined ${roomID}`);
await socket.join(roomID);
const sockets = await io.in(roomID).fetchSockets();
if (sockets.length <= 1) {
io.to(`${socket.id}`).emit("first-in-room");
} else {
socketDebug(`${socket.id} new-user emitted to room ${roomID}`);
socket.broadcast.to(roomID).emit("new-user", socket.id);
}
io.in(roomID).emit(
"room-user-change",
sockets.map((socket) => socket.id),
);
});
socket.on(
"server-broadcast",
(roomID: string, encryptedData: ArrayBuffer, iv: Uint8Array) => {
socketDebug(`${socket.id} sends update to ${roomID}`);
socket.broadcast.to(roomID).emit("client-broadcast", encryptedData, iv);
},
);
socket.on(
"server-volatile-broadcast",
(roomID: string, encryptedData: ArrayBuffer, iv: Uint8Array) => {
socketDebug(`${socket.id} sends volatile update to ${roomID}`);
socket.volatile.broadcast
.to(roomID)
.emit("client-broadcast", encryptedData, iv);
},
);
socket.on("user-follow", async (payload: OnUserFollowedPayload) => {
const roomID = `follow@${payload.userToFollow.socketId}`;
switch (payload.action) {
case "FOLLOW": {
await socket.join(roomID);
const sockets = await io.in(roomID).fetchSockets();
const followedBy = sockets.map((socket) => socket.id);
io.to(payload.userToFollow.socketId).emit(
"user-follow-room-change",
followedBy,
);
break;
}
case "UNFOLLOW": {
await socket.leave(roomID);
const sockets = await io.in(roomID).fetchSockets();
const followedBy = sockets.map((socket) => socket.id);
io.to(payload.userToFollow.socketId).emit(
"user-follow-room-change",
followedBy,
);
break;
}
}
});
socket.on("disconnecting", async () => {
socketDebug(`${socket.id} has disconnected`);
for (const roomID of Array.from(socket.rooms)) {
const otherClients = (await io.in(roomID).fetchSockets()).filter(
(_socket) => _socket.id !== socket.id,
);
const isFollowRoom = roomID.startsWith("follow@");
if (!isFollowRoom && otherClients.length > 0) {
socket.broadcast.to(roomID).emit(
"room-user-change",
otherClients.map((socket) => socket.id),
);
}
if (isFollowRoom && otherClients.length === 0) {
const socketId = roomID.replace("follow@", "");
io.to(socketId).emit("broadcast-unfollow");
}
}
});
socket.on("disconnect", () => {
socket.removeAllListeners();
socket.disconnect();
});
});
} catch (error) {
console.error(error);
}

16
excalidraw-room/tsconfig.json Executable file
View File

@ -0,0 +1,16 @@
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"outDir": "dist"
}
}

1760
excalidraw-room/yarn.lock Normal file

File diff suppressed because it is too large Load Diff