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-acomp/js/DualSelectMenu.js ***/
"use strict";

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

var _ACore = _interopRequireWildcard(require("../ACore"));

var _DualSelectBox = _interopRequireDefault(require("./DualSelectBox"));

var _Dom = require("absol/src/HTML5/Dom");

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

var _OOP = _interopRequireDefault(require("absol/src/HTML5/OOP"));




/***
 * @extends AElement
 * @constructor
 */
function DualSelectMenu() {
  this._format = '$0, $1';
  /***
   * @type {DualSelectBox}
   */

  this.$box = (0, _ACore._)({
    tag: _DualSelectBox.default.tag,
    props: {
      anchor: [1, 6, 2, 5]
    },
    on: {
      preupdateposition: this.eventHandler.preUpdatePosition,
      change: this.eventHandler.boxChange,
      close: this.eventHandler.boxClose
    }
  });
  this.$box.cancelWaiting();
  this.$item = (0, _ACore.$)('.absol-selectlist-item', this);
  this.on('click', this.eventHandler.click);

  _OOP.default.drillProperty(this, this.$box, 'enableSearch');
  /***
   * @name strictValue
   * @type {boolean}
   * @memberOf DualSelectMenu#
   */

  /***
   * @name readOnly
   * @type {boolean}
   * @memberOf DualSelectMenu#
   */

  /***
   * @name disabled
   * @type {boolean}
   * @memberOf DualSelectMenu#
   */

}

DualSelectMenu.tag = 'DualSelectMenu'.toLowerCase();

DualSelectMenu.render = function () {
  return (0, _ACore._)({
    class: ['absol-selectmenu', 'as-dual-select-menu'],
    extendEvent: ['change'],
    attr: {
      tabindex: '1'
    },
    child: [{
      class: 'absol-selectmenu-holder-item',
      child: '.absol-selectlist-item'
    }, {
      tag: 'button',
      class: 'absol-selectmenu-btn',
      child: ['dropdown-ico']
    }, 'attachhook']
  });
};

DualSelectMenu.prototype._updateViewValue = function () {
  var format = this._format;
  var value = this.$box.value || [null, null];
  var strictValue = this.strictValue;
  var hbv = this.$box.holderByValue;
  var firstToken = '__';
  var secToken = '__';
  var firstHolder = hbv[value[0]];
  var sectHolder;

  if (firstHolder) {
    firstToken = firstHolder.item.text;
    sectHolder = firstHolder.child[value[1]];
    if (sectHolder) secToken = sectHolder.item.text;
  }

  var text = format.replace('$0', firstToken).replace('$1', secToken);
  this.$item.clearChild().addChild((0, _ACore._)({
    tag: 'span',
    class: ['as-selectlist-item-text', 'absol-selectlist-item-text'],
    child: {
      text: text
    }
  }));
};

DualSelectMenu.property = {};
DualSelectMenu.property.selectedItems = {
  get: function () {
    var value = this.$box.value || [null, null];
    var hbv = this.$box.holderByValue;
    var firstHolder = hbv[value[0]];
    var sectHolder;
    var res = [null, null];

    if (firstHolder) {
      res[0] = firstHolder.item;
      sectHolder = firstHolder.child[value[1]];
      if (sectHolder) res[1] = sectHolder.item;
    }

    return res;
  }
};
DualSelectMenu.property.isFocus = {
  /***
   * @this DualSelectMenu
   * @param value
   */
  set: function (value) {
    var self = this;
    value = !!value;
    if (value && (this.disabled || this.readOnly)) return;
    if (this.hasClass('as-focus') === value) return;

    if (value) {
      this._prevValue = (this.$box.value || [null, null]).join('//');
      this.addClass('as-focus');
      this.off('click', this.eventHandler.click);
      this.$box.followTarget = this;
      this.$box.sponsorElement = this;
      this.$box.addTo(document.body);
      this.$box.updatePosition();
      this.$box.scrollIntoSelected();
      setTimeout(function () {
        self.$box.focus();
        document.addEventListener('click', self.eventHandler.clickOut);
      }, 10);
    } else {
      this.removeClass('as-focus');
      this.$box.selfRemove();
      this.$box.resetSearchState();
      document.removeEventListener('click', self.eventHandler.clickOut);
      setTimeout(function () {
        self.on('click', self.eventHandler.click);
      }, 10);

      if ((this.$box.value || [null, null]).join('//') !== this._prevValue) {
        this._updateViewValue();

        this.emit('change', {
          type: 'change',
          target: this
        }, this);
      }
    }
  },
  get: function () {
    return this.hasClass('as-focus');
  }
};
/****
 * @memberOf DualSelectMenu#
 * @type {{}}
 */

DualSelectMenu.eventHandler = {};
DualSelectMenu.property.items = {
  /***
   * @this DualSelectMenu
   * @param items
   */
  set: function (items) {
    this.$box.items = items;
    this.addStyle('--dual-list-estimate-text-width', this.$box.estimateSize.textWidth + 'px');

    this._updateViewValue();
  },
  get: function () {
    return this.$box.items;
  }
};
DualSelectMenu.property.value = {
  set: function (value) {
    this.$box.value = value;

    this._updateViewValue();
  },
  get: function () {
    return this.$box.value;
  }
};
DualSelectMenu.property.strictValue = {
  set: function (value) {
    this.$box.strictValue = value;

    this._updateViewValue();
  },
  get: function () {
    return this.$box.strictValue;
  }
};
DualSelectMenu.property.format = {
  set: function (value) {
    this._format = value || '$0, $1';

    this._updateViewValue();
  },
  get: function () {
    return this._format;
  }
};
DualSelectMenu.property.readOnly = {
  set: function (value) {
    if (value) {
      this.addClass('as-read-only');
    } else {
      this.removeClass('as-read-only');
    }
  },
  get: function () {
    return this.hasClass('as-read-only');
  }
};
DualSelectMenu.property.disabled = {
  set: function (value) {
    if (value) {
      this.addClass('as-disabled');
    } else {
      this.removeClass('as-disabled');
    }
  },
  get: function () {
    return this.hasClass('as-disabled');
  }
};
/**
 * @this DualSelectMenu
 */

DualSelectMenu.eventHandler.click = function () {
  if (this.readOnly) return;
  this.isFocus = true;
};
/**
 * @this DualSelectMenu
 */


DualSelectMenu.eventHandler.clickOut = function (event) {
  if ((0, _EventEmitter.hitElement)(this.$box, event)) return;
  this.isFocus = false;
};
/***
 * @this DualSelectMenu
 */


DualSelectMenu.eventHandler.preUpdatePosition = function () {
  var bound = this.getBoundingClientRect();
  var screenSize = (0, _Dom.getScreenSize)();
  var availableTop = bound.top - 5;
  var availableBot = screenSize.height - 5 - bound.bottom;
  this.$box.addStyle('--max-height', Math.max(availableBot, availableTop) + 'px');
  var outBound = (0, _Dom.traceOutBoundingClientRect)(this);

  if (bound.bottom < outBound.top || bound.top > outBound.bottom || bound.right < outBound.left || bound.left > outBound.right) {
    this.isFocus = false;
  }
};

DualSelectMenu.eventHandler.boxChange = function () {
  this._updateViewValue();
};

DualSelectMenu.eventHandler.boxClose = function () {
  this.isFocus = false;
};

_ACore.default.install(DualSelectMenu);

var _default = DualSelectMenu;
exports.default = _default;