@haiku/player/lib/renderers/dom/HaikuDOMRenderer.js

Haiku Player is a JavaScript library for building user interfaces

"use strict";
var __assign = (this && this.__assign) || Object.assign || function(t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
        s = arguments[i];
        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
            t[p] = s[p];
    }
    return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
var createMixpanel_1 = require("./createMixpanel");
var createRightClickMenu_1 = require("./createRightClickMenu");
var getElementSize_1 = require("./getElementSize");
var getLocalDomEventPosition_1 = require("./getLocalDomEventPosition");
var patch_1 = require("./patch");
var render_1 = require("./render");
function HaikuDOMRenderer(config) {
    this._user = {
        mouse: {
            x: 0,
            y: 0,
            down: 0,
            buttons: [0, 0, 0],
        },
        keys: {},
        touches: [],
        mouches: [],
    };
    this._lastContainer = undefined;
    this.config = config;
    this.shouldCreateContainer = true;
}
exports.default = HaikuDOMRenderer;
HaikuDOMRenderer.prototype.render = function renderWrap(domElement, virtualContainer, virtualTree, component) {
    return render_1.default(domElement, virtualContainer, virtualTree, component);
};
HaikuDOMRenderer.prototype.patch = function patchWrap(domElement, patchesDict, component) {
    return patch_1.default(domElement, patchesDict, component);
};
HaikuDOMRenderer.prototype.menuize = function menuize(domElement, component) {
    return createRightClickMenu_1.default(domElement, component);
};
HaikuDOMRenderer.prototype.mixpanel = function mixpanel(domElement, mixpanelToken, component) {
    return createMixpanel_1.default(domElement, mixpanelToken, component);
};
HaikuDOMRenderer.prototype.hasSizing = function hasSizing() {
    return this.config && this.config.options.sizing && this.config.options.sizing !== 'normal';
};
HaikuDOMRenderer.prototype.createContainer = function createContainer(domElement) {
    this._lastContainer = {
        isContainer: true,
        layout: {
            computed: {
                size: getElementSize_1.default(domElement),
            },
        },
    };
    if (!this.hasSizing() || !this.config.options.alwaysComputeSizing) {
        this.shouldCreateContainer = false;
    }
    return this._lastContainer;
};
HaikuDOMRenderer.prototype.getLastContainer = function getLastContainer() {
    return this._lastContainer;
};
HaikuDOMRenderer.prototype.initialize = function initialize(domMountElement) {
    var _this = this;
    var user = this._user;
    function setMouse(mouseEvent) {
        var topElement = domMountElement.childNodes[0];
        if (topElement) {
            var pos = getLocalDomEventPosition_1.default(mouseEvent, topElement);
            user.mouse.x = pos.x;
            user.mouse.y = pos.y;
        }
    }
    function setTouches(touchEvent) {
        user.touches.splice(0);
        var topElement = domMountElement.childNodes[0];
        if (topElement) {
            for (var i = 0; i < touchEvent.touches.length; i++) {
                var touch = touchEvent.touches[i];
                var pos = getLocalDomEventPosition_1.default(touch, topElement);
                user.touches.push(pos);
            }
        }
    }
    function setMouches() {
        user.mouches.splice(0);
        if (user.mouse.down) {
            user.mouches.push(user.mouse);
        }
        user.mouches.push.apply(user.mouches, user.touches);
    }
    function clearKey() {
        for (var which in user.keys) {
            user.keys[which] = 0;
        }
    }
    function clearMouse() {
        user.mouse.down = 0;
        user.touches.splice(0);
        for (var i = 0; i < user.mouse.buttons.length; i++) {
            user.mouse.buttons[i] = 0;
        }
    }
    function clearMouch() {
        user.mouches.splice(0);
    }
    function clearTouch() {
        user.touches.splice(0);
    }
    domMountElement.addEventListener('mousedown', function (mouseEvent) {
        ++user.mouse.down;
        ++user.mouse.buttons[mouseEvent.button];
        setMouse(mouseEvent);
        setMouches();
    });
    domMountElement.addEventListener('mouseup', function (mouseEvent) {
        clearMouse();
        clearMouch();
        setMouches();
    });
    domMountElement.addEventListener('mousemove', function (mouseEvent) {
        setMouse(mouseEvent);
        setMouches();
    });
    domMountElement.addEventListener('mouseenter', function (mouseEvent) {
        clearMouse();
        clearMouch();
    });
    domMountElement.addEventListener('mouseleave', function (mouseEvent) {
        clearMouse();
        clearMouch();
    });
    domMountElement.addEventListener('wheel', function (mouseEvent) {
        setMouse(mouseEvent);
        setMouches();
    }, {
        passive: true,
    });
    var doc = domMountElement.ownerDocument;
    var win = doc.defaultView || doc.parentWindow;
    doc.addEventListener('keydown', function (keyEvent) {
        if (user.keys[keyEvent.which] === undefined) {
            user.keys[keyEvent.which] = 0;
        }
        ++user.keys[keyEvent.which];
    });
    doc.addEventListener('keyup', function (keyEvent) {
        if (user.keys[keyEvent.which] === undefined) {
            user.keys[keyEvent.which] = 0;
        }
        if (keyEvent.which === 91 || keyEvent.which === 17) {
            clearKey();
        }
        user.keys[keyEvent.which] = 0;
    });
    if (this.hasSizing() && !this.config.options.alwaysComputeSizing) {
        win.addEventListener('resize', function () {
            _this.shouldCreateContainer = true;
        });
        win.addEventListener('orientationchange', function () {
            _this.shouldCreateContainer = true;
        });
    }
    win.addEventListener('blur', function (blurEvent) {
        clearKey();
        clearMouse();
        clearTouch();
        clearMouch();
    });
    win.addEventListener('focus', function (blurEvent) {
        clearKey();
        clearMouse();
        clearTouch();
        clearMouch();
    });
    domMountElement.addEventListener('touchstart', function (touchEvent) {
        setTouches(touchEvent);
        setMouches();
    }, {
        passive: true,
    });
    domMountElement.addEventListener('touchend', function (touchEvent) {
        clearTouch();
        clearMouch();
    });
    domMountElement.addEventListener('touchmove', function (touchEvent) {
        setTouches(touchEvent);
        setMouches();
    }, {
        passive: true,
    });
    domMountElement.addEventListener('touchenter', function (touchEvent) {
        clearTouch();
        clearMouch();
    });
    domMountElement.addEventListener('touchleave', function (touchEvent) {
        clearTouch();
        clearMouch();
    });
};
HaikuDOMRenderer.prototype.removeListener = function removeListener(target, handler, eventName) {
    target.removeEventListener(eventName, handler);
    return this;
};
HaikuDOMRenderer.prototype.getUser = function getUser() {
    return {
        mouse: {
            x: this._user.mouse.x,
            y: this._user.mouse.y,
            down: this._user.mouse.down,
            buttons: this._user.mouse.buttons.slice(),
        },
        keys: __assign({}, this._user.keys),
        touches: this._user.touches.slice(),
        mouches: this._user.mouches.slice(),
    };
};
//# sourceMappingURL=HaikuDOMRenderer.js.map