diff --git a/src/app/index.ts b/src/app/index.ts
index 2c00f77b38b83f3a4958714fcc9e632d3e52ad63..cb5239d15c2caed68d3f5cf55aadc149ec027bf7 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 5dfa7564284df166327c957ed514af1a99d01ac0..da6567d144596f5eb3949b72283d2c035b975188 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 3d06e02b0a1707725d8279ea5892cbd541e492a4..9eb0a132b67898a513f0090bad8f9e1a13bcecbb 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 e784a3231b3bee12e0c9a73105770c3b53b66eda..32babbb27c9ca325adfb3910e4ab39131441e317 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 e6c9f63f56f6b3cd8a9f75d1f645dd8ad8412d79..df1d0ed9c0da6cd4fad022cfd11dfce273dfa1cc 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 be9aac38dc5c9605c7d36df5716ba61b0f921690..321a72c739d185a65fdcf510ef0287ec447b5bfe 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 7755ce6dc5f6f7f58dc303ff87806033c8184342..1075a4d41c2aab9960da05c78f8a51ec6f92a48e 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 f796aaaec211b44d7821cbd80ab012c4ed7b6f85..bd1b6c1366ac76b9d9b766ba8371a47ba7585614 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 32165ceccca4af59b3201ea3d4706b32db6d3379..19d7ab7c1396c1fa09602a4e7bb4045cfaea0ab6 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 4f88e5b75255b20ae0cebb45c0b53d1bfc0dc957..be1ecfd8de7caae831a4c45bfdde93db039c0be0 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 4ed27faa60541340455e989084bd3278f85efb09..930ae53d4cea008dbbd04754b6e95fb46f68b545 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 63fbad0946cd5c81a3769d70e1a62ea6a9e3da49..7188c4fe870ce61d7a484ebf35e4fe365f152a61 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 2b4f38ffad8ae0f99624ab5d34e09014ce0cc134..fe6d9e9c7371a57a6a5a7be9f4b22a598edc04eb 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 0280711b321596a6b0dc1632174a50e6d16f7eda..ea7b6508aa17416ab31b02b1061d43c0028beaa7 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 affe201056a72df3508ffe91b950294722d554e7..e525b11bfb7768a31c9cd2052007b785bc73f1e3 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 4ec0a6bb7ad0920a8f82daec38833b69203d0302..fa9664611ef17fe735fb5f5a16c16825cea4fc4a 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 aafa7b1f5552509fc455bc8f96e25e1b1ae2b430..2a7ab9deccc015f1fdff0a9deff3f258f267ce7d 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 4ffa82b45e123860e8f6e8afc15cf0725c0a18fc..805946c366cd078f60240886386d9b4ae63ee3ff 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 c48ecac68cdf4f380d28df9445908b3690da2075..37cae996dbf2fdff4af852daf5ff4985a17db0da 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);