Allow object to move to right edge and bottom edge and allow scroll o…

…f note fields when not using IO (#3630)

* allow drag and draw at right and bottom edge of canvas area

* allow scroll in fields, when mask editor hidden

* format code

ts/routes/image-occlusion/Toolbar.svelte

@@ -125,6 +125,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     }
 
     function onWheel(event: WheelEvent) {
+        // allow scroll in fields, when mask editor hidden
+        if (!$ioMaskEditorVisible) {
+            return;
+        }
+
         if (event.ctrlKey) {
             controlClicked = true;
         }

ts/routes/image-occlusion/tools/lib.ts

@@ -288,9 +288,9 @@ export const makeShapesRemainInCanvas = (canvas: fabric.Canvas, boundingBox: fab
         const left = obj.left!;
 
         const topBound = boundingBox.top!;
-        const bottomBound = topBound + boundingBox.height!;
+        const bottomBound = topBound + boundingBox.height! + 5;
         const leftBound = boundingBox.left!;
-        const rightBound = leftBound + boundingBox.width!;
+        const rightBound = leftBound + boundingBox.width! + 5;
 
         obj.left = Math.min(Math.max(left, leftBound), rightBound - objWidth);
         obj.top = Math.min(Math.max(top, topBound), bottomBound - objHeight);