Context Menu Widget

[Andy90]

I think a context menu widget is an realy helpfull widget for gui's. I created a script to create one. I will post it in case some needs it

1. Context Menu Script

Script.itemHeight = 22 --Height of the menu entry
Script.hovered = false --Is hovered variable
Script.menuItems = {} --The menu items as table
Script.padding = 2 --The padding between the menu entrys

--Shows the context menu
function Script:ShowContextMenu(x, y)
	self:HideContextMenu()
	local sz = self.widget:GetSize(true)
	local height = self:CalculateHeight()
	self.widget:SetLayout(x, y, sz.width, height)
	self.widget:Show()
	self.widget:Redraw()
end

--Hides the context menu
function Script:HideContextMenu()
	self.widget:Hide()
	self.widget:GetParent():Redraw()
end

--Sets new context menu items
function Script:SetContextMenuItems(contextMenuItems)
	self.menuItems = contextMenuItems
	self.widget:Redraw()
end

--Calculates the height of the context menu
function Script:CalculateHeight()
	return (#self.menuItems * self.itemHeight) + (#self.menuItems * self.padding) + self.padding
end

--Renders the context menu
function Script:Draw(x, y, width, height)
	local gui = self.widget:GetGUI()
	local pos = self.widget:GetPosition(true)
	local sz = self.widget:GetSize(true)
	local fontHeight = gui:GetFontHeight()
	local height = self:CalculateHeight()

	local iX = pos.x + self.padding
	local iY = pos.y + self.padding
	local iWidth = sz.width - (self.padding * 2)

	gui:SetColor(0.145, 0.145, 0.145)
	gui:DrawRect(pos.x, pos.y, sz.width, height, 0)
	gui:SetColor(0, 0, 0)
	gui:DrawRect(pos.x, pos.y, sz.width, height, 1)

	for _, item in ipairs(self.menuItems) do
		local centerX = (iX + sz.width) / 2
		local textX = centerX - (gui:GetTextWidth(item.Text) / 2)
		local textY = (iY + (self.itemHeight / 2)) - ((gui:GetFontHeight() / 2) - self.padding)

		if self:IsItemHovered(iX, iY, iWidth, self.itemHeight) then
			gui:SetColor(0.075, 0.075, 0.075)
			item.Hovered = true
		else
			gui:SetColor(0.175, 0.175, 0.175)
			item.Hovered = false
		end
		gui:DrawRect(iX, iY, iWidth, self.itemHeight, 0)
		gui:SetColor(1, 1, 1)
		gui:DrawText(item.Text, iX + self.padding, textY, iWidth, self.itemHeight)
		iY = iY + self.itemHeight + self.padding
	end
end


--Returns the hovered item
function Script:GetHoveredItem()
	for _, item in ipairs(self.menuItems) do
		if item.Hovered then
			return item
		end
	end
	return nil
end

--On mouse enter event
function Script:MouseEnter(x, y)
	self.hovered = true
	self.widget:Redraw()
end

--On mouse leave event
function Script:MouseLeave(x, y)
	self.hovered = false
	self.widget:Redraw()
end

--On mouse down event
function Script:MouseDown(button, x, y)
	if button == Mouse.Left then
		self.widget:Redraw()
	end
end

--On mouse up event
function Script:MouseUp(button, x, y)
	if button == Mouse.Left then
		if self.hovered then
			EventQueue:Emit(Event.WidgetAction, self.widget)
			local selectedItem = self:GetHoveredItem()
			if selectedItem ~= nil then
				selectedItem.OnClick(selectedItem)
			end
			self:HideContextMenu()
		end
		self.widget:Redraw()
	end
end

--On mouse move event
function Script:MouseMove(x, y)
	self.widget:Redraw()
end

--Check if a item is hovered
function Script:IsItemHovered(x, y, width, height)
	if self.hovered then
		local mousePos = Window:GetCurrent():GetMousePosition()
		if mousePos.x > x and mousePos.y > y and mousePos.x < x + width and mousePos.y < y + height then
			return true
		end
	end
	return false
end

2. Intial the widget

	self.contextMenu = Widget:Create("", 15, 15, 150, 64, base, "Scripts/Own/GUI/ContextMenu.lua")
	local menuItems = {
		{
			Text = "Unequip",
			OnClick = function() 
				System:Print("Unequip Item")
				self.ivEquipItem3.script:ClearItem()
				self.Tool = nil
			end
		}, 
		{
			Text = "Repair Item",
			OnClick = function() 
				System:Print("Repair Item")
			end
		}
	}
	self.contextMenu.script:SetContextMenuItems(menuItems)
	self.contextMenu.script:HideContextMenu()	

3. Open the context menu widget

function IvEquipItem3Click(event, parent)
	local mousePos = window:GetMousePosition()
	parent.contextMenu.script:ShowContextMenu(mousePos.x,mousePos.y)
end