Refactor and improve the demo picker

Improve the UI styles
Add a button to go back to the demo picker
Simplify the code that handles text

project/demos/DemoPickerUI.gd

@@ -0,0 +1,21 @@
+class_name DemoPickerUI
+extends CenterContainer
+
+
+signal demo_requested
+
+var demo_path := "" setget set_demo_path
+
+onready var list: ItemList = $VBoxContainer/ItemList
+onready var button: Button = $VBoxContainer/Button
+
+
+func _ready() -> void:
+	list.connect("demo_selected", self, "set_demo_path")
+	# I don't emit the demo_path as an argument as I've had type issues doing so
+	list.connect("item_activated", self, "emit_signal", ["demo_requested"])
+	button.connect("pressed", self, "emit_signal", ["demo_requested"])
+
+
+func set_demo_path(value: String) -> void:
+	demo_path = value

project/demos/DemoPlayer.gd

@@ -0,0 +1,16 @@
+extends Node2D
+
+
+func load_demo(scene_path: String) -> void:
+	if not scene_path:
+		return
+
+	var demo = load(scene_path)
+	if demo:
+		add_child(demo.instance())
+
+
+func unload() -> void:
+	for node in get_children():
+		remove_child(node)
+		node.queue_free()

project/demos/DemoSelector.gd

@@ -1,26 +0,0 @@
-extends CenterContainer
-
-
-onready var list := $VBoxContainer/ItemList
-onready var button := $VBoxContainer/Button
-var selected_demo: String
-
-
-func _ready() -> void:
-	button.connect("button_down", self, "_on_Button_down")
-	button.disabled = true
-	list.connect("item_selected", self, "_on_ItemList_item_selected")
-	list.connect("item_activated", self, "_on_ItemList_item_activated")
-
-
-func _on_Button_down() -> void:
-	get_tree().change_scene(selected_demo)
-
-
-func _on_ItemList_item_selected(index: int) -> void:
-	selected_demo = list.file_paths[index]
-	button.disabled = false
-
-
-func _on_ItemList_item_activated(index: int) -> void:
-	_on_Button_down()

project/demos/DemoSelector.tscn

@@ -1,11 +1,19 @@
-[gd_scene load_steps=5 format=2]
+[gd_scene load_steps=7 format=2]
 
 [ext_resource path="res://demos/PopulateItemList.gd" type="Script" id=1]
 [ext_resource path="res://assets/theme/gdquest.theme" type="Theme" id=2]
 [ext_resource path="res://assets/sprites/background.png" type="Texture" id=3]
-[ext_resource path="res://demos/DemoSelector.gd" type="Script" id=4]
+[ext_resource path="res://demos/DemoPickerUI.gd" type="Script" id=4]
+[ext_resource path="res://demos/DemoPlayer.gd" type="Script" id=5]
+[ext_resource path="res://demos/Demos.gd" type="Script" id=6]
 
-[node name="DemoSelector" type="CenterContainer"]
+[node name="Demos" type="Node"]
+script = ExtResource( 6 )
+
+[node name="DemoPlayer" type="Node2D" parent="."]
+script = ExtResource( 5 )
+
+[node name="DemoPickerUI" type="CenterContainer" parent="."]
 anchor_right = 1.0
 anchor_bottom = 1.0
 theme = ExtResource( 2 )
@@ -14,7 +22,7 @@ __meta__ = {
 "_edit_use_anchors_": false
 }
 
-[node name="TextureRect" type="TextureRect" parent="."]
+[node name="TextureRect" type="TextureRect" parent="DemoPickerUI"]
 margin_right = 1024.0
 margin_bottom = 600.0
 rect_min_size = Vector2( 1024, 600 )
@@ -24,31 +32,44 @@ texture = ExtResource( 3 )
 expand = true
 stretch_mode = 2
 
-[node name="VBoxContainer" type="VBoxContainer" parent="."]
-margin_left = 170.0
-margin_top = 277.0
-margin_right = 852.0
-margin_bottom = 323.0
+[node name="VBoxContainer" type="VBoxContainer" parent="DemoPickerUI"]
+margin_left = 171.0
+margin_top = 261.0
+margin_right = 853.0
+margin_bottom = 338.0
 rect_min_size = Vector2( 682, 0 )
 size_flags_horizontal = 3
 size_flags_vertical = 3
 
-[node name="ItemList" type="ItemList" parent="VBoxContainer"]
+[node name="ItemList" type="ItemList" parent="DemoPickerUI/VBoxContainer"]
 margin_right = 682.0
-margin_bottom = 12.0
-size_flags_vertical = 3
-custom_constants/vseparation = 5
-custom_constants/hseparation = 20
+margin_bottom = 9.0
 auto_height = true
-max_columns = 2
-same_column_width = true
 script = ExtResource( 1 )
 
-[node name="Button" type="Button" parent="VBoxContainer"]
-margin_left = 283.0
-margin_top = 20.0
-margin_right = 398.0
-margin_bottom = 46.0
+[node name="Button" type="Button" parent="DemoPickerUI/VBoxContainer"]
+margin_left = 241.0
+margin_top = 17.0
+margin_right = 441.0
+margin_bottom = 77.0
+rect_min_size = Vector2( 200, 60 )
 size_flags_horizontal = 4
 size_flags_vertical = 13
 text = "Load scene"
