"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.SImageItem = void 0; const SObjectItem_1 = require("./SObjectItem"); const lib_1 = require("@persagy-web/draw/lib"); const __1 = require(".."); class SImageItem extends SObjectItem_1.SObjectItem { constructor(parent, url) { super(parent); this._showType = __1.SImageShowType.Full; this._strokeColor = lib_1.SColor.Transparent; this._lineWidth = 1; this._originPosition = __1.STextOrigin.LeftTop; this.isLoadOver = false; this.imgWidth = this.width; this.imgHeight = this.height; this._url = ""; if (url) this.url = url; } get showType() { return this._showType; } set showType(v) { this._showType = v; this.computeImgSize(); this.update(); } get strokeColor() { return this._strokeColor; } set strokeColor(v) { this._strokeColor = v; this.update(); } get lineWidth() { return this._lineWidth; } set lineWidth(v) { this._lineWidth = v; this.update(); } get originPosition() { return this._originPosition; } set originPosition(v) { this._originPosition = v; this.update(); } get url() { return this._url; } set url(v) { this._url = v; this.img = new Image(); this.img.onload = (e) => { const imgSrc = e.path[0].src; if (this.isUrlIdentical(imgSrc)) { this.isLoadOver = true; this.computeImgSize(); this.$emit("imgLoadOver"); this.update(); } }; this.img.onerror = (e) => { const imgSrc = e.path[0].src; if (this.isUrlIdentical(imgSrc)) { this.isLoadOver = false; this.$emit("imgLoadOver"); this.update(); console.log("加载图片错误!", e); } }; this.img.src = v; } computeImgSize() { if (this.isLoadOver) { let width = 0; let height = 0; let itemAspectRatio = this.width / this.height; let imgAspectRatio = this.img.width / this.img.height; let imgHwRatio = this.img.height / this.img.width; if (this.showType == __1.SImageShowType.Full) { width = this.width; height = this.height; } else if (this.showType == __1.SImageShowType.Equivalency) { if (itemAspectRatio > imgAspectRatio) { height = this.height; width = imgAspectRatio * height; } else if (itemAspectRatio < imgAspectRatio) { width = this.width; height = width * imgHwRatio; } else { width = this.width; height = this.height; } } else if (this.showType == __1.SImageShowType.AutoFit) { this.width = this.img.width; this.height = this.img.height; width = this.width; height = this.height; } this.imgWidth = width; this.imgHeight = height; if (this.originPosition == __1.STextOrigin.Centrum) { this.origin = new lib_1.SPoint(this.width / 2, this.height / 2); } } } isUrlIdentical(imgUrl) { if (this.url.indexOf("://") == -1) { const reg = /^\s*data:([a-z]+\/[a-z0-9-+.]+(;[a-z-]+=[a-z0-9-]+)?)?(;base64)?,([a-z0-9!$&',()*+;=\-._~:@\/?%\s]*?)\s*$/i; if (reg.test(this.url)) { if (this.url == imgUrl) { return true; } else { return false; } } else { if (this.url == this.GetUrlRelativePath(imgUrl)) { return true; } else { return false; } } } else { if (this.url == imgUrl) { return true; } else { return false; } } } GetUrlRelativePath(url) { var arrUrl = url.split("//"); var start = arrUrl[1].indexOf("/"); var relUrl = arrUrl[1].substring(start); return relUrl; } boundingRect() { return new lib_1.SRect(-this.origin.x, -this.origin.y, this.width, this.height); } onResize(oldSize, newSize) { this.computeImgSize(); this.update(); } onDraw(painter) { painter.translate(-this.origin.x, -this.origin.y); if (this.isLoadOver) { painter.drawImage(this.img, 0, 0, this.imgWidth, this.imgHeight); } if (this.selected) { painter.shadow.shadowBlur = 10; painter.shadow.shadowColor = new lib_1.SColor(`#00000033`); painter.shadow.shadowOffsetX = 5; painter.shadow.shadowOffsetY = 5; } else { painter.shadow.shadowColor = lib_1.SColor.Transparent; } painter.pen.lineWidth = this.lineWidth; painter.pen.color = this.strokeColor; painter.brush.color = lib_1.SColor.Transparent; painter.drawRect(0, 0, this.width, this.height); } } exports.SImageItem = SImageItem;