medsurf-draw
Version:
Draw annotations on jpg/zoomify images, based on PIXI.js
232 lines • 9.14 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 __());
};
})();
import * as PIXI from "pixi.js-legacy";
import * as MedsurfDraw from "../../public-api";
import { Design } from "../../config/design";
import { BaseContainer, BaseContainerImageModel } from "../../bases/elements/BaseContainer";
var RoundSubMenuEntryModel = (function () {
function RoundSubMenuEntryModel() {
}
return RoundSubMenuEntryModel;
}());
export { RoundSubMenuEntryModel };
var RoundSubMenuElementModel = (function (_super) {
__extends(RoundSubMenuElementModel, _super);
function RoundSubMenuElementModel() {
return _super !== null && _super.apply(this, arguments) || this;
}
return RoundSubMenuElementModel;
}(BaseContainerImageModel));
export { RoundSubMenuElementModel };
var RoundSubMenuElement = (function (_super) {
__extends(RoundSubMenuElement, _super);
function RoundSubMenuElement(model) {
var _this = _super.call(this, model) || this;
_this.zIndex = Design.subMenu.zIndex;
return _this;
}
RoundSubMenuElement.prototype.init = function () {
var _this = this;
this._buttonElement = new MedsurfDraw.RoundButtonElement({
image: this.image,
text: this.text,
description: this.description,
descriptionFontSize: this.descriptionFontSize,
circle: new PIXI.Circle(0, 0, this.circle.radius),
fontSize: this.fontSize,
fontColor: this.fontColor,
});
this._buttonElement.on('onHover', this.onHover, this);
this._buttonElement.on('onOut', this.onOut, this);
this._buttonElement.on('button', this.onRelease, this);
this.addChild(this._buttonElement);
this._buttonIndicatorElement = new MedsurfDraw.RoundButtonIndicatorElement({
image: this.image,
circle: new PIXI.Circle(0, 0, this.circle.radius),
});
this._buttonIndicatorElement.angle += 90;
this.addChild(this._buttonIndicatorElement);
this._containerElement = new MedsurfDraw.Container({ image: this.image });
this._containerElement.position.x = this._buttonElement.width + Design.subMenu.buttonGab;
this._containerElement.hideItem();
this.addChild(this._containerElement);
if (this.menuElements && this.menuElements.length > 0) {
this.menuElements.forEach(function (menuElement) {
_this._containerElement.addChild(menuElement.element);
});
}
this.sortChildren();
this.emit("debounceDraw");
};
RoundSubMenuElement.prototype.draw = function () {
var _this = this;
this._buttonElement.setIconAngle(360 - this.angle);
this._buttonElement.draw();
this._buttonIndicatorElement.draw();
this._containerElement.position.x = this._buttonElement.width + Design.subMenu.buttonGab;
if (this.menuElements) {
var prevElement_1;
this.menuElements.forEach(function (menuElement) {
if (prevElement_1) {
menuElement.element.position.x = prevElement_1.element.position.x + prevElement_1.element.width + menuElement.order * Design.subMenuItems.buttonGab;
}
else {
menuElement.element.position.x = menuElement.order * Design.subMenuItems.buttonGab;
}
prevElement_1 = menuElement;
if (menuElement.element instanceof MedsurfDraw.IndexedRoundButtonElement || menuElement.element instanceof MedsurfDraw.RoundButtonElement) {
menuElement.element.setIconAngle(360 - _this.angle);
}
menuElement.element.draw();
});
}
};
RoundSubMenuElement.prototype.destroy = function (options) {
var _this = this;
if (this.menuElements && this.menuElements.length > 0) {
this.menuElements.forEach(function (menuElement) {
if (_this._containerElement) {
_this._containerElement.removeChild(menuElement.element);
}
});
}
if (this._buttonElement) {
this._buttonElement.destroy(options);
}
if (this._buttonIndicatorElement) {
this._buttonIndicatorElement.destroy(options);
}
if (this._containerElement) {
this._containerElement.destroy(options);
}
_super.prototype.destroy.call(this, options);
};
RoundSubMenuElement.prototype.showMenu = function (event) {
this.toggleMenu(event, true);
};
RoundSubMenuElement.prototype.hideMenu = function (event) {
this.toggleMenu(event, false);
};
RoundSubMenuElement.prototype.toggleMenu = function (event, override) {
if (override === void 0) { override = undefined; }
event.stopPropagation();
if (this._containerElement) {
if (override !== undefined) {
this._containerElement.visible = override;
}
else {
this._containerElement.visible = !this._containerElement.visible;
}
this.emit("toggleMenu", event, this._containerElement.visible);
if (!this._containerElement.visible) {
this._buttonIndicatorElement.visible = true;
}
}
else {
this.emit("toggleMenu", event, false);
}
};
RoundSubMenuElement.prototype.onHover = function (event) {
this._buttonIndicatorElement.visible = false;
this.emit("onHover", event);
};
RoundSubMenuElement.prototype.onOut = function (event) {
this.emit("onOut", event);
};
RoundSubMenuElement.prototype.onRelease = function (event) {
this.hideMenu(event);
this.emit("button", event);
};
RoundSubMenuElement.prototype.onImageZoom = function (scaleX, scaleY) {
this.emit("debounceDraw");
};
Object.defineProperty(RoundSubMenuElement.prototype, "text", {
get: function () {
return this.data.text;
},
set: function (value) {
this.data.text = value;
},
enumerable: false,
configurable: true
});
Object.defineProperty(RoundSubMenuElement.prototype, "description", {
get: function () {
return this.data.description;
},
set: function (value) {
this.data.description = value;
},
enumerable: false,
configurable: true
});
Object.defineProperty(RoundSubMenuElement.prototype, "descriptionFontSize", {
get: function () {
return this.data.descriptionFontSize;
},
set: function (value) {
this.data.descriptionFontSize = value;
},
enumerable: false,
configurable: true
});
Object.defineProperty(RoundSubMenuElement.prototype, "menuElements", {
get: function () {
return this.data.menuElements;
},
set: function (value) {
this.data.menuElements = value;
},
enumerable: false,
configurable: true
});
Object.defineProperty(RoundSubMenuElement.prototype, "circle", {
get: function () {
return this.data.circle;
},
set: function (value) {
this.data.circle = value;
this.emit("debounceDraw");
},
enumerable: false,
configurable: true
});
Object.defineProperty(RoundSubMenuElement.prototype, "fontSize", {
get: function () {
return this.data.fontSize || Design.subMenu.fontSize;
},
set: function (value) {
this.data.fontSize = value;
this._buttonElement.fontSize = this.fontSize;
},
enumerable: false,
configurable: true
});
Object.defineProperty(RoundSubMenuElement.prototype, "fontColor", {
get: function () {
return this.data.fontColor || Design.subMenu.fontColor;
},
set: function (value) {
this.data.fontColor = value;
this._buttonElement.fontColor = this.fontColor;
},
enumerable: false,
configurable: true
});
return RoundSubMenuElement;
}(BaseContainer));
export { RoundSubMenuElement };
//# sourceMappingURL=RoundSubMenuElement.js.map