Merge pull request mathewthe2#31 from agloo/bugfix

Bug/QoL fixes around the text selection UI
Oshibuki · Aug 29, 2021 · 16a66c6 · 16a66c6
2 parents 50cf52c + 4cc64a0
commit 16a66c6
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 10 deletions.
diff --git a/web/index.css b/web/index.css
@@ -163,7 +163,9 @@ video, canvas {
   color: white;
 }
 .canvasContextSelectionImage {
-  width: 100%;
+  height: 100%;
+  max-width:100%;
+  max-height:100%;
   display: block;
 }
 .welcome-card-wide.mdl-card {

diff --git a/web/index.js b/web/index.js
@@ -311,8 +311,8 @@ function changeOutputText(outputElement) {
 
 cv1.addEventListener("mouseup", function (e) {
   mousedown = false;
-  const isRightClick = e.button === 0;
-  if (hasSelection() && !clipboardMode && isRightClick) {
+  const isLeftClick = e.button === 0;
+  if (hasSelection() && !clipboardMode && isLeftClick) {
     // Invert selection if selection is from  top left
     if (rect.height < 0) {
       rect.y += rect.height;
@@ -338,11 +338,14 @@ cv1.addEventListener("mouseup", function (e) {
 cv1.addEventListener("mousedown", function (e) {
   // find correct position if scrolled down
   // there is no need for scrollXoffset because the video is always resized to 100% the width of the window
-  const scrollYOffset  = window.pageYOffset || document.documentElement.scrollTop;
+  const isLeftClick = e.button === 0;
 
-  last_mousex = parseInt(e.clientX-canvasx);
-	last_mousey = parseInt(e.clientY-canvasy+scrollYOffset);
-  mousedown = true;
+  if (isLeftClick) {
+      const scrollYOffset = window.pageYOffset || document.documentElement.scrollTop;
+      last_mousex = parseInt(e.clientX-canvasx);
+      last_mousey = parseInt(e.clientY-canvasy+scrollYOffset);
+      mousedown = true;
+  }
 }, false);
 
 cv1.addEventListener("mousemove", function (e) {
@@ -426,7 +429,10 @@ function toggleAutoMode() {
   if (autoMode) {
     refreshButton.disabled = true;
     autoModeTimer = setInterval(()=>{
-      if (rect.width > 0 && OCRrequests === 0) {
+      // Updating the OCR scrolls the page down to show it, which becomes
+      // very obnoxious when you're trying to position a box over the right text.
+      // To fix this, we just don't update when we're dragging a selection.
+      if (rect.width > 0 && OCRrequests === 0 && !mousedown) {
         showStuff(rect);
       }
     }, autoModeSpeed);
@@ -927,4 +933,4 @@ function cropVideo() {
       croppedVideoCanvas.hidden = false;
     }, 20);
   }
-}
+}
diff --git a/web/settings.js b/web/settings.js
@@ -267,6 +267,7 @@ function updateOCREngine() {
         textOrientationSwitch.disabled = true;
         textOrientationSwitch.parentNode.classList.add("is-disabled");
     }
+    refreshOCR();
     return OCREngine;
 }
 
@@ -282,6 +283,7 @@ function updateOCREngineAndPersist() {
 
 function toggleTextOrientation() {
     verticalText = !verticalText;
+    refreshOCR();
 }
 
 /*
@@ -638,4 +640,4 @@ function changeRefreshHotkey(input) {
 
 function changeAddToAnkiHotkey(input) {
     eel.update_config(HOTKEY_CONFIG, {'add_to_anki': input.value})();
-}
+}