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-acomp/out/
Upload File :
Current File : /var/www/html/libs/absol-acomp/out/QuickMenu.js.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JSDoc: Source: QuickMenu.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: QuickMenu.js</h1>
<section>
<article>
<pre class="prettyprint source linenums"><code>import ACore from "../ACore";
import Dom, { getScreenSize, traceOutBoundingClientRect } from "absol/src/HTML5/Dom";
import BrowserDetector from "absol/src/Detector/BrowserDetector";
import './Menu';
import { cleanMenuItemProperty } from "./utils";
import Follower from "./Follower";
import { copyEvent, hitElement } from "absol/src/HTML5/EventEmitter";
import safeThrow from "absol/src/Code/safeThrow";
var isMobile = BrowserDetector.isMobile;
var _ = ACore._;
var $ = ACore.$;
function QuickMenu() {
//like context menu without right-click
this._contextMenuSync = Promise.resolve();
}
QuickMenu.tag = 'QuickMenu'.toLowerCase();
QuickMenu.render = function () {
return _({
tag: 'vmenu',
extendEvent: 'requestcontextmenu',
class: [
'as-quick-menu', 'as-bscroller'
],
style: {
'overflow-y': 'auto',
'box-sizing': 'border-box'
}
});
};
ACore.install(QuickMenu);
/***
*
* @param {AElement} elt
* @param opt
* @constructor
*/
export function QuickMenuInstance(elt, opt) {
this.id = (Math.random() * 10000 >> 0) + '' + new Date().getTime();
/***
*
* @type {"OPEN"|"CLOSE"}
*/
this.state = 'CLOSE';
this._willAddClickOut = -1;
this.elt = elt;
this.opt = opt;
for (var key in this) {
if (key.startsWith('_on')) {
this[key] = this[key].bind(this);
}
}
this._init();
}
QuickMenuInstance.prototype._init = function () {
this.elt.classList.add('as-quick-menu-trigger');
if (this.opt.triggerEvent === 'mousedown')
$(this.elt).on('contextmenu', function (event) {
event.preventDefault();
}).attr('oncontextmenu', "return false;");
if (this.opt.triggerEvent) {
this.elt.addEventListener(this.opt.triggerEvent, this._onClick, true);
}
else
this.elt.addEventListener('click', this._onClick, true);
};
QuickMenuInstance.prototype._deinit = function () {
if (this.state === "OPEN") this.close();
this.elt.classList.remove('as-quick-menu-trigger');
if (this.opt.triggerEvent) {
this.elt.removeEventListener(this.opt.triggerEvent, this._onClick, true);
}
else {
this.elt.removeEventListener('click', this._onClick, true);
}
};
QuickMenuInstance.prototype.getMenuProps = function () {
var props;
if (this.opt.getMenuProps) {
props = this.opt.getMenuProps();
}
else {
props = this.opt.menuProps;
}
props = props || {};
return Object.assign({ extendClasses: [], extendStyle: {} }, props);
};
QuickMenuInstance.prototype.remove = function () {
this._deinit();
};
QuickMenuInstance.prototype._onClick = function (event) {
if (this.opt.triggerEvent === 'mousedown') {
event.preventDefault();
}
var event = copyEvent(event, {
canceled: false,
cancel: function () {
this.canceled = true;
}
});
if (this.opt.onClick) {
this.opt.onClick.call(this, event);
}
if (!event.canceled)
this.toggle();
};
QuickMenuInstance.prototype._onClickOut = function (event) {
if (hitElement(this.elt, event)) return;
this.close();
};
QuickMenuInstance.prototype.onSelect = function (item) {
if (this.opt.onSelect) this.opt.onSelect(item.__originalItem__ || item);
this.close();
}
QuickMenuInstance.prototype.open = function () {
if (QuickMenu.runningInstance === this) return;
if (this.state !== "CLOSE") return;
if (QuickMenu.runningInstance) QuickMenu.runningInstance.close();
QuickMenu.runningInstance = this;
this.state = 'OPEN';
this.elt.classList.add('as-quick-menu-attached');
this._willAddClickOut = setTimeout(() => {
this._willAddClickOut = -1;
document.addEventListener('click', this._onClickOut, false);
followerElt.updatePosition();
menuElt.addStyle('visibility', 'visible');
}, isMobile ? 33 : 2);
var anchor = this.getAnchor();
var followerElt = QuickMenu.$follower;
var menuElt = QuickMenu.$elt;
this.originProps = this.getMenuProps();
this.copyProps = Object.assign({}, this.originProps);
this.copyProps.items = this.originProps.items || [];
this.copyProps.items = this.copyProps.items.map(function visit(item) {
var cpyItem = item;
if (typeof item === "string") cpyItem = item;
else if (item && (typeof item.text === "string")) {
cpyItem = Object.assign({ __originalItem__: item }, item);
if (cpyItem.items && cpyItem.items.map) cpyItem.items = cpyItem.items.map(visit);
}
return cpyItem;
});
Object.assign(menuElt, this.copyProps);
followerElt.addClass('absol-active');
if (anchor === 'modal') {
followerElt.addClass('as-anchor-modal');
followerElt.anchor = [];
}
else {
followerElt.removeClass('as-anchor-modal');
followerElt.anchor = anchor;
}
this._onSizeNeedUpdate();
QuickMenu.$follower.on('preupdateposition', this._onSizeNeedUpdate);
followerElt.followTarget = this.elt;
menuElt.addStyle('visibility', 'hidden');
followerElt.addTo(document.body);
followerElt.addClass('absol-active');
if (this.opt.onOpen) {
try {
this.opt.onOpen.call(this);
} catch (err) {
safeThrow(err);
}
}
};
QuickMenuInstance.prototype.close = function () {
if (QuickMenu.runningInstance !== this) return;
if (this.state !== "OPEN") return;
if (this.opt.onClose) {
try {
this.opt.onClose.call(this);
} catch (err) {
safeThrow(err);
}
}
this.state = 'CLOSE';
this.elt.classList.remove('as-quick-menu-attached');
QuickMenu.$elt.removeStyle('--available-height');
var followerElt = QuickMenu.$follower;
followerElt.addClass('absol-active');
followerElt.remove();
QuickMenu.$follower.off('preupdateposition', this._onSizeNeedUpdate);
if (this._willAddClickOut >= 0) {
clearTimeout(this._willAddClickOut);
}
else {
document.removeEventListener('click', this._onClickOut, false);
}
QuickMenu.runningInstance = null;
};
QuickMenuInstance.prototype._onSizeNeedUpdate = function () {
var screenSize = getScreenSize();
var eltBound = this.elt.getBoundingClientRect();
var aTop = eltBound.bottom;
var aBottom = screenSize.height - eltBound.top;
QuickMenu.$elt.addStyle('--available-height', (Math.max(aTop, aBottom) - 10) + 'px');
};
QuickMenuInstance.prototype.toggle = function () {
if (this.state === "OPEN") {
this.close();
}
else if (this.state === 'CLOSE') {
this.open();
}
};
QuickMenuInstance.prototype.getAnchor = function () {
var menuAnchors;
var anchor = this.opt.getAnchor ? this.opt.getAnchor() : this.opt.anchor;
if (typeof anchor == 'number') {
menuAnchors = [anchor];
}
else if (anchor instanceof Array) {
menuAnchors = anchor;
}
else if (anchor === 'modal') {
menuAnchors = 'modal';
}
else {
menuAnchors = QuickMenu.PRIORITY_ANCHORS;
}
return menuAnchors;
};
QuickMenu.PRIORITY_ANCHORS = [0, 3, 7, 4, 1, 2, 6, 5];
QuickMenu.$elt = _('quickmenu');
/***
*
* @type {Follower}
*/
QuickMenu.$follower = _({
tag: Follower.tag,
class: 'absol-context-menu-anchor',
child: QuickMenu.$elt,
on: {
preupdateposition: function () {
var bound = this.getBoundingClientRect();
var outBound = traceOutBoundingClientRect(this);
if (bound.bottom < outBound.top || bound.top > outBound.bottom || bound.right < outBound.left || bound.left > outBound.right) {
QuickMenu.close(QuickMenu._session);
}
}
}
});
/***
*
* @type {null|QuickMenuInstance}
*/
QuickMenu.runningInstance = null;
QuickMenu._session = Math.random() * 10000000000 >> 0;
QuickMenu._menuListener = undefined;
QuickMenu.$elt.on('press', function (event) {
if (QuickMenu.runningInstance) QuickMenu.runningInstance.onSelect(cleanMenuItemProperty(event.menuItem));
if (QuickMenu._menuListener) QuickMenu._menuListener(cleanMenuItemProperty(event.menuItem));
});
QuickMenu.show = function (element, menuProps, anchor, menuListener, darkTheme) {
var instance = new QuickMenuInstance(element, {
menuProps: menuProps,
anchor: anchor,
onSelect: menuListener,
darkTheme: darkTheme
});
instance.open();
};
QuickMenu.close = function (session) {
if (QuickMenu.runningInstance && QuickMenu.runningInstance.id === session) QuickMenu.runningInstance.close();
};
QuickMenu.showWhenClick = function (element, menuProps, anchor, menuListener, darkTheme) {
return new QuickMenuInstance(element, {
menuProps: menuProps,
anchor: anchor,
onSelect: menuListener,
darkTheme: darkTheme
});
};
/**
* @typedef {Object} QuickMenuAdaptor
* @property {Function} getFlowedElement default is trigger
* @property {Function} getMenuProps define menuProps if un-change
* @property {Function} getAnchor default is 'auto', define anchor if un-change
* @property {Function} onClose callback
* @property {Function} onOpen callback
* @property {Function} onSelect calback
* @property {Function} isDarkTheme default is false, define darkThem if un-change
*
*
* @typedef {Object} QuickMenuDataHolder
* @property {Function} remove
*
* @param {Element} trigger
* @param {QuickMenuAdaptor} adaptor
* @returns {QuickMenuDataHolder}
*/
QuickMenu.toggleWhenClick = function (trigger, adaptor) {
return new QuickMenuInstance(trigger, adaptor);
};
export default QuickMenu;</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)