UNPKG

@visactor/vtable

Version:

canvas table width high performance

107 lines (99 loc) 5.49 kB
"use strict"; var __createBinding = this && this.__createBinding || (Object.create ? function(o, m, k, k2) { void 0 === k2 && (k2 = k); var desc = Object.getOwnPropertyDescriptor(m, k); desc && !("get" in desc ? !m.__esModule : desc.writable || desc.configurable) || (desc = { enumerable: !0, get: function() { return m[k]; } }), Object.defineProperty(o, k2, desc); } : function(o, m, k, k2) { void 0 === k2 && (k2 = k), o[k2] = m[k]; }), __setModuleDefault = this && this.__setModuleDefault || (Object.create ? function(o, v) { Object.defineProperty(o, "default", { enumerable: !0, value: v }); } : function(o, v) { o.default = v; }), __importStar = this && this.__importStar || function(mod) { if (mod && mod.__esModule) return mod; var result = {}; if (null != mod) for (var k in mod) "default" !== k && Object.prototype.hasOwnProperty.call(mod, k) && __createBinding(result, mod, k); return __setModuleDefault(result, mod), result; }; Object.defineProperty(exports, "__esModule", { value: !0 }), exports.TextIcon = exports.Icon = void 0; const vrender_1 = require("./../../vrender"), gifuct_js_1 = require("gifuct-js"), icons = __importStar(require("../../icons")); class Icon extends vrender_1.Image { constructor(params) { super(params), this.failCallback = () => { const registeredIcons = icons.get(), {svg: svg, src: src} = registeredIcons.damage_pic || {}, image = svg || src; image && (super.image = image); }, "mouseenter_cell" !== this.attribute.visibleTime && "click_cell" !== this.attribute.visibleTime || (this.attribute.opacity = 0), this.attribute.hoverImage && (this.attribute.originImage = this.attribute.image), this.attribute.isGif && this.attribute.gif && this.loadGif(); } loadGif() { this.playing = !1, vrender_1.ResourceLoader.GetFile(this.attribute.gif + "?role=gif" + `&radom=${Math.random()}`, "arrayBuffer").then((res => { const gif = (0, gifuct_js_1.parseGIF)(res), frames = (0, gifuct_js_1.decompressFrames)(gif, !0); this.renderGIF(frames), this.resources.set(this.attribute.image, { state: "success", data: this.gifCanvas }); })).catch((e => {})); } get backgroundWidth() { var _a, _b; return null !== (_b = null !== (_a = this.attribute.backgroundWidth) && void 0 !== _a ? _a : this.attribute.width) && void 0 !== _b ? _b : 0; } get backgroundHeight() { var _a, _b; return null !== (_b = null !== (_a = this.attribute.backgroundHeight) && void 0 !== _a ? _a : this.attribute.height) && void 0 !== _b ? _b : 0; } renderGIF(frames) { this.loadedFrames = frames, this.frameIndex = 0, this.tempCanvas || (this.tempCanvas = document.createElement("canvas"), this.tempCtx = this.tempCanvas.getContext("2d")), this.gifCanvas || (this.gifCanvas = document.createElement("canvas"), this.gifCtx = this.gifCanvas.getContext("2d")), this.gifCanvas.width = frames[0].dims.width, this.gifCanvas.height = frames[0].dims.height, this.playing = !0, this.lastTime = (new Date).getTime(), this.animate().to({}, 1e3, "linear").loop(1 / 0); } renderFrame(context, x, y) { const frame = this.loadedFrames[this.frameIndex || 0]; 2 === frame.disposalType && this.gifCtx.clearRect(0, 0, this.gifCanvas.width, this.gifCanvas.height), this.drawPatch(frame), this.manipulate(context, x, y); const diff = (new Date).getTime() - this.lastTime; frame.delay < diff && (this.frameIndex++, this.lastTime = (new Date).getTime()), this.frameIndex >= this.loadedFrames.length && (this.frameIndex = 0); } drawPatch(frame) { const dims = frame.dims; this.frameImageData && dims.width === this.frameImageData.width && dims.height === this.frameImageData.height || (this.tempCanvas.width = dims.width, this.tempCanvas.height = dims.height, this.frameImageData = this.tempCtx.createImageData(dims.width, dims.height)), this.frameImageData.data.set(frame.patch), this.tempCtx.putImageData(this.frameImageData, 0, 0), this.gifCtx.drawImage(this.tempCanvas, dims.left, dims.top); } manipulate(context, x, y) { context.drawImage(this.gifCanvas, 0, 0, this.gifCanvas.width, this.gifCanvas.height, x, y, this.attribute.width, this.attribute.height); } setAttribute(key, value, forceUpdateTag, context) { super.setAttribute(key, value, forceUpdateTag, context), "gif" === key && this.loadGif(); } setAttributes(params, forceUpdateTag, context) { super.setAttributes(params, forceUpdateTag, context), params.gif && this.loadGif(); } } exports.Icon = Icon; class TextIcon extends vrender_1.Text { constructor(params) { var _a, _b, _c, _d, _e; params.fill = null !== (_a = params.fill) && void 0 !== _a ? _a : "#00F", params.fontSize = null !== (_b = params.fontSize) && void 0 !== _b ? _b : 12, params.underline = null !== (_c = params.underline) && void 0 !== _c ? _c : 1, params.textBaseline = null !== (_d = params.textBaseline) && void 0 !== _d ? _d : "top", params.cursor = null !== (_e = params.cursor) && void 0 !== _e ? _e : "pointer", super(params); } } exports.TextIcon = TextIcon; //# sourceMappingURL=icon.js.map