medsurf-draw/dist/lib/elements/legends/LegendCollection.js

Draw annotations on jpg/zoomify images, based on PIXI.js

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 __());
    };
})();
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 LegendCollection = (function (_super) {
    __extends(LegendCollection, _super);
    function LegendCollection(image, model) {
        var _this = _super.call(this, { image: image, model: model }) || this;
        _this.legendColumns = [];
        _this.zIndex = Design.legendCollection.zIndexDefault + _this.model.zIndex;
        _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('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('choose_select', _this._modeBlockedItem, _this);
        _this.modeInteraction.on('remove-choose_select', _this._removeModeBlockedItem, _this);
        _this.modeInteraction.on('choose_unselect', _this._modeBlockedItem, _this);
        _this.modeInteraction.on('remove-choose_unselect', _this._removeModeBlockedItem, _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.scaleInteraction = new MedsurfDraw.ScaleInteraction(_this);
        _this.scaleInteraction.on("onScale", _this.onScale, _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._debounceControlSelectItemMethod = debounce(_this.controlSelectItem.bind(_this), 10).bind(_this);
        _this._debounceControlUnselectItemMethod = debounce(_this.controlUnselectItem.bind(_this), 10).bind(_this);
        _this.on("added", function () {
            _this.on("debounceControlSelectItem", _this._debounceControlSelectItemMethod);
            _this.on("debounceControlUnselectItem", _this._debounceControlUnselectItemMethod);
        });
        _this.on("removed", function () {
            _this.off("debounceControlSelectItem", _this._debounceControlSelectItemMethod);
            _this.off("debounceControlUnselectItem", _this._debounceControlUnselectItemMethod);
        });
        return _this;
    }
    LegendCollection.prototype.init = function () {
        var imageWidth = this.imageDimensions.width;
        var selftestPoint = this.model.selftestPoint
            ? { x: this.model.selftestPoint.x * imageWidth, y: this.model.selftestPoint.y * imageWidth }
            : { x: 0, y: 0 };
        this.position.set(this.model.rectangle.x * imageWidth, this.model.rectangle.y * imageWidth);
        this._selftestElement = new MedsurfDraw.WedgePoint({
            image: this.image,
            wedgePoint: selftestPoint
        });
        this._selftestElement.moveInteraction.on("onMove", this.onSelftestMove, this);
        this._selftestElement.moveInteraction.on("endMove", this.onSelftestEndMove, this);
        this.addChild(this._selftestElement);
        for (var col = 0; col < this.model.cols.length; col++) {
            var legendColumn = new MedsurfDraw.LegendColumn(this.image, this.model.cols[col]);
            this.addChild(legendColumn);
            this.legendColumns.push(legendColumn);
        }
        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");
    };
    LegendCollection.prototype.draw = function () {
        var imageWidth = this.imageDimensions.width;
        var colWidth = this.model.rectangle.width * imageWidth / this.model.cols.length;
        var heightArray = [];
        var index = 1;
        for (var col = 0; col < this.legendColumns.length; col++) {
            var legendColumn = this.legendColumns[col];
            for (var row = 0; row < legendColumn.legendRows.length; row++) {
                var legendRow = legendColumn.legendRows[row];
                legendRow.setPositionX(col * colWidth);
                legendRow.setWordWrapWidth(colWidth);
                legendRow.index = index;
                var height = legendRow.height;
                if (!heightArray[row]) {
                    heightArray[row] = height;
                }
                else if (height > heightArray[col]) {
                    heightArray[row] = height;
                }
                index++;
            }
        }
        for (var col = 0; col < this.legendColumns.length; col++) {
            for (var row = 0; row < this.legendColumns[col].legendRows.length; row++) {
                this.legendColumns[col].legendRows[row].setPositionY(heightArray[row - 1] || 0);
            }
        }
        this._selftestElement.draw();
        for (var _i = 0, _a = this.legendColumns; _i < _a.length; _i++) {
            var legendColumn = _a[_i];
            legendColumn.draw();
        }
        this.hitArea = this.getLocalBounds();
    };
    LegendCollection.prototype.destroy = function (options) {
        if (this.moveInteraction) {
            this.moveInteraction.removeAllListeners();
        }
        if (this.scaleInteraction) {
            this.scaleInteraction.removeAllListeners();
        }
        if (this.selectInteraction) {
            this.selectInteraction.removeAllListeners();
        }
        if (this._selftestElement) {
            this._selftestElement.moveInteraction.off("onMove", this.onSelftestMove, this);
            this._selftestElement.moveInteraction.off("endMove", this.onSelftestEndMove, this);
            this._selftestElement.destroy(options);
        }
        for (var _i = 0, _a = this.legendColumns; _i < _a.length; _i++) {
            var legendColumn = _a[_i];
            legendColumn.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);
    };
    LegendCollection.getInstance = function (image, imageWidth) {
        var legendCollectionModel = {
            id: uuidv4(),
            type: Models.ImageObjectType.LEGENDCOLLECTION,
            isStatic: false,
            zIndex: 0,
            rectangle: new PIXI.Rectangle(0 / imageWidth, 0 / imageWidth, 100 / imageWidth, 100 / imageWidth),
            cols: [],
            rowDistance: 14 / imageWidth,
            columnDistance: 14 / imageWidth,
            indexWidth: 14 / imageWidth
        };
        var legendColumnModel = {
            id: uuidv4(),
            type: Models.ImageObjectType.LEGENDCOLUMN,
            isStatic: false,
            zIndex: 0,
            table: legendCollectionModel,
            rows: []
        };
        legendCollectionModel.cols.push(legendColumnModel);
        var legendRowModel = {
            id: uuidv4(),
            type: Models.ImageObjectType.LEGENDROW,
            isStatic: false,
            zIndex: 0,
            text: 'Neue Legende',
            style: {
                fill: 0x000000,
                fontSize: 12 / imageWidth,
                fontFamily: 'proxima_nova_altsemibold',
                align: 'left',
                breakWords: false,
            },
            col: legendColumnModel
        };
        legendColumnModel.rows.push(legendRowModel);
        return new LegendCollection(image, legendCollectionModel);
    };
    LegendCollection.prototype.addLegendColumn = function () {
        var legendColumn = MedsurfDraw.LegendColumn.getInstance(this.image, this.model);
        this.addChild(legendColumn);
        legendColumn.modeInteraction.setDefaultMode("author");
        this.legendColumns.push(legendColumn);
        legendColumn.onButtonAddLegendRow();
        this.emit("debounceDraw");
        this.model.cols.push(legendColumn.model);
        this.image.updateImageObject(this.model);
        legendColumn.controlSelectItem();
    };
    LegendCollection.prototype.removeLegendColumn = function (model) {
        var legendColumnIndex = this.legendColumns.findIndex(function (lc) { return lc.model.id === model.id; });
        var legendColumn = this.legendColumns[legendColumnIndex];
        if (!legendColumn) {
            return;
        }
        this.removeChild(legendColumn);
        this.legendColumns.splice(legendColumnIndex, 1);
        this.parent.draw();
        this.model.cols.splice(legendColumnIndex, 1);
        this.image.updateImageObject(this.model);
    };
    LegendCollection.prototype.getSelftestPosition = function () {
        var imageWidth = this.imageDimensions.width;
        var selftestPoint = this.model.selftestPoint
            ? { x: this.model.selftestPoint.x * imageWidth, y: this.model.selftestPoint.y * imageWidth }
            : { x: 0, y: 0 };
        return selftestPoint;
    };
    LegendCollection.prototype._modeDefault = function () {
        if (this.model.isStatic) {
            this.showItem();
        }
        else {
            this.hideItem();
        }
    };
    LegendCollection.prototype._removeModeDefault = function () {
    };
    LegendCollection.prototype._modeMarker = function () {
        this.showItem();
    };
    LegendCollection.prototype._removeModeMarker = function () {
    };
    LegendCollection.prototype._modeSelftest = function () {
        this.showItem();
    };
    LegendCollection.prototype._removeModeSelftest = function () {
        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.onSelftest, this.selectInteraction);
    };
    LegendCollection.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);
        this.showItem();
    };
    LegendCollection.prototype._removeModeAuthor = function () {
        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);
    };
    LegendCollection.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();
    };
    LegendCollection.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);
    };
    LegendCollection.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();
    };
    LegendCollection.prototype._removeModeSelectGrouping = 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);
    };
    LegendCollection.prototype._modeSelectItem = function () {
        this.onOut();
        this.interactive = true;
        this._selftestElement.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());
    };
    LegendCollection.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);
        }
    };
    LegendCollection.prototype._modeSelectChild = function () {
    };
    LegendCollection.prototype._removeModeSelectChild = function () {
    };
    LegendCollection.prototype._modeSelectRow = function () {
    };
    LegendCollection.prototype._removeModeSelectRow = function () {
    };
    LegendCollection.prototype._modeBlockedItem = function () {
    };
    LegendCollection.prototype._removeModeBlockedItem = function () {
    };
    LegendCollection.prototype._modeDrawItem = function () {
    };
    LegendCollection.prototype._removeModeDrawItem = function () {
        this.moveInteraction.reset();
    };
    LegendCollection.prototype._modeCloneItem = function () {
    };
    LegendCollection.prototype._removeModeCloneItem = function () {
        this.moveInteraction.reset();
    };
    LegendCollection.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();
    };
    LegendCollection.prototype.collapseAllMenus = function (event) {
        this._moveToFrontButtonElement.toggleMenu(event, false);
    };
    LegendCollection.prototype.onButtonEdit = function () {
        this.collapseAllMenus(new PIXI.InteractionEvent());
        this.image.controlHideMenu();
        this.image.editImageObject(this.model);
    };
    LegendCollection.prototype.onButtonMoveToFront = function () {
        this.model.zIndex++;
        this.zIndex = Design.legendCollection.zIndexDefault + this.model.zIndex;
        this.image.sortChildren();
        this.image.updateImageObject(this.model);
    };
    LegendCollection.prototype.onButtonMoveToBack = function () {
        this.model.zIndex--;
        this.zIndex = Design.legendCollection.zIndexDefault + this.model.zIndex;
        this.image.sortChildren();
        this.image.updateImageObject(this.model);
    };
    LegendCollection.prototype.onButtonDelete = function (event) {
        var _this = this;
        this.collapseAllMenus(new PIXI.InteractionEvent());
        this.image.controlHideMenu();
        setTimeout(function () {
            _this.modeInteraction.setMode("delete");
        }, 300);
    };
    LegendCollection.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);
        }
    };
    LegendCollection.prototype.onButtonDuplicate = function () {
        this.collapseAllMenus(new PIXI.InteractionEvent());
        this.image.controlHideMenu();
        this.image.copyImageObject(this.model);
    };
    LegendCollection.prototype.onButtonClipboard = function () {
        this.collapseAllMenus(new PIXI.InteractionEvent());
        this.image.controlHideMenu();
        this.image.clipboardImageObject(this.model);
    };
    LegendCollection.prototype.onButtonSetSelftest = function (event) {
    };
    LegendCollection.prototype.onButtonChooseSelftest = function (event) {
    };
    LegendCollection.prototype.onButtonStatic = function (override) {
        this.model.isStatic = override || !this.model.isStatic;
        this.emit("debounceDraw");
        this.image.updateImageObject(this.model);
    };
    LegendCollection.prototype.onButtonAddLegendColumn = function () {
        this.addLegendColumn();
    };
    LegendCollection.prototype.controlSelectItem = function () {
        this.image.selectImageObject(this.model);
        this.externControlSelectItem();
    };
    LegendCollection.prototype.controlUnselectItem = function (image) {
        if (!this.controlSelectLayerGroup(image)) {
            image.externControlSelectImage();
            image.unselectImageObject();
        }
    };
    LegendCollection.prototype.externControlSelectItem = function () {
        var _this = this;
        this.image.getImageObjects()
            .filter(function (imageObject) { return imageObject !== _this; })
            .forEach(function (imageObject) {
            imageObject.modeInteraction.setMode('blocked_item');
        });
        this.modeInteraction.setModeChildren('select_legend');
        this.modeInteraction.setModeItem('select_item');
    };
    LegendCollection.prototype.controlSelectLayerGroup = function (image) {
        var layerGroup = image.getLayerGroupByImageObject(this.model);
        if (layerGroup) {
            image.selectLayerGroup(layerGroup);
            return image.externControlSelectLayerGroup(layerGroup);
        }
        return false;
    };
    LegendCollection.prototype.controlUnselectLayerGroup = function () {
        this.image.unselectLayerGroup();
    };
    LegendCollection.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');
    };
    LegendCollection.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');
    };
    LegendCollection.prototype.startMove = function () {
    };
    LegendCollection.prototype.onMove = function (event, dX, dY) {
        var imageWidth = this.imageDimensions.width;
        this.position.x += dX;
        this.position.y += dY;
        this.model.rectangle.x = this.position.x / imageWidth;
        this.model.rectangle.y = this.position.y / imageWidth;
    };
    LegendCollection.prototype.endMove = function (event) {
        this.emit("pointerover", event);
        this.image.updateImageObject(this.model);
    };
    LegendCollection.prototype.onRelease = function () {
        this.modeInteraction.setMode(this.modeInteraction.defaultMode);
    };
    LegendCollection.prototype.onSelftestMove = function (event, dX, dY) {
        var imageWidth = this.imageDimensions.width;
        this._selftestElement.wedgePoint.x += dX;
        this._selftestElement.wedgePoint.y += dY;
        this._selftestElement.draw();
        if (!this.model.selftestPoint) {
            this.model.selftestPoint = { x: 0, y: 0 };
        }
        this.model.selftestPoint.x = this._selftestElement.position.x / imageWidth;
        this.model.selftestPoint.y = this._selftestElement.position.x / imageWidth;
    };
    LegendCollection.prototype.onSelftestEndMove = function () {
        this.image.updateImageObject(this.model);
    };
    LegendCollection.prototype.onHover = function () {
        this.legendColumns.forEach(function (legendColumn) {
            legendColumn.onHover();
        });
        this.emit("debounceDraw");
    };
    LegendCollection.prototype.onOut = function () {
        this.legendColumns.forEach(function (legendColumn) {
            legendColumn.onOut();
        });
        this.emit("debounceDraw");
    };
    LegendCollection.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();
            }
        }
    };
    LegendCollection.prototype.onSelftest = function () {
    };
    LegendCollection.prototype.startScale = function () {
    };
    LegendCollection.prototype.onScale = function (scaleSide, dX, dY, dW, dH) {
        var imageWidth = this.imageDimensions.width;
        if (this.model.rectangle.width * imageWidth + dW < 1) {
            return;
        }
        if (this.model.rectangle.height * imageWidth + dH < 1) {
            return;
        }
        this.model.rectangle.width += dW / imageWidth;
        this.model.rectangle.height += dH / imageWidth;
        this.draw();
    };
    LegendCollection.prototype.endScale = function () {
        this.image.updateImageObject(this.model);
    };
    LegendCollection.prototype.startDraw = function () {
        this.cursor = "draw";
    };
    LegendCollection.prototype.startDrawScale = function () {
        this.cursor = "scale-nwse";
    };
    LegendCollection.prototype.onDraw = function (event) {
    };
    Object.defineProperty(LegendCollection.prototype, "moveInteraction", {
        get: function () {
            return this._moveInteraction;
        },
        set: function (value) {
            this._moveInteraction = value;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(LegendCollection.prototype, "scaleInteraction", {
        get: function () {
            return this._scaleInteraction;
        },
        set: function (value) {
            this._scaleInteraction = value;
        },
        enumerable: false,
        configurable: true
    });
    Object.defineProperty(LegendCollection.prototype, "selectInteraction", {
        get: function () {
            return this._selectInteraction;
        },
        set: function (value) {
            this._selectInteraction = value;
        },
        enumerable: false,
        configurable: true
    });
    return LegendCollection;
}(BaseElementContainer));
export { LegendCollection };
//# sourceMappingURL=LegendCollection.js.map