1
0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-07-30 04:23:11 +03:00

Drawio: Started browser drawing backup store system

Adds just the part to store image data, and remove on successfull save.
Alters save events to properly throw upon error.
Adds IDB-Keyval library for local large-size store.
For #4421
This commit is contained in:
Dan Brown
2023-08-22 19:30:39 +01:00
parent cbcec189fd
commit a4fbde9185
7 changed files with 61 additions and 28 deletions

View File

@ -1,17 +1,22 @@
// Docs: https://www.diagrams.net/doc/faq/embed-mode
import * as store from './store';
let iFrame = null;
let lastApprovedOrigin;
let onInit; let
onSave;
let onInit;
let onSave;
const saveBackupKey = 'last-drawing-save';
function drawPostMessage(data) {
iFrame.contentWindow.postMessage(JSON.stringify(data), lastApprovedOrigin);
}
function drawEventExport(message) {
store.set(saveBackupKey, message.data);
if (onSave) {
onSave(message.data);
onSave(message.data).then(() => {
store.del(saveBackupKey);
});
}
}
@ -64,9 +69,11 @@ function drawReceive(event) {
/**
* Show the draw.io editor.
* onSaveCallback must return a promise that resolves on successful save and errors on failure.
* onInitCallback must return a promise with the xml to load for the editor.
* @param {String} drawioUrl
* @param {Function} onInitCallback - Must return a promise with the xml to load for the editor.
* @param {Function} onSaveCallback - Is called with the drawing data on save.
* @param {Function<Promise<String>>} onInitCallback
* @param {Function<Promise>} onSaveCallback - Is called with the drawing data on save.
*/
export function show(drawioUrl, onInitCallback, onSaveCallback) {
onInit = onInitCallback;

View File

@ -0,0 +1 @@
export { get, set, del } from 'idb-keyval';

View File

@ -70,3 +70,14 @@ export function uniqueId() {
const S4 = () => (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
return (`${S4() + S4()}-${S4()}-${S4()}-${S4()}-${S4()}${S4()}${S4()}`);
}
/**
* Create a promise that resolves after the given time.
* @param {int} timeMs
* @returns {Promise}
*/
export function wait(timeMs) {
return new Promise(res => {
setTimeout(res, timeMs);
});
}