Add debug builds

.drone.yml

@@ -13,7 +13,7 @@ steps:
     image: debian:bookworm
     pull: always
     commands:
-      - apt-get update && apt-get install -y zip
+      - apt-get update && apt-get install -y zip slugify
       - ./build.sh
 
   - name: Upload Artifact to Gitea
@@ -25,7 +25,8 @@ steps:
         from_secret: gitea_api_token
       checksum: sha256
       base_url: https://git.tobiasmanske.de
-      files: editor-preview.ankiaddon
+      files:
+        - "*.ankiaddon"
 
 image_pull_secrets:
   - registry

.gitignore

@@ -117,7 +117,6 @@ venv/
 ENV/
 env.bak/
 venv.bak/
-.idea
 
 # Spyder project settings
 .spyderproject
@@ -170,3 +169,4 @@ tags
 
 # Stores actual addon config if the src directory is symlinked into an anki installation during development
 src/meta.json
+src/manifest.json

build.sh

@@ -1,11 +1,27 @@
 #!/bin/bash
 set -e
+set -o nounset
+
+SLUG=$(slugify "${DRONE_COMMIT_REF}")
 
 if [ -d src/__pycache__ ]; then
     rm -r src/__pycache__
 fi
 
 cd src
-zip -r ../editor-preview.ankiaddon --exclude meta.json -- *
+
+# Create Manifest
+cat - > manifest.json <<EOF
+{
+  "name": "Editor Live Preview - ${SLUG}",
+  "package": "editor-live-preview-${SLUG}"
+}
+EOF
+
+zip -r ../editor-preview-external.ankiaddon --exclude meta.json -- *
+zip -r ../editor-preview-ankiweb.ankiaddon --exclude meta.json --exclude manifest.json -- *
 cd ..
-unzip -l  editor-preview.ankiaddon
+echo "Ankiweb Contents"
+unzip -l editor-preview-ankiweb.ankiaddon
+echo "External Contents"
+unzip -l editor-preview-external.ankiaddon

src/__init__.py

@@ -1,5 +1,4 @@
 import json
-from typing import Set
 
 from anki import hooks, buildinfo
 from aqt import editor, gui_hooks, mw
@@ -11,7 +10,6 @@ config = mw.addonManager.getConfig(__name__)
 
 
 class EditorPreview(object):
