hotkey button highlighting

src/base/base_controller.c

@@ -36,7 +36,7 @@ String StringFromButton(Button button)
         [Button_F22]           = CompLit("F22"),
         [Button_F23]           = CompLit("F23"),
         [Button_F24]           = CompLit("F24"),
-        [Button_GraveAccent]   = CompLit("~"),
+        [Button_GraveAccent]   = CompLit("Tilde"),
         [Button_0]             = CompLit("0"),
         [Button_1]             = CompLit("1"),
         [Button_2]             = CompLit("2"),
@@ -91,12 +91,12 @@ String StringFromButton(Button button)
         [Button_PageDown]      = CompLit("PageDown"),
         [Button_Home]          = CompLit("Home"),
         [Button_End]           = CompLit("End"),
-        [Button_ForwardSlash]  = CompLit("ForwardSlash"),
+        [Button_ForwardSlash]  = CompLit("Slash"),
         [Button_Period]        = CompLit("Period"),
         [Button_Comma]         = CompLit("Comma"),
         [Button_Quote]         = CompLit("Quote"),
-        [Button_LeftBracket]   = CompLit("LeftBracket"),
+        [Button_LeftBracket]   = CompLit("Left Bracket"),
-        [Button_RightBracket]  = CompLit("RightBracket"),
+        [Button_RightBracket]  = CompLit("Right Bracket"),
         [Button_Insert]        = CompLit("Insert"),
         [Button_Semicolon]     = CompLit("Semicolon"),
     };

src/proto/pp_game.c

@@ -209,6 +209,11 @@ JobDef(PP_VisWorker, sig, job_id)
         PP_WidgetTheme theme = PP_GetWidgetTheme();
         PP_PushWidgetThemeStyles(theme);
 
+        UI_Push(ChildLayoutAxis, Axis_Y);
+        UI_Push(Width, UI_GROW(1, 0));
+        UI_Push(Height, UI_GROW(1, 0));
+        UI_Push(Parent, UI_BuildColumnEx(UI_KeyF("AAH")));
+
         //////////////////////////////
         //- Process controller events vis cmds
 

src/proto/pp_widgets.c

@@ -8,7 +8,7 @@ PP_WidgetTheme PP_GetWidgetTheme(void)
     theme.window_background_color = Rgb32(0xff1a1d1e);
     theme.window_border_color = Rgb32(0xff343a3b);
     theme.window_border = 1;
-    theme.window_width = 1000;
+    theme.window_width = 600;
     theme.window_padding = theme.window_border - 1;
     theme.divider_color = theme.window_border_color;
 
@@ -167,26 +167,27 @@ void PP_EndCommandsWidget(PP_CommandsWidget *widget)
 
                     UI_Key btn_key = item->key;
                     UI_Report btn_rep = UI_ReportFromKey(btn_key);
