This commit is contained in:
2021-08-14 14:35:10 +03:00
parent 6da6da6ad0
commit a66ccba187
63 changed files with 24744 additions and 0 deletions
+220
View File
@@ -0,0 +1,220 @@
kit.PluginManager.register('align',function() {
var AlignClass = function(){
var Align = function()
{
this.reset();
this.node = null;
this.parentNode = null;
this.offsetHorizontal = 0;
this.offsetVertical = 0;
this.offset = 0;
};
/**
* @param node HTMLElement
* @return {Align}
*/
Align.prototype.setNode = function(node){
this.node = node;
return this;
};
/**
* @param node HTMLElement
* @return {Align}
*/
Align.prototype.setParentNode = function(node){
this.parentNode = node;
return this;
};
/**
* @return {Align}
*/
Align.prototype.reset = function(hor = true, vert = true){
if(hor) {
this.right = {applicability: 0, valid: false};
this.left = {applicability: 0, valid: false};
}
if(vert) {
this.top = {applicability: 0, valid: false};
this.bottom = {applicability: 0, valid: false};
}
return this;
};
Align.prototype.getContentSizes = function() {
return {
InnerWidth: window.innerWidth,
InnerHeight: window.innerHeight,
};
};
/**
* @param top bool
* @param inner bool
* @return {Align}
*/
Align.prototype.setVertical = function(top = false, inner = false){
var contentSizes = this.getContentSizes();
this.reset(false, true);
if(top){
!this.calcTop(contentSizes, inner) && this.calcBottom(contentSizes, inner);
} else {
!this.calcBottom(contentSizes, inner) && this.calcTop(contentSizes, inner);
}
if(!this.top.valid && !this.bottom.valid) {
if(this.top.applicability > this.bottom.applicability || contentSizes.InnerHeight < this.node.offsetHeight) {
this.calcTop(contentSizes, inner, true);
} else {
this.calcBottom(contentSizes, inner, true);
}
}
return this;
};
Align.prototype.calcTop = function (contentSizes, inner, extra = false) {
var top, offset;
this.node.setAttribute('data-kit-align-vertical','top');
offset = this.offsetVertical || this.offset;
if(inner) {
top = 0 - this.node.offsetHeight + this.parentNode.offsetHeight - this.parentNode.clientTop - offset;
} else {
top = 0 - this.parentNode.clientTop - this.node.offsetHeight + this.node.clientTop - offset;
}
this.node.style.top = '' + top + 'px';
this.node.style.bottom = 'unset';
if(extra) {
this.checkTop(contentSizes);
this.node.style.top = (top - this.top.applicability) + 'px';
return false;
}
return this.checkTop(contentSizes);
};
Align.prototype.calcBottom = function (contentSizes, inner, extra = false) {
var top, offset;
this.node.setAttribute('data-kit-align-vertical','bottom');
offset = this.offsetVertical || this.offset;
if(inner) {
top = 0 - this.parentNode.clientTop + offset;
} else {
top = this.parentNode.offsetHeight - this.parentNode.clientTop + offset;
}
this.node.style.top = '' + top + 'px';
this.node.style.bottom = 'unset';
if(extra) {
this.checkBottom(contentSizes);
this.node.style.top = (top + this.bottom.applicability) + 'px';
return false;
}
return this.checkBottom(contentSizes);
};
Align.prototype.checkTop = function (contentSizes) {
var b = this.node.getBoundingClientRect();
this.top.applicability = b.top - 0;
this.top.valid = b.top >= 0;
return this.top.valid;
};
Align.prototype.checkBottom = function (contentSizes) {
var b = this.node.getBoundingClientRect();
this.bottom.applicability = contentSizes.InnerHeight - (b.top + b.height);
this.bottom.valid = contentSizes.InnerHeight >= (b.top + b.height);
return this.bottom.valid;
};
/**
* @param right bool
* @param inner bool
* @return {Align}
*/
Align.prototype.setHorizontal = function(right = true, inner = false){
var contentSizes = this.getContentSizes();
this.reset(true, false);
if(right){
!this.calcRight(contentSizes, inner) && this.calcLeft(contentSizes, inner);
} else {
!this.calcLeft(contentSizes, inner) && this.calcRight(contentSizes, inner);
}
if(!this.left.valid && !this.right.valid) {
if(this.left.applicability > this.right.applicability || contentSizes.InnerWidth < this.node.offsetWidth) {
this.calcLeft(contentSizes, inner, true);
} else {
this.calcRight(contentSizes, inner, true)
}
}
return this;
};
Align.prototype.calcLeft = function (contentSizes, inner, extra = false) {
var left, offset;
this.node.setAttribute('data-kit-align-horizontal','left');
offset = this.offsetHorizontal || this.offset;
if(inner) {
left = 0 - this.node.offsetWidth + this.parentNode.offsetWidth - this.parentNode.clientLeft - offset;
} else {
left = 0 - this.parentNode.clientLeft - this.node.offsetWidth + this.node.clientLeft - offset;
}
this.node.style.left = '' + left + 'px';
this.node.style.right = 'unset';
if(extra) {
this.checkLeft(contentSizes);
this.node.style.left = (left - this.left.applicability) + 'px';
return false;
}
return this.checkLeft(contentSizes);
};
Align.prototype.calcRight = function (contentSizes, inner, extra = false) {
var left, offset;
this.node.setAttribute('data-kit-align-horizontal','right');
offset = this.offsetHorizontal || this.offset;
if(inner) {
left = 0 - this.parentNode.clientLeft + offset;
} else {
left = this.parentNode.offsetWidth - this.parentNode.clientLeft + offset;
}
this.node.style.left = '' + left + 'px';
this.node.style.right = 'unset';
if(extra) {
this.checkRight(contentSizes);
this.node.style.left = (left + this.right.applicability) + 'px';
return false;
}
return this.checkRight(contentSizes);
};
Align.prototype.checkLeft = function (contentSizes) {
var b = this.node.getBoundingClientRect();
this.left.applicability = b.left - 0;
this.left.valid = b.left >= 0;
return this.left.valid;
};
Align.prototype.checkRight = function (contentSizes) {
var b = this.node.getBoundingClientRect();
this.right.applicability = contentSizes.InnerWidth - (b.left + b.width);
this.right.valid = contentSizes.InnerWidth >= (b.left + b.width);
return this.right.valid;
};
return Align;
}();
this.Class = AlignClass;
return this;
});