smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor(app.tsx): move Portal to new file and some refactoring (#1398)

Browse source
This commit is contained in:
Aakansha Doshi 2020-04-12 16:24:52 +05:30 • committed by GitHub
parent 6abcb2d87f
commit 227ff60909
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 78 additions and 61 deletions
Download patch file Download diff file Expand all files Collapse all files

59
src/components/App.tsx
View file

@ -3,7 +3,7 @@ import React from "react";
import socketIOClient from "socket.io-client";
import rough from "roughjs/bin/rough";
import { RoughCanvas } from "roughjs/bin/canvas";
import { FlooredNumber } from "../types";
import { FlooredNumber, SocketUpdateData } from "../types";
import {
newElement,
@ -41,7 +41,6 @@ import {
} from "../scene";
import {
decryptAESGEM,
encryptAESGEM,
saveToLocalStorage,
loadScene,
loadFromBlob,
@ -49,6 +48,7 @@ import {
SocketUpdateDataSource,
exportCanvas,
} from "../data";
import Portal from "./Portal";
import { renderScene } from "../renderer";
import { AppState, GestureEvent, Gesture } from "../types";
@ -160,53 +160,7 @@ const gesture: Gesture = {
initialScale: null,
};
class Portal {
socket: SocketIOClient.Socket | null = null;
socketInitialized: boolean = false; // we don't want the socket to emit any updates until it is fully initalized
roomID: string | null = null;
roomKey: string | null = null;
open(socket: SocketIOClient.Socket, id: string, key: string) {
this.socket = socket;
this.roomID = id;
this.roomKey = key;
}
close() {
if (!this.socket) {
return;
}
this.socket.close();
this.socket = null;
this.roomID = null;
this.roomKey = null;
}
isOpen() {
return this.socketInitialized && this.socket && this.roomID && this.roomKey;
}
async _broadcastSocketData(
data: SocketUpdateDataSource[keyof SocketUpdateDataSource] & {
_brand: "socketUpdateData";
},
volatile: boolean = false,
) {
if (this.isOpen()) {
const json = JSON.stringify(data);
const encoded = new TextEncoder().encode(json);
const encrypted = await encryptAESGEM(encoded, this.roomKey!);
this.socket!.emit(
volatile ? "server-volatile-broadcast" : "server-broadcast",
this.roomID,
encrypted.data,
encrypted.iv,
);
}
}
}
export class App extends React.Component<any, AppState> {
class App extends React.Component<any, AppState> {
canvas: HTMLCanvasElement | null = null;
rc: RoughCanvas | null = null;
portal: Portal = new Portal();
@ -1060,7 +1014,7 @@ export class App extends React.Component<any, AppState> {
},
};
return this.portal._broadcastSocketData(
data as typeof data & { _brand: "socketUpdateData" },
data as SocketUpdateData,
true, // volatile
);
}
@ -1079,9 +1033,7 @@ export class App extends React.Component<any, AppState> {
this.lastBroadcastedOrReceivedSceneVersion,
getDrawingVersion(globalSceneState.getElementsIncludingDeleted()),
);
return this.portal._broadcastSocketData(
data as typeof data & { _brand: "socketUpdateData" },
);
return this.portal._broadcastSocketData(data as SocketUpdateData);
};
private onSceneUpdated = () => {
@ -2664,4 +2616,5 @@ if (
});
}
export default App;
// -----------------------------------------------------------------------------

54
src/components/Portal.tsx Normal file
View file

@ -0,0 +1,54 @@
import { encryptAESGEM } from "../data";
import { SocketUpdateData } from "../types";
import { BROADCAST } from "../constants";
class Portal {
socket: SocketIOClient.Socket | null = null;
socketInitialized: boolean = false; // we don't want the socket to emit any updates until it is fully initialized
roomID: string | null = null;
roomKey: string | null = null;
open(socket: SocketIOClient.Socket, id: string, key: string) {
this.socket = socket;
this.roomID = id;
this.roomKey = key;
}
close() {
if (!this.socket) {
return;
}
this.socket.close();
this.socket = null;
this.roomID = null;
this.roomKey = null;
}
isOpen() {
return !!(
this.socketInitialized &&
this.socket &&
this.roomID &&
this.roomKey
);
}
async _broadcastSocketData(
data: SocketUpdateData,
volatile: boolean = false,
) {
if (this.isOpen()) {
const json = JSON.stringify(data);
const encoded = new TextEncoder().encode(json);
const encrypted = await encryptAESGEM(encoded, this.roomKey!);
this.socket!.emit(
volatile ? BROADCAST.SERVER_VOLATILE : BROADCAST.SERVER,
this.roomID,
encrypted.data,
encrypted.iv,
);
}
}
}
export default Portal;