-    editors: Set[editor.Editor] = set()
     js = [
         "js/mathjax.js",
         "js/vendor/mathjax/tex-chtml.js",
@@ -21,18 +19,8 @@ class EditorPreview(object):
     def __init__(self):
         gui_hooks.editor_did_init.append(self.editor_init_hook)
         gui_hooks.editor_did_init_buttons.append(self.editor_init_button_hook)
-        gui_hooks.editor_did_load_note.append(self.editor_note_hook)
+        self.scrollLock = config["enableScrollLockByDefault"]
-        gui_hooks.editor_did_fire_typing_timer.append(self.onedit_hook)
+        if int(buildinfo.version.split(".")[2]) < 45:  # < 2.1.45
-        buildversion = buildinfo.version.split(".")
-
-        # Anki changed their versioning scheme in 2023 to year.month(.patch), causing things to explode here.
-        if int(buildversion[0]) >= 24 or (int(buildversion[0]) == 23 and int(buildversion[1]) == 12 and 2 < len(buildversion) and int(buildversion[2])) >= 1:  # >= 23.12.1
-            self.js = [
-                "js/mathjax.js",
-                "js/vendor/mathjax/tex-chtml-full.js",
-                "js/reviewer.js",
-            ]
-        elif int(buildversion[0]) < 23 and int(buildversion[2]) < 45:  # < 2.1.45
             self.js = [
                 "js/vendor/jquery.min.js",
                 "js/vendor/css_browser_selector.min.js",
@@ -55,29 +43,34 @@ class EditorPreview(object):
             ed.editor_preview.hide()
 
         self._inject_splitter(ed)
+        gui_hooks.editor_did_fire_typing_timer.append(lambda o: self.onedit_hook(ed, o))
+        gui_hooks.editor_did_load_note.append(
+            lambda o: None if o != ed else self.editor_note_hook(o)
+        )
 
     def _get_splitter(self, editor):
-        mainR, editorR = [int(r) * 10000 for r in config["splitRatio"].split(":")]
+        layout = editor.outerLayout
+        mainR, editorR = [int(r) for r in config["splitRatio"].split(":")]
         location = config["location"]
         split = QSplitter()
         if location == "above":
-            split.setOrientation(Qt.Orientation.Vertical)
+            split.setOrientation(Qt.Vertical)
             split.addWidget(editor.editor_preview)
-            split.addWidget(editor.wrapped_web)
+            split.addWidget(editor.web)
             sizes = [editorR, mainR]
         elif location == "below":
-            split.setOrientation(Qt.Orientation.Vertical)
+            split.setOrientation(Qt.Vertical)
-            split.addWidget(editor.wrapped_web)
+            split.addWidget(editor.web)
             split.addWidget(editor.editor_preview)
             sizes = [mainR, editorR]
         elif location == "left":
-            split.setOrientation(Qt.Orientation.Horizontal)
+            split.setOrientation(Qt.Horizontal)
             split.addWidget(editor.editor_preview)
-            split.addWidget(editor.wrapped_web)
+            split.addWidget(editor.web)
             sizes = [editorR, mainR]
         elif location == "right":
-            split.setOrientation(Qt.Orientation.Horizontal)
+            split.setOrientation(Qt.Horizontal)
-            split.addWidget(editor.wrapped_web)
+            split.addWidget(editor.web)
             split.addWidget(editor.editor_preview)
             sizes = [mainR, editorR]
         else:
@@ -87,43 +80,45 @@ class EditorPreview(object):
         return split
 
     def _inject_splitter(self, editor: editor.Editor):
-        layout = editor.web.parentWidget().layout()
+        layout = editor.outerLayout
-        if layout is None:
-            layout = QVBoxLayout()
-            editor.web.parentWidget().setLayout(layout)
         web_index = layout.indexOf(editor.web)
         layout.removeWidget(editor.web)
 
-        # Wrap a widget on the outer layer of the webview
-        # So that other plugins can continue to modify the layout
-        editor.wrapped_web = QWidget()
-        wrapLayout = QHBoxLayout()
-        editor.wrapped_web.setLayout(wrapLayout)
-        wrapLayout.addWidget(editor.web)
-
         split = self._get_splitter(editor)
         layout.insertWidget(web_index, split)
 
+    def isScrollLocked(self):
+        return self.scrollLock
+
+    def toggleScrollLock(self):
+        self.scrollLock = not self.scrollLock
+
     def editor_note_hook(self, editor):
-        self.editors = set(filter(lambda it: it.note is not None, self.editors))
+        # Dont lock the editor in place when loading a new note
-        self.editors.add(editor)
+        # i.e. when using the cards browser
-        # The initial loading of notes will also trigger an editing event
+        self.onedit_hook(editor, editor.note, keep_scrollbar_value=False)
-        # which will cause a second refresh
-        # Caching the content of notes here will be used to determine if the content has changed
-        editor.cached_fields = list(editor.note.fields)
-        self.refresh(editor)
 
     def editor_init_button_hook(self, buttons, editor):
         addon_path = os.path.dirname(__file__)
         icons_dir = os.path.join(addon_path, "icons")
-        b = editor.addButton(
+        previewButton = editor.addButton(
             icon=os.path.join(icons_dir, "file.svg"),
             cmd="_editor_toggle_preview",
             tip="Toggle Live Preview",
             func=lambda o=editor: self.onEditorPreviewButton(o),
             disables=False,
         )
-        buttons.append(b)
+        scrollLockButton = editor.addButton(
+            # icon=os.path.join(icons_dir, "file.svg"),
+            icon=None,
+            label="🔒",
+            cmd="_editor_toggle_scroll_lock",
+            tip="Toggle Scroll Locking",
+            func=lambda o=editor: self.onEditorScrollLockButton(o),
+            disables=True,
+        )
+        buttons.append(previewButton)
+        buttons.append(scrollLockButton)
 
     def onEditorPreviewButton(self, origin: editor.Editor):
         if origin.editor_preview.isHidden():
@@ -131,22 +126,29 @@ class EditorPreview(object):
         else:
             origin.editor_preview.hide()
 
+    def onEditorScrollLockButton(self, origin: editor.Editor):
+        self.toggleScrollLock()
+
     def _obtainCardText(self, note):
         c = note.ephemeral_card()
         a = mw.prepare_card_text_for_display(c.answer())
         a = gui_hooks.card_will_show(a, c, "clayoutAnswer")
-        bodyclass = theme_manager.body_classes_for_card_ord(c.ord, theme_manager.night_mode)
+        bodyclass = theme_manager.body_classes_for_card_ord(
+            c.ord, theme_manager.night_mode
+        )
         bodyclass += " editor-preview"
 
         return f"_showAnswer({json.dumps(a)},'{bodyclass}');"
 
-    def onedit_hook(self, note):
+    def onedit_hook(self, editor, origin, keep_scrollbar_value=True):
-        for editor in self.editors:
+        if editor.note == origin:
-            if editor.note == note and editor.cached_fields != note.fields:
+            page: QWebEnginePage = editor.editor_preview.page()
-                editor.cached_fields = list(note.fields)
+            scrollbar_value = page.scrollPosition()
-                self.refresh(editor)
+            editor.editor_preview.eval(self._obtainCardText(editor.note))
+            if keep_scrollbar_value and self.isScrollLocked():
+                page.runJavaScript(
+                    f"window.scrollTo({scrollbar_value.x()}, {scrollbar_value.y()});"
+                )
 
-    def refresh(self, editor):
-        editor.editor_preview.eval(self._obtainCardText(editor.note))
 
 eprev = EditorPreview()

src/config.json

@@ -1,5 +1,6 @@
 {
   "showPreviewAutomatically": true,
   "splitRatio": "1:1",
-  "location": "below"
+  "location": "below",
+  "enableScrollLockByDefault": true
 }

src/config.md

@@ -7,3 +7,6 @@
 \- `location` [string (above | below | left | right)]:<br/>
 &nbsp;&nbsp;&nbsp;Defines where to render the preview (default: below)
 <br/>
+\- `showPreviewAutomatically` [boolean (true | false)]:<br/>
+&nbsp;&nbsp;&nbsp;Whether to keep the scrollbar at the same location when text changed or not (default: true)<br/>
+<br/>