VaKeR CYBER ARMY
Apache/2.4.41 (Ubuntu) Linux absol.cf 5.4.0-198-generic #218-Ubuntu SMP Fri Sep 27 20:18:53 UTC 2024 x86_64 www-data ( 33 )7.4.33 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, / var /www /html /libs /absol-acomp /out /
Current File : /var/www/html/libs/absol-acomp/out/DualSelectMenu.js.html <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JSDoc: Source: DualSelectMenu.js</title>
<script src="scripts/prettify/prettify.js"> </script>
<script src="scripts/prettify/lang-css.js"> </script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>
<body>
<div id="main">
<h1 class="page-title">Source: DualSelectMenu.js</h1>
<section>
<article>
<pre class="prettyprint source linenums"><code>import ACore, { $, _ } from "../ACore";
import DualSelectBox from "./DualSelectBox";
import { getScreenSize, traceOutBoundingClientRect } from "absol/src/HTML5/Dom";
import { hitElement } from "absol/src/HTML5/EventEmitter";
import OOP from "absol/src/HTML5/OOP";
/***
* @extends AElement
* @constructor
*/
function DualSelectMenu() {
this._format = '$0, $1';
/***
* @type {DualSelectBox}
*/
this.$box = _({
tag: DualSelectBox.tag,
props: {
anchor: [1, 6, 2, 5]
},
on: {
preupdateposition: this.eventHandler.preUpdatePosition,
change: this.eventHandler.boxChange,
close: this.eventHandler.boxClose
}
});
this.$item = $('.absol-selectlist-item', this);
this.on('click', this.eventHandler.click);
OOP.drillProperty(this, this.$box, 'enableSearch');
/***
* @name strictValue
* @type {boolean}
* @memberOf DualSelectMenu#
*/
/***
* @name readOnly
* @type {boolean}
* @memberOf DualSelectMenu#
*/
}
DualSelectMenu.tag = 'DualSelectMenu'.toLowerCase();
DualSelectMenu.render = function () {
return _({
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(_({
tag: 'span',
child: { text: text }
}));
};
DualSelectMenu.property = {};
DualSelectMenu.property.isFocus = {
/***
* @this DualSelectMenu
* @param value
*/
set: function (value) {
var self = this;
value = !!value;
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.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.remove();
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 (hitElement(this.$box, event)) return;
this.isFocus = false;
};
/***
* @this DualSelectMenu
*/
DualSelectMenu.eventHandler.preUpdatePosition = function () {
var bound = this.getBoundingClientRect();
var screenSize = 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 = 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.install(DualSelectMenu);
export default DualSelectMenu;</code></pre>
</article>
</section>
</div>
<nav>
<h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="CalendarInput.html">CalendarInput</a></li><li><a href="CandyBoxButton.html">CandyBoxButton</a></li><li><a href="ChromeCalendar.html">ChromeCalendar</a></li><li><a href="CircleSectionLabel.html">CircleSectionLabel</a></li><li><a href="Cluster.html">Cluster</a></li><li><a href="ClusterIconInfo.html">ClusterIconInfo</a></li><li><a href="ClusterIconStyle.html">ClusterIconStyle</a></li><li><a href="ContextCaptor.html">ContextCaptor</a></li><li><a href="DateInput.html">DateInput</a></li><li><a href="DateInput2.html">DateInput2</a></li><li><a href="DropPanel.html">DropPanel</a></li><li><a href="DropPanelStack.html">DropPanelStack</a></li><li><a href="FlexiconButton.html">FlexiconButton</a></li><li><a href="MarkerClusterer.html">MarkerClusterer</a></li><li><a href="MarkerClustererOptions.html">MarkerClustererOptions</a></li><li><a href="SearchTextInput.html">SearchTextInput</a></li><li><a href="Sprite.html">Sprite</a></li><li><a href="Time24Input.html">Time24Input</a></li></ul><h3>Events</h3><ul><li><a href="MarkerClusterer.html#event:click">click</a></li><li><a href="MarkerClusterer.html#event:clusteringbegin">clusteringbegin</a></li><li><a href="MarkerClusterer.html#event:clusteringend">clusteringend</a></li><li><a href="MarkerClusterer.html#event:mouseout">mouseout</a></li><li><a href="MarkerClusterer.html#event:mouseover">mouseover</a></li></ul><h3>Global</h3><ul><li><a href="global.html#$windowTitleText">$windowTitleText</a></li><li><a href="global.html#AddIcon">AddIcon</a></li><li><a href="global.html#calcMinHMTime">calcMinHMTime</a></li><li><a href="global.html#cleanMenuItemProperty">cleanMenuItemProperty</a></li><li><a href="global.html#preventNotNumberInput">preventNotNumberInput</a></li><li><a href="global.html#vScrollIntoView">vScrollIntoView</a></li></ul>
</nav>
<br class="clear">
<footer>
Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.0</a> on Wed Jan 04 2023 18:18:58 GMT+0700 (Indochina Time)
</footer>
<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>
Server : Apache/2.4.41 (Ubuntu)