From 3917e50c903af674d08d8865d55342e10fc56238 Mon Sep 17 00:00:00 2001
From: Dan Brown <ssddanbrown@googlemail.com>
Date: Wed, 23 Aug 2023 18:50:37 +0100
Subject: [PATCH] Drawio: Tweaked fail backup handling during testing

- Tweaked wording of popup title.
- Updated WYSIWYG create handling to properly remove drawing container
  on failure.

Tested across FF and chrome, in both editors for create & editing.
---
 lang/en/entities.php                  | 2 +-
 resources/js/wysiwyg/plugin-drawio.js | 9 +++++----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/lang/en/entities.php b/lang/en/entities.php
index 453d45d56..4468cd68f 100644
--- a/lang/en/entities.php
+++ b/lang/en/entities.php
@@ -239,7 +239,7 @@ 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' => 'Unsaved Drawing Found',
     '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',
diff --git a/resources/js/wysiwyg/plugin-drawio.js b/resources/js/wysiwyg/plugin-drawio.js
index c98b1aa10..3b343a958 100644
--- a/resources/js/wysiwyg/plugin-drawio.js
+++ b/resources/js/wysiwyg/plugin-drawio.js
@@ -34,7 +34,6 @@ function showDrawingManager(mceEditor, selectedNode = null) {
 }
 
 async function updateContent(pngData) {
-    const id = `image-${Math.random().toString(16).slice(2)}`;
     const loadingImage = window.baseUrl('/loading.gif');
 
     const handleUploadError = error => {
@@ -65,17 +64,19 @@ async function updateContent(pngData) {
 
     await wait(5);
 
-    pageEditor.insertContent(`<div drawio-diagram contenteditable="false"><img src="${loadingImage}" id="${id}"></div>`);
+    const id = `drawing-${Math.random().toString(16).slice(2)}`;
+    const wrapId = `drawing-wrap-${Math.random().toString(16).slice(2)}`;
+    pageEditor.insertContent(`<div drawio-diagram contenteditable="false" id="${wrapId}"><img src="${loadingImage}" id="${id}"></div>`);
     DrawIO.close();
 
     try {
         const img = await DrawIO.upload(pngData, options.pageId);
         pageEditor.undoManager.transact(() => {
             pageEditor.dom.setAttrib(id, 'src', img.url);
-            pageEditor.dom.get(id).parentNode.setAttribute('drawio-diagram', img.id);
+            pageEditor.dom.setAttrib(wrapId, 'drawio-diagram', img.id);
         });
     } catch (err) {
-        pageEditor.dom.remove(id);
+        pageEditor.dom.remove(wrapId);
         handleUploadError(err);
         throw new Error(`Failed to save image with error: ${err}`);
     }