Merge develop into main: release v1.5.10

Author: Gnathonic

CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [1.5.10] - 2026-05-22
+
+### Fixed
+
+- **QuickActions "+" ignored Anki card mode** - The QuickActions "+" → image → text-box picker flow always opened the "Create new card" modal, ignoring the `cardMode` setting. It now uses the same update/create dispatch logic as the double-click and context-menu flows, including the 5-minute window check for updates. The `{page_num}` template variable also resolves correctly in this flow (#216)
+- **Page swipes during Anki modal** - The reader no longer flips pages while the Anki Update/Create Card modal is open, preventing accidental flips when dragging the crop box on touchscreens (#189)
+
 ## [1.5.9] - 2026-05-17
 
 ### Fixed

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "mokuro-reader",
-  "version": "1.5.9",
+  "version": "1.5.10",
   "private": true,
   "scripts": {
     "dev": "vite dev",

package.json

@@ -21,10 +21,23 @@
     volumeUuid: string;
     page1?: Page; // First page data for Anki card creation
     page2?: Page; // Second page data (when in dual mode)
+    page1Number?: number; // 1-indexed page number for src1/page1
+    page2Number?: number; // 1-indexed page number for src2/page2
     visible?: boolean;
   }
 
-  let { left, right, src1, src2, volumeUuid, page1, page2, visible = true }: Props = $props();
+  let {
+    left,
+    right,
+    src1,
+    src2,
+    volumeUuid,
+    page1,
+    page2,
+    page1Number,
+    page2Number,
+    visible = true
+  }: Props = $props();
 
   let ankiTags = $derived($settings.ankiConnectSettings.tags);
   let volumeMetadata = $derived<VolumeMetadata>({
@@ -49,10 +62,10 @@
     open = false;
   }
 
-  async function onUpdateCard(src: File | undefined, page?: Page) {
+  async function onUpdateCard(src: File | undefined, page?: Page, pageNumber?: number) {
     if ($settings.ankiConnectSettings.enabled && src && page) {
-      // Show text box picker first, then cropper
-      showTextBoxPicker(URL.createObjectURL(src), page, ankiTags, volumeMetadata);
+      // Show text box picker first, then dispatch to create/update based on cardMode
+      showTextBoxPicker(URL.createObjectURL(src), page, ankiTags, volumeMetadata, pageNumber);
     }
     open = false;
   }
@@ -69,7 +82,7 @@
       <div class="mb-2 flex flex-col items-center gap-2">
         {#if $settings.ankiConnectSettings.enabled}
           <button
-            onclick={() => onUpdateCard(src1, page1)}
+            onclick={() => onUpdateCard(src1, page1, page1Number)}
             class="relative flex h-12 w-12 items-center justify-center rounded-full bg-gray-700 text-gray-300 shadow-lg hover:bg-gray-600 focus:outline-none dark:bg-gray-700 dark:text-gray-300 dark:hover:bg-gray-600"
             aria-label="Add image to Anki"
           >
@@ -84,7 +97,7 @@
         {/if}
         {#if $settings.ankiConnectSettings.enabled && src2}
           <button
-            onclick={() => onUpdateCard(src2, page2)}
+            onclick={() => onUpdateCard(src2, page2, page2Number)}
             class="relative flex h-12 w-12 items-center justify-center rounded-full bg-gray-700 text-gray-300 shadow-lg hover:bg-gray-600 focus:outline-none dark:bg-gray-700 dark:text-gray-300 dark:hover:bg-gray-600"
             aria-label="Add image 2 to Anki"
           >

src/lib/components/Reader/QuickActions.svelte

@@ -31,6 +31,7 @@
   import MangaPage from './MangaPage.svelte';
   import TextBoxContextMenu from './TextBoxContextMenu.svelte';
   import {
+    cropperStore,
     openCreateModal,
     openUpdateModal,
     sendQuickCapture,
@@ -474,6 +475,7 @@
 
   function handleTouchStart(event: TouchEvent) {
     if (!$settings.mobile) return;
+    if ($cropperStore?.open) return;
     if ($settings.continuousScroll) return; // Continuous mode handles its own touch
     if (event.touches.length > 1) return; // Ignore multi-touch starts
 
@@ -494,6 +496,7 @@
   function handlePointerUp(event: TouchEvent) {
     if (!$settings.mobile) return;
     if ($settings.continuousScroll) return; // Continuous mode handles its own touch
+    if ($cropperStore?.open) return; // Don't process swipes when Anki modal is open
 
     // If fingers remain, this was a multi-touch gesture - mark it and wait
     if (event.touches.length !== 0) {
@@ -1279,6 +1282,8 @@
     volumeUuid={volume.volume_uuid}
     page1={pages[index]}
     page2={!useSinglePage ? pages[index + 1] : undefined}
+    page1Number={index + 1}
+    page2Number={!useSinglePage ? index + 2 : undefined}
     visible={overlaysVisible}
   />
   <SettingsButton visible={overlaysVisible} />

src/lib/components/Reader/Reader.svelte

@@ -1,13 +1,26 @@
 <script lang="ts">
   import { Button, Helper, Modal, Spinner } from 'flowbite-svelte';
   import type { Page } from '$lib/types';
-  import { showCropper, expandTextBoxBounds, type VolumeMetadata } from '$lib/anki-connect';
+  import {
+    expandTextBoxBounds,
+    extractFieldValues,
+    getCardAgeInMin,
+    getLastCardInfo,
+    getModelConfig,
+    openCreateModal,
+    openUpdateModal,
+    sendQuickCapture,
+    type VolumeMetadata
+  } from '$lib/anki-connect';
+  import { settings } from '$lib/settings';
+  import { showSnackbar } from '$lib/util';
   import { onMount } from 'svelte';
   import { textBoxPickerStore } from './text-box-picker';
 
   let open = $state(false);
   let image = $state<string | undefined>(undefined);
   let page = $state<Page | undefined>(undefined);
+  let pageNumber = $state<number | undefined>(undefined);
   let tags = $state<string | undefined>(undefined);
   let metadata = $state<VolumeMetadata | undefined>(undefined);
 
@@ -54,6 +67,7 @@
       open = value.open;
       image = value.image;
       page = value.page;
+      pageNumber = value.pageNumber;
       tags = value.tags;
       metadata = value.metadata;
 
@@ -72,7 +86,7 @@
     textBoxPickerStore.set({ open: false });
   }
 
-  function handleContinue() {
+  async function handleContinue() {
     if (selectedBlockIndex === null || !page || !image) return;
 
     const zone = textBoxZones.find((z) => z.blockIndex === selectedBlockIndex);
@@ -88,11 +102,100 @@
     const imageUrl = image;
     const ankiTags = tags;
     const volumeMetadata = metadata;
+    const currentPageNumber = pageNumber;
+    const pageFilename = page.img_path;
 
     close();
 
-    // Show the cropper with the selected text and bounds
-    showCropper(imageUrl, selectedText, selectedText, ankiTags, volumeMetadata, undefined, textBox);
+    const cardMode = $settings.ankiConnectSettings.cardMode;
+
+    if (cardMode === 'update') {
+      const lastCard = await getLastCardInfo();
+
+      if (!lastCard || !lastCard.noteId) {
+        showSnackbar('No recent card found to update');
+        return;
+      }
+
+      if (!lastCard.modelName) {
+        showSnackbar('Could not detect card note type');
+        return;
+      }
+
+      const cardAge = getCardAgeInMin(lastCard.noteId);
+      if (cardAge >= 5) {
+        showSnackbar(`Last card is ${cardAge} minutes old (max 5 min)`);
+        return;
+      }
+
+      const previousValues = extractFieldValues(lastCard);
+      const modelConfig = getModelConfig(lastCard.modelName, 'update');
+      const quickCapture = modelConfig?.quickCapture ?? false;
+
+      if (quickCapture) {
+        await sendQuickCapture(
+          'update',
+          imageUrl,
+          selectedText,
+          selectedText,
+          volumeMetadata,
+          textBox,
+          previousValues,
+          lastCard.noteId,
+          lastCard.tags,
+          lastCard.modelName,
+          pageFilename
+        );
+      } else {
+        openUpdateModal(
+          imageUrl,
+          previousValues,
+          lastCard.noteId,
+          lastCard.modelName,
+          lastCard.tags,
+          selectedText,
+          selectedText,
+          ankiTags,
+          volumeMetadata,
+          undefined,
+          textBox,
+          currentPageNumber,
+          pageFilename
+        );
+      }
+    } else {
+      const { selectedModel } = $settings.ankiConnectSettings;
+      const modelConfig = getModelConfig(selectedModel, 'create');
+      const quickCapture = modelConfig?.quickCapture ?? false;
+
+      if (quickCapture) {
+        await sendQuickCapture(
+          'create',
+          imageUrl,
+          selectedText,
+          selectedText,
+          volumeMetadata,
+          textBox,
+          undefined,
+          undefined,
+          undefined,
+          undefined,
+          pageFilename
+        );
+      } else {
+        openCreateModal(
+          imageUrl,
+          selectedText,
+          selectedText,
+          ankiTags,
+          volumeMetadata,
+          undefined,
+          textBox,
+          currentPageNumber,
+          pageFilename
+        );
+      }
+    }
   }
 
   // Handle backdrop mousedown - dismiss on mousedown outside content

src/lib/components/Reader/TextBoxPicker.svelte

@@ -6,6 +6,7 @@ interface TextBoxPickerState {
   open: boolean;
   image?: string;
   page?: Page;
+  pageNumber?: number;
   tags?: string;
   metadata?: VolumeMetadata;
 }
@@ -16,7 +17,8 @@ export function showTextBoxPicker(
   image: string,
   page: Page,
   tags?: string,
-  metadata?: VolumeMetadata
+  metadata?: VolumeMetadata,
+  pageNumber?: number
 ) {
-  textBoxPickerStore.set({ open: true, image, page, tags, metadata });
+  textBoxPickerStore.set({ open: true, image, page, pageNumber, tags, metadata });
 }