GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-11-09 14:17:13 -05:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Fix polygon tool not working (#2712)

Browse source 
* Fix polygon not converting correctly to cloze

* Fix first polygon disappearing when creating se...

...cond one during editing

Previously, a fabric object was passed directly to a `Shape` such as
`Rectangle` or `Polygon`, so mutating a non-primitive property of the
shape would lead to mutating the original fabric object as well.

* Commit addition of polygon immediately

Unlike the rect or ellipse tools, when the polygon tool was active,
clicking on the canvas did not fire the `object:removed` event and the
`change` event was not dispatched. As a result, an addition of a polygon
was not saved to the DB when switching to another note or closing the
editor in edit mode without performing an action that dispatched the
`change` event.
This commit is contained in:
Hikaru Y 2023-10-10 12:51:35 +09:00 committed by GitHub
parent 4cd12ccd28
commit b3f6edc323
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
ts/image-occlusion/shapes/to-cloze.ts
View file

@ -3,6 +3,7 @@
import type { Canvas, Object as FabricObject } from "fabric"; import type { Canvas, Object as FabricObject } from "fabric";
import { fabric } from "fabric"; import { fabric } from "fabric";
import { cloneDeep } from "lodash-es";
import { makeMaskTransparent } from "../tools/lib"; import { makeMaskTransparent } from "../tools/lib";
import type { Size } from "../types"; import type { Size } from "../types";
@ -52,15 +53,19 @@ function fabricObjectToBaseShapeOrShapes(
): ShapeOrShapes | null { ): ShapeOrShapes | null {
let shape: Shape; let shape: Shape;
// Prevents the original fabric object from mutating when a non-primitive
// property of a Shape mutates.
const cloned = cloneDeep(object);
switch (object.type) { switch (object.type) {
case "rect": case "rect":
shape = new Rectangle(object); shape = new Rectangle(cloned);
break; break;
case "ellipse": case "ellipse":
shape = new Ellipse(object); shape = new Ellipse(cloned);
break; break;
case "polygon": case "polygon":
shape = new Polygon(object); shape = new Polygon(cloned);
break; break;
case "group": case "group":
return object._objects.map((child) => { return object._objects.map((child) => {
@ -96,7 +101,7 @@ function shapeOrShapesToCloze(
): string { ): string {
let text = ""; let text = "";
function addKeyValue(key: string, value: string) { function addKeyValue(key: string, value: string) {
if (Number.isNaN(Number(value))) { if (key !== "points" && Number.isNaN(Number(value))) {
value = ".0000"; value = ".0000";
} }
text += `:${key}=${value}`; text += `:${key}=${value}`;

2
ts/image-occlusion/tools/tool-polygon.ts
View file

@ -4,6 +4,7 @@
import { fabric } from "fabric"; import { fabric } from "fabric";
import type { PanZoom } from "panzoom"; import type { PanZoom } from "panzoom";
import { emitChangeSignal } from "../MaskEditor.svelte";
import { BORDER_COLOR, disableRotation, SHAPE_MASK_COLOR } from "./lib"; import { BORDER_COLOR, disableRotation, SHAPE_MASK_COLOR } from "./lib";
import { undoStack } from "./tool-undo-redo"; import { undoStack } from "./tool-undo-redo";
@ -190,6 +191,7 @@ const generatePolygon = (canvas: fabric.Canvas, pointsList): void => {
canvas.add(polygon); canvas.add(polygon);
// view undo redo tools // view undo redo tools
undoStack.onObjectAdded(polygon.id); undoStack.onObjectAdded(polygon.id);
emitChangeSignal();
} }
polygon.on("modified", () => { polygon.on("modified", () => {