Refactor transparency logic and improve button interaction in PatchVisualizer

- Simplified transparency handling in the SelectionOption component to enhance hover effects for parent-only and normal nodes.
- Updated the DomLabel component to ensure the button is active for input events, improving user interaction.
- Cleaned up comments for clarity and maintainability.
This commit is contained in:
Joe 2026-02-01 10:42:02 -06:00
parent b2ce199a37
commit df70dc1ff4
4 changed files with 38 additions and 21 deletions

View file

@ -80,9 +80,7 @@ function SelectionOption:render()
-- Use wider button for "Studio" text (6 chars vs 4 for others)
local buttonWidth = if props.text == "Studio" then 44 else 36
-- Transparency logic:
-- - Parent-only nodes: more transparent when not hovered, less so when hovering button
-- - Normal nodes: standard transparency based on selection
-- Transparency logic with hover effect
local bgTransparency, txtTransparency
if isParentOnly then
-- Parent-only: partially transparent, less so when hovering the button
@ -93,8 +91,13 @@ function SelectionOption:render()
return if isHovered then 0 + t else 0.3 + (0.7 * t)
end)
else
-- Normal buttons: show hover effect by reducing transparency
bgTransparency = props.transparency:map(function(t)
return if isSelected then 0.1 + (0.9 * t) else 0.7 + (0.3 * t)
if isSelected then
return if isHovered then 0 + (1 * t) else 0.1 + (0.9 * t)
else
return if isHovered then 0.5 + (0.5 * t) else 0.7 + (0.3 * t)
end
end)
txtTransparency = props.transparency
end
@ -373,6 +376,7 @@ function DomLabel:render()
PaddingRight = UDim.new(0, 10),
}),
Button = e("Frame", {
Active = true, -- Required for InputBegan to work on Frames
BackgroundTransparency = 1,
Size = UDim2.new(1, 0, 1, 0),
[Roact.Event.MouseEnter] = function()

View file

@ -173,9 +173,9 @@ function ConfirmingPage:render()
})
else nil,
Accept = e(TextButton, {
text = if hasChanges then "Accept" else "OK",
style = "Primary",
Accept = e(TextButton, {
text = if hasChanges then "Accept" else "OK",
style = "Primary",
transparency = self.props.transparency,
layoutOrder = 2,
onClick = function()

View file

@ -124,9 +124,9 @@ function NotConnectedPage:render()
}),
}),
Connect = e(TextButton, {
text = "Sync",
style = "Primary",
Connect = e(TextButton, {
text = "Sync",
style = "Primary",
transparency = self.props.transparency,
layoutOrder = 2,
onClick = self.props.onConnect,