medsurf-draw
Version:
Draw annotations on jpg/zoomify images, based on PIXI.js
894 lines • 45.4 kB
JavaScript
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null)
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
import * as PIXI from "pixi.js-legacy";
import * as MedsurfDraw from "../../public-api";
import * as Models from '@ascii-dev-user/medsurf-lib/models';
import { v4 as uuidv4 } from 'uuid';
import { Design } from "../../config/design";
import { BaseElementContainer } from "../../bases/elements/BaseElementContainer";
import { debounce } from "debounce";
var PositionPoint = (function (_super) {
__extends(PositionPoint, _super);
function PositionPoint(image, model) {
var _this = _super.call(this, { image: image, model: model }) || this;
_this.zIndex = Design.positionPoint.zIndexDefault + _this.model.zIndex || 0;
_this.modeInteraction.on("default", _this._modeDefault, _this);
_this.modeInteraction.on("remove-default", _this._removeModeDefault, _this);
_this.modeInteraction.on("marker", _this._modeMarker, _this);
_this.modeInteraction.on("remove-marker", _this._removeModeMarker, _this);
_this.modeInteraction.on("selftest", _this._modeSelftest, _this);
_this.modeInteraction.on("remove-selftest", _this._removeModeSelftest, _this);
_this.modeInteraction.on("author", _this._modeAuthor, _this);
_this.modeInteraction.on("remove-author", _this._removeModeAuthor, _this);
_this.modeInteraction.on('select_layer_group', _this._modeSelectLayerGroup, _this);
_this.modeInteraction.on('remove-select_layer_group', _this._removeModeSelectLayerGroup, _this);
_this.modeInteraction.on('select_grouping', _this._modeSelectGrouping, _this);
_this.modeInteraction.on('remove-select_grouping', _this._removeModeSelectGrouping, _this);
_this.modeInteraction.on('select_item', _this._modeSelectItem, _this);
_this.modeInteraction.on("remove-select_item", _this._removeModeSelectItem, _this);
_this.modeInteraction.on('select_child', _this._modeSelectChild, _this);
_this.modeInteraction.on("remove-select_child", _this._removeModeSelectChild, _this);
_this.modeInteraction.on('blocked_item', _this._modeBlockedItem, _this);
_this.modeInteraction.on("remove-blocked_item", _this._removeModeBlockedItem, _this);
_this.modeInteraction.on('select_line', _this._modeSelectLine, _this);
_this.modeInteraction.on("remove-select_line", _this._removeModeSelectLine, _this);
_this.modeInteraction.on('draw_item', _this._modeDrawItem, _this);
_this.modeInteraction.on("remove-draw_item", _this._removeModeDrawItem, _this);
_this.modeInteraction.on('draw_item_new', _this._modeDrawItem, _this);
_this.modeInteraction.on("remove-draw_item_new", _this._removeModeDrawItem, _this);
_this.modeInteraction.on('draw_select', _this._modeDrawSelect, _this);
_this.modeInteraction.on('remove-draw_select', _this._removeModeDrawSelect, _this);
_this.modeInteraction.on('draw_select_new', _this._modeDrawSelect, _this);
_this.modeInteraction.on('remove-draw_select_new', _this._removeModeDrawSelect, _this);
_this.modeInteraction.on('draw_clickable', _this._modeDrawSelect, _this);
_this.modeInteraction.on('remove-draw_clickable', _this._removeModeDrawSelect, _this);
_this.modeInteraction.on('choose_item', _this._modeChooseItem, _this);
_this.modeInteraction.on("remove-choose_item", _this._removeModeChooseItem, _this);
_this.modeInteraction.on('choose_select', _this._modeChooseSelect, _this);
_this.modeInteraction.on('remove-choose_select', _this._removeModeChooseSelect, _this);
_this.modeInteraction.on('choose_unselect', _this._modeChooseUnselect, _this);
_this.modeInteraction.on('remove-choose_unselect', _this._removeModeChooseUnselect, _this);
_this.modeInteraction.on('clone_item', _this._modeCloneItem, _this);
_this.modeInteraction.on("remove-clone_item", _this._removeModeCloneItem, _this);
_this.modeInteraction.on('clone_item_new', _this._modeCloneItem, _this);
_this.modeInteraction.on("remove-clone_item_new", _this._removeModeCloneItem, _this);
_this.modeInteraction.on("delete", _this._modeDelete, _this);
_this.modeInteraction.on("delete_multiple", _this._modeDelete, _this);
_this.modeInteraction.on('delete_draw', _this._modeDelete, _this);
_this.modeInteraction.on('delete_clone', _this._modeDelete, _this);
_this.moveInteraction = new MedsurfDraw.MoveInteraction(_this);
_this.moveInteraction.on("startMove", _this.startMove, _this);
_this.moveInteraction.on("onMove", _this.onMove, _this);
_this.moveInteraction.on("endMove", _this.endMove, _this);
_this.moveInteraction.on("onRelease", _this.onRelease, _this);
_this.selectInteraction = new MedsurfDraw.SelectInteraction(_this);
_this.selectInteraction.on("onHover", _this.onHover, _this);
_this.selectInteraction.on("onOut", _this.onOut, _this);
_this.selectInteraction.on("onSelectStart", _this.onSelectStart, _this);
_this.selectInteraction.on("onSelftest", _this.onSelftest, _this);
_this.chooseInteraction = new MedsurfDraw.ChooseInteraction(_this, MedsurfDraw.ChooseTypes.Collections);
_this._debounceControlSelectItemMethod = debounce(_this.controlSelectItem.bind(_this), 10).bind(_this);
_this._debounceControlUnselectItemMethod = debounce(_this.controlUnselectItem.bind(_this), 10).bind(_this);
_this._debounceDeleteItemMethod = debounce(_this._deleteItem.bind(_this), 10).bind(_this);
_this.on("added", function () {
_this.on("debounceControlSelectItem", _this._debounceControlSelectItemMethod);
_this.on("debounceControlUnselectItem", _this._debounceControlUnselectItemMethod);
_this.on("debounceDeleteItem", _this._debounceDeleteItemMethod);
});
_this.on("removed", function () {
_this.off("debounceControlSelectItem", _this._debounceControlSelectItemMethod);
_this.off("debounceControlUnselectItem", _this._debounceControlUnselectItemMethod);
_this.off("debounceDeleteItem", _this._debounceDeleteItemMethod);
});
return _this;
}
PositionPoint.prototype.init = function () {
var imageWidth = this.imageDimensions.width;
this.position.set(this.model.position.x * imageWidth, this.model.position.y * imageWidth);
this._positionPointElement = new MedsurfDraw.Circle({
circle: new PIXI.Circle(0, 0, Design.positionPoint.radius),
options: { hasLine: true, lineColor: Design.positionPoint.lineColorNormal, lineAlpha: Design.positionPoint.lineAlpha, hasFill: true, fillColor: Design.positionPoint.fillColorNormal, fillAlpha: Design.positionPoint.fillAlpha },
lineWidth: Design.positionPoint.lineWidth
});
this.addChild(this._positionPointElement);
this._lineElement = new MedsurfDraw.Rectangle({
rectangle: new PIXI.Rectangle(-1 * Design.positionPoint.lineRectangleWidth / 2, -1 * Design.positionPoint.lineRectangleHeight / 2, Design.positionPoint.lineRectangleWidth, Design.positionPoint.lineRectangleHeight),
options: { hasLine: true, lineColor: 0xffffff, lineAlpha: 1, hasFill: true, fillColor: 0xffffff, fillAlpha: 0.8 },
lineWidth: Design.positionPoint.lineWidth
});
this._lineElement.zIndex = Design.positionPoint.lineRectangleZIndex;
this._lineElement.hideItem();
this.addChild(this._lineElement);
this._editButtonElement = new MedsurfDraw.RoundButtonElement({
image: this.image,
text: '\uf3f0',
description: 'Bearbeiten',
descriptionFontSize: Design.subMenu.descriptionFontSize,
circle: new PIXI.Circle(0, 0, Design.subMenu.buttonRadius),
fontSize: Design.subMenu.fontSize,
fontColor: Design.subMenu.fontColor
});
this._editButtonElement.on("onHover", this.collapseAllMenus, this);
this._editButtonElement.on("button", this.onButtonEdit, this);
this.imageObjectMenu.push({
element: this._editButtonElement,
order: 0,
});
this._moveToBackButtonElement = new MedsurfDraw.RoundButtonElement({
image: this.image,
text: '\uf87f',
description: 'Nach Hinten\nverschieben',
descriptionFontSize: Design.subMenu.descriptionFontSize,
circle: new PIXI.Circle(0, 0, Design.subMenu.buttonRadius),
fontSize: Design.subMenu.fontSize,
fontColor: Design.subMenu.fontColor
});
this._moveToBackButtonElement.on("button", this.onButtonMoveToBack, this);
this._moveToFrontButtonElement = new MedsurfDraw.RoundSubMenuElement({
image: this.image,
text: '\uf856',
description: 'Nach Vorne\nverschieben',
descriptionFontSize: Design.subMenu.descriptionFontSize,
menuElements: [
{
element: this._moveToBackButtonElement,
order: 0,
}
],
circle: new PIXI.Circle(0, 0, Design.subMenu.buttonRadius)
});
this._moveToFrontButtonElement.on("onHover", this._moveToFrontButtonElement.showMenu, this._moveToFrontButtonElement);
this._moveToFrontButtonElement.on("button", this.onButtonMoveToFront, this);
this.imageObjectMenu.push({
element: this._moveToFrontButtonElement,
order: 7,
});
this._deleteButtonElement = new MedsurfDraw.RoundButtonElement({
image: this.image,
text: '\uf1f8',
description: 'Löschen',
descriptionFontSize: Design.subMenu.descriptionFontSize,
circle: new PIXI.Circle(0, 0, Design.subMenu.buttonRadius),
fontSize: Design.subMenu.fontSize,
fontColor: Design.subMenu.fontColor
});
this._deleteButtonElement.on("onHover", this.collapseAllMenus, this);
this._deleteButtonElement.on("button", this.onButtonDelete, this);
this.imageObjectMenu.push({
element: this._deleteButtonElement,
order: 6,
});
this._degroupButtonElement = new MedsurfDraw.RoundButtonElement({
image: this.image,
text: '\uf248',
description: 'Aus Gruppe\nentfernen',
descriptionFontSize: Design.subMenu.descriptionFontSize,
circle: new PIXI.Circle(0, 0, Design.subMenu.buttonRadius),
fontSize: Design.subMenu.fontSize,
fontColor: Design.subMenu.fontColor
});
this._degroupButtonElement.on("onHover", this.collapseAllMenus, this);
this._degroupButtonElement.on("button", this.onButtonDegroup, this);
this.imageObjectMenu.push({
element: this._degroupButtonElement,
order: 4,
});
this._duplicateButtonElement = new MedsurfDraw.RoundButtonElement({
image: this.image,
text: '\uf24d',
description: 'Duplizieren',
descriptionFontSize: Design.subMenu.descriptionFontSize,
circle: new PIXI.Circle(0, 0, Design.subMenu.buttonRadius),
fontSize: Design.subMenu.fontSize,
fontColor: Design.subMenu.fontColor
});
this._duplicateButtonElement.on("onHover", this.collapseAllMenus, this);
this._duplicateButtonElement.on("button", this.onButtonDuplicate, this);
this.imageObjectMenu.push({
element: this._duplicateButtonElement,
order: 2,
});
this._clipboardButtonElement = new MedsurfDraw.RoundButtonElement({
image: this.image,
text: '\uf0c5',
description: 'Kopieren',
descriptionFontSize: Design.subMenu.descriptionFontSize,
circle: new PIXI.Circle(0, 0, Design.subMenu.buttonRadius),
fontSize: Design.subMenu.fontSize,
fontColor: Design.subMenu.fontColor
});
this._clipboardButtonElement.on("onHover", this.collapseAllMenus, this);
this._clipboardButtonElement.on("button", this.onButtonClipboard, this);
this.imageObjectMenu.push({
element: this._clipboardButtonElement,
order: 1,
});
this.sortChildren();
this.emit("debounceDraw");
};
PositionPoint.prototype.draw = function () {
var scale = this.imageScale.x * Design.positionPoint.scaleAspect;
var lineWidth = Math.floor(Design.positionPoint.lineWidth || 1 / scale);
if (lineWidth < 1) {
lineWidth = 1;
}
if (this._positionPointElement.visible) {
var radius = Design.positionPoint.radius;
radius = Math.floor(radius / scale);
this._positionPointElement.circle.radius = radius;
this._positionPointElement.lineWidth = lineWidth;
this._positionPointElement.draw();
}
if (this._lineElement.visible) {
var width = Design.positionPoint.lineRectangleWidth;
width = Math.floor(width / scale);
var height = Design.positionPoint.lineRectangleHeight;
height = Math.floor(height / scale);
this._lineElement.rectangle = new PIXI.Rectangle(-1 * width / 2, -1 * height / 2, width, height);
this._lineElement.lineWidth = lineWidth;
this._lineElement.draw();
}
};
PositionPoint.prototype.destroy = function (options) {
if (this.moveInteraction) {
this.moveInteraction.removeAllListeners();
}
if (this.selectInteraction) {
this.selectInteraction.removeAllListeners();
}
if (this.chooseInteraction) {
this.chooseInteraction.removeAllListeners();
}
if (this._positionPointElement) {
this._positionPointElement.destroy(options);
}
if (this._lineElement) {
this._lineElement.destroy(options);
}
if (this._editButtonElement) {
this._editButtonElement.destroy(options);
}
if (this._moveToBackButtonElement) {
this._moveToBackButtonElement.destroy(options);
}
if (this._moveToFrontButtonElement) {
this._moveToFrontButtonElement.destroy(options);
}
if (this._deleteButtonElement) {
this._deleteButtonElement.destroy(options);
}
if (this._degroupButtonElement) {
this._degroupButtonElement.destroy(options);
}
if (this._duplicateButtonElement) {
this._duplicateButtonElement.destroy(options);
}
if (this._clipboardButtonElement) {
this._clipboardButtonElement.destroy(options);
}
_super.prototype.destroy.call(this, options);
};
PositionPoint.getInstance = function (image) {
return new PositionPoint(image, {
dirty: true,
id: uuidv4(),
type: Models.ImageObjectType.POSITIONPOINT,
isStatic: false,
zIndex: 0,
position: {
x: 0,
y: 0,
},
isSelftest: false
});
};
PositionPoint.prototype.getLines = function () {
return this.image.getLinesByPositionPoint(this);
};
PositionPoint.prototype._modeDefault = function () {
this.hideItem();
};
PositionPoint.prototype._removeModeDefault = function () {
};
PositionPoint.prototype._modeMarker = function () {
if (this.model.primitives && this.model.primitives.length > 0) {
this._positionPointElement.alpha = 0;
this.showItem();
}
else {
this.hideItem();
}
};
PositionPoint.prototype._removeModeMarker = function () {
this._positionPointElement.alpha = 1;
};
PositionPoint.prototype._modeSelftest = function () {
if (this.model.isSelftest) {
this.interactive = true;
this.cursor = "select";
this._positionPointElement.alpha = 0;
this.showItem();
}
else {
this.hideItem();
}
};
PositionPoint.prototype._removeModeSelftest = function () {
this.interactive = false;
this._positionPointElement.alpha = 1;
this.off("pointerover", this.selectInteraction.onHover, this.selectInteraction);
this.off("pointerout", this.selectInteraction.onOut, this.selectInteraction);
this.off("mousedown", this.selectInteraction.onPointerDown, this.selectInteraction);
this.off("mouseup", this.selectInteraction.onSelftest, this.selectInteraction);
};
PositionPoint.prototype._modeAuthor = function () {
this.interactive = true;
this.on("pointerover", this.selectInteraction.onHover, this.selectInteraction);
this.on("pointerout", this.selectInteraction.onOut, this.selectInteraction);
this.on("mousedown", this.selectInteraction.onPointerDown, this.selectInteraction);
this.on("mouseup", this.selectInteraction.onSelect, this.selectInteraction);
if (this.model.primitives && this.model.primitives.length > 0) {
this._positionPointElement.alpha = 0;
}
this.showItem();
};
PositionPoint.prototype._removeModeAuthor = function () {
this.interactive = false;
this._positionPointElement.options.lineColor = Design.positionPoint.lineColorNormal;
this._positionPointElement.options.fillColor = Design.positionPoint.fillColorNormal;
this.off("pointerover", this.selectInteraction.onHover, this.selectInteraction);
this.off("pointerout", this.selectInteraction.onOut, this.selectInteraction);
this.off("mousedown", this.selectInteraction.onPointerDown, this.selectInteraction);
this.off("mouseup", this.selectInteraction.onSelect, this.selectInteraction);
};
PositionPoint.prototype._modeSelectLayerGroup = function () {
this.onOut();
this.interactive = true;
this.on("pointerover", this.selectInteraction.onHover, this.selectInteraction);
this.on("pointerout", this.selectInteraction.onOut, this.selectInteraction);
this.on("mousedown", this.selectInteraction.onPointerDown, this.selectInteraction);
this.on("mouseup", this.selectInteraction.onSelect, this.selectInteraction);
this.image.controlUpdateElements();
this.showItem();
};
PositionPoint.prototype._removeModeSelectLayerGroup = function (parent, mode) {
this.interactive = false;
this.off("pointerover", this.selectInteraction.onHover, this.selectInteraction);
this.off("pointerout", this.selectInteraction.onOut, this.selectInteraction);
this.off("mousedown", this.selectInteraction.onPointerDown, this.selectInteraction);
this.off("mouseup", this.selectInteraction.onSelect, this.selectInteraction);
};
PositionPoint.prototype._modeSelectGrouping = function () {
this.interactive = true;
this.on("pointerover", this.selectInteraction.onHover, this.selectInteraction);
this.on("pointerout", this.selectInteraction.onOut, this.selectInteraction);
this.on("mousedown", this.selectInteraction.onPointerDown, this.selectInteraction);
this.on("mouseup", this.selectInteraction.onSelect, this.selectInteraction);
this.image.controlUpdateElements();
this.showItem();
};
PositionPoint.prototype._removeModeSelectGrouping = function (parent, mode) {
this.interactive = false;
this._positionPointElement.options.lineColor = Design.positionPoint.lineColorNormal;
this._positionPointElement.options.fillColor = Design.positionPoint.fillColorNormal;
this.off("pointerover", this.selectInteraction.onHover, this.selectInteraction);
this.off("pointerout", this.selectInteraction.onOut, this.selectInteraction);
this.off("mousedown", this.selectInteraction.onPointerDown, this.selectInteraction);
this.off("mouseup", this.selectInteraction.onSelect, this.selectInteraction);
};
PositionPoint.prototype._modeSelectItem = function () {
this.onOut();
this.interactive = true;
this.on("pointerover", this.moveInteraction.onMoveHover, this.moveInteraction);
this.on("mousedown", this.moveInteraction.startMove, this.moveInteraction);
this.on("pointermove", this.moveInteraction.onMove, this.moveInteraction);
this.on("mouseup", this.moveInteraction.endMove, this.moveInteraction);
MedsurfDraw.Keyboard.events.on("down_ArrowUp", "onPositionPointMoveUp", this.moveInteraction.moveUp.bind(this.moveInteraction));
MedsurfDraw.Keyboard.events.on("down_ArrowRight", "onPositionPointMoveRight", this.moveInteraction.moveRight.bind(this.moveInteraction));
MedsurfDraw.Keyboard.events.on("down_ArrowDown", "onPositionPointMoveDown", this.moveInteraction.moveDown.bind(this.moveInteraction));
MedsurfDraw.Keyboard.events.on("down_ArrowLeft", "onPositionPointMoveLeft", this.moveInteraction.moveLeft.bind(this.moveInteraction));
MedsurfDraw.Keyboard.events.on("released_ArrowUp", "onPositionPointMoveUpEnd", this.moveInteraction.moveRelease.bind(this.moveInteraction));
MedsurfDraw.Keyboard.events.on("released_ArrowRight", "onPositionPointMoveRightEnd", this.moveInteraction.moveRelease.bind(this.moveInteraction));
MedsurfDraw.Keyboard.events.on("released_ArrowDown", "onPositionPointMoveDownEnd", this.moveInteraction.moveRelease.bind(this.moveInteraction));
MedsurfDraw.Keyboard.events.on("released_ArrowLeft", "onPositionPointMoveLeftEnd", this.moveInteraction.moveRelease.bind(this.moveInteraction));
this.image.controlUpdateElements();
this.showItem();
this.emit("pointerover", new PIXI.InteractionEvent());
};
PositionPoint.prototype._removeModeSelectItem = function (parent, mode) {
this.interactive = false;
this.off("pointerover", this.moveInteraction.onMoveHover, this.moveInteraction);
this.off("mousedown", this.moveInteraction.startMove, this.moveInteraction);
this.off("pointermove", this.moveInteraction.onMove, this.moveInteraction);
this.off("mouseup", this.moveInteraction.endMove, this.moveInteraction);
MedsurfDraw.Keyboard.events.remove("down_ArrowUp", "onPositionPointMoveUp");
MedsurfDraw.Keyboard.events.remove("down_ArrowRight", "onPositionPointMoveRight");
MedsurfDraw.Keyboard.events.remove("down_ArrowDown", "onPositionPointMoveDown");
MedsurfDraw.Keyboard.events.remove("down_ArrowLeft", "onPositionPointMoveLeft");
MedsurfDraw.Keyboard.events.remove("released_ArrowUp", "onPositionPointMoveUpEnd");
MedsurfDraw.Keyboard.events.remove("released_ArrowRight", "onPositionPointMoveRightEnd");
MedsurfDraw.Keyboard.events.remove("released_ArrowDown", "onPositionPointMoveDownEnd");
MedsurfDraw.Keyboard.events.remove("released_ArrowLeft", "onPositionPointMoveLeftEnd");
this.collapseAllMenus(new PIXI.InteractionEvent());
if (mode === 'author') {
this.emit("debounceControlUnselectItem", this.image);
}
};
PositionPoint.prototype._modeSelectChild = function () {
};
PositionPoint.prototype._removeModeSelectChild = function () {
};
PositionPoint.prototype._modeBlockedItem = function () {
this._positionPointElement.options.lineAlpha = Design.blocked.lineAlpha;
this._positionPointElement.options.fillAlpha = Design.blocked.fillAlpha;
this.emit("debounceDraw");
};
PositionPoint.prototype._removeModeBlockedItem = function () {
this._positionPointElement.options.lineAlpha = Design.positionPoint.lineAlpha;
this._positionPointElement.options.fillAlpha = Design.positionPoint.fillAlpha;
this.emit("debounceDraw");
};
PositionPoint.prototype._modeSelectLine = function () {
this.interactive = true;
this._positionPointElement.hideItem();
this._lineElement.showItem();
this.on("pointerover", this.moveInteraction.onMoveHover, this.moveInteraction);
this.on("mousedown", this.moveInteraction.startMove, this.moveInteraction);
this.on("pointermove", this.moveInteraction.onMove, this.moveInteraction);
this.on("mouseup", this.moveInteraction.endMove, this.moveInteraction);
this.sortChildren();
this.showItem();
};
PositionPoint.prototype._removeModeSelectLine = function () {
this.interactive = false;
this._positionPointElement.showItem();
this._lineElement.hideItem();
this.off("pointerover", this.moveInteraction.onMoveHover, this.moveInteraction);
this.off("mousedown", this.moveInteraction.startMove, this.moveInteraction);
this.off("pointermove", this.moveInteraction.onMove, this.moveInteraction);
this.off("mouseup", this.moveInteraction.endMove, this.moveInteraction);
};
PositionPoint.prototype._modeDrawItem = function () {
};
PositionPoint.prototype._removeModeDrawItem = function () {
this.moveInteraction.reset();
};
PositionPoint.prototype._modeDrawSelect = function () {
this.interactive = true;
this.cursor = "select";
this._positionPointElement.options.lineColor = Design.positionPoint.lineColorGroup;
this._positionPointElement.options.fillColor = Design.positionPoint.fillColorGroup;
this.emit("debounceDraw");
};
PositionPoint.prototype._removeModeDrawSelect = function (parent, mode) {
this.interactive = false;
this._positionPointElement.options.lineColor = Design.positionPoint.lineColorNormal;
this._positionPointElement.options.fillColor = Design.positionPoint.fillColorNormal;
if (!mode.startsWith('delete')) {
this.emit("debounceDraw");
}
};
PositionPoint.prototype._modeChooseItem = function () {
this.chooseInteraction.on("chooseElement", this.chooseElement, this);
};
PositionPoint.prototype._removeModeChooseItem = function () {
this.chooseInteraction.off("chooseElement", this.chooseElement, this);
};
PositionPoint.prototype._modeChooseSelect = function () {
this.interactive = true;
this.cursor = "select";
this._positionPointElement.options.lineColor = Design.selftest.lineColorSelect;
this._positionPointElement.options.fillColor = Design.selftest.fillColorSelect;
this.emit("debounceDraw");
};
PositionPoint.prototype._removeModeChooseSelect = function () {
this.interactive = false;
this._positionPointElement.options.lineColor = Design.positionPoint.lineColorNormal;
this._positionPointElement.options.fillColor = Design.positionPoint.fillColorNormal;
this.emit("debounceDraw");
};
PositionPoint.prototype._modeChooseUnselect = function () {
this.interactive = true;
this.cursor = "select";
this._positionPointElement.options.lineColor = Design.selftest.lineColorUnselect;
this._positionPointElement.options.fillColor = Design.selftest.fillColorUnselect;
this.emit("debounceDraw");
};
PositionPoint.prototype._removeModeChooseUnselect = function () {
this.interactive = false;
this._positionPointElement.options.lineColor = Design.positionPoint.lineColorNormal;
this._positionPointElement.options.fillColor = Design.positionPoint.fillColorNormal;
this.emit("debounceDraw");
};
PositionPoint.prototype._modeCloneItem = function () {
};
PositionPoint.prototype._removeModeCloneItem = function () {
this.moveInteraction.reset();
};
PositionPoint.prototype._modeDelete = function () {
var image = this.image;
if (image) {
if (['delete_multiple', 'delete_draw', 'delete_clone'].indexOf(this.modeInteraction.lastMode) === -1) {
this.controlUnselectItem(image);
}
image.removeChild(this);
image.deleteImageObject(this.model);
}
this.destroy();
image.controlHideMenu();
image.controlUpdateElements();
};
PositionPoint.prototype.collapseAllMenus = function (event) {
this._moveToFrontButtonElement.toggleMenu(event, false);
};
PositionPoint.prototype.onButtonEdit = function () {
this.collapseAllMenus(new PIXI.InteractionEvent());
this.image.controlHideMenu();
this.image.editImageObject(this.model);
};
PositionPoint.prototype.onButtonMoveToFront = function () {
this.model.zIndex++;
this.zIndex = Design.positionPoint.zIndexDefault + this.model.zIndex;
this.image.sortChildren();
this.image.updateImageObject(this.model);
};
PositionPoint.prototype.onButtonMoveToBack = function () {
this.model.zIndex--;
this.zIndex = Design.positionPoint.zIndexDefault + this.model.zIndex;
this.image.sortChildren();
this.image.updateImageObject(this.model);
};
PositionPoint.prototype.onButtonDelete = function (event) {
var _this = this;
this.collapseAllMenus(new PIXI.InteractionEvent());
this.image.controlHideMenu();
setTimeout(function () {
_this.modeInteraction.setMode("delete");
}, 300);
};
PositionPoint.prototype.onButtonDegroup = function (unselectElement) {
if (unselectElement === void 0) { unselectElement = true; }
this.collapseAllMenus(new PIXI.InteractionEvent());
this.image.controlHideMenu();
this.image.degroupLayerGroupImageObject(this.model);
if (unselectElement) {
this.image.unselectLayerGroup();
this.image.selectImageObject(this.model);
}
};
PositionPoint.prototype.onButtonDuplicate = function () {
this.collapseAllMenus(new PIXI.InteractionEvent());
this.image.controlHideMenu();
this.image.copyImageObject(this.model);
};
PositionPoint.prototype.onButtonClipboard = function () {
this.collapseAllMenus(new PIXI.InteractionEvent());
this.image.controlHideMenu();
this.image.clipboardImageObject(this.model);
};
PositionPoint.prototype.onButtonSetSelftest = function (override) {
this.model.isSelftest = override || !this.model.isSelftest;
if (this.model.isSelftest) {
}
else {
var imageObjects_1 = this.image.getImageObjects();
var items = this.model.selftestItems;
this.model.selftestItems = [];
if (items) {
items.forEach(function (item) {
var element = imageObjects_1.find(function (io) { return io.name === item; });
if (element) {
element.modeInteraction.setMode('blocked_item');
}
});
}
}
this.emit("debounceDraw");
this.emit("selftestChanged");
this.image.updateImageObject(this.model);
};
PositionPoint.prototype.controlSelectItem = function () {
this.image.selectImageObject(this.model);
this.externControlSelectItem();
};
PositionPoint.prototype.controlUnselectItem = function (image) {
if (!this.controlSelectLayerGroup(image)) {
image.externControlSelectImage();
image.unselectImageObject();
}
};
PositionPoint.prototype.externControlSelectItem = function () {
var _this = this;
this.image.getImageObjects()
.filter(function (imageObject) { return imageObject !== _this; })
.forEach(function (imageObject) {
if (_this.model.selftestItems && _this.model.selftestItems.indexOf(imageObject.name) > -1) {
imageObject.modeInteraction.setMode('choose_select');
}
else if (_this.model.selftestItems && imageObject instanceof MedsurfDraw.LegendCollection) {
var legendRows = imageObject.legendColumns.map(function (lc) { return lc.legendRows; })
.reduce(function (cur, acc) { return __spreadArray(__spreadArray([], cur, true), acc, true); }, [])
.map(function (lr) { return { name: lr.model.id, element: lr }; });
for (var _i = 0, legendRows_1 = legendRows; _i < legendRows_1.length; _i++) {
var legendRow = legendRows_1[_i];
if (_this.model.selftestItems.indexOf(legendRow.name) > -1) {
legendRow.element.modeInteraction.setMode('choose_select');
}
else {
legendRow.element.modeInteraction.setMode('blocked_item');
}
}
}
else {
imageObject.modeInteraction.setMode('blocked_item');
}
});
this.modeInteraction.setModeChildren('select_parent');
this.modeInteraction.setModeItem('select_item');
};
PositionPoint.prototype.controlSelectLayerGroup = function (image) {
var layerGroup = image.getLayerGroupByImageObject(this.model);
if (layerGroup) {
image.selectLayerGroup(layerGroup);
return image.externControlSelectLayerGroup(layerGroup);
}
return false;
};
PositionPoint.prototype.controlUnselectLayerGroup = function () {
this.image.unselectLayerGroup();
};
PositionPoint.prototype.controlDrawItem = function (isNew) {
var _this = this;
this.image.getImageObjects()
.filter(function (imageObject) { return imageObject !== _this && !imageObject.modeInteraction.lastMode.startsWith('draw'); })
.forEach(function (imageObject) {
imageObject.modeInteraction.setMode('blocked_item');
});
this.modeInteraction.setModeChildren('draw_parent');
this.modeInteraction.setModeItem(isNew ? 'draw_item_new' : 'draw_item');
};
PositionPoint.prototype.controlChooseItem = function () {
var _this = this;
this.image.getImageObjects()
.filter(function (imageObject) { return imageObject !== _this; })
.forEach(function (imageObject) {
if (_this.model.selftestItems && _this.model.selftestItems.indexOf(imageObject.name) > -1) {
imageObject.modeInteraction.setMode('choose_select');
}
else if (_this.model.selftestItems && imageObject instanceof MedsurfDraw.LegendCollection) {
var legendRows = imageObject.legendColumns.map(function (lc) { return lc.legendRows; })
.reduce(function (cur, acc) { return __spreadArray(__spreadArray([], cur, true), acc, true); }, [])
.map(function (lr) { return { name: lr.model.id, element: lr }; });
for (var _i = 0, legendRows_2 = legendRows; _i < legendRows_2.length; _i++) {
var legendRow = legendRows_2[_i];
if (_this.model.selftestItems.indexOf(legendRow.name) > -1) {
legendRow.element.modeInteraction.setMode('choose_select');
}
else {
legendRow.element.modeInteraction.setMode('choose_unselect');
}
}
}
else {
imageObject.modeInteraction.setMode('choose_unselect');
}
});
this.modeInteraction.setModeChildren('choose_parent');
this.modeInteraction.setModeItem('choose_item');
};
PositionPoint.prototype.controlCloneItem = function () {
var _this = this;
this.image.getImageObjects()
.filter(function (imageObject) { return imageObject !== _this && !imageObject.modeInteraction.lastMode.startsWith('clone'); })
.forEach(function (imageObject) {
imageObject.modeInteraction.setMode('blocked_item');
});
this.modeInteraction.setModeChildren('clone_parent');
this.modeInteraction.setModeItem('clone_item_new');
};
PositionPoint.prototype.startMove = function () {
};
PositionPoint.prototype.onMove = function (event, dX, dY) {
var imageWidth = this.imageDimensions.width;
this.position.x += dX;
this.position.y += dY;
this.model.position.x = this.position.x / imageWidth;
this.model.position.y = this.position.y / imageWidth;
this.emit("onPositionPointMove");
};
PositionPoint.prototype.endMove = function (event) {
this.emit("pointerover", event);
this.image.updateImageObject(this.model);
this.emit("endPositionPointMove");
};
PositionPoint.prototype.onRelease = function () {
this.modeInteraction.setMode(this.modeInteraction.defaultMode);
};
PositionPoint.prototype.onHover = function () {
this._positionPointElement.options.lineColor = Design.positionPoint.lineColorHover;
this._positionPointElement.options.fillColor = Design.positionPoint.fillColorHover;
this.emit("debounceDraw");
};
PositionPoint.prototype.onOut = function () {
this._positionPointElement.options.lineColor = Design.positionPoint.lineColorNormal;
this._positionPointElement.options.fillColor = Design.positionPoint.fillColorNormal;
this.emit("debounceDraw");
};
PositionPoint.prototype.onSelectStart = function (event, preventSelectItem) {
if (preventSelectItem === void 0) { preventSelectItem = false; }
event.stopPropagation();
var lastMode = this.modeInteraction.lastMode;
if (lastMode === 'select_layer_group') {
this.controlSelectItem();
}
else {
if (!this.controlSelectLayerGroup(this.image) && !preventSelectItem) {
this.controlSelectItem();
}
}
};
PositionPoint.prototype.onSelftest = function () {
var _this = this;
this.image.getImageObjects()
.forEach(function (imageObject) {
if (imageObject === _this
|| (_this.model.selftestItems
&& _this.model.selftestItems.indexOf(imageObject.name) > -1)) {
if (imageObject instanceof MedsurfDraw.PositionPoint) {
imageObject.children.forEach(function (child) {
if (child instanceof MedsurfDraw.BackgroundRectanglePrimitive) {
child.showItem();
child._rectangleElement.showItem();
}
else if (child instanceof MedsurfDraw.ArrowPrimitive) {
child.showItem();
child._arrowElement.showItem();
child._selftestElement.hideItem();
}
else if (child instanceof MedsurfDraw.EllipsePrimitive) {
child.showItem();
child._ellipseElement.showItem();
child._selftestElement.hideItem();
}
else if (child instanceof MedsurfDraw.RectanglePrimitive) {
child.showItem();
child._rectangleElement.showItem();
child._selftestElement.hideItem();
}
else if (child instanceof MedsurfDraw.TextPrimitive) {
child.showItem();
child._textElement.showItem();
child._selftestElement.hideItem();
}
});
}
imageObject.showItem();
}
else if (imageObject instanceof MedsurfDraw.LegendCollection && _this.model.selftestItems) {
var legendRows = imageObject.legendColumns.map(function (lc) { return lc.legendRows; })
.reduce(function (cur, acc) { return __spreadArray(__spreadArray([], cur, true), acc, true); }, [])
.map(function (lr) {
return { name: lr.model.id, element: lr };
});
for (var _i = 0, legendRows_3 = legendRows; _i < legendRows_3.length; _i++) {
var legendRow = legendRows_3[_i];
if (_this.model.selftestItems.indexOf(legendRow.name) > -1) {
legendRow.element.showItem();
}
}
}
else {
imageObject.hideItem();
}
});
var image = this.image;
image.parent.once('pointerup', this.onSelftestRelease, this);
};
PositionPoint.prototype.onSelftestRelease = function (event) {
var _this = this;
this.selectInteraction.onRelease(event);
var defaultMode = this.image.modeInteraction.defaultMode;
this.image.getImageObjects()
.filter(function (imageObject) { return imageObject !== _this; })
.forEach(function (imageObject) {
imageObject.modeInteraction.setMode(defaultMode);
});
var image = this.image;
image.moveInteraction.endMove(new PIXI.InteractionEvent());
};
PositionPoint.prototype.startDraw = function () {
this.cursor = "draw";
};
PositionPoint.prototype.startDrawScale = function () {
this.cursor = "scale-nwse";
};
PositionPoint.prototype.onDraw = function (event) {
};
PositionPoint.prototype.chooseElement = function (event, element) {
if (!this.model.selftestItems) {
this.model.selftestItems = [];
}
var index = this.model.selftestItems.findIndex(function (item) { return item === element.name; });
if (index > -1) {
this.model.selftestItems.splice(index, 1);
element.modeInteraction.setMode('choose_unselect');
}
else {
this.model.selftestItems.push(element.name);
element.modeInteraction.setMode('choose_select');
}
};
PositionPoint.prototype._deleteItem = function (image) {
if ((this.model.primitives || []).length > 0) {
return;
}
if (image.getLinesByPositionPoint(this).length > 0) {
return;
}
this.modeInteraction.setMode("delete");
};
PositionPoint.prototype.onImageZoom = function (scaleX, scaleY) {
this.emit("debounceDraw");
};
PositionPoint.prototype.getElementRectangle = function () {
var scale = this.imageScale.x * Design.positionPoint.scaleAspect;
var radius = Design.positionPoint.radius;
radius = Math.floor(radius / scale);
return new PIXI.Rectangle(this.position.x - radius, this.position.y - radius, radius * 2, radius * 2);
};
Object.defineProperty(PositionPoint.prototype, "moveInteraction", {
get: function () {
return this._moveInteraction;
},
set: function (value) {
this._moveInteraction = value;
},
enumerable: false,
configurable: true
});
Object.defineProperty(PositionPoint.prototype, "selectInteraction", {
get: function () {
return this._selectInteraction;
},
set: function (value) {
this._selectInteraction = value;
},
enumerable: false,
configurable: true
});
Object.defineProperty(PositionPoint.prototype, "chooseInteraction", {
get: function () {
return this._chooseInteraction;
},
set: function (value) {
this._chooseInteraction = value;
},
enumerable: false,
configurable: true
});
return PositionPoint;
}(BaseElementContainer));
export { PositionPoint };
//# sourceMappingURL=PositionPoint.js.map