Frame numbers in the timeline above the cels are now clickable buttons

src/Classes/Project.gd

@@ -37,6 +37,8 @@ var file_name := "untitled"
 var file_format : int = Export.FileFormat.PNG
 var was_exported := false
 
+var frame_button_node = preload("res://src/UI/Timeline/FrameButton.tscn")
+
 
 func _init(_frames := [], _name := tr("untitled"), _size := Vector2(64, 64)) -> void:
 	frames = _frames
@@ -140,13 +142,13 @@ func change_project() -> void:
 			layers[i].frame_container.add_child(cel_button)
 
 	for j in range(frames.size()): # Create frame ID labels
-		var label := Label.new()
-		label.rect_min_size.x = Global.animation_timeline.cel_size
-		label.align = Label.ALIGN_CENTER
-		label.text = str(j + 1)
+		var button : Button = frame_button_node.instance()
+		button.frame = j
+		button.rect_min_size.x = Global.animation_timeline.cel_size
+		button.text = str(j + 1)
 		if j == current_frame:
-			label.add_color_override("font_color", Global.control.theme.get_color("Selected Color", "Label"))
-		Global.frame_ids.add_child(label)
+			button.add_color_override("font_color", Global.control.theme.get_color("Selected Color", "Label"))
+		Global.frame_ids.add_child(button)
 
 	var layer_button = Global.layers_container.get_child(Global.layers_container.get_child_count() - 1 - current_layer)
 	layer_button.pressed = true
@@ -394,11 +396,11 @@ func frames_changed(value : Array) -> void:
 		Global.frames_container.add_child(layers[i].frame_container)
 
 	for j in range(frames.size()):
-		var label := Label.new()
-		label.rect_min_size.x = Global.animation_timeline.cel_size
-		label.align = Label.ALIGN_CENTER
-		label.text = str(j + 1)
-		Global.frame_ids.add_child(label)
+		var button : Button = frame_button_node.instance()
+		button.frame = j
+		button.rect_min_size.x = Global.animation_timeline.cel_size
+		button.text = str(j + 1)
+		Global.frame_ids.add_child(button)
 
 		for i in range(layers.size() - 1, -1, -1):
 			var cel_button = load("res://src/UI/Timeline/CelButton.tscn").instance()

src/UI/Timeline/AnimationTimeline.tscn

@@ -1,4 +1,4 @@
-[gd_scene load_steps=44 format=2]
+[gd_scene load_steps=45 format=2]
 
 [ext_resource path="res://src/UI/Timeline/AnimationTimeline.gd" type="Script" id=1]
 [ext_resource path="res://assets/graphics/layers/new.png" type="Texture" id=2]
@@ -8,6 +8,7 @@
 [ext_resource path="res://assets/graphics/layers/delete.png" type="Texture" id=6]
 [ext_resource path="res://assets/graphics/layers/clone.png" type="Texture" id=7]
 [ext_resource path="res://assets/graphics/timeline/move_arrow.png" type="Texture" id=8]
+[ext_resource path="res://src/UI/Timeline/FrameButton.tscn" type="PackedScene" id=9]
 [ext_resource path="res://src/UI/Timeline/LayerButton.tscn" type="PackedScene" id=18]
 [ext_resource path="res://assets/graphics/timeline/new_frame.png" type="Texture" id=19]
 [ext_resource path="res://assets/graphics/timeline/remove_frame.png" type="Texture" id=20]
@@ -905,21 +906,17 @@ margin_bottom = 88.0
 
 [node name="FrameIDs" type="HBoxContainer" parent="AnimationContainer/TimelineContainer/PanelContainer/TimelineScroll/LayersAndFrames/FrameButtonsAndIds"]
 margin_right = 36.0
-margin_bottom = 16.0
+margin_bottom = 20.0
 rect_min_size = Vector2( 0, 16 )
 
-[node name="Label" type="Label" parent="AnimationContainer/TimelineContainer/PanelContainer/TimelineScroll/LayersAndFrames/FrameButtonsAndIds/FrameIDs"]
-margin_top = 1.0
+[node name="FrameButton" parent="AnimationContainer/TimelineContainer/PanelContainer/TimelineScroll/LayersAndFrames/FrameButtonsAndIds/FrameIDs" instance=ExtResource( 9 )]
 margin_right = 36.0
-margin_bottom = 15.0
 rect_min_size = Vector2( 36, 0 )
-text = "1"
-align = 1
 
 [node name="FramesContainer" type="VBoxContainer" parent="AnimationContainer/TimelineContainer/PanelContainer/TimelineScroll/LayersAndFrames/FrameButtonsAndIds"]
-margin_top = 20.0
+margin_top = 24.0
 margin_right = 36.0
-margin_bottom = 20.0
+margin_bottom = 24.0
 
 [node name="AnimationTimer" type="Timer" parent="."]
 

src/UI/Timeline/FrameButton.gd

@@ -0,0 +1,12 @@
+extends Button
+
+
+var frame := 0
+
+
+func _ready() -> void:
+	connect("pressed", self, "_button_pressed")
+
+
+func _button_pressed() -> void:
+	Global.current_project.current_frame = frame

src/UI/Timeline/FrameButton.tscn

@@ -0,0 +1,13 @@
+[gd_scene load_steps=2 format=2]
+
+[ext_resource path="res://src/UI/Timeline/FrameButton.gd" type="Script" id=1]
+
+[node name="FrameButton" type="Button"]
+margin_right = 12.0
+margin_bottom = 20.0
+mouse_default_cursor_shape = 2
+text = "1"
+script = ExtResource( 1 )
+__meta__ = {
+"_edit_use_anchors_": false
+}