ensure the popup remains onscreen if it would go past the client area

This commit is contained in:
Michael Becker 2024-01-20 00:53:35 -05:00
parent 63c16be86d
commit d99b1317ea

View File

@ -1,13 +1,68 @@
function AdditionalDetailWidget(parent)
{
this.Parent = parent;
this.Parent.addEventListener("transitionend", function(e)
{
if (!System.ClassList.Contains(this, "apb-selected"))
{
System.ClassList.Remove(document.body, "uwt-prevent-scrolling");
}
});
this.InitializePopupLocation = function()
{
this.PreviewElement.style.top = "";
this.PreviewElement.style.left = "";
this.PreviewElement.style.position = "fixed";
};
this.UpdatePopupLocation = function()
{
this.InitializePopupLocation();
if (System.ClassList.Contains(this.PreviewElement, "uwt-loading"))
{
return;
}
var buttonRect = this.ButtonLink.getBoundingClientRect();
console.log ("button rect: ");
console.log(buttonRect);
var previewRect = this.PreviewElement.getBoundingClientRect();
console.log ("preview rect: ");
console.log(previewRect);
this.PreviewElement.style.top = buttonRect.bottom + "px";
this.PreviewElement.style.left = buttonRect.right + "px";
var offsetBottom = this.PreviewElement.offsetTop + previewRect.height;
console.log ("popup bottom: " + offsetBottom);
console.log ("document height: " + document.body.clientHeight);
this.PreviewElement.style.left = buttonRect.right + "px";
if (offsetBottom > document.body.clientHeight)
{
this.PreviewElement.style.top = "";
this.PreviewElement.style.bottom = (document.body.clientHeight - buttonRect.top) + "px";
}
else
{
this.PreviewElement.style.top = buttonRect.bottom + "px";
this.PreviewElement.style.bottom = "";
}
};
this.Show = function ()
{
System.ClassList.Add(document.body, "uwt-prevent-scrolling");
this.UpdatePopupLocation();
this.OnOpening();
System.ClassList.Add(this.Parent, "apb-selected");
};
this.Hide = function ()
{
System.ClassList.Remove(document.body, "uwt-prevent-scrolling");
System.ClassList.Remove(this.Parent, "apb-selected");
};
this.Toggle = function ()
@ -29,12 +84,14 @@ function AdditionalDetailWidget(parent)
this.IconElement = parent.children[0];
this.TextLink = parent.children[1];
this.ButtonLink = parent.children[2];
this.PreviewElement = parent.children[3];
}
else
{
this.IconElement = null;
this.TextLink = parent.children[0];
this.ButtonLink = parent.children[1];
this.PreviewElement = parent.children[2];
}
// aria
@ -64,7 +121,7 @@ function AdditionalDetailWidget(parent)
this.TextLink.addEventListener("focus", function(e)
{
if (e.relatedTarget !== null)
{
{Show
var pos = this.compareDocumentPosition(e.relatedTarget);
if (pos == Node.DOCUMENT_POSITION_FOLLOWING && e.relatedTarget !== this.NativeObject.ButtonLink)
{