alcetech/phast
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Michael Becker 2024-01-20 00:53:35 -05:00
parent 63c16be86d
commit d99b1317ea
1 changed files with 58 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
lib/phast/client/scripts/controls/AdditionalDetailWidget.js
View File

@ -1,13 +1,68 @@
function AdditionalDetailWidget(parent) function AdditionalDetailWidget(parent)
{ {
this.Parent = 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 () this.Show = function ()
{ {
System.ClassList.Add(document.body, "uwt-prevent-scrolling");
this.UpdatePopupLocation();
this.OnOpening(); this.OnOpening();
System.ClassList.Add(this.Parent, "apb-selected"); System.ClassList.Add(this.Parent, "apb-selected");
}; };
this.Hide = function () this.Hide = function ()
{ {
System.ClassList.Remove(document.body, "uwt-prevent-scrolling");
System.ClassList.Remove(this.Parent, "apb-selected"); System.ClassList.Remove(this.Parent, "apb-selected");
}; };
this.Toggle = function () this.Toggle = function ()
@ -29,12 +84,14 @@ function AdditionalDetailWidget(parent)
this.IconElement = parent.children[0]; this.IconElement = parent.children[0];
this.TextLink = parent.children[1]; this.TextLink = parent.children[1];
this.ButtonLink = parent.children[2]; this.ButtonLink = parent.children[2];
this.PreviewElement = parent.children[3];
} }
else else
{ {
this.IconElement = null; this.IconElement = null;
this.TextLink = parent.children[0]; this.TextLink = parent.children[0];
this.ButtonLink = parent.children[1]; this.ButtonLink = parent.children[1];
this.PreviewElement = parent.children[2];
} }
// aria // aria
@ -64,7 +121,7 @@ function AdditionalDetailWidget(parent)
this.TextLink.addEventListener("focus", function(e) this.TextLink.addEventListener("focus", function(e)
{ {
if (e.relatedTarget !== null) if (e.relatedTarget !== null)
{ {Show
var pos = this.compareDocumentPosition(e.relatedTarget); var pos = this.compareDocumentPosition(e.relatedTarget);
if (pos == Node.DOCUMENT_POSITION_FOLLOWING && e.relatedTarget !== this.NativeObject.ButtonLink) if (pos == Node.DOCUMENT_POSITION_FOLLOWING && e.relatedTarget !== this.NativeObject.ButtonLink)
{ {