"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = Object.setPrototypeOf ||
        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
var __read = (this && this.__read) || function (o, n) {
    var m = typeof Symbol === "function" && o[Symbol.iterator];
    if (!m) return o;
    var i = m.call(o), r, ar = [], e;
    try {
        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
    }
    catch (error) { e = { error: error }; }
    finally {
        try {
            if (r && !r.done && (m = i["return"])) m.call(i);
        }
        finally { if (e) throw e.error; }
    }
    return ar;
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var lib_1 = require("typestyle/lib");
var csstips = require("csstips/lib");
var next_1 = require("@hackforplay/next");
var cursor_1 = require("../utils/cursor");
var container = lib_1.style(csstips.flex8);
var hackforplayRootNode = lib_1.style({
    width: '100%',
    height: '100%',
    padding: 16
});
var CanvasView = /** @class */ (function (_super) {
    __extends(CanvasView, _super);
    function CanvasView() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.setRoot = function (hackforplayRootNode) {
            _this.setState({ hackforplayRootNode: hackforplayRootNode });
        };
        return _this;
    }
    CanvasView.prototype.componentDidUpdate = function () {
        if (this.state.hackforplayRootNode && !this.props.loading) {
            next_1.render(this.props.rootScene, this.state.hackforplayRootNode);
        }
    };
    CanvasView.prototype.render = function () {
        var _a = this.props, cursorMode = _a.cursorMode, rootScene = _a.rootScene;
        var cursor = cursor_1.cursorClasses[cursorMode];
        var _b = __read(rootScene.map.tables, 1), table = _b[0];
        var height = table.length * 32;
        var width = table[0].length * 32;
        return (React.createElement("div", { className: container },
            React.createElement("div", { className: hackforplayRootNode, ref: this.setRoot },
                React.createElement("canvas", { className: cursor, width: width, height: height, onMouseEnter: this.props.onCanvasMouseEnter, onMouseLeave: this.props.onCanvasMouseLeave, onMouseDown: this.props.onCanvasMouseDown, onMouseMove: this.props.onCanvasMouseMove, onMouseUp: this.props.onCanvasMouseUp }))));
    };
    return CanvasView;
}(React.Component));
exports.default = CanvasView;
//# sourceMappingURL=CanvasView.js.map