diff --git a/src/app/index.ts b/src/app/index.ts
index 7eab43dabbff65445a0eefcc1b69db3c0b1ae767..d078907b1d3ad155754f9d27751410b0daa9a34f 100644
--- a/src/app/index.ts
+++ b/src/app/index.ts
@@ -10,7 +10,7 @@ import {ArrowPrimitive} from "../lib/elements/primitives/ArrowPrimitive";
import {Line} from "../lib/elements/connections/Line";
import {ImageNavigatorElement} from "../lib/elements/interactions/ImageNavigatorElement";
import {FillCollection} from "../lib/elements/collections/FillCollection";
-import {LegendCollection, LegendItem} from "../lib/elements/collections/LegendCollection";
+import {LegendCollection} from "../lib/elements/collections/LegendCollection";
import {MedsurfSprite} from "../lib";
const canvas = document.getElementById("medsurf_canvas") as HTMLCanvasElement;
@@ -377,7 +377,7 @@ PIXI.Renderer.registerPlugin('bla', bla);
style: {
fill: 0xFFFFFF,
fontSize: 22,
- fontFamily: "Times New Roman",
+ fontFamily: "proxima_nova_altsemibold",
}
});
point5.addChild(text);
@@ -744,11 +744,126 @@ PIXI.Renderer.registerPlugin('bla', bla);
});
image.addChild(fill1);
- /* TODO for test
- const legend1 = new LegendCollection(new PIXI.Rectangle(200, 100, 300, 100), [[new LegendItem("row1\nrow1"), new LegendItem("row1"), new LegendItem("row1")], [new LegendItem("row2"), new LegendItem("row2")], [new LegendItem("row3"), new LegendItem("row3")]], undefined, false);
+ const legendCollectionModel: Models.LegendCollection = {
+ id: 'legend1',
+ type: Models.ImageObjectType.LEGENDCOLLECTION,
+ isStatic: false,
+ rectangle: new PIXI.Rectangle(200, 100, 300, 100),
+ cols: [],
+ rowDistance: 14,
+ columnDistance: 14,
+ indexWidth: 14
+ };
+
+ const legendColumn1: Models.LegendColumn = {
+ id: 'legendColumn1',
+ table: legendCollectionModel,
+ rows: []
+ };
+ const legendText1_1: Models.LegendItem = {
+ id: 'legendText1_1',
+ type: Models.ImageObjectType.LEGENDITEM,
+ isStatic: false,
+ text: 'row1\nrow1',
+ style: {
+ fill: 0xFFFFFF,
+ fontSize: 22,
+ fontFamily: 'proxima_nova_altsemibold'
+ },
+ col: legendColumn1
+ };
+ const legendText1_2: Models.LegendItem = {
+ id: 'legendText1_2',
+ type: Models.ImageObjectType.LEGENDITEM,
+ isStatic: false,
+ text: 'row1',
+ style: {
+ fill: 0xFFFFFF,
+ fontSize: 22,
+ fontFamily: 'proxima_nova_altsemibold'
+ },
+ col: legendColumn1
+ };
+ const legendText1_3: Models.LegendItem = {
+ id: 'legendText1_3',
+ type: Models.ImageObjectType.LEGENDITEM,
+ isStatic: false,
+ text: 'row1',
+ style: {
+ fill: 0xFFFFFF,
+ fontSize: 22,
+ fontFamily: 'proxima_nova_altsemibold'
+ },
+ col: legendColumn1
+ };
+ legendColumn1.rows.push(...[legendText1_1, legendText1_2, legendText1_3]);
+
+ const legendColumn2: Models.LegendColumn = {
+ id: 'legendColumn2',
+ table: legendCollectionModel,
+ rows: []
+ };
+ const legendText2_1: Models.LegendItem = {
+ id: 'legendText2_1',
+ type: Models.ImageObjectType.LEGENDITEM,
+ isStatic: false,
+ text: 'row2',
+ style: {
+ fill: 0xFFFFFF,
+ fontSize: 22,
+ fontFamily: 'proxima_nova_altsemibold'
+ },
+ col: legendColumn2
+ };
+ const legendText2_2: Models.LegendItem = {
+ id: 'legendText2_2',
+ type: Models.ImageObjectType.LEGENDITEM,
+ isStatic: false,
+ text: 'row2',
+ style: {
+ fill: 0xFFFFFF,
+ fontSize: 22,
+ fontFamily: 'proxima_nova_altsemibold'
+ },
+ col: legendColumn2
+ };
+ legendColumn2.rows.push(...[legendText2_1, legendText2_2]);
+
+ const legendColumn3: Models.LegendColumn = {
+ id: 'legendColumn3',
+ table: legendCollectionModel,
+ rows: []
+ };
+ const legendText3_1: Models.LegendItem = {
+ id: 'legendText3_1',
+ type: Models.ImageObjectType.LEGENDITEM,
+ isStatic: false,
+ text: 'row1',
+ style: {
+ fill: 0xFFFFFF,
+ fontSize: 22,
+ fontFamily: 'proxima_nova_altsemibold'
+ },
+ col: legendColumn3
+ };
+ const legendText3_2: Models.LegendItem = {
+ id: 'legendText3_2',
+ type: Models.ImageObjectType.LEGENDITEM,
+ isStatic: false,
+ text: 'row1',
+ style: {
+ fill: 0xFFFFFF,
+ fontSize: 22,
+ fontFamily: 'proxima_nova_altsemibold'
+ },
+ col: legendColumn3
+ };
+ legendColumn3.rows.push(...[legendText3_1, legendText3_2]);
+ legendCollectionModel.cols.push(...[legendColumn1, legendColumn2, legendColumn3]);
+
+ const legend1 = new LegendCollection(legendCollectionModel);
legend1.name = "legend1";
image.addChild(legend1);
- */
// TODO emit draw event on both
diff --git a/src/lib/elements/collections/FillCollection.ts b/src/lib/elements/collections/FillCollection.ts
index e9edc0681a5e600add6a85200c09a2db5be9dcf9..4b3a15a9e5d20758ac84b71e4022331e1284573b 100644
--- a/src/lib/elements/collections/FillCollection.ts
+++ b/src/lib/elements/collections/FillCollection.ts
@@ -23,9 +23,10 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
/**
* Members
*/
+ private _interactiveItems: ImageObject[];
+ private _lines: Line[];
protected _fillColor: number;
protected _fillAlpha: number;
- private _lines: Line[]; // TODO implement this -> add in added
/* TODO remove
private _isInteractive: boolean;
private _interactiveItems: ImageObject[];
@@ -92,6 +93,8 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
// Setup
this.zIndex = 99;
+ this._interactiveItems = [];
+ this._lines = [];
this._fillColor = this.model.options.fillColor;
/* TODO remove
this._lines = model.lines; // TODO type
@@ -183,8 +186,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
parent.on("itemFillChoosing", this._itemFillChoosing, this);
parent.on("allElementRelease", this._allElementRelease, this);
- this.model.lines.forEach((model: Models.Line) => {
- const line = this.getImage().getChildByName(model.id || "new") as ImageObject;
+ this._lines.forEach((line: Line) => {
line.on("draw", this.draw, this);
line.on("positionPointAdded", this._positionPointAdded, this);
line.on("removed", this._onRemoveButton, this);
@@ -204,8 +206,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
parent.off("itemFillChoosing", this._itemFillChoosing, this);
parent.off("allElementRelease", this._allElementRelease, this);
- this.model.lines.forEach((model: Models.Line) => {
- const line = this.getImage().getChildByName(model.id || "new") as ImageObject;
+ this._lines.forEach((line: Line) => {
line.off("draw", this.draw, this);
line.off("positionPointAdded", this._positionPointAdded, this);
line.off("removed", this._onRemoveButton, this);
@@ -215,16 +216,14 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
//<editor-fold desc="Public functions">
public validate(): boolean {
- if (this.model.lines.length === 0) {
+ if (this._lines.length === 0) {
return false;
}
// Find positionPoints with an odd count of lines
let positionPointReference: PositionPoint[] = [];
let positionPointReferenceCount: number[] = [];
- this.model.lines.find((model: Models.Line) => {
- const line = this.getImage().getChildByName(model.id || "new") as Line;
-
+ this._lines.find((line: Line) => {
if (!line.graphicLine.start || !line.graphicLine.end) {
return;
}
@@ -269,9 +268,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
}
// Get first element and moveTo this
- let model: Models.Line = this.model.lines[0];
- let line = this.getImage().getChildByName(model.id || "new") as Line;
-
+ let line: Line = this._lines[0];
if (!line.graphicLine.start || !line.graphicLine.end) {
return;
}
@@ -287,7 +284,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
}
this._fillElement.moveTo(startPoint.x, startPoint.y);
- for (let i = 0; i < this.model.lines.length; i++) {
+ for (let i = 0; i < this._lines.length; i++) {
switch (line.graphicLine.type) {
case LineTypes.LINEAR:
this._fillElement.lineTo(endPoint.x, endPoint.y);
@@ -304,65 +301,21 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
}
// Get next line
- /*
- const nextLine: Models.Line | undefined = this.model.lines.find((model: Models.Line) => {
- const line = this.getImage().getChildByName(model.id || "new") as Line;
- return nextLine && nextLine.id !== line.name && (nextLine.id === endPoint.name || nextLine.id === endPoint.name);
- });
-
- if (nextLine) {
- line = this.getImage().getChildByName(nextLine.id || "new") as Line;
- if (nextLine.id === endPoint.name) {
- startPoint = this.getImage().getChildByName(nextLine.id || "new") as PositionPoint;
- endPoint = this.getImage().getChildByName(nextLine.id || "new") as PositionPoint;
- } else {
- startPoint = this.getImage().getChildByName(nextLine.id || "new") as PositionPoint;
- endPoint = this.getImage().getChildByName(nextLine.id || "new") as PositionPoint;
- }
- } else {
- throw new Error('we messed up something');
- }
- */
-
- // Get next line
- /*
- const nextLine: Models.Line | undefined = this.model.lines.find((model: Models.Line) => {
- const line = this.getImage().getChildByName(model.id || "new") as ImageObject;
- return nextLine && nextLine.id !== model.id && (nextLine.start.id === endPoint.name || nextLine.end.id === endPoint.name);
- });
-
- if (nextLine) {
- line = this.getImage().getChildByName(nextLine.id || "new") as Line;
- if (nextLine.start.id === endPoint.name) {
- startPoint = this.getImage().getChildByName(nextLine.start.id || "new") as PositionPoint;
- endPoint = this.getImage().getChildByName(nextLine.end.id || "new") as PositionPoint;
- } else {
- startPoint = this.getImage().getChildByName(nextLine.end.id || "new") as PositionPoint;
- endPoint = this.getImage().getChildByName(nextLine.start.id || "new") as PositionPoint;
- }
- } else {
- throw new Error('we messed up something');
- }
- */
- // Get next line
- const nextLineModel = this.lines.find((l: Models.Line) => {
- const nextLine = this.getImage().getChildByName(l.id || 'new') as Line;
+ const nextLine = this._lines.find((nextLine: Line) => {
return nextLine !== line && (nextLine.graphicLine.start === endPoint || nextLine.graphicLine.end === endPoint);
});
- if (nextLineModel) {
- const nextLine = this.getImage().getChildByName(nextLineModel.id || 'new') as Line;
-
- if (!nextLine.graphicLine.start || !nextLine.graphicLine.end) {
- return;
- }
-
+ if (nextLine) {
line = nextLine;
if (nextLine.graphicLine.start === endPoint) {
+ // @ts-ignore
startPoint = nextLine.graphicLine.start;
+ // @ts-ignore
endPoint = nextLine.graphicLine.end;
} else {
+ // @ts-ignore
startPoint = nextLine.graphicLine.end;
+ // @ts-ignore
endPoint = nextLine.graphicLine.start;
}
} else {
@@ -423,7 +376,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
}
public hasLine(line: Line): boolean {
- return this.model.lines.some((model: Models.Line) => model.id === line.name);
+ return this._lines.some((l: Line) => l === line);
}
public addLine(line: Line): void {
@@ -432,6 +385,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
line.on("removed", this._onRemoveButton, this);
this.model.lines.push(line.model);
+ this._lines.push(line);
this.draw();
}
@@ -442,6 +396,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
line.off("removed", this._onRemoveButton, this);
this.model.lines = this.model.lines.filter((model: Models.Line) => model.id !== line.name);
+ this._lines = this._lines.filter((l: Line) => l !== line);
this.draw();
}
@@ -463,6 +418,12 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
* @private
*/
protected _stageReady(): void {
+ if (this.model.interactiveItems) {
+ this._interactiveItems = this.model.interactiveItems.map((item: Models.ImageObject) => {
+ return this.getImage().getChildByName(item.id || 'new') as ImageObject;
+ });
+ }
+
this.draw();
this.emit("stage-ready");
}
@@ -599,10 +560,10 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
}
protected _modeBlocked(parent: ImageObject, element: ImageObject): void {
- if (element instanceof PositionPoint && element.selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ if (element instanceof PositionPoint && element.selftestItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
- } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
} else {
@@ -678,7 +639,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
protected _modeSelftestChoosing(parent: ImageObject, element: PositionPoint): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.selftestItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.selftestItems.some((item: ImageObject) => item === this);
this._fillColor = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
@@ -700,7 +661,7 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
protected _modeInteractiveChoosing(parent: ImageObject, element: FillCollection): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.interactiveItems.some((item: ImageObject) => item === this);
this._fillColor = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
@@ -931,16 +892,16 @@ export class FillCollection extends BaseElementContainer<Models.FillCollection>
this.model.isInteractive = value;
}
- public get interactiveItems(): Models.ImageObject[] {
- return this.model.interactiveItems || [];
+ public get interactiveItems(): ImageObject[] {
+ return this._interactiveItems || [];
}
- public set interactiveItems(value: Models.ImageObject[]) {
- this.model.interactiveItems = value;
+ public set interactiveItems(value: ImageObject[]) {
+ this._interactiveItems = value;
}
- public get lines(): Models.Line[] {
- return this.model.lines;
+ public get lines(): Line[] {
+ return this._lines;
}
//</editor-fold>
}
\ No newline at end of file
diff --git a/src/lib/elements/collections/LegendCollection.ts b/src/lib/elements/collections/LegendCollection.ts
index 7241527975b802b4702d0ecef019a84128f82356..305190f34a5b4ea49dac8ab8295885456aa978ea 100644
--- a/src/lib/elements/collections/LegendCollection.ts
+++ b/src/lib/elements/collections/LegendCollection.ts
@@ -18,46 +18,19 @@ import {ScaleElement} from "../interactions/ScaleElement";
import {MedsurfSprite} from "../images/MedsurfSprite";
import {LegendColumnCollection} from "./LegendColumnCollection";
import {PointElement} from "../interactions/PointElement";
-import {Line} from "../..";
-
-export class LegendItem extends BaseElementContainer<Models.LegendItem> {
- public textElement: LegendTextPrimitive;
-
- /**
- * Constructor
- * @param model
- */
- public constructor(model: Models.LegendItem) {
- super(model);
- // TODO add to import in api: text: string, style: PIXI.TextStyle = new PIXI.TextStyle({fontSize: 22, fill: 0xFFFFFF, fontFamily: "Times New Roman", wordWrap: true, breakWords: true})
- this.textElement = new LegendTextPrimitive(model);
- }
-
- //<editor-fold desc="BaseContainer">
- public getRectangle(): PIXI.Rectangle {
- return this.getBounds();
- }
-
- public showItem(): void {
- this.renderable = true;
- }
-
- public hideItem(): void {
- this.renderable = false;
- }
- //</editor-fold>
-}
/**
* Legend collection
+ * TODO Problem with index show -> new item
+ * TODO integrate rowDistance, colDistance, indexWidth
*/
export class LegendCollection extends BaseElementContainer<Models.LegendCollection> {
/**
* Members
*/
protected _columns: LegendColumnCollection[]; // TODO implement this -> add in added
- /*
protected _rectangle: PIXI.Rectangle;
+ /*
protected _table: LegendItem[][];
private _isSelftest: boolean;
*/
@@ -108,8 +81,9 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
// Setup
this.zIndex = 300;
+ this._columns = [];
+ this._rectangle = new PIXI.Rectangle(0, 0, this.model.rectangle.width, this.model.rectangle.height);
/* TODO remove
- this._rectangle = new PIXI.Rectangle(0, 0, this._model.rectangle.width, this._model.rectangle.height);
this._table = this._model.cols; // TODO check correct schema
this._isSelftest = false;
*/
@@ -161,7 +135,7 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
this._rotateContainer = new PIXI.Container();
this.addChild(this._rotateContainer);
- this._selftestPointElement = (model.selftestPoint && model.selftestPoint.x && model.selftestPoint.y) ? new PointElement(model.selftestPoint.x, model.selftestPoint.y) : new PointElement(this.model.rectangle.x, this.model.rectangle.y);
+ this._selftestPointElement = (model.selftestPoint && model.selftestPoint.x && model.selftestPoint.y) ? new PointElement(model.selftestPoint.x, model.selftestPoint.y) : new PointElement(this._rectangle.x, this._rectangle.y);
this._selftestPointElement.on("onMove", this._onSelftestMove, this);
this._configurationElement = new ConfigurationElement(this.modeInteraction);
@@ -187,10 +161,6 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
// On added event
this.on("added", (parent: PositionPoint) => {
- this._columns = this.model.cols.map((col: Models.LegendColumn) => {
- return this.getImage().getChildByName(col.id || 'new') as LegendColumnCollection;
- });
-
// Events
parent.on("setDefaultMode", this._setDefaultMode, this);
parent.on("stage-ready", this._stageReady, this);
@@ -223,12 +193,13 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
// Init elements
for (let col = 0; col < this.model.cols.length; col++) {
const container = new LegendColumnCollection(this.model.cols[col], col + "_container", col);
+ this._columns.push(container);
+
this._rotateContainer.addChild(container);
for (let row = 0; row < this.model.cols[col].rows.length; row++) {
- const textElement = (this.getChildByName(this.model.cols[col].rows[row].id || 'new') as LegendItem).textElement;
+ const textElement = this._columns[col].rows[row];
textElement.index = row;
- textElement.name = col + "_" + row + "_text";
textElement.on("onText", this.draw, this);
// @ts-ignore
container._rotateContainer.addChild(textElement);
@@ -244,18 +215,17 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
//<editor-fold desc="Public functions">
public draw(): void {
- const colWidth = this.model.rectangle.width / this.model.cols.length;
+ const colWidth = this._rectangle.width / this.model.cols.length;
let index: number = 1;
- this.model.rectangle.height = 0;
+ this._rectangle.height = 0;
for (let col = 0; col < this.model.cols.length; col++) {
const container = this._rotateContainer.getChildByName(col + "_container") as LegendColumnCollection;
let previousMaxHeight: number = 0;
let previousTextElement: LegendTextPrimitive | null = null;
for (let row = 0; row < this.model.cols[col].rows.length; row++) {
- // @ts-ignore
- const textElement = container._rotateContainer.getChildByName(col + "_" + row + "_text") as LegendTextPrimitive;
+ const textElement = this._columns[col].rows[row];
// @ts-ignore
const numberElement = container._rotateContainer.getChildByName(col + "_" + row + "_num") as PIXI.Text;
@@ -273,22 +243,22 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
textElement._textElement.style.wordWrapWidth = colWidth - this._enumerationPadding;
// @ts-ignore
- previousMaxHeight = Math.max.apply(null, this._rotateContainer.children.filter((child: DisplayObject) => child instanceof LegendColumnCollection).map((container: LegendColumnCollection) => container._rotateContainer.children).reduce((cur, acc) => [...cur, ...acc], []).filter((child: DisplayObject) => child instanceof LegendTextPrimitive && child.name.endsWith(row + "_text")).map((child: LegendTextPrimitive) => child._textElement.height));
+ previousMaxHeight = Math.max.apply(null, this._columns.map((container : LegendColumnCollection) => container.rows[row] || false).filter((child: LegendTextPrimitive) => child).reduce((cur, acc) => [...cur, ...acc], []).map((child: LegendTextPrimitive) => child._textElement.height));
previousTextElement = textElement;
index++;
}
- if (previousTextElement && previousMaxHeight && previousTextElement.y + previousMaxHeight > this.model.rectangle.height) {
- this.model.rectangle.height = previousTextElement.y + previousMaxHeight;
- this._rotateContainer.pivot.y = this.model.rectangle.height / 2;
+ if (previousTextElement && previousMaxHeight && previousTextElement.y + previousMaxHeight > this._rectangle.height) {
+ this._rectangle.height = previousTextElement.y + previousMaxHeight;
+ this._rotateContainer.pivot.y = this._rectangle.height / 2;
}
}
// Hit area fix
this._hitAreaFixElement.clear();
this._hitAreaFixElement.beginFill(0xFFFFFF, 0.00000001);
- this._hitAreaFixElement.drawRect(this.model.rectangle.x - this.model.rectangle.width / 2, this.model.rectangle.y - this.model.rectangle.height / 2, this.model.rectangle.width, this.model.rectangle.height);
+ this._hitAreaFixElement.drawRect(this._rectangle.x - this._rectangle.width / 2, this._rectangle.y - this._rectangle.height / 2, this._rectangle.width, this._rectangle.height);
this._hitAreaFixElement.endFill();
}
@@ -359,19 +329,21 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
const container = new LegendColumnCollection(this.model.cols[col], col + "_container", col);
container.modeInteraction.defaultMode = "author";
+ this._columns.push(container);
+
this._rotateContainer.addChild(container);
for (let row = 0; row < this.model.cols[col].rows.length; row++) {
- const textElement = (this.getChildByName(this.model.cols[col].rows[row].id || 'new') as LegendItem).textElement;
+ const textElement = this._columns[col].rows[row];
textElement.modeInteraction.defaultMode = "author";
textElement.index = row;
- textElement.name = col + "_" + row + "_text";
textElement.on("onText", this.draw, this);
// @ts-ignore
container._rotateContainer.addChild(textElement);
// @ts-ignore
const numberElement = this._createNumberElement(textElement._textElement.style);
+ numberElement.visible = true;
numberElement.name = col + "_" + row + "_num";
// @ts-ignore
container._rotateContainer.addChild(numberElement);
@@ -387,8 +359,7 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
// Remove col
const container = this._rotateContainer.getChildByName(col + "_container");
for (let row = 0; row < this.model.cols[col].rows.length; row++) {
- // @ts-ignore
- const textElement = container._rotateContainer.getChildByName(col + "_" + row + "_text") as LegendTextPrimitive;
+ const textElement = this._columns[col].rows[row];
textElement.off("onText", this.draw, this);
textElement.modeInteraction.changeMode("delete");
@@ -407,10 +378,6 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
container.name = (c - 1) + "_container";
for (let row = 0; row < this.model.cols[c].rows.length; row++) {
- // @ts-ignore
- const textElement = container._rotateContainer.getChildByName(c + "_" + row + "_text") as LegendTextPrimitive;
- textElement.name = (c - 1) + "_" + row + "_text";
-
// @ts-ignore
const numberElement = container._rotateContainer.getChildByName(c + "_" + row + "_num") as PIXI.Text;
numberElement.name = (c - 1) + "_" + row + "_num";
@@ -419,13 +386,14 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
// Remove from table
this.model.cols.splice(col, 1);
+ this._columns.splice(col, 1);
// Draw
this.draw();
}
public addRowItem(col: number): void {
- const legendItem = new LegendItem({
+ const textElement = new LegendTextPrimitive({
type: Models.ImageObjectType.LEGENDITEM,
isStatic: false,
text: 'NEW',
@@ -436,22 +404,22 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
},
col: this.model.cols[col]
});
- this.model.cols[col].rows.push(legendItem.model);
+ this.model.cols[col].rows.push(textElement.model);
+ this._columns[col].rows.push(textElement);
const row = this.model.cols[col].rows.length - 1;
const container = this._rotateContainer.getChildByName(col + "_container") as LegendColumnCollection;
- const textElement = (this.getChildByName(this.model.cols[col].rows[row].id || 'new') as LegendItem).textElement;
textElement.modeInteraction.defaultMode = "author";
textElement.index = row;
- textElement.name = col + "_" + row + "_text";
textElement.on("onText", this.draw, this);
// @ts-ignore
container._rotateContainer.addChild(textElement);
// @ts-ignore
const numberElement = this._createNumberElement(textElement._textElement.style);
+ numberElement.visible = true;
numberElement.name = col + "_" + row + "_num";
// @ts-ignore
container._rotateContainer.addChild(numberElement);
@@ -466,8 +434,7 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
// Remove col
const container = this._rotateContainer.getChildByName(col + "_container");
- // @ts-ignore
- const textElement = container._rotateContainer.getChildByName(col + "_" + row + "_text") as LegendTextPrimitive;
+ const textElement = this._columns[col].rows[row];
textElement.off("onText", this.draw, this);
textElement.modeInteraction.changeMode("delete");
@@ -479,10 +446,8 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
// Update lower hand names
for (let r = row + 1; r < this.model.cols[col].rows.length; r++) {
- // @ts-ignore
- const textElement = container._rotateContainer.getChildByName(col + "_" + r + "_text") as LegendTextPrimitive;
+ const textElement = this._columns[col].rows[r];
textElement.index = (r - 1);
- textElement.name = col + "_" + (r - 1) + "_text";
// @ts-ignore
const numberElement = container._rotateContainer.getChildByName(col + "_" + r + "_num") as PIXI.Text;
@@ -491,6 +456,7 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
// Remove from table
this.model.cols[col].rows.splice(row, 1);
+ this._columns[col].rows.splice(row, 1);
if (this.model.cols[col].rows.length == 0) {
this.removeColItem(col);
@@ -784,8 +750,8 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
}
protected _onMove(event: PIXI.interaction.InteractionEvent, dX: number, dY: number): void {
- this.position.x += dX;
- this.position.y += dY;
+ this.position.x = this.model.rectangle.x += dX;
+ this.position.y = this.model.rectangle.y += dY;
}
protected _onSelftestMove(event: PIXI.interaction.InteractionEvent, dX: number, dY: number): void {
@@ -806,7 +772,7 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
}
protected _onScale(dX: number, dY: number, dW: number, dH: number): void {
- if (this.model.rectangle.width + dW < 1) {
+ if (this._rectangle.width + dW < 1) {
return;
/*
dW = 1 - this._ellipse.width;
@@ -814,7 +780,7 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
dY = 0;
*/
}
- if (this.model.rectangle.height + dH < 1) {
+ if (this._rectangle.height + dH < 1) {
return;
/*
dH = 1 - this._ellipse.height;
@@ -824,8 +790,8 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
}
// Element
- this.model.rectangle.width += dW;
- this.model.rectangle.height += dH;
+ this._rectangle.width = this.model.rectangle.width += dW;
+ this._rectangle.height = this.model.rectangle.height += dH;
// Position TODO not needed ??
// this.position.x += (dX + dW / 2) * Math.cos(this.rotation) - (dY + dH / 2) * Math.sin(this.rotation);
@@ -1000,13 +966,13 @@ export class LegendCollection extends BaseElementContainer<Models.LegendCollecti
}
public getRectangle(): PIXI.Rectangle {
- return new PIXI.Rectangle(this.position.x, this.position.y, this.model.rectangle.width, this.model.rectangle.height);
+ return new PIXI.Rectangle(this._rectangle.x, this._rectangle.y, this._rectangle.width, this._rectangle.height);
}
public showItem(): void {
this.renderable = true;
- this._rotateContainer.pivot.set(this.model.rectangle.width / 2, this.model.rectangle.height / 2);
+ this._rotateContainer.pivot.set(this._rectangle.width / 2, this._rectangle.height / 2);
// this.pivot.set(0, this._rectangle.height / 2); // TODO pivot for rotation
}
diff --git a/src/lib/elements/collections/LegendColumnCollection.ts b/src/lib/elements/collections/LegendColumnCollection.ts
index 23897782a64868b93a672099b7d42cf320a1a4f3..043cf299df63bf312f49b6b371a41107032edc86 100644
--- a/src/lib/elements/collections/LegendColumnCollection.ts
+++ b/src/lib/elements/collections/LegendColumnCollection.ts
@@ -9,6 +9,7 @@ import {MedsurfSprite} from "../images/MedsurfSprite";
import {LegendCollection} from "./LegendCollection";
import {SimpleScaleElement} from "../interactions/SimpleScaleElement";
import DisplayObject = PIXI.DisplayObject;
+import {LegendTextPrimitive} from "../primitives/LegendTextPrimitive";
/**
* Legend column collection
@@ -18,6 +19,7 @@ export class LegendColumnCollection extends BaseContainer {
* Members
*/
private _model: Models.LegendColumn;
+ private _rows: LegendTextPrimitive[];
private _index: number;
/**
@@ -50,6 +52,8 @@ export class LegendColumnCollection extends BaseContainer {
// Setup
this.zIndex = 300;
+ this.model = model;
+ this.rows = [];
this.name = name;
this.index = index;
@@ -133,6 +137,11 @@ export class LegendColumnCollection extends BaseContainer {
parent.off("itemFillChoosing", this._itemFillChoosing, this);
parent.off("allElementRelease", this._allElementRelease, this);
});
+
+ for (let row = 0; row < this.model.rows.length; row++) {
+ const text = new LegendTextPrimitive(this.model.rows[row]);
+ this._rows.push(text);
+ }
}
//<editor-fold desc="Public functions">
@@ -592,7 +601,15 @@ export class LegendColumnCollection extends BaseContainer {
this._index = value;
}
- // TODO better solution for this
+ public get rows(): LegendTextPrimitive[] {
+ return this._rows;
+ }
+
+ public set rows(value: LegendTextPrimitive[]) {
+ this._rows = value;
+ }
+
+// TODO better solution for this
public get isStatic(): boolean {
// @ts-ignore
return this.parent ? (this.parent.parent as LegendCollection).isStatic : super.isStatic;
diff --git a/src/lib/elements/connections/Line.ts b/src/lib/elements/connections/Line.ts
index 7721c2755e84d8bea3a00f321e307f550b641a50..0ec084abfdd4f2d9d288453d10aefa1b4c4198b6 100644
--- a/src/lib/elements/connections/Line.ts
+++ b/src/lib/elements/connections/Line.ts
@@ -805,13 +805,13 @@ export class Line extends BaseElementContainer<Models.Line> {
}
protected _modeBlocked(parent: ImageObject, element: ImageObject): void {
- if (element instanceof PositionPoint && element.selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ if (element instanceof PositionPoint && element.selftestItems.some((item: ImageObject) => item === this)) {
this._lineColor = this._lineColorSelftestSelected;
this.draw();
- } else if (element instanceof FillCollection && element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if (element instanceof FillCollection && element.interactiveItems.some((item: ImageObject) => item === this)) {
this._lineColor = this._lineColorSelftestSelected;
this.draw();
- } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((item: ImageObject) => item === this)) {
this._lineColor = this._lineColorSelftestSelected;
this.draw();
} else {
@@ -891,7 +891,7 @@ export class Line extends BaseElementContainer<Models.Line> {
protected _modeSelftestChoosing(parent: ImageObject, element: PositionPoint): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.selftestItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.selftestItems.some((item: ImageObject) => item === this);
this._lineColor = containsElement ? this._lineColorSelftestSelected : this._lineColorSelftestUnselected;
this.draw();
@@ -913,7 +913,7 @@ export class Line extends BaseElementContainer<Models.Line> {
protected _modeInteractiveChoosing(parent: ImageObject, element: FillCollection): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.interactiveItems && element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.interactiveItems && element.interactiveItems.some((item: ImageObject) => item === this);
this._lineColor = containsElement ? this._lineColorSelftestSelected : this._lineColorSelftestUnselected;
this.draw();
@@ -935,7 +935,7 @@ export class Line extends BaseElementContainer<Models.Line> {
protected _modeFillChoosing(parent: ImageObject, element: FillCollection): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.lines.some((model: Models.Line) => model.id === this.name);
+ const containsElement = element.lines.some((line: Line) => line === this);
this._lineColor = containsElement ? this._lineColorSelftestSelected : this._lineColorSelftestUnselected;
this.draw();
diff --git a/src/lib/elements/positionings/PositionPoint.ts b/src/lib/elements/positionings/PositionPoint.ts
index e091e2d0f2198323718331f01cd5aaf98460ff7b..17ff9ee4d630494a904df0f199d0f06c9e907346 100644
--- a/src/lib/elements/positionings/PositionPoint.ts
+++ b/src/lib/elements/positionings/PositionPoint.ts
@@ -29,10 +29,10 @@ export class PositionPoint extends BaseElementContainer<Models.PositionPoint> {
/**
* Members
*/
+ private _selftestItems: ImageObject[];
protected _circle: PIXI.Circle;
protected _lineColor: number;
protected _fillColor: number;
- private _selftestItems: Line[]; // TODO implement this -> add in added
/**
* Interactions
@@ -85,6 +85,7 @@ export class PositionPoint extends BaseElementContainer<Models.PositionPoint> {
// Setup
this.zIndex = 200;
+ this._selftestItems = [];
this._circle = new PIXI.Circle(0, 0, this._radius);
this._lineColor = this.model.isSelftest ? this._lineColorSelftest : this._lineColorNormal;
this._fillColor = this.model.isSelftest ? this._lineColorSelftest : this._fillColorNormal;
@@ -283,8 +284,7 @@ export class PositionPoint extends BaseElementContainer<Models.PositionPoint> {
} else {
const items = this.selftestItems;
this.selftestItems = []; // Remove existing items
- items.forEach((model: Models.ImageObject) => {
- const element = this.getImage().getChildByName(model.id || "new") as ImageObject;
+ items.forEach((element: ImageObject) => {
element.modeInteraction.changeMode("blocked", this);
});
this._configurationElement.removeChild(this._selftestChooseButton);
@@ -321,6 +321,12 @@ export class PositionPoint extends BaseElementContainer<Models.PositionPoint> {
* @private
*/
protected _stageReady(): void {
+ if (this.model.selftestItems) {
+ this._selftestItems = this.model.selftestItems.map((item: Models.ImageObject) => {
+ return this.getImage().getChildByName(item.id || 'new') as ImageObject;
+ });
+ }
+
this.draw();
this.emit("stage-ready");
}
@@ -581,8 +587,7 @@ export class PositionPoint extends BaseElementContainer<Models.PositionPoint> {
protected _onSelftest(): void {
this.getImage().itemSelftest(new PIXI.interaction.InteractionEvent(), this);
- this.selftestItems.forEach((model: Models.ImageObject) => {
- const element = this.getImage().getChildByName(model.id || "new") as ImageObject;
+ this.selftestItems.forEach((element: ImageObject) => {
element.showSelftest();
});
}
@@ -595,8 +600,7 @@ export class PositionPoint extends BaseElementContainer<Models.PositionPoint> {
this._circle.radius = this._radiusSelected;
this.draw();
- this.selftestItems.forEach((model: Models.ImageObject) => {
- const element = this.getImage().getChildByName(model.id || "new") as ImageObject;
+ this.selftestItems.forEach((element: ImageObject) => {
element.hideSelftest();
});
}
@@ -790,12 +794,12 @@ export class PositionPoint extends BaseElementContainer<Models.PositionPoint> {
this.model.isSelftest = value;
}
- public get selftestItems(): Models.ImageObject[] {
- return this.model.selftestItems || [];
+ public get selftestItems(): ImageObject[] {
+ return this._selftestItems || [];
}
- public set selftestItems(value: Models.ImageObject[]) {
- this.model.selftestItems = value;
+ public set selftestItems(value: ImageObject[]) {
+ this._selftestItems = value;
}
//</editor-fold>
}
\ No newline at end of file
diff --git a/src/lib/elements/primitives/ArrowPrimitive.ts b/src/lib/elements/primitives/ArrowPrimitive.ts
index ac69ba3dc0b0ae070acae077e85a79547c8d3c33..4c4cc0083b92eb0d6f2cabd65c7d6fdcaec6bba1 100644
--- a/src/lib/elements/primitives/ArrowPrimitive.ts
+++ b/src/lib/elements/primitives/ArrowPrimitive.ts
@@ -497,13 +497,13 @@ export class ArrowPrimitive extends BaseElementContainer<Models.ArrowPrimitive>
}
protected _modeBlocked(parent: PositionPoint, element: ImageObject): void {
- if (element instanceof PositionPoint && element.selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ if (element instanceof PositionPoint && element.selftestItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
- } else if (element instanceof FillCollection && element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if (element instanceof FillCollection && element.interactiveItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
- } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
} else {
@@ -566,7 +566,7 @@ export class ArrowPrimitive extends BaseElementContainer<Models.ArrowPrimitive>
protected _modeSelftestChoosing(parent: ImageObject, element: PositionPoint): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.selftestItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.selftestItems.some((item: ImageObject) => item === this);
this._fillColor = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
@@ -588,7 +588,7 @@ export class ArrowPrimitive extends BaseElementContainer<Models.ArrowPrimitive>
protected _modeInteractiveChoosing(parent: ImageObject, element: FillCollection): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.interactiveItems.some((item: ImageObject) => item === this);
this._fillColor = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
diff --git a/src/lib/elements/primitives/EllipsePrimitive.ts b/src/lib/elements/primitives/EllipsePrimitive.ts
index 5a500e936cbc30a559aeb6aca8c160b2d600c67c..b6cd9483d254723c1da5f533cbac906a4ba85a9d 100644
--- a/src/lib/elements/primitives/EllipsePrimitive.ts
+++ b/src/lib/elements/primitives/EllipsePrimitive.ts
@@ -478,13 +478,13 @@ export class EllipsePrimitive extends BaseElementContainer<Models.EllipsePrimiti
}
protected _modeBlocked(parent: PositionPoint, element: ImageObject): void {
- if (element instanceof PositionPoint && element.selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ if (element instanceof PositionPoint && element.selftestItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
- } else if (element instanceof FillCollection && element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if (element instanceof FillCollection && element.interactiveItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
- } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
} else {
@@ -547,7 +547,7 @@ export class EllipsePrimitive extends BaseElementContainer<Models.EllipsePrimiti
protected _modeSelftestChoosing(parent: ImageObject, element: PositionPoint): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.selftestItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.selftestItems.some((item: ImageObject) => item === this);
this._fillColor = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
@@ -569,7 +569,7 @@ export class EllipsePrimitive extends BaseElementContainer<Models.EllipsePrimiti
protected _modeInteractiveChoosing(parent: ImageObject, element: FillCollection): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.interactiveItems.some((item: ImageObject) => item === this);
this._fillColor = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
diff --git a/src/lib/elements/primitives/LegendTextPrimitive.ts b/src/lib/elements/primitives/LegendTextPrimitive.ts
index a68da0f16ad8e0b86a6b042f42e3065844f186cb..1466d8fea2eddf5c44114a0b93d66e3758d397da 100644
--- a/src/lib/elements/primitives/LegendTextPrimitive.ts
+++ b/src/lib/elements/primitives/LegendTextPrimitive.ts
@@ -417,13 +417,13 @@ export class LegendTextPrimitive extends BaseElementContainer<Models.LegendItem>
}
protected _modeBlocked(parent: LegendColumnCollection, element: ImageObject): void {
- if (element instanceof PositionPoint && element.selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ if (element instanceof PositionPoint && element.selftestItems.some((item: ImageObject) => item === this)) {
this._style.fill = this._fillColorSelftestSelected;
this.draw();
- } else if (element instanceof FillCollection && element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if (element instanceof FillCollection && element.interactiveItems.some((item: ImageObject) => item === this)) {
this._style.fill = this._fillColorSelftestSelected;
this.draw();
- } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((item: ImageObject) => item === this)) {
this._style.fill = this._fillColorSelftestSelected;
this.draw();
} else {
@@ -486,7 +486,7 @@ export class LegendTextPrimitive extends BaseElementContainer<Models.LegendItem>
protected _modeSelftestChoosing(parent: ImageObject, element: PositionPoint): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.selftestItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.selftestItems.some((item: ImageObject) => item === this);
this._style.fill = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
@@ -508,7 +508,7 @@ export class LegendTextPrimitive extends BaseElementContainer<Models.LegendItem>
protected _modeInteractiveChoosing(parent: ImageObject, element: FillCollection): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.interactiveItems.some((item: ImageObject) => item === this);
this._style.fill = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
diff --git a/src/lib/elements/primitives/RectanglePrimitive.ts b/src/lib/elements/primitives/RectanglePrimitive.ts
index c97ceb6a023ac8a73ad3c7ab0bfa8da217041d92..bef1e0d245a2d8650ca739b81093ef97621da6b0 100644
--- a/src/lib/elements/primitives/RectanglePrimitive.ts
+++ b/src/lib/elements/primitives/RectanglePrimitive.ts
@@ -479,13 +479,13 @@ export class RectanglePrimitive extends BaseElementContainer<Models.RectanglePri
}
protected _modeBlocked(parent: PositionPoint, element: ImageObject): void {
- if (element instanceof PositionPoint && element.selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ if (element instanceof PositionPoint && element.selftestItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
- } else if (element instanceof FillCollection && element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if (element instanceof FillCollection && element.interactiveItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
- } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((item: ImageObject) => item === this)) {
this._fillColor = this._fillColorSelftestSelected;
this.draw();
} else {
@@ -548,7 +548,7 @@ export class RectanglePrimitive extends BaseElementContainer<Models.RectanglePri
protected _modeSelftestChoosing(parent: ImageObject, element: PositionPoint): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.selftestItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.selftestItems.some((item: ImageObject) => item === this);
this._fillColor = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
@@ -570,7 +570,7 @@ export class RectanglePrimitive extends BaseElementContainer<Models.RectanglePri
protected _modeInteractiveChoosing(parent: ImageObject, element: FillCollection): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.interactiveItems.some((item: ImageObject) => item === this);
this._fillColor = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
diff --git a/src/lib/elements/primitives/TextPrimitive.ts b/src/lib/elements/primitives/TextPrimitive.ts
index 73388a9d94d14c7b8b9a724a01a165c5c6423f0c..ce98a7652f4f760f49337500cf03ba3eb0118bb9 100644
--- a/src/lib/elements/primitives/TextPrimitive.ts
+++ b/src/lib/elements/primitives/TextPrimitive.ts
@@ -551,13 +551,13 @@ export class TextPrimitive extends BaseElementContainer<Models.TextPrimitive> {
}
protected _modeBlocked(parent: PositionPoint, element: ImageObject): void {
- if (element instanceof PositionPoint && element.selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ if (element instanceof PositionPoint && element.selftestItems.some((item: ImageObject) => item === this)) {
this._style.fill = this._fillColorSelftestSelected;
this.draw();
- } else if (element instanceof FillCollection && element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if (element instanceof FillCollection && element.interactiveItems.some((item: ImageObject) => item === this)) {
this._style.fill = this._fillColorSelftestSelected;
this.draw();
- } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((model: Models.ImageObject) => model.id === this.name)) {
+ } else if ((element instanceof ArrowPrimitive || element instanceof EllipsePrimitive || element instanceof LegendTextPrimitive || element instanceof RectanglePrimitive || element instanceof TextPrimitive) && (element.parent instanceof PositionPoint) && (element.parent as PositionPoint).selftestItems.some((item: ImageObject) => item === this)) {
this._style.fill = this._fillColorSelftestSelected;
this.draw();
} else {
@@ -620,7 +620,7 @@ export class TextPrimitive extends BaseElementContainer<Models.TextPrimitive> {
protected _modeSelftestChoosing(parent: ImageObject, element: PositionPoint): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.selftestItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.selftestItems.some((item: ImageObject) => item === this);
this._style.fill = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
@@ -642,7 +642,7 @@ export class TextPrimitive extends BaseElementContainer<Models.TextPrimitive> {
protected _modeInteractiveChoosing(parent: ImageObject, element: FillCollection): void {
this.removeAllListeners("pointerup"); // TODO dirty fix for adding lines
- const containsElement = element.interactiveItems.some((model: Models.ImageObject) => model.id === this.name);
+ const containsElement = element.interactiveItems.some((item: ImageObject) => item === this);
this._style.fill = containsElement ? this._fillColorSelftestSelected : this._fillColorSelftestUnselected;
this.draw();
diff --git a/src/lib/generators/InteractiveGenerator.ts b/src/lib/generators/InteractiveGenerator.ts
index ee0e85ca79fdf3de992a26ac7178b6777e0cd6ca..98026883dff586aebdd1540dadf497f663b39334 100644
--- a/src/lib/generators/InteractiveGenerator.ts
+++ b/src/lib/generators/InteractiveGenerator.ts
@@ -53,11 +53,19 @@ export class InteractiveGenerator extends BaseGenerator {
protected _chooseElement(event: PIXI.interaction.InteractionEvent, element: BaseElementContainer<Models.ImageObject>): void {
event.stopPropagation();
- const index = this._targetFill.interactiveItems.findIndex((model: Models.ImageObject) => model.id === element.name);
+ const index = this._targetFill.interactiveItems.findIndex((item: ImageObject) => item === element);
if (index > -1) {
+ if (!this._targetFill.model.interactiveItems) {
+ return;
+ }
+ this._targetFill.model.interactiveItems.splice(index, 1);
this._targetFill.interactiveItems.splice(index, 1);
} else {
- this._targetFill.interactiveItems.push(element.model);
+ if (!this._targetFill.model.interactiveItems) {
+ this._targetFill.model.interactiveItems = [];
+ }
+ this._targetFill.model.interactiveItems.push(element.model);
+ this._targetFill.interactiveItems.push(element);
}
element.modeInteraction.changeMode("interactive_choosing", this._targetFill);
diff --git a/src/lib/generators/SelftestGenerator.ts b/src/lib/generators/SelftestGenerator.ts
index 001de5e97ceb4fdef7236994bfe46ceb116649c2..7be9445dc4c39e6308703d106b977c27ba94c1c2 100644
--- a/src/lib/generators/SelftestGenerator.ts
+++ b/src/lib/generators/SelftestGenerator.ts
@@ -49,11 +49,19 @@ export class SelftestGenerator extends BaseGenerator {
protected _chooseElement(event: PIXI.interaction.InteractionEvent, element: BaseElementContainer<Models.ImageObject>): void {
event.stopPropagation();
- const index = this.targetPositionPoint.selftestItems.findIndex((model: Models.ImageObject) => model.id === element.name);
+ const index = this.targetPositionPoint.selftestItems.findIndex((item: ImageObject) => item === element);
if (index > -1) {
+ if (!this.targetPositionPoint.model.selftestItems) {
+ return;
+ }
+ this.targetPositionPoint.model.selftestItems.splice(index, 1);
this.targetPositionPoint.selftestItems.splice(index, 1);
} else {
- this.targetPositionPoint.selftestItems.push(element.model);
+ if (!this.targetPositionPoint.model.selftestItems) {
+ this.targetPositionPoint.model.selftestItems = [];
+ }
+ this.targetPositionPoint.model.selftestItems.push(element.model);
+ this.targetPositionPoint.selftestItems.push(element);
}
element.modeInteraction.changeMode("selftest_choosing", this.targetPositionPoint);