@web-atoms/core/dist/web/controls/AtomGridSplitter.js

Web Atoms Core

System.register(["./AtomControl", "./AtomGridView"], function (_export, _context) {
  "use strict";

  var AtomControl, AtomGridView, AtomGridSplitter;
  _export("AtomGridSplitter", void 0);
  return {
    setters: [function (_AtomControl) {
      AtomControl = _AtomControl.AtomControl;
    }, function (_AtomGridView) {
      AtomGridView = _AtomGridView.AtomGridView;
    }],
    execute: function () {
      _export("AtomGridSplitter", AtomGridSplitter = class AtomGridSplitter extends AtomControl {
        constructor() {
          super(...arguments);
          this.dragging = false;
        }
        preCreate() {
          this.direction = "vertical";
          this.dragging = false;
        }
        create() {
          this.bind(this.element, "styleCursor", [["direction"]], false, v => v === "vertical" ? "ew-resize" : "ns-resize");
          this.bind(this.element, "styleBackgroundColor", [["dragging"]], false, v => v ? "blue" : "lightgray");
          const style = this.element.style;
          style.position = "absolute";
          style.left = style.top = style.bottom = style.right = "0";
          this.bindEvent(this.element, "mousedown", e => {
            e.preventDefault();
            this.dragging = true;
            const parent = this.parent;
            const isVertical = this.direction === "vertical";
            const disposables = [];
            const rect = {
              x: e.screenX,
              y: e.screenY
            };
            const {
              column,
              row
            } = AtomGridView.getCellInfo(this.element);
            const ss = document.createElement("style");
            ss.textContent = "iframe { pointer-events: none }";
            document.head.appendChild(ss);
            disposables.push({
              dispose: () => ss.remove()
            });
            disposables.push(this.bindEvent(document.body, "mousemove", me => {
              const {
                screenX,
                screenY
              } = me;
              const dx = screenX - rect.x;
              const dy = screenY - rect.y;
              if (isVertical) {
                parent.resize("column", column, dx);
              } else {
                parent.resize("row", row, dy);
              }
              rect.x = screenX;
              rect.y = screenY;
            }));
            disposables.push(this.bindEvent(document.body, "mouseup", mup => {
              this.dragging = false;
              for (const iterator of disposables) {
                iterator.dispose();
              }
            }));
          });
        }
      });
    }
  };
});
//# sourceMappingURL=AtomGridSplitter.js.map