phast/lib/phast/client/scripts/controls/AdditionalDetailWidget.js

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 ()
	{
		if (!System.ClassList.Contains(this.Parent, "apb-selected"))
		{
			this.OnOpening();
		}
		System.ClassList.Toggle(this.Parent, "apb-selected");
	};

	this.OnOpening = function()
	{

	};

	if (parent.children[0].tagName === "IMG")
	{
		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
	this.TextLink.NativeObject = this;
	this.TextLink.addEventListener("keydown", function(e)
	{
		if (e.keyCode == 9)
		{
			if (!e.shiftKey)
			{
				this.focusIndex = 1;
				// tab
				this.NativeObject.ButtonLink.tabIndex = -1;
				this.NativeObject.ButtonLink.focus();
				console.log("focused");
				console.log(this.NativeObject.ButtonLink);

				// just.. eat it!
				e.preventDefault();
				e.stopPropagation();
				return false;
			}
		}
	});
	
	this.TextLink.NativeObject = this;
	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)
			{
				this.NativeObject.ButtonLink.focus();
			}
		}
	});
	
	this.ButtonLink.NativeObject = this;
	this.ButtonLink.addEventListener("click", function (e)
	{
		if (e.which == MouseButtons.Primary)
		{
			this.NativeObject.Show();
			
			e.preventDefault();
			e.stopPropagation();
			return false;
		}
	});
	this.ButtonLink.addEventListener("keydown", function (e)
	{
		if (e.keyCode == 13 || e.keyCode == 32) // enter or space
		{
			this.NativeObject.Toggle();

			e.preventDefault();
			e.stopPropagation();
			return false;
		}
		// console.log("keydown on button"); console.log(e);
	});
}
window.addEventListener("load", function(e)
{
	var items = document.getElementsByClassName("uwt-actionpreviewbutton");
	for (var i = 0; i < items.length; i++)
	{
		items[i].NativeObject = new AdditionalDetailWidget(items[i]);
	}
});
window.addEventListener("mousedown", function (e)
{
	var sender = null;
	if (!e) e = window.event;
	if (e.target)
	{
		sender = e.target;
	}
	else if (e.srcElement)
	{
		sender = e.srcElement;
	}
	if (!System.TerminateIfSenderIs(sender, ["uwt-actionpreviewbutton"]))
	{
		var items = document.getElementsByClassName("uwt-actionpreviewbutton");
		for (var i = 0; i < items.length; i++)
		{
			items[i].NativeObject.Hide();
		}
	}
});
window.addEventListener("keydown", function (e)
{
	if (e.keyCode == 27)
	{
		// cancel all APBs if they are open
		var items = document.getElementsByClassName("uwt-actionpreviewbutton");
		for (var i = 0; i < items.length; i++)
		{
			items[i].NativeObject.Hide();
		}
	}
});