UNPKG

@tarojs/components

Version:
48 lines (44 loc) 1.54 kB
import { r as registerInstance, c as createEvent, h, g as getElement } from './index-ab3c86da.js'; const indexCss = "taro-canvas-core{width:300px;height:150px;display:block;position:relative}"; const LONG_TAP_DELAY = 500; const Canvas = class { constructor(hostRef) { registerInstance(this, hostRef); this.onLongTap = createEvent(this, "longtap", 7); this.onTouchStart = () => { this.timer = setTimeout(() => { this.onLongTap.emit(); }, LONG_TAP_DELAY); }; this.onTouchMove = () => { clearTimeout(this.timer); }; this.onTouchEnd = () => { clearTimeout(this.timer); }; this.canvasId = undefined; this.height = undefined; this.width = undefined; this.nativeProps = {}; } componentDidRender() { const [canvas] = this.el.children; if (!this.height || !this.width) { let style = window.getComputedStyle(canvas); this.height || (this.height = style.height); this.width || (this.width = style.width); } canvas.height = parseInt(this.height); canvas.width = parseInt(this.width); } render() { const { canvasId, nativeProps } = this; return (h("canvas", Object.assign({ "canvas-id": canvasId, style: { width: '100%', height: '100%' }, onTouchStart: this.onTouchStart, onTouchMove: this.onTouchMove, onTouchCancel: this.onTouchEnd, onTouchEnd: this.onTouchEnd }, nativeProps))); } get el() { return getElement(this); } }; Canvas.style = indexCss; export { Canvas as taro_canvas_core };