From 7ba85a2fbe350720501d8d7ee7a27e8d07b4d274 Mon Sep 17 00:00:00 2001
From: Henrik Giesel <hengiesel@gmail.com>
Date: Sat, 7 Aug 2021 04:04:42 +0200
Subject: [PATCH] Disallow draggin of mathjax + only ever have one handle
 active

---
 ts/editable/Mathjax.svelte       |  8 +++++++-
 ts/editable/mathjax-component.ts |  1 -
 ts/editor/editing-area.ts        | 14 +++++++++-----
 3 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/ts/editable/Mathjax.svelte b/ts/editable/Mathjax.svelte
index b34aaa52d..513f81c67 100644
--- a/ts/editable/Mathjax.svelte
+++ b/ts/editable/Mathjax.svelte
@@ -12,7 +12,13 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     $: encoded = encodeURIComponent(converted);
 </script>
 
-<img src="data:image/svg+xml,{encoded}" class:block alt="Mathjax" data-anki="mathjax" />
+<img
+    src="data:image/svg+xml,{encoded}"
+    class:block
+    alt="Mathjax"
+    data-anki="mathjax"
+    on:dragstart|preventDefault
+/>
 
 <style lang="scss">
     img {
diff --git a/ts/editable/mathjax-component.ts b/ts/editable/mathjax-component.ts
index 91ec7b33d..1b38782c4 100644
--- a/ts/editable/mathjax-component.ts
+++ b/ts/editable/mathjax-component.ts
@@ -130,7 +130,6 @@ export const Mathjax: DecoratedElementConstructor = class Mathjax
 
     connectedCallback(): void {
         this.decorate();
-        // TODO text is assigned white-space: normal
         this.disconnect = moveNodesInsertedOutside(this, this.children[0]);
     }
 
diff --git a/ts/editor/editing-area.ts b/ts/editor/editing-area.ts
index 88cd1028c..90867bf93 100644
--- a/ts/editor/editing-area.ts
+++ b/ts/editor/editing-area.ts
@@ -222,8 +222,8 @@ export class EditingArea extends HTMLDivElement {
         this.activeInput.onPaste(event);
     }
 
-    resetHandles(): void {
-        this.imageHandle.then((imageHandle) =>
+    resetHandles(): Promise<void> {
+        const promise = this.imageHandle.then((imageHandle) =>
             (imageHandle as any).$set({
                 activeImage: null,
             })
@@ -232,12 +232,16 @@ export class EditingArea extends HTMLDivElement {
         (this.mathjaxHandle as any).$set({
             activeImage: null,
         });
+
+        return promise;
     }
 
-    showHandles(event: MouseEvent): void {
+    async showHandles(event: MouseEvent): Promise<void> {
         if (event.target instanceof HTMLImageElement) {
+            await this.resetHandles();
+
             if (!event.target.dataset.anki) {
-                this.imageHandle.then((imageHandle) =>
+                await this.imageHandle.then((imageHandle) =>
                     (imageHandle as any).$set({
                         activeImage: event.target,
                         isRtl: this.isRightToLeft(),
@@ -250,7 +254,7 @@ export class EditingArea extends HTMLDivElement {
                 });
             }
         } else {
-            this.resetHandles();
+            await this.resetHandles();
         }
     }