@tarojs/components
Version:
48 lines (44 loc) • 1.54 kB
JavaScript
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 };