diff --git a/lang/en/entities.php b/lang/en/entities.php index b1b0e5236..453d45d56 100644 --- a/lang/en/entities.php +++ b/lang/en/entities.php @@ -239,6 +239,8 @@ return [ 'pages_md_insert_drawing' => 'Insert Drawing', 'pages_md_show_preview' => 'Show preview', 'pages_md_sync_scroll' => 'Sync preview scroll', + 'pages_drawing_unsaved' => 'Unsaved Drawing', + 'pages_drawing_unsaved_confirm' => 'Unsaved drawing data was found from a previous failed drawing save attempt. Would you like to restore and continue editing this unsaved drawing?', 'pages_not_in_chapter' => 'Page is not in a chapter', 'pages_move' => 'Move Page', 'pages_copy' => 'Copy Page', diff --git a/resources/js/services/drawio.js b/resources/js/services/drawio.js index 10943ab57..46e10327a 100644 --- a/resources/js/services/drawio.js +++ b/resources/js/services/drawio.js @@ -67,18 +67,43 @@ function drawReceive(event) { } } +/** + * Attempt to prompt and restore unsaved drawing content if existing. + * @returns {Promise} + */ +async function attemptRestoreIfExists() { + const backupVal = await store.get(saveBackupKey); + const dialogEl = document.getElementById('unsaved-drawing-dialog'); + + if (!dialogEl) { + console.error('Missing expected unsaved-drawing dialog'); + } + + if (backupVal) { + /** @var {ConfirmDialog} */ + const dialog = window.$components.firstOnElement(dialogEl, 'confirm-dialog'); + const restore = await dialog.show(); + if (restore) { + onInit = async () => backupVal; + } + } +} + /** * 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. + * Will attempt to provide an option to restore unsaved changes if found to exist. * @param {String} drawioUrl * @param {Function>} onInitCallback * @param {Function} onSaveCallback - Is called with the drawing data on save. */ -export function show(drawioUrl, onInitCallback, onSaveCallback) { +export async function show(drawioUrl, onInitCallback, onSaveCallback) { onInit = onInitCallback; onSave = onSaveCallback; + await attemptRestoreIfExists(); + iFrame = document.createElement('iframe'); iFrame.setAttribute('frameborder', '0'); window.addEventListener('message', drawReceive); diff --git a/resources/views/common/confirm-dialog.blade.php b/resources/views/common/confirm-dialog.blade.php index 8e4148b88..736a1c49b 100644 --- a/resources/views/common/confirm-dialog.blade.php +++ b/resources/views/common/confirm-dialog.blade.php @@ -1,5 +1,6 @@