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 File : /var/www/html/libs/absol-full/dist/js/mdls__absol-form__js__anchors__RelativeAnchor.js
/*** module: node_modules/absol-form/js/anchors/RelativeAnchor.js ***/
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _FCore = _interopRequireDefault(require("../core/FCore"));
var _FViewable = _interopRequireDefault(require("../core/FViewable"));
require("../../css/relativeanchor.css");
require("../../css/alignbox.css");
var _inheritComponentClass = _interopRequireDefault(require("../core/inheritComponentClass"));
var _makeMapStyleHandler = _interopRequireDefault(require("./makeMapStyleHandler"));
var _utils = require("../core/utils");
var _ = _FCore.default._;
var $ = _FCore.default.$;
/**
* AnchorBox only has on child node
* @extends FViewable
* @constructor
*/
function RelativeAnchor() {
_FViewable.default.call(this);
this.childNode = null;
this.$container = null; //for quick binding render
this.viewBinding = {};
this.onCreate();
this.domElt = this.render();
this.onCreated();
}
(0, _inheritComponentClass.default)(RelativeAnchor, _FViewable.default);
RelativeAnchor.prototype.onCreate = function () {
/* NOOP */
};
RelativeAnchor.prototype.onCreated = function () {
for (var key in this.viewBinding) {
this[key] = $(this.viewBinding[key], this.domElt);
}
};
RelativeAnchor.prototype.VALIGN_VALUE = ['top', 'bottom', 'center', 'fixed'];
RelativeAnchor.prototype.HALIGN_VALUE = ['left', 'right', 'center', 'fixed'];
RelativeAnchor.prototype.HALIGN_CLASS_NAMES = {
left: 'as-halign-left',
right: 'as-halign-right',
center: 'as-halign-center',
fixed: 'as-halign-fixed'
};
RelativeAnchor.prototype.VALIGN_CLASS_NAMES = {
top: 'as-valign-top',
bottom: 'as-valign-bottom',
center: 'as-valign-center',
fixed: 'as-valign-fixed'
};
RelativeAnchor.prototype.compStyleHandlers = {};
RelativeAnchor.prototype.compStyleHandlers.hAlign = {
set: function (value) {
var anchor = this.anchor;
var ref = arguments[arguments.length - 1];
var currentValue = ref.get();
if (!anchor.HALIGN_VALUE.includes(value)) value = anchor.HALIGN_VALUE[0];
anchor.domElt.removeClass(anchor.HALIGN_CLASS_NAMES[currentValue]);
anchor.domElt.addClass(anchor.HALIGN_CLASS_NAMES[value]);
ref.set(value);
this.style['left'] = this.style.left;
this.style['right'] = this.style.right;
this.style['width'] = this.style.width;
return value;
},
descriptor: {
type: 'enum',
values: ['left', 'right', 'center', 'fixed'],
disabled: false,
sign: 'RelativeAnchor_HAlign'
}
};
RelativeAnchor.prototype.compStyleHandlers.vAlign = {
set: function (value) {
var anchor = this.anchor;
var ref = arguments[arguments.length - 1];
var currentValue = ref.get();
if (!anchor.VALIGN_VALUE.includes(value)) value = anchor.VALIGN_VALUE[0];
anchor.domElt.removeClass(anchor.VALIGN_CLASS_NAMES[currentValue]);
anchor.domElt.addClass(anchor.VALIGN_CLASS_NAMES[value]);
ref.set(value);
this.style['top'] = this.style.top;
this.style['bottom'] = this.style.bottom;
this.style['height'] = this.style.height;
return value;
},
descriptor: {
type: 'enum',
values: ['top', 'bottom', 'center', 'fixed'],
disabled: false,
sign: 'RelativeAnchor_VAlign'
}
};
RelativeAnchor.prototype.compStyleHandlers.left = {
/***
* @this BaseComponent
* @param value
* @returns {*}
*/
set: function (value) {
var unit = arguments.length > 2 ? arguments[1] : undefined;
var ref = arguments[arguments.length - 1];
var currentValue = ref.get();
var currentMS = (0, _utils.parseMeasureValue)(currentValue) || {
value: "auto",
unit: null
};
value = this.implicitMeasureSizeValue(value, unit, "width", currentMS.unit);
var styleValue = value >= 0 ? value + 'px' : value;
if (this.style.hAlign !== 'center' && this.style.hAlign !== 'right') {
this.anchor.domElt.addStyle('left', styleValue);
} else this.anchor.domElt.removeStyle('left');
return value;
},
get: function () {
var ref = arguments[arguments.length - 1];
var value = ref.get();
var unit = arguments.length > 1 ? arguments[0] : undefined;
var disabled = this.style.hAlign === 'center' || this.style.hAlign === 'right';
var bound;
var parentBound;
if (unit === 'px') {
if (typeof value != 'number' || disabled) {
bound = this.domElt.getBoundingClientRect();
parentBound = this.parent.domElt.getBoundingClientRect();
return bound.left - parentBound.left;
} else {
return value;
}
} else if (unit === '%') {
if (typeof value == 'string' && !value.match(/%$/) || typeof value != 'string' || disabled) {
bound = this.domElt.getBoundingClientRect();
parentBound = this.parent.domElt.getBoundingClientRect();
return (bound.left - parentBound.left) * 100 / parentBound.width;
} else {
return parseFloat(value.replace('%', ''));
}
} else return value;
},
descriptor: function () {
return {
type: 'measurePosition',
min: -Infinity,
max: Infinity,
disabled: this.style.hAlign === 'center' || this.style.hAlign === 'right',
livePreview: true,
dependency: ['hAlign', 'right', 'width']
};
}
};
RelativeAnchor.prototype.compStyleHandlers.right = {
set: function (value) {
var unit = arguments.length > 2 ? arguments[1] : undefined;
var ref = arguments[arguments.length - 1];
var currentValue = ref.get();
var currentMS = (0, _utils.parseMeasureValue)(currentValue) || {
value: "auto",
unit: null
};
value = this.implicitMeasureSizeValue(value, unit, "width", currentMS.unit);
var styleValue = value >= 0 ? value + 'px' : value;
if (this.style.hAlign !== 'center' && this.style.hAlign !== 'left') {
this.anchor.domElt.addStyle('right', styleValue);
} else this.anchor.domElt.removeStyle('right');
ref.set(value);
this.onSizeChange();
return value;
},
get: function () {
var ref = arguments[arguments.length - 1];
var value = ref.get();
var unit = arguments.length > 1 ? arguments[0] : undefined;
var disabled = this.style.hAlign === 'center' || this.style.hAlign === 'left';
var bound, parentBound;
if (unit === 'px') {
if (typeof value != 'number' || disabled) {
bound = this.domElt.getBoundingClientRect();
parentBound = this.parent.domElt.getBoundingClientRect();
return parentBound.right - bound.right;
} else {
return value;
}
} else if (unit === '%') {
if (typeof value == 'string' && !value.match(/%$/) || typeof value != 'string' || disabled) {
bound = this.domElt.getBoundingClientRect();
parentBound = this.parent.domElt.getBoundingClientRect();
return (parentBound.right - bound.right) * 100 / parentBound.width;
} else {
return parseFloat(value.replace('%', ''));
}
} else {
return value;
}
},
descriptor: function () {
return {
type: 'measurePosition',
min: -Infinity,
max: Infinity,
disabled: this.style.hAlign === 'center' || this.style.hAlign === 'left',
livePreview: true,
dependency: ['hAlign', 'left', 'width'],
sign: 'RelativeRight'
};
}
};
RelativeAnchor.prototype.compStyleHandlers.top = {
set: function (value) {
var unit = arguments.length > 2 ? arguments[1] : undefined;
var ref = arguments[arguments.length - 1];
var currentValue = ref.get();
var currentMS = (0, _utils.parseMeasureValue)(currentValue) || {
value: "auto",
unit: null
};
value = this.implicitMeasureSizeValue(value, unit, "height", currentMS.unit);
var styleValue = value >= 0 ? value + 'px' : value;
if (this.style.vAlign !== 'center' && this.style.vAlign !== 'bottom') {
this.anchor.domElt.addStyle('top', styleValue);
} else this.anchor.domElt.removeStyle('top');
ref.set(value);
this.onSizeChange();
return value;
},
get: function () {
var ref = arguments[arguments.length - 1];
var value = ref.get();
var unit = arguments.length > 1 ? arguments[0] : undefined;
var disabled = this.style.vAlign === 'center' || this.style.vAlign === 'bottom';
var bound, parentBound;
if (unit === 'px') {
if (typeof value != 'number' || disabled) {
bound = this.domElt.getBoundingClientRect();
parentBound = this.parent.domElt.getBoundingClientRect();
return bound.top - parentBound.top;
} else {
return value;
}
} else if (unit === '%') {
if (typeof value == 'string' && !value.match(/%$/) || typeof value != 'string' || disabled) {
{
bound = this.domElt.getBoundingClientRect();
parentBound = this.parent.domElt.getBoundingClientRect();
return (bound.top - parentBound.top) * 100 / parentBound.height;
}
} else {
return parseFloat(value.replace('%', ''));
}
} else return value;
},
descriptor: function () {
return {
type: 'measurePosition',
min: -Infinity,
max: Infinity,
disabled: this.style.vAlign === 'center' || this.style.vAlign === 'bottom',
livePreview: true,
dependency: ['vAlign', 'bottom', 'height'],
sign: 'RelativeTop'
};
}
};
RelativeAnchor.prototype.compStyleHandlers.bottom = {
set: function (value) {
var unit = arguments.length > 2 ? arguments[1] : undefined;
var ref = arguments[arguments.length - 1];
var currentValue = ref.get();
var currentMS = (0, _utils.parseMeasureValue)(currentValue) || {
value: "auto",
unit: null
};
value = this.implicitMeasureSizeValue(value, unit, "height", currentMS.unit);
var styleValue = value >= 0 ? value + 'px' : value;
if (this.style.vAlign !== 'center' && this.style.vAlign !== 'top') {
this.anchor.domElt.addStyle('bottom', styleValue);
} else this.anchor.domElt.removeStyle('bottom');
ref.set(value);
this.onSizeChange();
return value;
},
get: function () {
var ref = arguments[arguments.length - 1];
var value = ref.get();
var unit = arguments.length > 1 ? arguments[0] : undefined;
var disabled = this.style.vAlign === 'center' || this.style.vAlign === 'top';
var bound, parentBound;
if (disabled || unit === 'px') {
if (typeof value != 'number' || disabled) {
bound = this.domElt.getBoundingClientRect();
parentBound = this.parent.domElt.getBoundingClientRect();
return parentBound.bottom - bound.bottom;
} else {
return value;
}
} else if (unit === '%') {
if (typeof value == 'string' && !value.match(/%$/) || typeof value != 'string' || disabled) {
bound = this.domElt.getBoundingClientRect();
parentBound = this.parent.domElt.getBoundingClientRect();
return (parentBound.bottom - bound.bottom) * 100 / parentBound.height;
} else {
return parseFloat(value.replace('%', ''));
}
} else return value;
},
descriptor: function () {
return {
type: 'measurePosition',
min: -Infinity,
max: Infinity,
disabled: this.style.vAlign === 'center' || this.style.vAlign === 'top',
livePreview: true,
dependency: ['vAlign', 'top', 'height'],
sign: 'RelativeBottom'
};
}
};
RelativeAnchor.prototype.compStyleHandlers.width = {
set: function (value) {
if (value === null || value === undefined || value === '') value = 'auto';
var ref = arguments[arguments.length - 1];
var unit = arguments.length > 2 ? arguments[1] : undefined;
var currentValue = ref.get();
var currentMS = (0, _utils.parseMeasureValue)(currentValue) || {
value: "auto",
unit: null
};
value = this.implicitMeasureSizeValue(value, unit, "width", currentMS.unit);
var styleValue = value >= 0 ? value + 'px' : value;
if (styleValue === 'match_parent') styleValue = '100%';
var vAlign = this.style.vAlign;
var hAlign = this.style.hAlign;
if (vAlign === 'center') {
if (hAlign === 'center') {
this.anchor.domElt.removeStyle('width');
this.domElt.addStyle('width', styleValue);
} else if (hAlign === 'fixed') {
this.anchor.domElt.removeStyle('width');
this.domElt.removeStyle('width');
} else {
this.anchor.domElt.addStyle('width', styleValue);
this.domElt.removeStyle('width');
}
} else {
if (hAlign === 'center') {
this.domElt.addStyle('width', styleValue);
this.anchor.domElt.removeStyle('width');
} else {
this.domElt.removeStyle('width');
if (hAlign === 'fixed') {
this.anchor.domElt.removeStyle('width');
} else {
this.anchor.domElt.addStyle('width', styleValue);
}
}
}
ref.set(value);
this.onSizeChange();
return value;
},
get: function () {
var ref = arguments[arguments.length - 1];
var value = ref.get();
var unit = arguments.length > 1 ? arguments[0] : undefined;
var hAlign = this.style.hAlign;
var disabled = this.style.hAlign === 'fixed';
var bound, parentBound;
if (disabled || unit === 'px') {
if (disabled || typeof value != 'number') {
bound = this.domElt.getBoundingClientRect();
return bound.width;
} else {
return value;
}
} else if (unit === '%') {
if (hAlign === 'match_parent') return 100;else if (disabled || typeof value === 'string' && !value.match(/%$/) || typeof value != 'string') {
bound = this.domElt.getBoundingClientRect();
parentBound = this.parent.domElt.getBoundingClientRect();
return bound.width * 100 / parentBound.width;
} else {
return parseFloat(value.replace('%', ''));
}
} else return value;
},
descriptor: function () {
return {
type: 'measureSize',
disabled: this.style.hAlign === 'fixed',
dependency: ['hAlign', 'left', 'right'],
sign: 'RelativeWidth'
};
}
};
RelativeAnchor.prototype.compStyleHandlers.height = {
set: function (value) {
if (value === null || value === undefined || value === '') value = 'auto';
if (value && value.startsWith && value.startsWith('auto')) value = 'auto';
var ref = arguments[arguments.length - 1];
var unit = arguments.length > 2 ? arguments[1] : undefined;
var currentValue = ref.get();
var vAlign = this.style.vAlign;
var currentMS = (0, _utils.parseMeasureValue)(currentValue) || {
value: "auto",
unit: null
};
value = this.implicitMeasureSizeValue(value, unit, "height", currentMS.unit);
var styleValue = value >= 0 ? value + 'px' : value;
if (styleValue === 'match_parent') styleValue = '100%';
if (vAlign === 'center') {
this.anchor.domElt.removeStyle('height');
this.domElt.addStyle('height', styleValue);
} else {
this.domElt.removeStyle('height');
if (vAlign === 'fixed') {
this.anchor.domElt.removeStyle('height', styleValue);
} else {
this.anchor.domElt.addStyle('height', styleValue);
}
}
ref.set(value);
this.onSizeChange();
return value;
},
get: function () {
var ref = arguments[arguments.length - 1];
var unit = arguments.length > 1 ? arguments[0] : undefined;
var disabled = this.style.vAlign === 'fixed';
var parentBound, bound;
var currentValue = ref.get();
var vAlign = this.style.vAlign;
if (disabled || unit === 'px') {
if (disabled || typeof currentValue != 'number') {
bound = this.domElt.getBoundingClientRect();
return bound.height;
} else {
return currentValue;
}
} else if (unit === '%') {
if (vAlign === 'match_parent') return 100;else if (disabled || typeof currentValue === 'string' && !currentValue.match(/%$/) || typeof currentValue != 'string') {
bound = this.domElt.getBoundingClientRect();
parentBound = this.parent.domElt.getBoundingClientRect();
return bound.height * 100 / parentBound.height;
} else {
return parseFloat(currentValue.replace('%', ''));
}
} else return currentValue;
},
descriptor: function () {
return {
type: 'measureSize',
disabled: this.style.vAlign === 'fixed',
dependency: ['vAlign', 'top', 'bottom'],
sign: 'RelativeHeight'
};
}
};
RelativeAnchor.prototype.compStyleHandlers.hidden = {
set: function (value) {
value = !!value;
if (value) this.anchor.domElt.addClass('as-display-hidden');else this.anchor.domElt.removeClass('as-display-hidden');
this.domElt.removeClass('as-display-hidden');
return value;
},
descriptor: {
type: 'bool',
sign: 'hidden'
}
};
['hAlign', 'vAlign', 'left', 'right', 'top', 'bottom', 'width', 'height', 'hidden'].forEach(function (name) {
RelativeAnchor.prototype.styleHandlers[name] = (0, _makeMapStyleHandler.default)(name);
});
RelativeAnchor.prototype.TOP_CLASS_NAME = 'as-relative-anchor-box';
RelativeAnchor.prototype.render = function () {
var layout = {
class: ['as-anchor-box', this.TOP_CLASS_NAME]
};
this.viewBinding.$containter = '.' + this.TOP_CLASS_NAME;
return _(layout);
};
/**
* @param {BaseComponent} child
*/
RelativeAnchor.prototype.attachChild = function (child) {
if (this.childNode) {
this.childNode.domElt.remove();
this.childNode = null;
this.childNode.anchor = null;
}
if (child.anchor) throw new Error("Detach anchorBox first"); //preinit
this.childNode = child;
child.anchor = this;
this.childNode.style.left = this.childNode.style.left || 0;
this.childNode.style.right = this.childNode.style.right || 0;
this.childNode.style.top = this.childNode.style.top || 0;
this.childNode.style.bottom = this.childNode.style.bottom || 0;
this.childNode.style.vAlign = this.childNode.style.vAlign || 'top';
this.childNode.style.hAlign = this.childNode.style.hAlign || 'left';
this.style.left = this.childNode.style.left;
this.style.right = this.childNode.style.right;
this.style.top = this.childNode.style.top;
this.style.bottom = this.childNode.style.bottom;
this.style.vAlign = this.childNode.style.vAlign;
this.style.hAlign = this.childNode.style.hAlign;
this.$containter.addChild(child.domElt);
this.$containter.attr('data-anchor-of', child.tag);
this.style.loadAttributeHandlers(this.styleHandlers);
child.style.loadAttributeHandlers(Object.assign({}, child.styleHandlers, this.compStyleHandlers));
child.onAnchorAttached();
};
RelativeAnchor.prototype.detachChild = function () {
if (this.childNode) {
this.childNode.domElt.remove();
this.style.unloadAttributeHandlers(this.styleHandlers);
this.childNode.style.unloadAttributeHandlers(Object.assign({}, this.childNode.styleHandlers, this.compStyleHandlers));
this.childNode.onAnchorDetached();
this.childNode.anchor = null;
this.childNode = null;
} else throw new Error("Nothing to detach");
};
RelativeAnchor.prototype.HALIGN_ACCEPT_STYLE = {
left: {
left: true,
right: false
},
right: {
left: false,
right: true
},
center: {
left: false,
right: false
},
// component need set width
fixed: {
left: true,
right: true
}
};
RelativeAnchor.prototype.VALIGN_ACCEPT_STYLE = {
top: {
top: true,
bottom: false
},
bottom: {
top: false,
bottom: true
},
center: {
top: false,
bottom: false
},
// component need set height
fixed: {
top: true,
bottom: true
}
};
RelativeAnchor.prototype.updateVAlignStyle = function () {
for (var key in this.VALIGN_ACCEPT_STYLE[this.childNode.style.vAlign]) {
if (this.VALIGN_ACCEPT_STYLE[this.childNode.style.vAlign][key]) {
this.domElt.addStyle(key, this.childNode.style[key] + 'px');
} else {
this.domElt.removeStyle(key);
this.domElt.removeStyle(key);
}
}
this.setStyle('width', this.childNode.style.width);
this.setStyle('height', this.childNode.style.height);
};
RelativeAnchor.prototype.updateHAlignStyle = function () {
for (var key in this.HALIGN_ACCEPT_STYLE[this.childNode.style.hAlign]) {
if (this.HALIGN_ACCEPT_STYLE[this.childNode.style.hAlign][key]) {
this.childNode.style[key] = key;
} else {
this.domElt.removeStyle(key);
}
}
this.setStyle('width', this.childNode.style.width);
this.setStyle('height', this.childNode.style.height);
};
Object.defineProperty(RelativeAnchor.prototype, 'view', {
get: function () {
return this.domElt;
}
});
var _default = RelativeAnchor;
exports.default = _default;
Server : Apache/2.4.41 (Ubuntu)