From 1e94f7f16f2c618101178a181286af3e66d556e4 Mon Sep 17 00:00:00 2001
From: Henrik Giesel <hengiesel@gmail.com>
Date: Sat, 7 Aug 2021 19:44:06 +0200
Subject: [PATCH] Display Mathjax error as title (tooltip)

---
 ts/editor/HandleBackground.svelte | 10 +++++++++-
 ts/editor/MathjaxHandle.svelte    |  8 ++++++--
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/ts/editor/HandleBackground.svelte b/ts/editor/HandleBackground.svelte
index fc6fc4eaf..0f98f907c 100644
--- a/ts/editor/HandleBackground.svelte
+++ b/ts/editor/HandleBackground.svelte
@@ -5,13 +5,21 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 <script lang="ts">
     import { onMount, createEventDispatcher } from "svelte";
 
+    export let title: string | undefined = undefined;
+
     let background: HTMLDivElement;
     const dispatch = createEventDispatcher();
 
     onMount(() => dispatch("mount", { background }));
 </script>
 
-<div bind:this={background} on:mousedown|preventDefault on:dblclick />
+<div
+    bind:this={background}
+    {title}
+    on:mousedown|preventDefault
+    on:click|stopPropagation
+    on:dblclick
+/>
 
 <style lang="scss">
     div {
diff --git a/ts/editor/MathjaxHandle.svelte b/ts/editor/MathjaxHandle.svelte
index 391e52755..86cbcd17d 100644
--- a/ts/editor/MathjaxHandle.svelte
+++ b/ts/editor/MathjaxHandle.svelte
@@ -27,10 +27,14 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     resizeObserver.observe(container);
 
     let updateSelection: () => void;
+    let title: string;
 
     function onUpdate(event: CustomEvent) {
         activeImage!.parentElement!.dataset.mathjax = event.detail.mathjax;
-        setTimeout(updateSelection);
+        setTimeout(() => {
+            updateSelection();
+            title = activeImage!.title;
+        });
     }
 </script>
 
@@ -50,7 +54,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
             bind:updateSelection
             on:mount={(event) => createDropdown(event.detail.selection)}
         >
-            <HandleBackground on:click={(event) => event.stopPropagation()} />
+            <HandleBackground {title} />
 
             <HandleControl offsetX={1} offsetY={1} />
         </HandleSelection>