Finalize Player Menu and UI scaling

This commit is contained in:
Alexander Sellite 2026-07-29 10:53:46 -04:00
parent 5af84eaf47
commit 3900b46618
17 changed files with 1002 additions and 322 deletions

View file

@ -158,10 +158,7 @@ func _process(delta: float) -> void:
func _update_layout() -> void:
if not is_node_ready() or _cluster == null:
return
var compact: bool = (
size.x < compact_width_threshold
or size.y < compact_height_threshold
)
var compact: bool = false
var layout_maximum: Vector2 = (
compact_maximum_layout_size
if compact

View file

@ -104,6 +104,7 @@ func _update_visual_pivot() -> void:
func _refresh_style() -> void:
var idle := StyleBoxEmpty.new()
var normal := _make_rarity_style(_rarity_color, 2, 0.25)
var hover := _make_rarity_style(_rarity_color.lightened(0.08), 4, 0.34)
var selected_fill: Color = (
@ -116,9 +117,21 @@ func _refresh_style() -> void:
6 if _batch_selected else 4,
0.46 if _batch_selected else 0.34,
)
var circle_visible: bool = (
_batch_selected
or _hovered
or has_focus()
)
var base_style: StyleBox = idle
if circle_visible:
base_style = (
selected
if _batch_selected or _focused_catch
else normal
)
add_theme_stylebox_override(
"normal",
selected if _batch_selected or _focused_catch else normal,
base_style,
)
add_theme_stylebox_override("hover", selected if _batch_selected else hover)
add_theme_stylebox_override("focus", selected)

View file

@ -4,37 +4,204 @@ render_mode unshaded;
uniform vec4 water_top : source_color = vec4(0.055, 0.38, 0.50, 1.0);
uniform vec4 water_bottom : source_color = vec4(0.018, 0.16, 0.25, 1.0);
uniform vec4 caustic_color : source_color = vec4(0.66, 0.91, 0.95, 1.0);
uniform float caustic_opacity : hint_range(0.0, 0.2) = 0.055;
uniform float caustic_speed : hint_range(0.0, 0.2) = 0.045;
uniform float bubble_opacity : hint_range(0.0, 0.25) = 0.11;
uniform vec2 pattern_density = vec2(38.0, 21.0);
uniform vec2 pattern_drift = vec2(0.012, 0.018);
uniform float mark_opacity_min : hint_range(0.0, 0.1) = 0.022;
uniform float mark_opacity_max : hint_range(0.0, 0.1) = 0.065;
uniform sampler2D decorative_bubble_1 : source_color, filter_nearest, repeat_disable;
uniform sampler2D decorative_bubble_2 : source_color, filter_nearest, repeat_disable;
uniform sampler2D decorative_bubble_3 : source_color, filter_nearest, repeat_disable;
uniform float decorative_bubble_opacity : hint_range(0.0, 1.0) = 0.48;
uniform vec2 rendered_size = vec2(784.0, 394.0);
uniform float corner_radius : hint_range(0.0, 96.0) = 29.0;
uniform float corner_softness : hint_range(0.0, 3.0) = 0.75;
float hash(float value) {
return fract(sin(value * 91.713) * 43758.5453);
float cell_hash(vec2 cell) {
return fract(sin(dot(cell, vec2(127.1, 311.7))) * 43758.5453);
}
float block_mark(vec2 point, vec2 half_size) {
return (
step(abs(point.x), half_size.x)
* step(abs(point.y), half_size.y)
);
}
vec4 sample_decorative_bubble(
sampler2D artwork,
vec2 uv,
vec2 rect_size,
vec2 center,
float logical_size
) {
vec2 artwork_uv = (
(uv - center) * rect_size / logical_size
+ vec2(0.5)
);
float inside = (
step(0.0, artwork_uv.x)
* step(artwork_uv.x, 1.0)
* step(0.0, artwork_uv.y)
* step(artwork_uv.y, 1.0)
);
return texture(artwork, clamp(artwork_uv, vec2(0.0), vec2(1.0))) * inside;
}
vec2 decorative_bubble_center(
float base_x,
float phase,
float speed,
float drift_phase
) {
float progress = fract(phase + TIME * speed);
return vec2(
base_x + sin(TIME * 0.21 + drift_phase) * 0.012,
1.10 - progress * 1.24
);
}
void fragment() {
vec2 uv = UV;
vec3 base = mix(water_top.rgb, water_bottom.rgb, smoothstep(0.0, 1.0, uv.y));
float slow_time = TIME * caustic_speed;
float broad_wave = sin((uv.x * 8.0 + uv.y * 5.0 + slow_time) * 6.28318);
float crossing_wave = sin((uv.x * 5.5 - uv.y * 7.0 - slow_time * 0.73) * 6.28318);
float caustic = smoothstep(1.46, 1.88, broad_wave + crossing_wave);
base += caustic_color.rgb * caustic * caustic_opacity;
vec2 flowing_grid = (uv + TIME * pattern_drift) * pattern_density;
float row = floor(flowing_grid.y);
flowing_grid.x += mod(row, 2.0) * 0.43;
vec2 cell = floor(flowing_grid);
vec2 local = fract(flowing_grid) - vec2(0.5);
vec2 jitter = vec2(
cell_hash(cell + vec2(3.7, 9.1)),
cell_hash(cell + vec2(7.3, 2.9))
) - vec2(0.5);
local -= jitter * vec2(0.52, 0.46);
vec2 stepped_local = (
floor((local + vec2(0.5)) * 8.0) / 8.0
- vec2(0.5)
);
float shape_key = cell_hash(cell + vec2(13.1, 5.7));
float size_key = cell_hash(cell + vec2(1.9, 17.3));
vec2 mark_half_size = mix(
vec2(0.10, 0.07),
vec2(0.18, 0.12),
size_key
);
float mark = block_mark(stepped_local, mark_half_size);
if (shape_key < 0.34) {
mark = max(
mark,
block_mark(
stepped_local - vec2(mark_half_size.x * 0.8, -0.11),
vec2(mark_half_size.x * 0.52, 0.045)
)
);
} else if (shape_key < 0.67) {
mark *= 1.0 - block_mark(
stepped_local - vec2(mark_half_size.x * 0.7, 0.0),
vec2(0.045, 0.045)
);
} else {
mark = max(
mark,
block_mark(
stepped_local + vec2(mark_half_size.x * 0.75, 0.10),
vec2(0.055, 0.04)
)
);
}
float occupancy = step(
0.22,
cell_hash(cell + vec2(19.7, 23.3))
);
float mark_opacity = mix(
mark_opacity_min,
mark_opacity_max,
cell_hash(cell + vec2(29.9, 11.5))
);
base += caustic_color.rgb * mark * occupancy * mark_opacity;
float sheen = (1.0 - smoothstep(0.0, 0.12, uv.y)) * 0.11;
base += caustic_color.rgb * sheen;
float bubbles = 0.0;
for (int index = 0; index < 8; index++) {
float key = float(index) + 1.0;
float x = 0.08 + hash(key * 2.13) * 0.84;
float phase = hash(key * 4.71);
float y = 1.08 - mod(slow_time * (0.42 + hash(key) * 0.34) + phase, 1.18);
float radius = 0.005 + hash(key * 8.23) * 0.008;
vec2 delta = uv - vec2(x, y);
delta.x *= 0.62;
float distance_to_edge = abs(length(delta) - radius);
bubbles += 1.0 - smoothstep(0.0015, 0.004, distance_to_edge);
}
base += caustic_color.rgb * min(bubbles, 1.0) * bubble_opacity;
COLOR = vec4(base, 1.0);
vec2 rect_size = max(rendered_size, vec2(1.0));
float desktop_bubble_slots = step(260.0, rect_size.y);
vec4 authored_bubbles = vec4(0.0);
authored_bubbles += sample_decorative_bubble(
decorative_bubble_1,
uv,
rect_size,
decorative_bubble_center(0.12, 0.05, 0.020, 0.4),
22.0
);
authored_bubbles += sample_decorative_bubble(
decorative_bubble_2,
uv,
rect_size,
decorative_bubble_center(0.27, 0.42, 0.016, 2.1),
28.0
);
authored_bubbles += sample_decorative_bubble(
decorative_bubble_3,
uv,
rect_size,
decorative_bubble_center(0.41, 0.76, 0.018, 4.0),
19.0
);
authored_bubbles += sample_decorative_bubble(
decorative_bubble_1,
uv,
rect_size,
decorative_bubble_center(0.56, 0.22, 0.015, 5.2),
25.0
);
authored_bubbles += sample_decorative_bubble(
decorative_bubble_3,
uv,
rect_size,
decorative_bubble_center(0.69, 0.58, 0.019, 1.3),
30.0
);
authored_bubbles += sample_decorative_bubble(
decorative_bubble_2,
uv,
rect_size,
decorative_bubble_center(0.82, 0.89, 0.017, 3.1),
21.0
) * desktop_bubble_slots;
authored_bubbles += sample_decorative_bubble(
decorative_bubble_1,
uv,
rect_size,
decorative_bubble_center(0.92, 0.34, 0.014, 6.0),
24.0
) * desktop_bubble_slots;
float authored_alpha = clamp(
authored_bubbles.a * decorative_bubble_opacity,
0.0,
0.72
);
vec3 authored_color = (
authored_bubbles.rgb
/ max(authored_bubbles.a, 0.001)
);
base = mix(base, authored_color, authored_alpha);
vec2 half_size = rect_size * 0.5;
float radius = min(corner_radius, min(half_size.x, half_size.y));
vec2 rounded_offset = (
abs(uv * rect_size - half_size)
- (half_size - vec2(radius))
);
float edge_distance = (
length(max(rounded_offset, vec2(0.0)))
+ min(max(rounded_offset.x, rounded_offset.y), 0.0)
- radius
);
float softness = max(corner_softness, 0.001);
float rounded_alpha = 1.0 - smoothstep(-softness, softness, edge_distance);
COLOR = vec4(base, rounded_alpha);
}

View file

@ -3,9 +3,14 @@ extends Button
@export var ink_color := Color(0.19, 0.16, 0.12, 1.0)
@export var disabled_ink_color := Color(0.31, 0.28, 0.23, 0.46)
@export var allow_persistent_mark: bool = false:
set(value):
allow_persistent_mark = value
if not allow_persistent_mark:
persistent_mark = false
@export var persistent_mark: bool = false:
set(value):
persistent_mark = value
persistent_mark = value and allow_persistent_mark
_refresh_ink()
@onready var _ink_outline: NotepadInkOutline = %InkOutline
@ -22,6 +27,7 @@ func _ready() -> void:
focus_exited.connect(_set_focused.bind(false))
button_down.connect(_set_pressed.bind(true))
button_up.connect(_set_pressed.bind(false))
gui_input.connect(_on_gui_input)
_apply_paper_style()
_refresh_ink()
@ -46,6 +52,22 @@ func _set_pressed(value: bool) -> void:
_refresh_ink()
func _on_gui_input(event: InputEvent) -> void:
if (
event is InputEventMouseButton
and event.button_index == MOUSE_BUTTON_LEFT
and not event.pressed
):
call_deferred("_finish_mouse_activation")
func _finish_mouse_activation() -> void:
_pressed = false
if has_focus():
release_focus()
_refresh_ink()
func _refresh_ink() -> void:
if not is_node_ready():
return

View file

@ -1,37 +1,115 @@
class_name NotepadInkChoice
extends OptionButton
extends Control
signal item_selected(index: int)
@export var ink_color := Color(0.19, 0.16, 0.12, 1.0)
@export_range(0.0, 16.0, 0.25) var outline_padding: float = 3.0:
set(value):
outline_padding = value
if is_node_ready():
_ink_outline.padding = outline_padding
_ink_outline.queue_redraw()
@export var outline_outsets := Vector4.ZERO:
set(value):
outline_outsets = value
if is_node_ready():
_apply_outline_geometry()
@onready var _ink_outline: NotepadInkOutline = %InkOutline
@onready var _displayed_value: Label = %DisplayedValue
@onready var _choice_panel: Control = %ChoicePanel
@onready var _choice_buttons: Array[Button] = [
%CatchOrderChoice,
%NameChoice,
%RarityChoice,
]
var disabled: bool = false:
set(value):
disabled = value
if is_node_ready():
_apply_interaction_state()
var _items: Array[String] = []
var _item_ids: Array[int] = []
var _selected_index: int = 0
var _hovered: bool = false
var _focused: bool = false
var _opened_with_mouse: bool = false
func _ready() -> void:
_ink_outline.padding = outline_padding
_apply_outline_geometry()
mouse_entered.connect(_set_hovered.bind(true))
mouse_exited.connect(_set_hovered.bind(false))
focus_entered.connect(_set_focused.bind(true))
focus_exited.connect(_set_focused.bind(false))
gui_input.connect(_on_display_gui_input)
for index: int in _choice_buttons.size():
var button: Button = _choice_buttons[index]
button.pressed.connect(_select_index.bind(index))
button.gui_input.connect(_on_choice_gui_input.bind(index))
_choice_panel.hide()
_apply_paper_style()
_style_popup()
queue_redraw()
_apply_interaction_state()
func add_item(item_text: String, item_id: int = -1) -> void:
if _items.size() >= _choice_buttons.size():
return
var index: int = _items.size()
_items.append(item_text)
_item_ids.append(item_id if item_id >= 0 else index)
_choice_buttons[index].text = item_text
_choice_buttons[index].show()
if index == _selected_index:
_displayed_value.text = item_text
func select(index: int) -> void:
if index < 0 or index >= _items.size():
return
_selected_index = index
_displayed_value.text = _items[index]
func get_selected_id() -> int:
if _selected_index < 0 or _selected_index >= _item_ids.size():
return -1
return _item_ids[_selected_index]
func refresh_ink_state() -> void:
_refresh_ink()
func set_choice_font_size(font_size: int) -> void:
_displayed_value.add_theme_font_size_override("font_size", font_size)
for button: Button in _choice_buttons:
button.add_theme_font_size_override("font_size", font_size)
func close_choices() -> void:
if not _choice_panel.visible:
return
_choice_panel.hide()
if _opened_with_mouse:
_opened_with_mouse = false
if has_focus():
release_focus()
_refresh_ink()
func _apply_outline_geometry() -> void:
_ink_outline.offset_left = -outline_outsets.x
_ink_outline.offset_top = -outline_outsets.y
_ink_outline.offset_right = outline_outsets.z
_ink_outline.offset_bottom = outline_outsets.w
_ink_outline.queue_redraw()
func _draw() -> void:
var chevron_x: float = size.x - 13.0
var chevron_y: float = size.y * 0.5 - 1.0
var chevron := PackedVector2Array([
Vector2(chevron_x - 4.0, chevron_y - 2.0),
Vector2(chevron_x, chevron_y + 2.0),
Vector2(chevron_x + 4.0, chevron_y - 2.5),
])
draw_polyline(chevron, ink_color, 1.8, true)
var underline_y: float = size.y - 5.0
var underline := PackedVector2Array([
Vector2(7.0, underline_y),
@ -44,6 +122,79 @@ func _draw() -> void:
draw_polyline(underline, underline_color, 1.1, true)
func _gui_input(event: InputEvent) -> void:
if disabled:
return
if event.is_action_pressed("ui_accept"):
_open_choices(false)
accept_event()
elif event.is_action_pressed("ui_cancel") and _choice_panel.visible:
close_choices()
accept_event()
func _input(event: InputEvent) -> void:
if not _choice_panel.visible:
return
if event.is_action_pressed("ui_cancel"):
close_choices()
get_viewport().set_input_as_handled()
return
if (
event is InputEventMouseButton
and event.button_index == MOUSE_BUTTON_LEFT
and event.pressed
):
var mouse_position: Vector2 = event.position
if (
not get_global_rect().has_point(mouse_position)
and not _choice_panel.get_global_rect().has_point(mouse_position)
):
close_choices()
func _on_display_gui_input(event: InputEvent) -> void:
if (
not disabled
and event is InputEventMouseButton
and event.button_index == MOUSE_BUTTON_LEFT
and event.pressed
):
_open_choices(true)
accept_event()
func _on_choice_gui_input(event: InputEvent, index: int) -> void:
if event.is_action_pressed("ui_cancel"):
close_choices()
get_viewport().set_input_as_handled()
elif event.is_action_pressed("ui_up"):
_choice_buttons[posmod(index - 1, _choice_buttons.size())].grab_focus()
get_viewport().set_input_as_handled()
elif event.is_action_pressed("ui_down"):
_choice_buttons[(index + 1) % _choice_buttons.size()].grab_focus()
get_viewport().set_input_as_handled()
func _open_choices(from_mouse: bool) -> void:
if disabled or _choice_panel.visible:
return
_opened_with_mouse = from_mouse
_choice_panel.show()
_choice_panel.move_to_front()
if not from_mouse:
_choice_buttons[_selected_index].grab_focus()
_refresh_ink()
func _select_index(index: int) -> void:
if disabled or index < 0 or index >= _items.size():
return
select(index)
close_choices()
item_selected.emit(get_selected_id())
func _set_hovered(value: bool) -> void:
_hovered = value
_refresh_ink()
@ -61,54 +212,51 @@ func _refresh_ink() -> void:
)
func _apply_interaction_state() -> void:
_displayed_value.modulate.a = 0.42 if disabled else 1.0
focus_mode = Control.FOCUS_NONE if disabled else Control.FOCUS_ALL
mouse_filter = (
Control.MOUSE_FILTER_IGNORE
if disabled
else Control.MOUSE_FILTER_STOP
)
for button: Button in _choice_buttons:
button.disabled = disabled
if disabled:
close_choices()
_refresh_ink()
func _apply_paper_style() -> void:
var empty := StyleBoxEmpty.new()
for state: StringName in [
&"normal",
&"hover",
&"pressed",
&"focus",
&"disabled",
]:
add_theme_stylebox_override(state, empty)
var empty_arrow := ImageTexture.new()
add_theme_icon_override("arrow", empty_arrow)
add_theme_color_override("font_color", ink_color)
add_theme_color_override("font_hover_color", ink_color.darkened(0.08))
add_theme_color_override("font_focus_color", ink_color.darkened(0.08))
add_theme_color_override("font_pressed_color", ink_color.darkened(0.14))
add_theme_color_override("font_disabled_color", Color(ink_color, 0.42))
func _style_popup() -> void:
var popup: PopupMenu = get_popup()
var paper := StyleBoxFlat.new()
paper.bg_color = Color(0.93, 0.885, 0.73, 1.0)
paper.border_color = Color(0.22, 0.19, 0.15, 1.0)
paper.set_border_width_all(2)
paper.set_corner_radius_all(5)
var hover_paper := paper.duplicate() as StyleBoxFlat
hover_paper.bg_color = Color(0.82, 0.775, 0.63, 1.0)
hover_paper.border_color = Color(0.30, 0.26, 0.20, 0.62)
hover_paper.set_border_width_all(1)
popup.add_theme_stylebox_override("panel", paper)
popup.add_theme_stylebox_override("hover", hover_paper)
popup.add_theme_stylebox_override("separator", StyleBoxEmpty.new())
popup.add_theme_color_override("font_color", ink_color)
popup.add_theme_color_override("font_hover_color", ink_color.darkened(0.08))
popup.add_theme_color_override(
"font_separator_color",
Color(ink_color, 0.56),
)
var empty_mark := ImageTexture.new()
for icon_name: StringName in [
&"checked",
&"unchecked",
&"radio_checked",
&"radio_unchecked",
&"checked_disabled",
&"unchecked_disabled",
&"radio_checked_disabled",
&"radio_unchecked_disabled",
]:
popup.add_theme_icon_override(icon_name, empty_mark)
var hover := StyleBoxFlat.new()
hover.bg_color = Color(0.82, 0.775, 0.63, 1.0)
hover.set_border_width_all(0)
hover.set_corner_radius_all(0)
hover.anti_aliasing = false
_displayed_value.add_theme_color_override("font_color", ink_color)
for button: Button in _choice_buttons:
for state: StringName in [
&"normal",
&"disabled",
]:
button.add_theme_stylebox_override(state, empty)
for state: StringName in [
&"hover",
&"pressed",
&"focus",
]:
button.add_theme_stylebox_override(state, hover)
button.add_theme_color_override("font_color", ink_color)
button.add_theme_color_override(
"font_hover_color",
ink_color.darkened(0.08),
)
button.add_theme_color_override(
"font_focus_color",
ink_color.darkened(0.08),
)
button.add_theme_color_override(
"font_pressed_color",
ink_color.darkened(0.14),
)

View file

@ -1,16 +1,35 @@
[gd_scene load_steps=3 format=3]
[gd_scene load_steps=6 format=3]
[ext_resource type="Script" path="res://ui/components/bubble_menu/notepad_ink_choice.gd" id="1_choice"]
[ext_resource type="Script" path="res://ui/components/bubble_menu/notepad_ink_outline.gd" id="2_outline"]
[node name="NotepadInkChoice" type="OptionButton"]
[sub_resource type="StyleBoxFlat" id="StyleBox_shadow"]
bg_color = Color(0.1, 0.08, 0.06, 0.24)
[sub_resource type="StyleBoxFlat" id="StyleBox_paper"]
bg_color = Color(0.93, 0.885, 0.73, 1)
[sub_resource type="StyleBoxEmpty" id="StyleBox_empty"]
[node name="NotepadInkChoice" type="Control"]
custom_minimum_size = Vector2(124, 38)
focus_mode = 1
mouse_default_cursor_shape = 2
clip_text = true
fit_to_longest_item = false
script = ExtResource("1_choice")
[node name="DisplayedValue" type="Label" parent="."]
unique_name_in_owner = true
layout_mode = 1
anchors_preset = 15
anchor_right = 1.0
anchor_bottom = 1.0
grow_horizontal = 2
grow_vertical = 2
mouse_filter = 2
text = "catch order"
horizontal_alignment = 1
vertical_alignment = 1
[node name="InkOutline" type="Control" parent="."]
unique_name_in_owner = true
visible = false
@ -22,3 +41,67 @@ grow_horizontal = 2
grow_vertical = 2
mouse_filter = 2
script = ExtResource("2_outline")
[node name="ChoicePanel" type="Control" parent="."]
unique_name_in_owner = true
visible = false
z_index = 30
layout_mode = 0
offset_left = -8.0
offset_top = 40.0
offset_right = 132.0
offset_bottom = 139.0
mouse_filter = 1
[node name="Shadow" type="Panel" parent="ChoicePanel"]
layout_mode = 0
offset_left = 3.0
offset_top = 4.0
offset_right = 143.0
offset_bottom = 103.0
mouse_filter = 2
theme_override_styles/panel = SubResource("StyleBox_shadow")
[node name="Paper" type="Panel" parent="ChoicePanel"]
layout_mode = 1
anchors_preset = 15
anchor_right = 1.0
anchor_bottom = 1.0
grow_horizontal = 2
grow_vertical = 2
mouse_filter = 2
theme_override_styles/panel = SubResource("StyleBox_paper")
[node name="Choices" type="VBoxContainer" parent="ChoicePanel"]
layout_mode = 1
anchors_preset = 15
anchor_right = 1.0
anchor_bottom = 1.0
grow_horizontal = 2
grow_vertical = 2
mouse_filter = 1
theme_override_constants/separation = 0
[node name="CatchOrderChoice" type="Button" parent="ChoicePanel/Choices"]
unique_name_in_owner = true
custom_minimum_size = Vector2(140, 33)
layout_mode = 2
focus_mode = 1
theme_override_styles/normal = SubResource("StyleBox_empty")
text = "catch order"
[node name="NameChoice" type="Button" parent="ChoicePanel/Choices"]
unique_name_in_owner = true
custom_minimum_size = Vector2(140, 33)
layout_mode = 2
focus_mode = 1
theme_override_styles/normal = SubResource("StyleBox_empty")
text = "name"
[node name="RarityChoice" type="Button" parent="ChoicePanel/Choices"]
unique_name_in_owner = true
custom_minimum_size = Vector2(140, 33)
layout_mode = 2
focus_mode = 1
theme_override_styles/normal = SubResource("StyleBox_empty")
text = "rarity"