whiteboard/dist/cjs/toolbar/Toolbar.js

"use strict";
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        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 extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
var interactjs_1 = require("interactjs");
var ToolbarButton_1 = require("./ToolbarButton");
var uuid_1 = require("../utils/uuid");
require("./index.less");
var index_1 = require("../renderer/DomEventAware/index");
var toolbar_items_1 = require("./toolbar-items");
var Toolbar = (function (_super) {
    __extends(Toolbar, _super);
    function Toolbar(toolbarItems, clickHandler) {
        var _this = _super.call(this) || this;
        _this.id = uuid_1.uuid();
        _this.zIndex = 999;
        _this.toolbarButtons = [];
        _this.getUI = function (drawboard) {
            _this.toolbarUI = document.createElement('div');
            _this.toolbarUI.id = "fcw-toolbar-" + _this.id;
            _this.toolbarUI.className = 'fc-whiteboard-toolbar';
            for (var _i = 0, _a = _this.toolbarItems; _i < _a.length; _i++) {
                var toolbarItem = _a[_i];
                var toolbarButton = new ToolbarButton_1.ToolbarButton(toolbarItem, _this.clickHandler);
                toolbarButton.drawboard = drawboard;
                _this.toolbarUI.appendChild(toolbarButton.getElement());
                _this.toolbarButtons.push(toolbarButton);
            }
            _super.prototype.init.call(_this, _this.toolbarUI);
            interactjs_1.default('#drag-handler').draggable({
                onmove: _this.onDragMove
            });
            return _this.toolbarUI;
        };
        _this.onMouseDown = function (downEv) { };
        _this.onMouseUp = function (ev) { };
        _this.onMouseMove = function (ev) { };
        _this.onDragMove = function (event) {
            var target = _this.toolbarUI;
            var x = ((parseFloat(target.getAttribute('data-x')) || 0) + event.dx);
            var y = ((parseFloat(target.getAttribute('data-y')) || 0) + event.dy);
            target.style.webkitTransform = target.style.transform = 'translate(' + x + 'px, ' + y + 'px)';
            target.style.zIndex = "" + _this.zIndex;
            target.setAttribute('data-x', x);
            target.setAttribute('data-y', y);
        };
        _this.toolbarItems = [toolbar_items_1.dragToolbarItem].concat(toolbarItems);
        _this.clickHandler = clickHandler;
        return _this;
    }
    Object.defineProperty(Toolbar.prototype, "toolbarButtonMap", {
        get: function () {
            var buttonMap = {};
            this.toolbarButtons.forEach(function (b) {
                buttonMap[b.id] = b;
            });
            return buttonMap;
        },
        enumerable: true,
        configurable: true
    });
    Toolbar.prototype.hide = function () {
        this.toolbarUI.style.visibility = 'hidden';
        this.toolbarUI.style.zIndex = '-1';
    };
    Toolbar.prototype.show = function () {
        this.toolbarUI.style.visibility = 'visible';
        this.toolbarUI.style.zIndex = "" + this.zIndex;
    };
    return Toolbar;
}(index_1.DomEventAware));
exports.Toolbar = Toolbar;