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

Auto-reconnecting WS client

Browse source
This commit is contained in:
Marcel Mraz 2024-12-21 00:27:22 +01:00
parent 040a57f56a
commit 6a17541713
No known key found for this signature in database
GPG key ID: 4EBD6E62DC830CD2
5 changed files with 224 additions and 242 deletions
Download patch file Download diff file Expand all files Collapse all files

66
excalidraw-app/App.tsx
View file

@ -26,6 +26,7 @@ import {
TTDDialogTrigger,
StoreAction,
reconcileElements,
newElementWith,
} from "../packages/excalidraw";
import type {
AppState,
@ -384,7 +385,7 @@ const ExcalidrawWrapper = () => {
setAcknowledgedIncrements([...(syncAPI?.acknowledgedIncrements ?? [])]);
}, 250);
syncAPI?.reconnect();
syncAPI?.connect();
return () => {
syncAPI?.disconnect();
@ -647,36 +648,35 @@ const ExcalidrawWrapper = () => {
// this check is redundant, but since this is a hot path, it's best
// not to evaludate the nested expression every time
// CFDO: temporary
// if (!LocalData.isSavePaused()) {
// LocalData.save(elements, appState, files, () => {
// if (excalidrawAPI) {
// let didChange = false;
if (!LocalData.isSavePaused()) {
LocalData.save(elements, appState, files, () => {
if (excalidrawAPI) {
let didChange = false;
// const elements = excalidrawAPI
// .getSceneElementsIncludingDeleted()
// .map((element) => {
// if (
// LocalData.fileStorage.shouldUpdateImageElementStatus(element)
// ) {
// const newElement = newElementWith(element, { status: "saved" });
// if (newElement !== element) {
// didChange = true;
// }
// return newElement;
// }
// return element;
// });
const elements = excalidrawAPI
.getSceneElementsIncludingDeleted()
.map((element) => {
if (
LocalData.fileStorage.shouldUpdateImageElementStatus(element)
) {
const newElement = newElementWith(element, { status: "saved" });
if (newElement !== element) {
didChange = true;
}
return newElement;
}
return element;
});
// if (didChange) {
// excalidrawAPI.updateScene({
// elements,
// storeAction: StoreAction.UPDATE,
// });
// }
// }
// });
// }
if (didChange) {
excalidrawAPI.updateScene({
elements,
storeAction: StoreAction.UPDATE,
});
}
}
});
}
// Render the debug scene if the debug canvas is available
if (debugCanvasRef.current && excalidrawAPI) {
@ -885,6 +885,14 @@ const ExcalidrawWrapper = () => {
max={acknowledgedIncrements.length}
value={nextVersion === -1 ? acknowledgedIncrements.length : nextVersion}
onChange={(value) => {
if (value !== acknowledgedIncrements.length - 1) {
// don't listen to updates in the detached mode
syncAPI?.disconnect();
} else {
// reconnect once we're back to the latest version
syncAPI?.connect();
}
setNextVersion(value as number);
debouncedTimeTravel(value as number);
}}

65
excalidraw-app/data/LocalData.ts
View file

@ -69,35 +69,34 @@ class LocalFileManager extends FileManager {
};
}
// CFDO: temporary
// const saveDataStateToLocalStorage = (
// elements: readonly ExcalidrawElement[],
// appState: AppState,
// ) => {
// try {
// const _appState = clearAppStateForLocalStorage(appState);
const saveDataStateToLocalStorage = (
elements: readonly ExcalidrawElement[],
appState: AppState,
) => {
try {
const _appState = clearAppStateForLocalStorage(appState);
// if (
// _appState.openSidebar?.name === DEFAULT_SIDEBAR.name &&
// _appState.openSidebar.tab === CANVAS_SEARCH_TAB
// ) {
// _appState.openSidebar = null;
// }
if (
_appState.openSidebar?.name === DEFAULT_SIDEBAR.name &&
_appState.openSidebar.tab === CANVAS_SEARCH_TAB
) {
_appState.openSidebar = null;
}
// localStorage.setItem(
// STORAGE_KEYS.LOCAL_STORAGE_ELEMENTS,
// JSON.stringify(clearElementsForLocalStorage(elements)),
// );
// localStorage.setItem(
// STORAGE_KEYS.LOCAL_STORAGE_APP_STATE,
// JSON.stringify(_appState),
// );
// updateBrowserStateVersion(STORAGE_KEYS.VERSION_DATA_STATE);
// } catch (error: any) {
// // Unable to access window.localStorage
// console.error(error);
// }
// };
localStorage.setItem(
STORAGE_KEYS.LOCAL_STORAGE_ELEMENTS,
JSON.stringify(clearElementsForLocalStorage(elements)),
);
localStorage.setItem(
STORAGE_KEYS.LOCAL_STORAGE_APP_STATE,
JSON.stringify(_appState),
);
updateBrowserStateVersion(STORAGE_KEYS.VERSION_DATA_STATE);
} catch (error: any) {
// Unable to access window.localStorage
console.error(error);
}
};
type SavingLockTypes = "collaboration";
@ -109,12 +108,12 @@ export class LocalData {
files: BinaryFiles,
onFilesSaved: () => void,
) => {
// saveDataStateToLocalStorage(elements, appState);
// await this.fileStorage.saveFiles({
// elements,
// files,
// });
// onFilesSaved();
saveDataStateToLocalStorage(elements, appState);
await this.fileStorage.saveFiles({
elements,
files,
});
onFilesSaved();
},
SAVE_TO_LOCAL_STORAGE_TIMEOUT,
);