This commit is contained in:
2021-12-16 13:04:32 +03:00
parent b94cb967a6
commit 636cd65c78
21 changed files with 342 additions and 57 deletions
+49 -20
View File
@@ -27,6 +27,10 @@ kit.PluginManager.register('align',function(module, exports, require) {
}
var metrics = {};
if(this.node instanceof HTMLElement) {
var pr = getBoundingClientRect(this.node.offsetParent);
var nr = getBoundingClientRect(this.node);
metrics = {
offsetHeight: this.node.offsetHeight,
offsetWidth: this.node.offsetWidth,
@@ -36,39 +40,39 @@ kit.PluginManager.register('align',function(module, exports, require) {
offsetTop: this.node.offsetTop,
clientLeft: this.node.clientLeft,
clientTop: this.node.clientTop,
clientRight: this.node.offsetWidth - this.node.clientWidth,
clientBottom: this.node.offsetHeight - this.node.clientHeight,
clientRight: this.node.offsetWidth - this.node.clientWidth - this.node.clientLeft,
clientBottom: this.node.offsetHeight - this.node.clientHeight - this.node.clientTop,
offsetRight: document.body.offsetWidth - this.node.offsetLeft - this.node.offsetWidth,
offsetBottom: window.innerHeight - this.node.offsetTop - this.node.offsetHeight,
offsetRight: pr.right - nr.right,
offsetBottom: pr.bottom - nr.bottom,
};
metrics = Object.assign({}, getBoundingClientRect(this.node), metrics);
metrics = Object.assign({}, nr, metrics);
}
if(this.node instanceof Window) {
metrics = {
offsetHeight: window.innerHeight,
offsetWidth: document.body.offsetWidth,
clientHeight: window.innerHeight,
offsetWidth: window.innerWidth,
clientHeight: document.body.offsetHeight,
clientWidth: document.body.offsetWidth,
offsetLeft: 0,
offsetTop: 0,
offsetLeft: window.pageXOffset,
offsetTop: window.pageYOffset,
clientLeft: 0,
clientTop: 0,
clientRight: 0,
clientBottom: 0,
clientRight: window.innerWidth - document.body.offsetWidth,
clientBottom: window.innerHeight - document.body.offsetHeight,
offsetRight: 0,
offsetBottom: 0,
offsetRight: document.body.scrollWidth - document.body.offsetWidth - window.pageXOffset,
offsetBottom: document.body.scrollHeight - document.body.offsetHeight - window.pageYOffset,
};
metrics = Object.assign({
left: 0,
top: 0,
right: document.body.offsetWidth,
bottom: window.innerHeight,
bottom: document.body.offsetHeight,
x: 0,
y: 0,
width: document.body.offsetWidth,
height: window.innerHeight,
height: document.body.offsetHeight,
}, metrics)
}
Object.assign(this, metrics);
@@ -173,7 +177,7 @@ kit.PluginManager.register('align',function(module, exports, require) {
this.style = {
start: function (extra) {
this.nodeMetricsLine.node.style[this.map.style.start()] = '' + ((!this.valid && extra)?this.shiftExtra:this.shift) + 'px';
this.nodeMetricsLine.node.style[this.map.style.start()] = '' + (extra?this.shiftExtra:this.shift) + 'px';
}.bind(this),
end: function (extra) {
this.nodeMetricsLine.node.style[this.map.style.end()] = 'unset';
@@ -233,7 +237,7 @@ kit.PluginManager.register('align',function(module, exports, require) {
};
var getShiftWhenHidingNodeUnderLimiterStart = function(shift) {
var d = this.parentMetricsLine.start + shift - this.limiterMetricsLine.start;
var d = this.parentMetricsLine.start + shift - Math.min(this.limiterMetricsLine.start, this.parentMetricsLine.end);
if(d < 0) {
shift = shift - d;
}
@@ -253,7 +257,13 @@ kit.PluginManager.register('align',function(module, exports, require) {
return (this.parentMetricsLine.start + this.shift) >= this.limiterMetricsLine.start;
}.bind(this),
shiftExtra: function () {
return getShiftWhenHidingNodeUnderLimiterStart(this.shift - this.applicability);
var shift = getShiftWhenHidingNodeUnderLimiterStart(this.shift);
var applicability = 0;
if(!this.valid) {
applicability = (this.parentMetricsLine.start + shift) - this.limiterMetricsLine.start;
shift = getShiftWhenHidingNodeUnderLimiterStart(shift - applicability);
}
return shift;
}.bind(this),
},
end: {
@@ -267,7 +277,13 @@ kit.PluginManager.register('align',function(module, exports, require) {
return this.limiterMetricsLine.end >= (this.parentMetricsLine.start + this.nodeMetricsLine.length + this.shift);
}.bind(this),
shiftExtra: function () {
return getShiftWhenHidingNodeUnderLimiterStart(this.shift + this.applicability);
var shift = getShiftWhenHidingNodeUnderLimiterStart(this.shift);
var applicability = 0;
if(!this.valid) {
applicability = this.limiterMetricsLine.end - (this.parentMetricsLine.start + this.nodeMetricsLine.length + shift);
shift = getShiftWhenHidingNodeUnderLimiterStart(shift + applicability);
}
return shift;
}.bind(this),
},
/**
@@ -284,7 +300,13 @@ kit.PluginManager.register('align',function(module, exports, require) {
return this.limiterMetricsLine.end >= (this.parentMetricsLine.start + this.nodeMetricsLine.length + this.shift);
}.bind(this),
shiftExtra: function () {
return getShiftWhenHidingNodeUnderLimiterStart(this.shift + this.applicability);
var shift = getShiftWhenHidingNodeUnderLimiterStart(this.shift);
var applicability = 0;
if(!this.valid) {
applicability = this.limiterMetricsLine.end - (this.parentMetricsLine.start + this.nodeMetricsLine.length + shift);
shift = getShiftWhenHidingNodeUnderLimiterStart(shift + applicability);
}
return shift;
}.bind(this),
},
},
@@ -569,6 +591,13 @@ kit.PluginManager.register('align',function(module, exports, require) {
if(!['absolute', 'relative'].includes(this.__nodeComputedStyle.position)) {
this.node.style.position = 'absolute';
}
if(!this.__parentNodeComputedStyle) {
this.__parentNodeComputedStyle = getComputedStyle(this.parentNode);
}
if(!['absolute', 'relative', 'fixed'].includes(this.__parentNodeComputedStyle.position)) {
this.parentNode.style.position = 'relative';
}
};
AlignClass.prototype.setEx = function(axis, align, direction){