+
+[node name="ButtonGoBack" type="Button" parent="."]
+visible = false
+anchor_top = 1.0
+anchor_bottom = 1.0
+margin_left = 40.0
+margin_top = -92.0
+margin_right = 200.0
+margin_bottom = -32.0
+rect_min_size = Vector2( 160, 60 )
+size_flags_horizontal = 4
+size_flags_vertical = 13
+theme = ExtResource( 2 )
+text = "Go back"
+__meta__ = {
+"_edit_use_anchors_": false
+}

project/demos/Demos.gd

@@ -0,0 +1,23 @@
+extends Node
+
+
+onready var demo_picker: DemoPickerUI = $DemoPickerUI
+onready var demo_player := $DemoPlayer
+onready var button_go_back: Button = $ButtonGoBack
+
+
+func _ready() -> void:
+	demo_picker.connect("demo_requested", self, "_on_DemoPickerUI_demo_requested")
+	button_go_back.connect("pressed", self, "_on_ButtonGoBack_pressed")
+
+
+func _on_DemoPickerUI_demo_requested() -> void:
+	demo_player.load_demo(demo_picker.demo_path)
+	demo_picker.hide()
+	button_go_back.show()
+
+
+func _on_ButtonGoBack_pressed() -> void:
+	demo_player.unload()
+	button_go_back.hide()
+	demo_picker.show()

project/demos/PopulateItemList.gd

@@ -1,39 +1,35 @@
 extends ItemList
 
 
+signal demo_selected(scene_path)
+
 var file_paths := PoolStringArray()
 
 
 func _ready() -> void:
-	file_paths = _find_files("./", ["*Demo.tscn"], true)
+	self.connect("item_selected", self, "_on_item_selected")
+
+	var this_directory: String = get_tree().current_scene.filename.rsplit("/", false, 1)[0]
+	file_paths = _find_files(this_directory, ["*Demo.tscn"], true)
 	populate(file_paths)
-	
+	select(0)
+
 
 func populate(demos: PoolStringArray) -> void:
-	for demo in demos:
-		var start: int = demo.find_last("/")+1
-		var end: int = demo.find_last("Demo")
-		var length := end - start
-		var demo_name: String = demo.substr(start, length)
+	for path in demos:
+		var demo_name: String = path.rsplit("/", true, 1)[-1]
+		demo_name = demo_name.rsplit("Demo", true, 1)[0]
 		demo_name = sentencify(demo_name)
 		add_item(demo_name)
 
 
 func sentencify(line: String) -> String:
-	var word_starts := []
-	for i in range(line.length()):
-		var code := line.ord_at(i)
-		if code < 97:
-			word_starts.append(i)
-	var sentence := ""
-	var last := 0
-	for i in range(word_starts.size()-1):
-		var start: int = word_starts[i]
-		last = word_starts[i+1]
-		var length: = last - start
-		sentence += line.substr(start, length) + " "
-	sentence += line.substr(last)
-	return sentence
+	var regex := RegEx.new()
+	regex.compile("[A-Z]")
+	
+	line = line.split(".", true, 1)[0]
+	line = regex.sub(line, " $0", true)
+	return line
 
 
 func _find_files(dirpath := "", patterns := PoolStringArray(), is_recursive := false, do_skip_hidden := true) -> PoolStringArray:
@@ -62,3 +58,8 @@ func _find_files(dirpath := "", patterns := PoolStringArray(), is_recursive := f
 
 	directory.list_dir_end()
 	return file_paths
+
+
+func _on_item_selected(index: int) -> void:
+	var demo_path := file_paths[index]
+	emit_signal("demo_selected", demo_path)

project/demos/PursueSeek/PursueAndSeekDemo.tscn

@@ -3,11 +3,12 @@
 [ext_resource path="res://demos/PursueSeek/Pursuer.gd" type="Script" id=1]
 [ext_resource path="res://demos/PursueSeek/Player.gd" type="Script" id=2]
 [ext_resource path="res://demos/PursueSeek/BoundaryManager.gd" type="Script" id=3]
-[ext_resource path="res://demos/PursueSeek/PursueVSSeekDemo.gd" type="Script" id=4]
+[ext_resource path="res://demos/PursueSeek/PursueAndSeekDemo.gd" type="Script" id=4]
 [ext_resource path="res://assets/theme/gdquest.theme" type="Theme" id=5]
 [ext_resource path="res://demos/Utils/Line2DDraw.gd" type="Script" id=6]
 [ext_resource path="res://assets/sprites/background.png" type="Texture" id=7]
 
+
 [node name="PursueVSSeekDemo" type="Node2D"]
 script = ExtResource( 4 )
 __meta__ = {

project/project.godot

@@ -9,6 +9,11 @@
 config_version=4
 
 _global_script_classes=[ {
+"base": "CenterContainer",
+"class": "DemoPickerUI",
+"language": "GDScript",
+"path": "res://demos/DemoPickerUI.gd"
+}, {
 "base": "Reference",
 "class": "GSTAgentLocation",
 "language": "GDScript",
@@ -155,6 +160,7 @@ _global_script_classes=[ {
 "path": "res://src/GSTUtils.gd"
 } ]
 _global_script_class_icons={
+"DemoPickerUI": "",
 "GSTAgentLocation": "",
 "GSTArrive": "",
 "GSTAvoidCollisions": "",