Port PoB2 socket position views

Author: vaisest

src/Classes/CompareTab.lua

@@ -13,6 +13,7 @@ local tradeHelpers = LoadModule("Classes/TradeHelpers")
 local buySimilar = LoadModule("Classes/CompareBuySimilar")
 local calcsHelpers = LoadModule("Classes/CompareCalcsHelpers")
 local buildListHelpers = LoadModule("Modules/BuildListHelpers")
+local itemSlotHelper = LoadModule("Modules/ItemSlotHelper")
 local configVisibility = LoadModule("Modules/ConfigVisibility")
 
 -- Node IDs below this value are normal passive tree nodes; IDs at or above are cluster jewel nodes
@@ -3797,13 +3798,33 @@ function CompareTabClass:DrawItems(vp, compareEntry, inputEvents)
 			drawY = drawY + maxH + 6
 		else
 			-- === COMPACT MODE ===
+			local slot = self.primaryBuild.itemsTab.slots[equipSlotName]
+			local nodeId = slot and slot.nodeId
+			local shouldUnderline = not not nodeId
 			local pHover, cHover, b1Hover, b2Hover, b3Hover, b2X, b2Y, b2W, b2H,
 				rowHoverItem, rowHoverItemsTab, rowHoverX, rowHoverY, rowHoverW, rowHoverH =
 				tradeHelpers.drawCompactSlotRow(drawY, label, pItem, cItem,
 					colWidth, cursorX, cursorY, labelW,
 					self.primaryBuild.itemsTab, compareEntry.itemsTab, pWarn, cWarn, slotMissing,
-					LAYOUT.itemsCopyBtnW, LAYOUT.itemsCopyBtnH, LAYOUT.itemsBuyBtnW, LAYOUT.itemsEquipBtnW, scrollOffsetX)
-
+					LAYOUT.itemsCopyBtnW, LAYOUT.itemsCopyBtnH, LAYOUT.itemsBuyBtnW, LAYOUT.itemsEquipBtnW, scrollOffsetX,
+					shouldUnderline)
+
+			local labelX = (scrollOffsetX or 0) + 10
+			-- draw passive tree view when hovering over the label, if the slot is a jewel socket
+			if labelX <= cursorX and cursorX <= (labelX + labelW)
+				and drawY < cursorY and cursorY <= (drawY + 20) then
+				if nodeId then
+					local boxSize = 250
+					-- anchor bottom left to label top left, keeping in mind what our viewport was
+					SetViewport()
+					local boxX = vp.x + labelX
+					local boxY = (vp.y + checkboxOffset) + drawY - boxSize
+					itemSlotHelper.DrawViewer(self.primaryBuild.itemsTab, nodeId, boxX, boxY, boxSize,
+						boxSize)
+					-- restore viewport
+					SetViewport(vp.x, vp.y + checkboxOffset, vp.width, scrollViewH)
+				end
+			end
 			if rowHoverItem then
 				hoverItem = rowHoverItem
 				hoverItemsTab = rowHoverItemsTab

src/Classes/ItemSlotControl.lua

@@ -7,6 +7,7 @@ local pairs = pairs
 local t_insert = table.insert
 local m_min = math.min
 
