'use strict';

import React, { Component } from 'react';
import API from '../../api';
import dataCenter from '../../util/dataCenter.js';
import Enum from '../../util/enum.js';
import util from '../../util/util';
import ViewCtrl from '../../util/viewCtrl.js';
import './output.js';
//import API from '../../api';

class PageCanvas extends Component {
    constructor(props) {
        super(props);
        this.state = this.state || {};
    }
    main;
    componentDidMount() {
        var that = this;
        that.main = this.spark_startEngine();
        window.myMain = that.main;
    }

    /**
     * 模板自动生成。不参与转换,请勿在此方法内修改逻辑。
     */
    spark_startEngine() {
        if (typeof Main !== 'function') {
            console.error("ERROR::::先发布引擎后，将output.js放入同目录下");
            return null;
        }
        var canvas = document.getElementById("canvas");
        canvas.width = document.body.clientWidth * (window.devicePixelRatio || 1)
        canvas.height = document.body.clientHeight * (window.devicePixelRatio || 1);
        var main = new Main(canvas);
        var mouseEvent = main.stage.onMouseEvent.bind(main.stage);
        canvas.addEventListener("touchstart", mouseEvent, false);
        canvas.addEventListener('touchmove', mouseEvent, false);
        canvas.addEventListener('touchend', mouseEvent, false);
        return main;
    }

    render() {
        return (<div>
            <canvas id="canvas" style={{ width: "100%", height: "100%" }}></canvas>
        </div>)
    }
}
export default PageCanvas;
