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:
@ -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;
|
||||
|
1
resources/js/services/store.js
Normal file
1
resources/js/services/store.js
Normal file
@ -0,0 +1 @@
|
||||
export { get, set, del } from 'idb-keyval';
|
@ -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);
|
||||
});
|
||||
}
|
||||
|
Reference in New Issue
Block a user