From 95c626259518c0081738bad123dcee1c89ec9c37 Mon Sep 17 00:00:00 2001 From: Jack T Date: Wed, 31 Jan 2024 15:03:08 -0800 Subject: [PATCH] Debugger panel improvements (#34) --- lib/debugger/ui.lua | 33 ++++--- lib/debugger/widgets/link.lua | 4 +- lib/debugger/widgets/panel.lua | 2 +- lib/debugger/widgets/selectionList.lua | 129 ++++++++++++++++--------- 4 files changed, 107 insertions(+), 61 deletions(-) diff --git a/lib/debugger/ui.lua b/lib/debugger/ui.lua index d2f1588b..7f7e171a 100644 --- a/lib/debugger/ui.lua +++ b/lib/debugger/ui.lua @@ -120,6 +120,9 @@ local function ui(debugger, loop) plasma.heading("SYSTEMS") plasma.space(10) + local durations = {} + local longestDuration = 0 + for _, eventName in debugger._eventOrder do local systems = loop._orderedSystemsByEvent[eventName] @@ -131,27 +134,33 @@ local function ui(debugger, loop) font = Enum.Font.Gotham, }) plasma.space(5) + local items = {} for _, system in systems do local samples = loop.profiling[system] - local averageFrameTime = "" - local icon - if samples then local duration = rollingAverage.getAverage(samples) - if duration > 0.004 then -- 4ms - icon = "\xe2\x9a\xa0\xef\xb8\x8f" - end + durations[system] = duration + longestDuration = math.max(longestDuration, duration) + end + end - if loop._systemErrors[system] then - icon = "\xf0\x9f\x92\xa5" - end + for index, system in systems do + local averageFrameTime = "" + local icon + + local duration = durations[system] or 0 + local humanDuration, unit = formatDuration(duration) + averageFrameTime = string.format("%.0f%s", humanDuration, unit) - local humanDuration, unit = formatDuration(duration) + if duration > 0.004 then -- 4ms + icon = "\xe2\x9a\xa0\xef\xb8\x8f" + end - averageFrameTime = string.format("%.0f%s", humanDuration, unit) + if loop._systemErrors[system] then + icon = "\xf0\x9f\x92\xa5" end table.insert(items, { @@ -160,6 +169,8 @@ local function ui(debugger, loop) selected = debugger.debugSystem == system, system = system, icon = icon, + barWidth = duration / longestDuration, + index = index, }) end diff --git a/lib/debugger/widgets/link.lua b/lib/debugger/widgets/link.lua index 6c147eac..8083566d 100644 --- a/lib/debugger/widgets/link.lua +++ b/lib/debugger/widgets/link.lua @@ -50,7 +50,7 @@ return function(Plasma) Text = text, TextXAlignment = Enum.TextXAlignment.Left, TextColor3 = color, - TextSize = 16, + TextSize = 14, }), Activated = function() @@ -87,7 +87,7 @@ return function(Plasma) refs.button.Icon.Text = options.icon or "" refs.button.Icon.Visible = not not options.icon - refs.mainText.Font = options.font or Enum.Font.SourceSans + refs.mainText.Font = options.font or Enum.Font.Gotham return { clicked = function() diff --git a/lib/debugger/widgets/panel.lua b/lib/debugger/widgets/panel.lua index 419f9944..16c47cf9 100644 --- a/lib/debugger/widgets/panel.lua +++ b/lib/debugger/widgets/panel.lua @@ -10,7 +10,7 @@ return function(Plasma) Name = "Panel", BackgroundColor3 = style.bg2, Position = UDim2.new(0, 0, 0, 0), - Size = UDim2.new(0, 250, 1, 0), + Size = UDim2.new(0, 260, 1, 0), create("Frame", { -- Account for GUI inset diff --git a/lib/debugger/widgets/selectionList.lua b/lib/debugger/widgets/selectionList.lua index 463f1692..5842b00f 100644 --- a/lib/debugger/widgets/selectionList.lua +++ b/lib/debugger/widgets/selectionList.lua @@ -1,7 +1,7 @@ return function(Plasma) local create = Plasma.create - local Item = Plasma.widget(function(text, selected, icon, sideText) + local Item = Plasma.widget(function(text, selected, icon, sideText, _, barWidth, index) local clicked, setClicked = Plasma.useState(false) local style = Plasma.useStyle() @@ -22,49 +22,80 @@ return function(Plasma) PaddingTop = UDim.new(0, 0), }), - create("UIListLayout", { - SortOrder = Enum.SortOrder.LayoutOrder, - FillDirection = Enum.FillDirection.Horizontal, - Padding = UDim.new(0, 10), - }), - - create("TextLabel", { - Name = "Icon", + create("Frame", { + [ref] = "container", BackgroundTransparency = 1, - Size = UDim2.new(0, 22, 1, 0), - Text = icon, - TextXAlignment = Enum.TextXAlignment.Left, - TextSize = 16, - TextColor3 = style.textColor, - Font = Enum.Font.GothamBold, - }), + Size = UDim2.new(1, 0, 1, 0), - create("TextLabel", { - AutomaticSize = Enum.AutomaticSize.X, - BackgroundTransparency = 1, - Size = UDim2.new(0, 0, 1, 0), - Text = text, - TextXAlignment = Enum.TextXAlignment.Left, - TextSize = 16, - TextColor3 = style.textColor, - Font = Enum.Font.SourceSans, - TextTruncate = Enum.TextTruncate.AtEnd, - - create("UISizeConstraint", { - MaxSize = Vector2.new(165, math.huge), + create("UIListLayout", { + SortOrder = Enum.SortOrder.LayoutOrder, + FillDirection = Enum.FillDirection.Horizontal, + Padding = UDim.new(0, 10), + }), + + create("TextLabel", { + Name = "index", + AutomaticSize = Enum.AutomaticSize.X, + Size = UDim2.new(0, 0, 1, 0), + BackgroundTransparency = 1, + Text = index, + TextXAlignment = Enum.TextXAlignment.Left, + TextSize = 11, + TextColor3 = style.mutedTextColor, + Font = Enum.Font.Gotham, + Visible = index ~= nil, + }), + + create("TextLabel", { + Name = "Icon", + BackgroundTransparency = 1, + Size = UDim2.new(0, 22, 1, 0), + Text = icon, + TextXAlignment = Enum.TextXAlignment.Left, + TextSize = 16, + TextColor3 = style.textColor, + Font = Enum.Font.GothamBold, + }), + + create("TextLabel", { + AutomaticSize = Enum.AutomaticSize.X, + BackgroundTransparency = 1, + Size = UDim2.new(0, 0, 1, 0), + Text = text, + TextXAlignment = Enum.TextXAlignment.Left, + TextSize = 13, + TextColor3 = style.textColor, + Font = Enum.Font.Gotham, + TextTruncate = Enum.TextTruncate.AtEnd, + + create("UISizeConstraint", { + MaxSize = Vector2.new(165, math.huge), + }), + }), + + create("TextLabel", { + [ref] = "sideText", + BackgroundTransparency = 1, + AutomaticSize = Enum.AutomaticSize.X, + Size = UDim2.new(0, 0, 1, 0), + Text = "", + TextXAlignment = Enum.TextXAlignment.Left, + TextSize = 11, + TextColor3 = style.mutedTextColor, + Font = Enum.Font.Gotham, }), }), - create("TextLabel", { - [ref] = "sideText", - BackgroundTransparency = 1, - AutomaticSize = Enum.AutomaticSize.X, - Size = UDim2.new(0, 0, 1, 0), - Text = "", - TextXAlignment = Enum.TextXAlignment.Left, - TextSize = 14, - TextColor3 = style.mutedTextColor, - Font = Enum.Font.SourceSans, + create("UIListLayout", { + SortOrder = Enum.SortOrder.LayoutOrder, + }), + + create("Frame", { + [ref] = "bar", + BackgroundColor3 = style.mutedTextColor, + BorderSizePixel = 0, + LayoutOrder = 1, + ZIndex = 2, }), Activated = function() @@ -76,15 +107,17 @@ return function(Plasma) end) Plasma.useEffect(function() - refs.button.TextLabel.Text = text - refs.button.Icon.Text = icon or "" - refs.button.Icon.Visible = not not icon + refs.button.container.TextLabel.Text = text + refs.button.container.Icon.Text = icon or "" + refs.button.container.Icon.Visible = icon ~= nil end, text, icon) - refs.sideText.Visible = not not sideText - refs.sideText.Text = sideText or "" - refs.sideText.TextColor3 = if selected then style.textColor else style.mutedTextColor - refs.button.TextLabel.TextTruncate = sideText and Enum.TextTruncate.AtEnd or Enum.TextTruncate.None + refs.button.container.sideText.Visible = sideText ~= nil + refs.button.container.sideText.Text = if sideText ~= nil then sideText else "" + refs.button.container.sideText.TextColor3 = if selected then style.textColor else style.mutedTextColor + refs.button.container.TextLabel.TextTruncate = sideText and Enum.TextTruncate.AtEnd or Enum.TextTruncate.None + + refs.button.bar.Size = UDim2.new(barWidth or 0, 0, 0, 1) Plasma.useEffect(function() refs.button.BackgroundColor3 = if selected then style.primaryColor else style.bg2 @@ -125,7 +158,9 @@ return function(Plasma) local selected for _, item in items do - if Item(item.text, item.selected, item.icon, item.sideText, options.width):clicked() then + if + Item(item.text, item.selected, item.icon, item.sideText, options.width, item.barWidth, item.index):clicked() + then selected = item end end