From d3ba6fb8a627b2eecba40df452178a02f76e7b52 Mon Sep 17 00:00:00 2001
From: Andrea Gottsponer <ago@attr.ch>
Date: Mon, 19 Sep 2022 15:23:18 +0200
Subject: [PATCH] - fix selftest on hover event - fix fill update for line with
fill
---
package.json | 2 +-
src/app/index.ts | 14 +++++++-------
src/lib/elements/fills/FillCollection.ts | 4 ++++
src/lib/elements/primitives/ArrowPrimitive.ts | 11 +++++++++--
src/lib/elements/primitives/EllipsePrimitive.ts | 11 +++++++++--
src/lib/elements/primitives/RectanglePrimitive.ts | 10 ++++++++--
src/lib/elements/primitives/TextPrimitive.ts | 9 ++++++++-
7 files changed, 46 insertions(+), 15 deletions(-)
diff --git a/package.json b/package.json
index a521c8de..fbbbe0ff 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "medsurf-draw",
- "version": "1.0.237",
+ "version": "1.0.238",
"description": "Draw annotations on jpg/zoomify images, based on PIXI.js",
"keywords": [
"draw",
diff --git a/src/app/index.ts b/src/app/index.ts
index f39749df..b58361d3 100644
--- a/src/app/index.ts
+++ b/src/app/index.ts
@@ -19,15 +19,15 @@ import { PixiPlugin } from 'gsap/PixiPlugin.js';
- Toggle submenus -> change hitbox when open and reset selection when outside
- Selektion der Fläche -> wird nicht geändert. scheint andere elemente zu ändern -> no events ???
- Fill unset line color creates black lines -> fix this
- Selftest add new element only for selftest -> use ellipse for this (make ellipse smaller once clicked) - otherwise elements like arrow / rectangle / ... will be shown (not nice)
- FillLine: "isPointInPolygon" and "getNearestPointForPoint" function wrong;
- Line: Hitbox not defined -> HOW TO ???
- Interactions anpassen; siehe dazu CloneInteraction -> kann einfacher so umgesetzt werden (Scale auf Draw nicht mehr notwendig; ausbauen) -> Test: Move events in Draw / Copy / Selection Generator
+ - Selftest add new element only for selftest -> use ellipse for this (make ellipse smaller once clicked) - otherwise elements like arrow / rectangle / ... will be shown (not nice)
+ - FillLine: "isPointInPolygon" and "getNearestPointForPoint" function wrong;
+ - Line: Hitbox not defined -> HOW TO ???
+ - Selftest selcet interaction available -> WHY?
- Speicherfehler
- Menu verschiebung auf LayerGruppe when Schrift angepasst wird (How to???)
- ---
+ - Menu verschiebung auf LayerGruppe when Schrift angepasst wird (How to???)
+ Interactions anpassen; siehe dazu CloneInteraction -> kann einfacher so umgesetzt werden (Scale auf Draw nicht mehr notwendig; ausbauen) -> Test: Move events in Draw / Copy / Selection Generator
Verpixelung ??? -> grössere Schrift
- -- not possible -- Reset der position when contextmenu klicket (How TO????)
+ Create Behaviour/Interaction -> to eliminate/clean up the elements
*/
// Element Refs
diff --git a/src/lib/elements/fills/FillCollection.ts b/src/lib/elements/fills/FillCollection.ts
index 15f99e37..87ccd0d1 100644
--- a/src/lib/elements/fills/FillCollection.ts
+++ b/src/lib/elements/fills/FillCollection.ts
@@ -290,6 +290,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection,
// TODO remove this -> prevent some strange behaviour
// line.on("draw", this.draw, this);
line.on("onPointUpdate", this.draw.bind(this), this);
+ line.on("onPointUpdate", this.emit.bind(this, "onFillMove"), this);
// line.on("positionPointAdded", this._positionPointAdded, this);
// line.on("removed", this._onRemoveButton, this);
});
@@ -302,6 +303,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection,
//<editor-fold desc="Events">
this.lines.forEach((line: MedsurfDraw.Line) => {
line.on("onPointUpdate", this.draw.bind(this), this);
+ line.on("onPointUpdate", this.emit.bind(this, "onFillMove"), this);
});
//</editor-fold>
@@ -315,6 +317,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection,
//<editor-fold desc="Events">
this.lines.forEach((line) => {
line.off("onPointUpdate", this.draw, this);
+ line.off("onPointUpdate", this.emit.bind(this, "onFillMove"), this);
});
//</editor-fold>
}
@@ -793,6 +796,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection,
// Add events
line.on("onPointUpdate", this.draw.bind(this), this);
+ line.on("onPointUpdate", this.emit.bind(this, "onFillMove"), this);
}
/**
diff --git a/src/lib/elements/primitives/ArrowPrimitive.ts b/src/lib/elements/primitives/ArrowPrimitive.ts
index f0575b13..ccc5ce91 100644
--- a/src/lib/elements/primitives/ArrowPrimitive.ts
+++ b/src/lib/elements/primitives/ArrowPrimitive.ts
@@ -1570,8 +1570,14 @@ export class ArrowPrimitive extends BaseElementContainer<Models.ArrowPrimitive,
*/
public onHover(): void {
// Setup
- this._arrowElement.options.lineColor = Design.primitive.lineColorHover;
- this._arrowElement.options.fillColor = Design.primitive.fillColorHover;
+ if (this.modeInteraction.lastMode !== 'selftest') {
+ this._arrowElement.options.lineColor = Design.primitive.lineColorHover;
+ this._arrowElement.options.fillColor = Design.primitive.fillColorHover;
+ } else {
+ this._selftestElement.options.lineColor = Design.primitive.lineColorHover;
+ this._selftestElement.options.fillColor = Design.primitive.fillColorHover;
+ }
+
// Draw
this.emit("debounceDraw");
@@ -1583,6 +1589,7 @@ export class ArrowPrimitive extends BaseElementContainer<Models.ArrowPrimitive,
public onOut(): void {
// Setup
this._arrowElement.options = Object.assign({}, this.model.options);
+ this._selftestElement.options = Object.assign({}, this.model.options);
// Draw
this.emit("debounceDraw");
diff --git a/src/lib/elements/primitives/EllipsePrimitive.ts b/src/lib/elements/primitives/EllipsePrimitive.ts
index 106e7983..fd368b30 100644
--- a/src/lib/elements/primitives/EllipsePrimitive.ts
+++ b/src/lib/elements/primitives/EllipsePrimitive.ts
@@ -1486,8 +1486,14 @@ export class EllipsePrimitive extends BaseElementContainer<Models.EllipsePrimiti
*/
public onHover(): void {
// Setup
- this._ellipseElement.options.lineColor = Design.primitive.lineColorHover;
- this._ellipseElement.options.fillColor = Design.primitive.fillColorHover;
+ if (this.modeInteraction.lastMode !== 'selftest') {
+ this._ellipseElement.options.lineColor = Design.primitive.lineColorHover;
+ this._ellipseElement.options.fillColor = Design.primitive.fillColorHover;
+ } else {
+ this._selftestElement.options.lineColor = Design.primitive.lineColorHover;
+ this._selftestElement.options.fillColor = Design.primitive.fillColorHover;
+ }
+
// Draw
this.emit("debounceDraw");
@@ -1499,6 +1505,7 @@ export class EllipsePrimitive extends BaseElementContainer<Models.EllipsePrimiti
public onOut(): void {
// Setup
this._ellipseElement.options = Object.assign({}, this.model.options);
+ this._selftestElement.options = Object.assign({}, this.model.options);
// Draw
this.emit("debounceDraw");
diff --git a/src/lib/elements/primitives/RectanglePrimitive.ts b/src/lib/elements/primitives/RectanglePrimitive.ts
index 52a89723..e87da7e0 100644
--- a/src/lib/elements/primitives/RectanglePrimitive.ts
+++ b/src/lib/elements/primitives/RectanglePrimitive.ts
@@ -1487,8 +1487,13 @@ export class RectanglePrimitive extends BaseElementContainer<Models.RectanglePri
*/
public onHover(): void {
// Setup
- this._rectangleElement.options.lineColor = Design.primitive.lineColorHover;
- this._rectangleElement.options.fillColor = Design.primitive.fillColorHover;
+ if (this.modeInteraction.lastMode !== 'selftest') {
+ this._rectangleElement.options.lineColor = Design.primitive.lineColorHover;
+ this._rectangleElement.options.fillColor = Design.primitive.fillColorHover;
+ } else {
+ this._selftestElement.options.lineColor = Design.primitive.lineColorHover;
+ this._selftestElement.options.fillColor = Design.primitive.fillColorHover;
+ }
// Draw
this.emit("debounceDraw");
@@ -1500,6 +1505,7 @@ export class RectanglePrimitive extends BaseElementContainer<Models.RectanglePri
public onOut(): void {;
// Setup
this._rectangleElement.options = Object.assign({}, this.model.options);
+ this._selftestElement.options = Object.assign({}, this.model.options);
// Draw
this.emit("debounceDraw");
diff --git a/src/lib/elements/primitives/TextPrimitive.ts b/src/lib/elements/primitives/TextPrimitive.ts
index 61fcac92..47718275 100644
--- a/src/lib/elements/primitives/TextPrimitive.ts
+++ b/src/lib/elements/primitives/TextPrimitive.ts
@@ -1649,7 +1649,12 @@ export class TextPrimitive extends BaseElementContainer<Models.TextPrimitive, Ba
*/
public onHover(): void {
// Setup
- this._textElement.style.fill = Design.primitive.lineColorHover;
+ if (this.modeInteraction.lastMode !== 'selftest') {
+ this._textElement.style.fill = Design.primitive.lineColorHover;
+ } else {
+ this._selftestElement.options.lineColor = Design.primitive.lineColorHover;
+ this._selftestElement.options.fillColor = Design.primitive.fillColorHover;
+ }
// Draw
this.emit("debounceDraw");
@@ -1674,6 +1679,8 @@ export class TextPrimitive extends BaseElementContainer<Models.TextPrimitive, Ba
// Setup
// @ts-ignore TODO ignore
this._textElement.style = new PIXI.TextStyle(style);
+ this._selftestElement.options = {hasLine: true, lineColor: style.fill, lineAlpha: 1,
+ hasFill: true, fillColor: style.fill, fillAlpha: 1};
// Draw
this.emit("debounceDraw");
--
GitLab