MontoyaTech/ignite-html-material
MontoyaTech/ignite-html-material
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fixed a minor bug within the popper and cleaned up some of the code.

Browse Source
This commit is contained in:
Matt Mo 2020-12-01 15:34:12 -08:00
parent 5c58d35be4
commit 5f30daca21
1 changed files with 8 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
popper.js
View File

@ -30,14 +30,14 @@ class Popper extends IgniteElement {
return this.template.child(
new slot(this)
.style("position", "absolute")
.style("top", this.position, true, value => { return value == "bottom" ? "100%" : null; })
.style("bottom", this.position, true, value => { return value == "top" ? "100%" : null; })
.style("margin-top", this.position, true, value => { return this.position == "bottom" ? this.offset : null })
.style("margin-bottom", this.position, true, value => { return this.position == "top" ? this.offset : null })
.style("top", this.position, true, value => value == "bottom" ? "100%" : null)
.style("bottom", this.position, true, value => value == "top" ? "100%" : null)
.style("margin-top", this.position, true, value => this.position == "bottom" ? this.offset : null)
.style("margin-bottom", this.position, true, value => this.position == "top" ? this.offset : null)
.style("left", "0")
.style("width", "100%")
.style("z-index", "99999")
.hide(this.show, value => { return !value; })
.hide(this.show, value => !value)
);
}
@ -54,8 +54,7 @@ class Popper extends IgniteElement {
}
//Only perform the calculation if we are ready.
if (this.offsetParent && this.firstChild)
{
if (this.offsetParent && this.firstChild) {
var bounds = this.firstChild.getBoundingClientRect();
var parentBounds = this.offsetParent.getBoundingClientRect();
@ -66,9 +65,9 @@ class Popper extends IgniteElement {
offset = this.firstChild.offsetTop - parentBounds.height;
}
if (bounds.y < 0 && this.position != "bottom" && (bounds.y + (bounds.height * 2) + offset + parentBounds.height) < window.innerHeight) {
if (bounds.y < 0 && this.position != "bottom" && (bounds.y + (bounds.height * 2) + (offset * 2) + parentBounds.height) < window.innerHeight) {
this.position = "bottom";
} else if (bounds.y + bounds.height + offset >= window.innerHeight && this.position != "top") {
} else if (bounds.y + bounds.height >= window.innerHeight && this.position != "top") {
this.position = "top";
} else if (parentBounds.height + parentBounds.y + bounds.height + offset <= window.innerHeight && this.position != "bottom") {
this.position = "bottom";