+local itemSlotHelper = LoadModule("Modules/ItemSlotHelper")
 local ItemSlotClass = newClass("ItemSlotControl", "DropDownControl", function(self, anchor, x, y, itemsTab, slotName, slotLabel, nodeId)
 	self.DropDownControl(anchor, {x, y, 310, 20}, { }, function(index, value)
 		if self.items[index] ~= self.selItemId then
@@ -135,30 +136,15 @@ function ItemSlotClass:Draw(viewPort)
 	self.DropDownControl:Draw(viewPort)
 	self:DrawControls(viewPort)
 	if not main.popups[1] and self.nodeId and (self.dropped or (self:IsMouseOver() and (self.otherDragSource or not self.itemsTab.selControl))) then
-		SetDrawLayer(nil, 15)
+		local width = 308
+		local height = 280
 		local viewerY
 		if self.DropDownControl.dropUp and self.DropDownControl.dropped then
 			viewerY = y + 20
 		else
-			viewerY = m_min(y - 300 - 5, viewPort.y + viewPort.height - 304)
+			viewerY = m_min(y - height - 4, viewPort.y + viewPort.height - height)
 		end
-		local viewerX = x
-		SetDrawColor(1, 1, 1)
-		DrawImage(nil, viewerX, viewerY, 304, 304)
-		local viewer = self.itemsTab.socketViewer
-		local node = self.itemsTab.build.spec.nodes[self.nodeId]
-		viewer.zoom = 5
-		local scale = self.itemsTab.build.spec.tree.size / 1500
-		viewer.zoomX = -node.x / scale
-		viewer.zoomY = -node.y / scale
-		SetViewport(viewerX + 2, viewerY + 2, 300, 300)
-		viewer:Draw(self.itemsTab.build, { x = 0, y = 0, width = 300, height = 300 }, { })
-		SetDrawLayer(nil, 30)
-		SetDrawColor(1, 1, 1, 0.2)
-		DrawImage(nil, 149, 0, 2, 300)
-		DrawImage(nil, 0, 149, 300, 2)
-		SetViewport()
-		SetDrawLayer(nil, 0)
+		itemSlotHelper.DrawViewer(self.itemsTab, self.nodeId, x, viewerY, width, height)
 	end
 end
 

src/Classes/TradeHelpers.lua

@@ -443,7 +443,7 @@ local ITEM_BOX_H = 20
 
 function M.drawCompactSlotRow(drawY, slotLabel, pItem, cItem,
 	colWidth, cursorX, cursorY, maxLabelW, primaryItemsTab, compareItemsTab, pWarn, cWarn, slotMissing,
-	copyBtnW, copyBtnH, buyBtnW, equipBtnW, xOffset)
+	copyBtnW, copyBtnH, buyBtnW, equipBtnW, xOffset, shouldUnderlineLabel)
 
 	xOffset = xOffset or 0
 	local pName = pItem and pItem.name or "(empty)"
@@ -473,7 +473,13 @@ function M.drawCompactSlotRow(drawY, slotLabel, pItem, cItem,
 
 	-- Draw slot label
 	SetDrawColor(1, 1, 1)
-	DrawString(labelX, drawY + 2, "LEFT", 16, "VAR", "^7" .. slotLabel .. ":")
+	local labelText = "^7" .. slotLabel .. ":"
+	DrawString(labelX, drawY + 2, "LEFT", 16, "VAR", labelText)
+
+	if shouldUnderlineLabel then
+		local labelW = DrawStringWidth(16, "VAR", labelText)
+		DrawImage(nil, labelX, drawY + 2 + 16, labelW, 1)
+	end
 
 	-- Draw primary item box
 	local pBorderGray = pHover and 0.5 or 0.33

src/Classes/TradeQuery.lua

@@ -6,6 +6,7 @@
 
 
 local dkjson = require "dkjson"
+local itemSlotHelper = LoadModule("Modules/ItemSlotHelper")
 
 local get_time = os.time
 local t_insert = table.insert
@@ -1007,6 +1008,18 @@ function TradeQueryClass:PriceItemRowDisplay(row_idx, top_pane_alignment_ref, ro
 	controls["bestButton"..row_idx].shown = function() return not self.resultTbl[row_idx] end
 	controls["bestButton"..row_idx].enabled = function() return self.pbLeague end
 	controls["bestButton"..row_idx].tooltipText = "Creates a weighted search to find the highest Stat Value items for this slot."
+	controls["bestButton" .. row_idx].onHover = function()
+		local button = controls["bestButton" .. row_idx]
+		local x, y = button:GetPos()
+		local buttonWidth, _ = button:GetSize()
+		local nodeId = slotTbl.nodeId
+		if not nodeId then return end
+		local boxSize = 250
+		-- anchor bottom to top of button
+		local viewerY = y - boxSize - 4
+		local viewerX = x - boxSize / 2 + buttonWidth / 2
+		itemSlotHelper.DrawViewer(self.itemsTab, nodeId, viewerX, viewerY, boxSize, boxSize)
+	end
 	local pbURL
 	controls["uri"..row_idx] = new("EditControl", { "TOPLEFT", controls["bestButton"..row_idx], "TOPRIGHT"}, {8, 0, 514, row_height}, nil, nil, "^%C\t\n", nil, function(buf)
 		local subpath = buf:match(self.hostName .. "trade/search/(.+)$") or ""

src/Modules/ItemSlotHelper.lua

@@ -0,0 +1,40 @@
+local M = {}
+
+-- Draws a small display window of a jewel socket's position. Note that this will reset the
+-- viewport and the draw layer.
+---@param nodeId integer
+---@param x integer
+---@param y integer
+---@param w integer
+---@param h integer
+function M.DrawViewer(itemsTab, nodeId, x, y, w, h)
+	local node = itemsTab.build.spec.nodes[nodeId]
+	if not node then return end
+	SetDrawLayer(nil, 15)
+	SetDrawColor(1, 1, 1)
+
+	local borderWidth = 1
+	DrawImage(nil, x, y, w + 2 * borderWidth, h + 2 * borderWidth)
+
+	local viewer = itemsTab.socketViewer
+
+	viewer.zoom = 17
+
+	local viewPortSize = math.min(w, h)
+	local scale = itemsTab.build.spec.tree.size / (viewPortSize * viewer.zoom)
+	viewer.zoomX = -node.x / scale
+	viewer.zoomY = -node.y / scale
+	-- offset viewport to be inside borders
+	SetViewport(x + borderWidth, y + borderWidth, w, h)
+	-- draw the actual image
+	viewer:Draw(itemsTab.build, { x = 0, y = 0, width = w, height = h }, {})
+	SetDrawLayer(nil, 30)
+	SetDrawColor(1, 1, 1, 0.2)
+	-- draw crosshair
+	DrawImage(nil, math.floor(w / 2) - 1, 0, 2, h)
+	DrawImage(nil, 0, math.floor(h / 2) - 1, w, 2)
+	SetViewport()
+	SetDrawLayer(nil, 0)
+end
+
+return M