Server : Apache/2.4.41 (Ubuntu) System : Linux absol.cf 5.4.0-198-generic #218-Ubuntu SMP Fri Sep 27 20:18:53 UTC 2024 x86_64 User : www-data ( 33) PHP Version : 7.4.33 Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare, Directory :  /var/www/html/libs/absol-full/dist/js/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

/*** module: node_modules/absol-form/js/editor/ComponentPicker.js ***/
"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _RelativeLayout = _interopRequireDefault(require("../layouts/RelativeLayout"));

var _DateInput = _interopRequireDefault(require("../components/DateInput"));

var _TextInput = _interopRequireDefault(require("../components/TextInput"));

var _TextArea = _interopRequireDefault(require("../components/TextArea"));

var _NumberInput = _interopRequireDefault(require("../components/NumberInput"));

var _ComboBox = _interopRequireDefault(require("../components/ComboBox"));

var _Radio = _interopRequireDefault(require("../components/Radio"));

var _Checkbox = _interopRequireDefault(require("../components/Checkbox"));

var _Label = _interopRequireDefault(require("../components/Label"));

var _FCore = _interopRequireDefault(require("../core/FCore"));

var _Context = _interopRequireDefault(require("absol/src/AppPattern/Context"));

var _EventEmitter = _interopRequireDefault(require("absol/src/HTML5/EventEmitter"));

require("../../css/componentpicker.css");

var _Draggable = _interopRequireDefault(require("absol-acomp/js/Draggable"));

var _R = _interopRequireDefault(require("../R"));

var _PluginManager = _interopRequireDefault(require("../core/PluginManager"));

var _ComponentTreeList = _interopRequireDefault(require("../components/ComponentTreeList"));

var _CPUViewer = _interopRequireDefault(require("absol-acomp/js/CPUViewer"));


var _ = _FCore.default._;
var $ = _FCore.default.$;

function ComponentPicker() {
  _Context.default.call(this);

  _EventEmitter.default.call(this);

  this.$view = null;
  /**
   * @type {import('../layouteditor/LayoutEditor').default}
   */

  this.layoutEditor = null;
}

Object.defineProperties(ComponentPicker.prototype, Object.getOwnPropertyDescriptors(_Context.default.prototype));
Object.defineProperties(ComponentPicker.prototype, Object.getOwnPropertyDescriptors(_EventEmitter.default.prototype));
ComponentPicker.prototype.constructor = ComponentPicker;

ComponentPicker.prototype.bindWithEditor = function (editor) {
  this.layoutEditor = editor;
};

ComponentPicker.prototype.getView = function () {
  if (this.$view) return this.$view;
  if (this.$view) return this.$compExpTree;
  var self = this;

  function toggleGroup() {
    this.status = {
      open: 'close',
      close: 'open'
    }[this.status];
  }

  function makeExp(node) {
    if (typeof node === 'object') {
      return {
        tag: 'exptree',
        props: {
          name: node.text,
          status: 'close'
        },
        on: {
          press: toggleGroup
        },
        child: node.children ? node.children.map(makeExp) : []
      };
    } else if (typeof node === 'function') {
      return {
        tag: 'exptree',
        props: {
          name: node.prototype.tag,
          icon: node.prototype.menuIcon,
          componentConstructor: node
        }
      };
    } else {
      console.error('Invalid node ', node);
    }
  }

  this.$view = _({
    class: ['as-compopnent-picker', 'as-bscroller'],
    child: makeExp(_ComponentTreeList.default)
  });
  this.$all = $('exptree', this.$view);
  this.$all.status = 'open';
  var context = {
    self: this,
    toggleGroup: toggleGroup,
    $view: this.$view
  };

  _PluginManager.default.exec(this, _R.default.PLUGINS.COMPONENT_PICKER_VIEW, context); //todo: find and call


  _({
    tag: 'hanger',
    elt: this.$all,
    on: {
      predrag: this.ev_constructorPreDrag.bind(self),
      dragstart: self.ev_constructorBeginDrag.bind(self),
      drag: self.ev_constructorDrag.bind(self),
      dragend: self.ev_constructorEndDrag.bind(self)
    }
  });

  return this.$view;
};

ComponentPicker.prototype._findComponentConstructor = function (elt) {
  while (elt) {
    if (elt.componentConstructor) return elt.componentConstructor;
    elt = elt.parentElement;
  }

  return null;
};

ComponentPicker.prototype.ev_constructorPreDrag = function (event) {
  if (!this._findComponentConstructor(event.target)) {
    event.cancel();
  }
};

ComponentPicker.prototype.ev_constructorBeginDrag = function (event) {
  var constructor = this._findComponentConstructor(event.target);

  this._currentComponentConstructor = constructor;
  this.$modal = this.$modal || _('.as-compopnent-picker-forceground');
  this.$higne = this.$higne || _('.as-compopnent-picker-higne').addTo(this.$modal);
  this.$addBoxCtn = this.$addBoxCtn || _('.as-compopnent-picker-add-box-container').addTo(this.$higne);
  this.$addBox = this.$addBox || _({
    class: 'as-compopnent-picker-add-box',
    child: {
      class: 'as-compopnent-picker-add-box-plus',
      child: 'span.mdi.mdi-plus'
    }
  }).addTo(this.$addBoxCtn);
  if (this.$addBoxIcon) this.$addBoxIcon.remove();
  this.$addBoxIcon = _(constructor.prototype && constructor.prototype.menuIcon || 'span.mdi.mdi-select-place').addTo(this.$addBox);
  this.$modal.addTo(document.body);

  if (this.layoutEditor.rootLayout) {
    this._dragRect = this.layoutEditor.rootLayout.domElt.getBoundingClientRect();
  } else {
    this._dragRect = undefined;
  }
};

ComponentPicker.prototype.ev_constructorEndDrag = function (event) {
  if (!this.$modal) return; //quick fix, must fix in Draggable

  _CPUViewer.default.hold();

  this.$modal.remove();
  var constructor = this._currentComponentConstructor;
  var x = event.clientX;
  var y = event.clientY;
  var rect = this._dragRect;

  if (rect && rect.top <= y && rect.bottom >= y && rect.left <= x && rect.right >= x) {
    this.layoutEditor.addNewComponent(constructor, x - rect.left, y - rect.top);
  }

  _CPUViewer.default.release();
};

ComponentPicker.prototype.ev_constructorDrag = function (event) {
  this.$addBoxCtn.addStyle({
    left: event.clientX + 'px',
    top: event.clientY + 'px'
  });
  var x = event.clientX;
  var y = event.clientY;
  var rect = this._dragRect;

  if (rect && rect.top <= y && rect.bottom >= y && rect.left <= x && rect.right >= x) {
    this.$addBox.addClass('as-can-drop');
  } else {
    this.$addBox.removeClass('as-can-drop');
  }
};

var _default = ComponentPicker;
exports.default = _default;