+
+                    Vec4 btn_color = theme.window_background_color;
+                    Vec4 btn_border_color = ZI;
+                    {
                         Vec4 hovered_color = Rgb32(0x103c4c);
                         Vec4 pressed_color = hovered_color;
                         pressed_color.w = 0.2;
-
+                        f32 btn_hot = btn_rep.hot;
-                    f32 hot = btn_rep.hot;
+                        f32 btn_active = btn_rep.active;
-                    f32 active = btn_rep.active;
+                        f32 btn_hovered = btn_rep.hovered;
-                    f32 hovered = btn_rep.hovered;
+                        btn_color = BlendSrgb(btn_color, hovered_color, btn_hot);
-
+                        btn_color = BlendSrgb(btn_color, pressed_color, btn_active * btn_hovered);
-                    Vec4 color = theme.window_background_color;
+                        btn_border_color = BlendSrgb(btn_border_color, Rgb32(0x0078a6), btn_hot);
-                    Vec4 border_color = ZI;
+                    }
-                    color = BlendSrgb(color, hovered_color, hot);
-                    color = BlendSrgb(color, pressed_color, active * hovered);
-                    border_color = BlendSrgb(border_color, Rgb32(0x0078a6), hot);
 
                     UI_SetNext(Rounding, 0);
                     UI_SetNext(Tint, 0);
                     UI_PushCP(UI_BuildRow());
                     {
-                        UI_SetNext(BorderColor, border_color);
+                        UI_SetNext(BorderColor, btn_border_color);
-                        UI_SetNext(BackgroundColor, color);
+                        UI_SetNext(BackgroundColor, btn_color);
                         UI_SetNext(Rounding, UI_RPIX(5));
                         UI_SetNext(Width, UI_GROW(1, 0));
                         UI_SetNext(Height, UI_FNT(1.5, 1));
@@ -194,6 +195,8 @@ void PP_EndCommandsWidget(PP_CommandsWidget *widget)
                         UI_SetNext(Flags, UI_BoxFlag_DrawText | UI_BoxFlag_Interactable);
                         UI_PushCP(UI_BuildRowEx(btn_key));
                         {
+                            UI_Push(Tag, btn_key.hash);
+
                             /* Begin spacer */
                             UI_BuildSpacer(UI_PIX(20, 1), Axis_X);
 
@@ -206,6 +209,23 @@ void PP_EndCommandsWidget(PP_CommandsWidget *widget)
                             /* Command hotkey buttons */
                             for (u64 i = 0; i < countof(item->desc.hotkeys); ++i)
                             {
+                                UI_Key hotkey_key = UI_KeyF("hotkey%F", FmtUint(i));
+                                UI_Report hotkey_rep = UI_ReportFromKey(hotkey_key);
+
+                                Vec4 hotkey_color = ZI;
+                                Vec4 hotkey_border_color = ZI;
+                                {
+                                    Vec4 hovered_color = Rgb32(0x103c4c);
+                                    Vec4 pressed_color = hovered_color;
+                                    pressed_color.w = 0.2;
+                                    f32 hotkey_hot = hotkey_rep.hot;
+                                    f32 hotkey_active = hotkey_rep.active;
+                                    f32 hotkey_hovered = hotkey_rep.hovered;
+                                    hotkey_color = BlendSrgb(hotkey_color, hovered_color, hotkey_hot);
+                                    hotkey_color = BlendSrgb(hotkey_color, pressed_color, hotkey_active * hotkey_hovered);
+                                    hotkey_border_color = BlendSrgb(hotkey_border_color, Rgb32(0x0078a6), hotkey_hot);
+                                }
+
                                 PP_Hotkey hotkey = item->desc.hotkeys[i];
                                 if (hotkey.button == Button_None)
                                 {
@@ -214,15 +234,18 @@ void PP_EndCommandsWidget(PP_CommandsWidget *widget)
                                 else
                                 {
                                     String hotkey_name = PP_StringFromHotkey(UI_FrameArena(), hotkey);
+                                    UI_SetNext(BackgroundColor, hotkey_color);
+                                    UI_SetNext(BorderColor, hotkey_border_color);
                                     UI_SetNext(Text, hotkey_name);
                                     UI_SetNext(Width, UI_SHRINK(theme.text_padding_x + 5, 1));
+                                    // UI_SetNext(Width, UI_SHRINK(0, 1));
                                     UI_SetNext(Height, UI_GROW(1, 0));
-                                    UI_SetNext(Rounding, UI_RGROW(1));
+                                    UI_SetNext(Rounding, UI_RPIX(5));
                                     UI_SetNext(Border, 1);
                                     // UI_SetNext(BackgroundColor, Color_Cyan);
                                     UI_SetNext(ChildAlignment, UI_Alignment_Center);
                                     UI_SetNext(Flags, UI_BoxFlag_DrawText | UI_BoxFlag_Interactable);
-                                    UI_PushCP(UI_BuildRow());
+                                    UI_PushCP(UI_BuildRowEx(hotkey_key));
                                     {
 
                                     }

src/ui/ui_common.c

@@ -7,6 +7,7 @@ UI_Key UI_BuildLabel(String text)
     ResourceKey font = UI_UseTop(Font);
     f32 font_size = UI_UseTop(FontSize);
     Vec4 tint = UI_UseTop(Tint);
+    UI_Alignment alignment = UI_UseTop(ChildAlignment);
 
     UI_Key key = ZI;
     UI_PushCP(UI_NilKey);
@@ -19,6 +20,7 @@ UI_Key UI_BuildLabel(String text)
         UI_SetNext(Width, UI_SHRINK(0, 1));
         UI_SetNext(Height, UI_SHRINK(0, 1));
         UI_SetNext(Text, text);
+        UI_SetNext(ChildAlignment, alignment);
         UI_SetNext(Flags, UI_BoxFlag_DrawText);
         key = UI_BuildBox();
     }

src/ui/ui_common.h

@@ -14,8 +14,8 @@ UI_Key UI_BuildDivider(UI_Size size, Vec4 color, Axis axis);
 ////////////////////////////////////////////////////////////
 //~ Layout helpers
 
-UI_Key UI_BuildColumnEx(UI_Key key);
 UI_Key UI_BuildRowEx(UI_Key key);
+UI_Key UI_BuildColumnEx(UI_Key key);
 
-#define UI_BuildColumn() UI_BuildColumnEx(UI_TransKey())
 #define UI_BuildRow() UI_BuildRowEx(UI_TransKey())
+#define UI_BuildColumn() UI_BuildColumnEx(UI_TransKey())

src/ui/ui_core.c

@@ -586,6 +586,8 @@ UI_Frame UI_BeginFrame(UI_FrameFlag frame_flags)
 
     result.window_frame = g->bframe.window_frame;
     result.cursor_pos = g->bframe.cursor_pos;
+    result.hovered_box = g->bframe.hovered_box;
+    result.active_box = g->bframe.hovered_box;
     return result;
 }
 
@@ -1316,7 +1318,6 @@ i64 UI_EndFrame(UI_Frame frame)
                 }
                 baseline = CeilVec2(baseline);
 
-
                 /* Push text rects */
                 for (u64 i = 0; i < run.count; ++i)
                 {

src/ui/ui_core.h

@@ -290,6 +290,8 @@ Struct(UI_Frame)
 {
     WND_Frame window_frame;
     Vec2 cursor_pos;
+    UI_Key hovered_box;
+    UI_Key active_box;
 };
 
 ////////////////////////////////////////////////////////////

src/ui/ui_draw.gpu

@@ -56,8 +56,6 @@ UI_RectPS_Output PSDef(UI_RectPS, UI_RectPS_Input input)
     Vec2 p0 = rect.p0;
     Vec2 p1 = rect.p1;
 
-    b32 aa_enabled = 0;
-
     /* Calculate rect sdf (negative means pixel is inside of rect) */
     f32 rect_dist = min(min(p.x - p0.x, p1.x - p.x), min(p.y - p0.y, p1.y - p.y));
     {
@@ -69,10 +67,10 @@ UI_RectPS_Output PSDef(UI_RectPS, UI_RectPS_Input input)
         Vec2 tr = Vec2(p1.x - tr_radius, p0.y + tr_radius);
         Vec2 br = Vec2(p1.x - br_radius, p1.y - br_radius);
         Vec2 bl = Vec2(p0.x + bl_radius, p1.y - bl_radius);
-        if (p.x < tl.x && p.y < tl.y) { rect_dist = min(rect_dist, tl_radius - length(tl - p)); aa_enabled = 1; }
+        if (p.x < tl.x && p.y < tl.y) { rect_dist = min(rect_dist, tl_radius - length(tl - p)); }
-        if (p.x > tr.x && p.y < tr.y) { rect_dist = min(rect_dist, tr_radius - length(tr - p)); aa_enabled = 1; }
+        if (p.x > tr.x && p.y < tr.y) { rect_dist = min(rect_dist, tr_radius - length(tr - p)); }
-        if (p.x > br.x && p.y > br.y) { rect_dist = min(rect_dist, br_radius - length(br - p)); aa_enabled = 1; }
+        if (p.x > br.x && p.y > br.y) { rect_dist = min(rect_dist, br_radius - length(br - p)); }
-        if (p.x < bl.x && p.y > bl.y) { rect_dist = min(rect_dist, bl_radius - length(bl - p)); aa_enabled = 1; }
+        if (p.x < bl.x && p.y > bl.y) { rect_dist = min(rect_dist, bl_radius - length(bl - p)); }
     }
     rect_dist = -rect_dist;
 
@@ -98,20 +96,16 @@ UI_RectPS_Output PSDef(UI_RectPS, UI_RectPS_Input input)
         }
     }
 
-    /* Calculate border blend from derivitive */
-    f32 border_dist_fwidth = fwidth(border_dist);
-    f32 border_blend = saturate(0.5 - border_dist / border_dist_fwidth);
-    if (!aa_enabled)
-    {
-        border_blend = border_dist <= 0;
-    }
-
     /* Background color */
     Vec4 background_color = 0;
     {
         if (rect_dist <= 0)
         {
-            if (rect.flags & UI_RectFlag_DrawTexture)
+            if (border_dist <= 0)
+            {
+                background_color = border_color;
+            }
+            else if (rect.flags & UI_RectFlag_DrawTexture)
             {
                 SamplerState sampler = UniformSamplerFromRid(sig.sampler);
                 Texture2D<Vec4> tex = NonUniformResourceFromRid(rect.tex);
@@ -125,7 +119,7 @@ UI_RectPS_Output PSDef(UI_RectPS, UI_RectPS_Input input)
     }
 
     /* Final color */
-    Vec4 final_color = lerp(background_color, border_color, border_blend);
+    Vec4 final_color = background_color;
     final_color *= input.tint_lin;
 
     /* Debug color */