From cadc108c4dfad98c84b182141a8a57ed5068a3d9 Mon Sep 17 00:00:00 2001
From: Andrea Gottsponer <ago@attr.ch>
Date: Fri, 9 Sep 2022 12:45:38 +0200
Subject: [PATCH] - fix position point/line/legend/image events - fix selection
elements - fix generator events
---
src/app/index.ts | 5 ++-
src/lib/config/design.ts | 4 +-
src/lib/elements/connections/Line.ts | 4 +-
.../elements/controls/SelectGroupElement.ts | 41 ++++++++++++++-----
.../elements/controls/SelectItemElement.ts | 23 +++++++++--
src/lib/elements/images/Image.ts | 41 +++++++++----------
.../elements/positionings/PositionPoint.ts | 8 ++--
src/lib/elements/primitives/ArrowPrimitive.ts | 2 +-
.../elements/primitives/EllipsePrimitive.ts | 2 +-
.../elements/primitives/RectanglePrimitive.ts | 2 +-
src/lib/elements/primitives/TextPrimitive.ts | 2 +-
.../generators/copies/CloneItemGenerator.ts | 4 +-
.../generators/copies/CloneLayerGenerator.ts | 4 +-
src/lib/generators/legends/LegendGenerator.ts | 20 ++++-----
.../positionings/PositionPointGenerator.ts | 4 +-
.../primitives/ArrowPrimitiveGenerator.ts | 24 +++++------
.../primitives/EllipsePrimitiveGenerator.ts | 24 +++++------
.../primitives/RectanglePrimitiveGenerator.ts | 24 +++++------
.../primitives/TextPrimitiveGenerator.ts | 24 +++++------
19 files changed, 149 insertions(+), 113 deletions(-)
diff --git a/src/app/index.ts b/src/app/index.ts
index 2c00f77b..cb5239d1 100644
--- a/src/app/index.ts
+++ b/src/app/index.ts
@@ -1154,6 +1154,7 @@ async function setupImageObjects() {
image.sortChildren();
app.stage.emit("setDefaultMode", "default");
+ app.stage.interactive = true;
return Promise.resolve();
}
@@ -1614,7 +1615,7 @@ buttonTest.addEventListener("click", () => {
});
/**/
// Select item
- /** /
+ /**/
const generator = new MedsurfDraw.SelectItemGenerator({
target: image,
element: elementsArray['textPoint'] as MedsurfDraw.PositionPoint,
@@ -1633,7 +1634,7 @@ buttonTest.addEventListener("click", () => {
// ellipsePoint, line1, fill1, legend
/**/
// Clone layer
- /**/
+ /** /
const generator = new MedsurfDraw.CloneLayerGenerator({
target: image,
imageObjects: image.getImageObjects().map((io) => (io as any).model),
diff --git a/src/lib/config/design.ts b/src/lib/config/design.ts
index 5dfa7564..da6567d1 100644
--- a/src/lib/config/design.ts
+++ b/src/lib/config/design.ts
@@ -326,7 +326,7 @@ export const Design = {
fillColorHover: 0x4BDEE3
},
selectElement: {
- zIndex: 9000,
+ zIndex: 150,
scaleAspect: 0.4,
radiusAspect: 5,
groupPadAspect: 6,
@@ -340,7 +340,7 @@ export const Design = {
fillAlpha: 0.5,
},
selectImageObjectElement: {
- zIndex: 9000,
+ zIndex: 151,
scaleAspect: 0.4,
pad: 5,
displayObjectDepth: 5,
diff --git a/src/lib/elements/connections/Line.ts b/src/lib/elements/connections/Line.ts
index 3d06e02b..9eb0a132 100644
--- a/src/lib/elements/connections/Line.ts
+++ b/src/lib/elements/connections/Line.ts
@@ -1544,10 +1544,10 @@ export class Line extends BaseElementContainer<Models.Line, BaseElementContainer
// Check if position points has/contains in any other elements
if (this.start) {
- this.start.emit("debounceDeleteItem");
+ this.start.emit("debounceDeleteItem", image);
}
if (this.end) {
- this.end.emit("debounceDeleteItem");
+ this.end.emit("debounceDeleteItem", image);
}
// Emits
diff --git a/src/lib/elements/controls/SelectGroupElement.ts b/src/lib/elements/controls/SelectGroupElement.ts
index e784a323..32babbb2 100644
--- a/src/lib/elements/controls/SelectGroupElement.ts
+++ b/src/lib/elements/controls/SelectGroupElement.ts
@@ -27,19 +27,20 @@ export class SelectGroupElement extends BaseContainer<SelectGroupModel> {
/**
* Members
*/
- private _image: MedsurfDraw.Image;
- private _type: SelectGroupType;
- private _layerGroup: Models.LayerGroup;
- private _grouping: Models.Grouping;
- private _displayObjects: MedsurfDraw.ImageObject[];
- private _imageObjectMenu: MedsurfDraw.MenuEntryModel[];
- private _groupingMenu: MedsurfDraw.MenuEntryModel[];
+ protected _image: MedsurfDraw.Image;
+ protected _type: SelectGroupType;
+ protected _layerGroup: Models.LayerGroup;
+ protected _grouping: Models.Grouping;
+ protected _displayObjects: MedsurfDraw.ImageObject[];
+ protected _imageObjectMenu: MedsurfDraw.MenuEntryModel[];
+ protected _groupingMenu: MedsurfDraw.MenuEntryModel[];
+ private _menuShown: boolean = false;
/**
* Interactions
*/
- private _contextInteraction: MedsurfDraw.ContextInteraction<SelectGroupElement>;
- private _moveInteraction: MedsurfDraw.MoveInteraction<SelectGroupElement>;
+ protected _contextInteraction: MedsurfDraw.ContextInteraction<SelectGroupElement>;
+ protected _moveInteraction: MedsurfDraw.MoveInteraction<SelectGroupElement>;
/**
* Methods
@@ -167,6 +168,7 @@ export class SelectGroupElement extends BaseContainer<SelectGroupModel> {
options: {hasLine: true, lineColor: Design.selectElement.lineColor, lineAlpha: Design.selectElement.lineAlpha, hasFill: true, fillColor: Design.selectElement.fillColor, fillAlpha: Design.selectElement.fillAlpha},
lineWidth: Design.selectElement.lineWidth
});
+ this._selectElement.zIndex = Design.selectElement.zIndex + 1;
this.addChild(this._selectElement);
// -- Image object menu element
this._imageObjectMenuElement = new MedsurfDraw.MenuElement({
@@ -562,6 +564,9 @@ export class SelectGroupElement extends BaseContainer<SelectGroupModel> {
// Setup
this.interactive = true;
+ // Sort children
+ this.getImage().sortChildren();
+
// Set display objects
this.displayObjects = displayObjects as MedsurfDraw.ImageObject[];
} else {
@@ -709,7 +714,7 @@ export class SelectGroupElement extends BaseContainer<SelectGroupModel> {
//<editor-fold desc="Events">
// -- Context
- this.image.on("rightup", this.contextInteraction.endRight, this.contextInteraction);
+ this.image.parent.on("rightup", this.contextInteraction.endRight, this.contextInteraction);
//</editor-fold>
}
@@ -734,6 +739,9 @@ export class SelectGroupElement extends BaseContainer<SelectGroupModel> {
public displayMenu(): void {
const point = this.getImage().getMousePosition();
+ // Setup
+ this._menuShown = true;
+
// Elements
if (MedsurfDraw.Keyboard.isKeyDown("KeyG")) {
// -- Grouping menu element
@@ -746,13 +754,17 @@ export class SelectGroupElement extends BaseContainer<SelectGroupModel> {
}
// Hide menu
- this.getImage().moveInteraction.once("endMove", () => {
+ this.getImage().moveInteraction.once("startMove", () => {
// Elements
// -- Menu element
this._imageObjectMenuElement.hideItem();
// -- Grouping menu element
this._groupingMenuElement.hideItem();
});
+ this.getImage().moveInteraction.once("endMove", () => {
+ // Setup
+ this._menuShown = false;
+ });
/* TODO remove
// Image -> remove unselect behaviour and reset it after one click on the image
const image = this.getImage();
@@ -1177,5 +1189,12 @@ export class SelectGroupElement extends BaseContainer<SelectGroupModel> {
public set moveInteraction(value: MedsurfDraw.MoveInteraction<SelectGroupElement>) {
this._moveInteraction = value;
}
+
+ /**
+ * Get menu shown
+ */
+ public get menuShown(): boolean {
+ return this._menuShown;
+ }
//</editor-fold>
}
\ No newline at end of file
diff --git a/src/lib/elements/controls/SelectItemElement.ts b/src/lib/elements/controls/SelectItemElement.ts
index e6c9f63f..df1d0ed9 100644
--- a/src/lib/elements/controls/SelectItemElement.ts
+++ b/src/lib/elements/controls/SelectItemElement.ts
@@ -20,8 +20,9 @@ export class SelectItemElement extends BaseContainer<SelectImageObjectElementMod
/**
* Members
*/
- private _image: MedsurfDraw.Image;
- private _displayObject: BaseElementContainer<Models.ImageObject, BaseElementContainerModel<Models.ImageObject>> | MedsurfDraw.Text | MedsurfDraw.Image | undefined;
+ protected _image: MedsurfDraw.Image;
+ protected _displayObject: BaseElementContainer<Models.ImageObject, BaseElementContainerModel<Models.ImageObject>> | MedsurfDraw.Text | MedsurfDraw.Image | undefined;
+ protected _menuShown: boolean = false;
/**
* Methods
@@ -521,6 +522,9 @@ export class SelectItemElement extends BaseContainer<SelectImageObjectElementMod
public displayMenu(event: MouseEvent): void {
event.stopPropagation();
+ // Setup
+ this._menuShown = true;
+
// Elements
// -- Menu element
const point = this.getImage().getMousePosition();
@@ -528,11 +532,15 @@ export class SelectItemElement extends BaseContainer<SelectImageObjectElementMod
this._menuElement.showItem();
// Hide menu
- this.getImage().moveInteraction.once("endMove", () => {
+ this.getImage().moveInteraction.once("startMove", () => {
// Elements
// -- Menu element
this._menuElement.hideItem();
});
+ this.getImage().moveInteraction.once("endMove", () => {
+ // Setup
+ this._menuShown = false;
+ });
/* TODO remove
// Image -> remove unselect behaviour and reset it after one click on the image
const image = this.getImage();
@@ -811,7 +819,7 @@ export class SelectItemElement extends BaseContainer<SelectImageObjectElementMod
// -- Menu element
if (!(this.displayObject instanceof MedsurfDraw.Text)) {
this._menuElement.menuElements = this.displayObject.imageObjectMenu;
- this.image.on('rightup', this.displayMenu, this);
+ this.image.parent.on('rightup', this.displayMenu, this);
} else {
this._menuElement.hideItem();
}
@@ -933,5 +941,12 @@ export class SelectItemElement extends BaseContainer<SelectImageObjectElementMod
// Add display object events
this._setEventsForDisplayObjects(this.displayObject);
}
+
+ /**
+ * Get menu shown
+ */
+ public get menuShown(): boolean {
+ return this._menuShown;
+ }
//</editor-fold>
}
\ No newline at end of file
diff --git a/src/lib/elements/images/Image.ts b/src/lib/elements/images/Image.ts
index be9aac38..321a72c7 100644
--- a/src/lib/elements/images/Image.ts
+++ b/src/lib/elements/images/Image.ts
@@ -206,7 +206,6 @@ export class Image extends BaseContainer<ImageModel> {
// -- Resize
parent.on("resize", this.onResize, this);
// -- Move
- parent.interactive = true;
parent.on("mousedown", this.moveInteraction.startMove, this.moveInteraction);
parent.on("pointermove", this.moveInteraction.onMove, this.moveInteraction);
parent.on("mouseup", this.moveInteraction.endMove, this.moveInteraction);
@@ -222,7 +221,6 @@ export class Image extends BaseContainer<ImageModel> {
// -- Resize
parent.off("resize", this.onResize, this);
// -- Move
- parent.interactive = false;
parent.off("mousedown", this.moveInteraction.startMove, this.moveInteraction);
parent.off("pointermove", this.moveInteraction.onMove, this.moveInteraction);
parent.off("mouseup", this.moveInteraction.endMove, this.moveInteraction);
@@ -963,7 +961,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _modeDefault(): void {
// Setup
- this.interactive = true;
+ // TODO remove this.interactive = true;
}
/**
@@ -972,7 +970,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _removeModeDefault(): void {
// Setup
- this.interactive = false;
+ // TODO remove this.interactive = false;
}
/**
@@ -981,7 +979,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _modeMarker(): void {
// Setup
- this.interactive = true;
+ // TODO remove this.interactive = true;
}
/**
@@ -990,7 +988,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _removeModeMarker(): void {
// Setup
- this.interactive = false;
+ // TODO remove this.interactive = false;
}
/**
@@ -999,7 +997,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _modeSelftest(): void {
// Setup
- this.interactive = true;
+ // TODO remove this.interactive = true;
}
/**
@@ -1008,7 +1006,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _removeModeSelftest(): void {
// Setup
- this.interactive = false;
+ // TODO remove this.interactive = false;
}
/**
@@ -1017,11 +1015,11 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _modeAuthor(): void {
// Setup
- this.interactive = true;
+ // TODO remove this.interactive = true;
//<editor-fold desc="Events">
// -- Context
- this.on("rightup", this.contextInteraction.endRight, this.contextInteraction);
+ this.parent.on("rightup", this.contextInteraction.endRight, this.contextInteraction);
//</editor-fold>
}
@@ -1031,11 +1029,11 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _removeModeAuthor(): void {
// Setup
- this.interactive = false;
+ // TODO remove this.interactive = false;
//<editor-fold desc="Events">
// -- Context
- this.off("rightup", this.contextInteraction.endRight, this.contextInteraction);
+ this.parent.off("rightup", this.contextInteraction.endRight, this.contextInteraction);
//</editor-fold>
}
@@ -1045,7 +1043,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _modeDrawing(): void {
// Setup
- this.interactive = true;
+ // TODO remove this.interactive = true;
}
/**
@@ -1054,7 +1052,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _removeModeDrawing(): void {
// Setup
- this.interactive = false;
+ // TODO remove this.interactive = false;
}
/**
@@ -1063,7 +1061,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _modeChoosing(): void {
// Setup
- this.interactive = true;
+ // TODO remove this.interactive = true; // TODO not working on image why??? when uncommend, the drawing is not working
}
/**
@@ -1072,7 +1070,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _removeModeChoosing(): void {
// Setup
- this.interactive = false;
+ // TODO remove this.interactive = false; // TODO not working on image why???
}
/**
@@ -1081,7 +1079,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _modeCloning(): void {
// Setup
- this.interactive = true;
+ // TODO remove this.interactive = true;
}
/**
@@ -1090,7 +1088,7 @@ export class Image extends BaseContainer<ImageModel> {
*/
protected _removeModeCloning(): void {
// Setup
- this.interactive = false;
+ // TODO remove this.interactive = false;
}
//</editor-fold>
@@ -2334,10 +2332,11 @@ export class Image extends BaseContainer<ImageModel> {
};
this.renderer.plugins.interaction.setCursorMode("default");
- // TODO movelock no needed ???
- if (['drawing', 'choosing', 'cloning'].indexOf(this.modeInteraction.lastMode) === -1 && !this._moveLock) {
+ if (!this._selectGroupElement.menuShown && !this._selectItemElement.menuShown) {
// Reset selection
- this.controlSetDefaultMode(event);
+ if (['drawing', 'choosing', 'cloning'].indexOf(this.modeInteraction.lastMode) === -1 && !this._moveLock) {
+ this.controlSetDefaultMode(event);
+ }
}
this._moveLock = false;
}
diff --git a/src/lib/elements/positionings/PositionPoint.ts b/src/lib/elements/positionings/PositionPoint.ts
index 7755ce6d..1075a4d4 100644
--- a/src/lib/elements/positionings/PositionPoint.ts
+++ b/src/lib/elements/positionings/PositionPoint.ts
@@ -1556,7 +1556,7 @@ export class PositionPoint extends BaseElementContainer<Models.PositionPoint, Ba
const image = this.getImage();
// Release event
- image.once('pointerup', this.onSelftestRelease, this);
+ image.parent.once('pointerup', this.onSelftestRelease, this);
}
/**
@@ -1649,15 +1649,17 @@ export class PositionPoint extends BaseElementContainer<Models.PositionPoint, Ba
//<editor-fold desc="Delete">
/**
* Delete Element
+ * @param image
+ * @protected
*/
- protected _deleteItem(): void {
+ protected _deleteItem(image: MedsurfDraw.Image): void {
// Check for primitives
if ((this.model.primitives || []).length > 0) {
return;
}
// Check for line
- if (this.getImage().getLinesByPositionPoint(this).length > 0) {
+ if (image.getLinesByPositionPoint(this).length > 0) {
return;
}
diff --git a/src/lib/elements/primitives/ArrowPrimitive.ts b/src/lib/elements/primitives/ArrowPrimitive.ts
index f796aaae..bd1b6c13 100644
--- a/src/lib/elements/primitives/ArrowPrimitive.ts
+++ b/src/lib/elements/primitives/ArrowPrimitive.ts
@@ -1015,7 +1015,7 @@ export class ArrowPrimitive extends BaseElementContainer<Models.ArrowPrimitive,
parent.removeChild(this);
// Check if position point has/contains in any other elements
- parent.emit("debounceDeleteItem");
+ parent.emit("debounceDeleteItem", image);
// Emits
image.deletePrimitive(this.model);
diff --git a/src/lib/elements/primitives/EllipsePrimitive.ts b/src/lib/elements/primitives/EllipsePrimitive.ts
index 32165cec..19d7ab7c 100644
--- a/src/lib/elements/primitives/EllipsePrimitive.ts
+++ b/src/lib/elements/primitives/EllipsePrimitive.ts
@@ -972,7 +972,7 @@ export class EllipsePrimitive extends BaseElementContainer<Models.EllipsePrimiti
parent.removeChild(this);
// Check if position point has/contains in any other elements
- parent.emit("debounceDeleteItem");
+ parent.emit("debounceDeleteItem", image);
// Emits
image.deletePrimitive(this.model);
diff --git a/src/lib/elements/primitives/RectanglePrimitive.ts b/src/lib/elements/primitives/RectanglePrimitive.ts
index 4f88e5b7..be1ecfd8 100644
--- a/src/lib/elements/primitives/RectanglePrimitive.ts
+++ b/src/lib/elements/primitives/RectanglePrimitive.ts
@@ -973,7 +973,7 @@ export class RectanglePrimitive extends BaseElementContainer<Models.RectanglePri
parent.removeChild(this);
// Check if position point has/contains in any other elements
- parent.emit("debounceDeleteItem");
+ parent.emit("debounceDeleteItem", image);
// Emits
image.deletePrimitive(this.model);
diff --git a/src/lib/elements/primitives/TextPrimitive.ts b/src/lib/elements/primitives/TextPrimitive.ts
index 4ed27faa..930ae53d 100644
--- a/src/lib/elements/primitives/TextPrimitive.ts
+++ b/src/lib/elements/primitives/TextPrimitive.ts
@@ -1022,7 +1022,7 @@ export class TextPrimitive extends BaseElementContainer<Models.TextPrimitive, Ba
parent.removeChild(this);
// Check if position point has/contains in any other elements
- parent.emit("debounceDeleteItem");
+ parent.emit("debounceDeleteItem", image);
// Emits
image.deletePrimitive(this.model);
diff --git a/src/lib/generators/copies/CloneItemGenerator.ts b/src/lib/generators/copies/CloneItemGenerator.ts
index 63fbad09..7188c4fe 100644
--- a/src/lib/generators/copies/CloneItemGenerator.ts
+++ b/src/lib/generators/copies/CloneItemGenerator.ts
@@ -81,10 +81,10 @@ export class CloneItemGenerator extends BaseGenerator<MedsurfDraw.Image, CloneIt
// Check pointerover
// -- Check if mouse is in image
const globalPoint = this.target.renderer.plugins.interaction.mouse.global;
- const hitTest = this.target.renderer.plugins.interaction.hitTest(globalPoint, this.target);
+ const hitTest = this.target.renderer.plugins.interaction.hitTest(globalPoint, this.target.parent);
if (!hitTest) {
// -- Not hit test result -> mouse outside image
- this.target.once("pointerover", this.start, this);
+ this.target.parent.once("pointerover", this.start, this);
} else {
// -- Hit rest result -> mouse inside image
const event = new PIXI.InteractionEvent();
diff --git a/src/lib/generators/copies/CloneLayerGenerator.ts b/src/lib/generators/copies/CloneLayerGenerator.ts
index 2b4f38ff..fe6d9e9c 100644
--- a/src/lib/generators/copies/CloneLayerGenerator.ts
+++ b/src/lib/generators/copies/CloneLayerGenerator.ts
@@ -71,10 +71,10 @@ export class CloneLayerGenerator extends BaseGenerator<MedsurfDraw.Image, CloneL
// Check pointerover
// -- Check if mouse is in image
const globalPoint = this.target.renderer.plugins.interaction.mouse.global;
- const hitTest = this.target.renderer.plugins.interaction.hitTest(globalPoint, this.target);
+ const hitTest = this.target.renderer.plugins.interaction.hitTest(globalPoint, this.target.parent);
if (!hitTest) {
// -- Not hit test result -> mouse outside image
- this.target.once("pointerover", this.start, this);
+ this.target.parent.once("pointerover", this.start, this);
} else {
// -- Hit rest result -> mouse inside image
const event = new PIXI.InteractionEvent();
diff --git a/src/lib/generators/legends/LegendGenerator.ts b/src/lib/generators/legends/LegendGenerator.ts
index 0280711b..ea7b6508 100644
--- a/src/lib/generators/legends/LegendGenerator.ts
+++ b/src/lib/generators/legends/LegendGenerator.ts
@@ -59,10 +59,10 @@ export class LegendGenerator extends BaseGenerator<MedsurfDraw.Image, LegendGene
//<editor-fold desc="Events">
// -- Image
this.target.on('imageZoom', this.onZoom, this);
- this.target.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// ---- Move
this.drawInteraction.on("startMove", this.legendElement.moveInteraction.startMove, this.legendElement.moveInteraction);
this.drawInteraction.on("resetMove", this.legendElement.moveInteraction.resetMove, this.legendElement.moveInteraction);
@@ -80,10 +80,10 @@ export class LegendGenerator extends BaseGenerator<MedsurfDraw.Image, LegendGene
// Check pointerover
// -- Check if mouse is in image
const globalPoint = this.target.renderer.plugins.interaction.mouse.global;
- const hitTest = this.target.renderer.plugins.interaction.hitTest(globalPoint, this.target);
+ const hitTest = this.target.renderer.plugins.interaction.hitTest(globalPoint, this.target.parent);
if (!hitTest) {
// -- Not hit test result -> mouse outside image
- this.target.once("pointerover", this.start, this);
+ this.target.parent.once("pointerover", this.start, this);
} else {
// -- Hit rest result -> mouse inside image
const event = new PIXI.InteractionEvent();
@@ -125,10 +125,10 @@ export class LegendGenerator extends BaseGenerator<MedsurfDraw.Image, LegendGene
//<editor-fold desc="Events">
// -- Image
this.target.off('imageZoom', this.onZoom, this);
- this.target.off("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.off("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.off("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.off("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.off("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.off("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.off("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.off("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// ---- Move
this.drawInteraction.off("startMove", this.legendElement.moveInteraction.startMove, this.legendElement.moveInteraction);
this.drawInteraction.off("resetMove", this.legendElement.moveInteraction.resetMove, this.legendElement.moveInteraction);
diff --git a/src/lib/generators/positionings/PositionPointGenerator.ts b/src/lib/generators/positionings/PositionPointGenerator.ts
index affe2010..e525b11b 100644
--- a/src/lib/generators/positionings/PositionPointGenerator.ts
+++ b/src/lib/generators/positionings/PositionPointGenerator.ts
@@ -83,10 +83,10 @@ export class PositionPointGenerator extends BaseGenerator<MedsurfDraw.Image, Pos
// Check pointerover
// -- Check if mouse is in image
const globalPoint = this.target.renderer.plugins.interaction.mouse.global;
- const hitTest = this.target.renderer.plugins.interaction.hitTest(globalPoint, this.target);
+ const hitTest = this.target.renderer.plugins.interaction.hitTest(globalPoint, this.target.parent);
if (!hitTest) {
// -- Not hit test result -> mouse outside image
- this.target.once("pointerover", this.start, this);
+ this.target.parent.once("pointerover", this.start, this);
} else {
// -- Hit rest result -> mouse inside image
const event = new PIXI.InteractionEvent();
diff --git a/src/lib/generators/primitives/ArrowPrimitiveGenerator.ts b/src/lib/generators/primitives/ArrowPrimitiveGenerator.ts
index 4ec0a6bb..fa966461 100644
--- a/src/lib/generators/primitives/ArrowPrimitiveGenerator.ts
+++ b/src/lib/generators/primitives/ArrowPrimitiveGenerator.ts
@@ -101,10 +101,10 @@ export class ArrowPrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image, Ar
public end(): void {
//<editor-fold desc="Events">
// -- Image
- this.target.off("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.off("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.off("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.off("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.off("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.off("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.off("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.off("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// -- Draw
this.drawInteraction.removeAllListeners();
//</editor-fold>
@@ -233,10 +233,10 @@ export class ArrowPrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image, Ar
} else {
//<editor-fold desc="Events">
// -- Image
- this.target.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// -- Scale
this.drawInteraction.on("startScale", this.arrowPrimitiveElement.scaleInteraction.startScale, this.arrowPrimitiveElement.scaleInteraction);
this.drawInteraction.on("onScale", this.arrowPrimitiveElement.scaleInteraction.onScale, this.arrowPrimitiveElement.scaleInteraction);
@@ -263,10 +263,10 @@ export class ArrowPrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image, Ar
} else {
//<editor-fold desc="Events">
// -- Image
- this.target.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// -- Draw
this.drawInteraction.on("endDraw", this.endArrowPrimitiveDraw, this);
this.drawInteraction.on("abortDraw", this.abortArrowPrimitiveDraw, this);
diff --git a/src/lib/generators/primitives/EllipsePrimitiveGenerator.ts b/src/lib/generators/primitives/EllipsePrimitiveGenerator.ts
index aafa7b1f..2a7ab9de 100644
--- a/src/lib/generators/primitives/EllipsePrimitiveGenerator.ts
+++ b/src/lib/generators/primitives/EllipsePrimitiveGenerator.ts
@@ -100,10 +100,10 @@ export class EllipsePrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image,
public end(): void {
//<editor-fold desc="Events">
// -- Image
- this.target.off("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.off("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.off("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.off("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.off("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.off("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.off("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.off("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// -- Draw
this.drawInteraction.removeAllListeners();
//</editor-fold>
@@ -232,10 +232,10 @@ export class EllipsePrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image,
} else {
//<editor-fold desc="Events">
// -- Image
- this.target.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// ---- Scale
this.drawInteraction.on("startScale", this.ellipsePrimitiveElement.scaleInteraction.startScale, this.ellipsePrimitiveElement.scaleInteraction);
this.drawInteraction.on("onScale", this.ellipsePrimitiveElement.scaleInteraction.onScale, this.ellipsePrimitiveElement.scaleInteraction);
@@ -262,10 +262,10 @@ export class EllipsePrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image,
} else {
//<editor-fold desc="Events">
// -- Image
- this.target.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// -- Draw
this.drawInteraction.on("endDraw", this.endEllipsePrimitiveDraw, this);
this.drawInteraction.on("abortDraw", this.abortEllipsePrimitiveDraw, this);
diff --git a/src/lib/generators/primitives/RectanglePrimitiveGenerator.ts b/src/lib/generators/primitives/RectanglePrimitiveGenerator.ts
index 4ffa82b4..805946c3 100644
--- a/src/lib/generators/primitives/RectanglePrimitiveGenerator.ts
+++ b/src/lib/generators/primitives/RectanglePrimitiveGenerator.ts
@@ -100,10 +100,10 @@ export class RectanglePrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image
public end(): void {
//<editor-fold desc="Events">
// -- Image
- this.target.off("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.off("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.off("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.off("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.off("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.off("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.off("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.off("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// -- Draw
this.drawInteraction.removeAllListeners();
//</editor-fold>
@@ -231,10 +231,10 @@ export class RectanglePrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image
} else {
//<editor-fold desc="Events">
// -- Image
- this.target.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// ---- Scale
this.drawInteraction.on("startScale", this.rectanglePrimitiveElement.scaleInteraction.startScale, this.rectanglePrimitiveElement.scaleInteraction);
this.drawInteraction.on("onScale", this.rectanglePrimitiveElement.scaleInteraction.onScale, this.rectanglePrimitiveElement.scaleInteraction);
@@ -261,10 +261,10 @@ export class RectanglePrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image
} else {
//<editor-fold desc="Events">
// -- Image
- this.target.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// -- Draw
this.drawInteraction.on("endDraw", this.endRectanglePrimitiveDraw, this);
this.drawInteraction.on("abortDraw", this.abortRectanglePrimitiveDraw, this);
diff --git a/src/lib/generators/primitives/TextPrimitiveGenerator.ts b/src/lib/generators/primitives/TextPrimitiveGenerator.ts
index c48ecac6..37cae996 100644
--- a/src/lib/generators/primitives/TextPrimitiveGenerator.ts
+++ b/src/lib/generators/primitives/TextPrimitiveGenerator.ts
@@ -100,10 +100,10 @@ export class TextPrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image, Tex
public end(): void {
//<editor-fold desc="Events">
// -- Image
- this.target.off("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.off("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.off("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.off("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.off("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.off("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.off("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.off("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// -- Draw
this.drawInteraction.removeAllListeners();
//</editor-fold>
@@ -231,10 +231,10 @@ export class TextPrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image, Tex
} else {
//<editor-fold desc="Events">
// -- Image
- this.target.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// ---- Scale
this.drawInteraction.on("startScale", this.textPrimitiveElement.scaleInteraction.startScale, this.textPrimitiveElement.scaleInteraction);
this.drawInteraction.on("onScale", this.textPrimitiveElement.scaleInteraction.onScale, this.textPrimitiveElement.scaleInteraction);
@@ -262,10 +262,10 @@ export class TextPrimitiveGenerator extends BaseGenerator<MedsurfDraw.Image, Tex
} else {
//<editor-fold desc="Events">
// -- Image
- this.target.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
- this.target.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
- this.target.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
- this.target.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
+ this.target.parent.on("mousedown", this.drawInteraction.startDrawScale, this.drawInteraction);
+ this.target.parent.on("rightup", this.drawInteraction.abortDraw, this.drawInteraction);
+ this.target.parent.on("pointermove", this.drawInteraction.onDraw, this.drawInteraction);
+ this.target.parent.on("mouseup", this.drawInteraction.endDraw, this.drawInteraction);
// -- Draw
this.drawInteraction.on("endDraw", this.endTextPrimitiveDraw, this);
this.drawInteraction.on("abortDraw", this.abortTextPrimitiveDraw, this);
--
GitLab