Add new sidebar option menu and options

Allows toggeling the use of folder colors and folder name truncation. Renames the sorting to grouping (in case sorting gets a separate control in the future) Makes it so the V-Split (between the resource list and the content list) is remembered across sessions.
Jowan-Spooner · Sep 22, 2024 · ab91322 · ab91322
1 parent 3e8123f
commit ab91322
Show file tree

Hide file tree

Showing 2 changed files with 133 additions and 70 deletions.
diff --git a/addons/dialogic/Editor/Common/side_bar.tscn b/addons/dialogic/Editor/Common/side_bar.tscn
@@ -46,17 +46,16 @@ size_flags_vertical = 3
 [node name="Margin" type="MarginContainer" parent="VBoxPrimary"]
 layout_mode = 2
 size_flags_vertical = 3
-theme_override_constants/margin_left = 5
-theme_override_constants/margin_bottom = 5
 
-[node name="VSplitContainer" type="VSplitContainer" parent="VBoxPrimary/Margin"]
+[node name="MainVSplit" type="VSplitContainer" parent="VBoxPrimary/Margin"]
+unique_name_in_owner = true
 layout_mode = 2
 
-[node name="VBox" type="VBoxContainer" parent="VBoxPrimary/Margin/VSplitContainer"]
+[node name="VBox" type="VBoxContainer" parent="VBoxPrimary/Margin/MainVSplit"]
 layout_mode = 2
 size_flags_vertical = 3
 
-[node name="Logo" type="TextureRect" parent="VBoxPrimary/Margin/VSplitContainer/VBox"]
+[node name="Logo" type="TextureRect" parent="VBoxPrimary/Margin/MainVSplit/VBox"]
 unique_name_in_owner = true
 modulate = Color(1, 1, 1, 0.623529)
 texture_filter = 6
@@ -65,18 +64,18 @@ layout_mode = 2
 expand_mode = 3
 stretch_mode = 4
 
-[node name="HBox" type="HBoxContainer" parent="VBoxPrimary/Margin/VSplitContainer/VBox"]
+[node name="HBox" type="HBoxContainer" parent="VBoxPrimary/Margin/MainVSplit/VBox"]
 layout_mode = 2
 
-[node name="CurrentResource" type="LineEdit" parent="VBoxPrimary/Margin/VSplitContainer/VBox/HBox"]
+[node name="CurrentResource" type="LineEdit" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBox"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_horizontal = 3
 text = "No resource"
 alignment = 1
 editable = false
 
-[node name="CloseButton" type="Button" parent="VBoxPrimary/Margin/VSplitContainer/VBox/HBox"]
+[node name="CloseButton" type="Button" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBox"]
 unique_name_in_owner = true
 layout_mode = 2
 tooltip_text = "Hide Sidebar"
@@ -86,10 +85,10 @@ flat = true
 icon_alignment = 1
 expand_icon = true
 
-[node name="HBoxSearchSort" type="HBoxContainer" parent="VBoxPrimary/Margin/VSplitContainer/VBox"]
+[node name="HBoxSearchSort" type="HBoxContainer" parent="VBoxPrimary/Margin/MainVSplit/VBox"]
 layout_mode = 2
 
-[node name="Search" type="LineEdit" parent="VBoxPrimary/Margin/VSplitContainer/VBox/HBoxSearchSort"]
+[node name="Search" type="LineEdit" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_horizontal = 3
@@ -98,56 +97,90 @@ placeholder_text = "Filter Resources"
 caret_blink = true
 caret_blink_interval = 0.5
 
-[node name="SortOption" type="OptionButton" parent="VBoxPrimary/Margin/VSplitContainer/VBox/HBoxSearchSort"]
+[node name="Options" type="Button" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort"]
 unique_name_in_owner = true
 layout_mode = 2
-tooltip_text = "Sort
-- Default: Sort alphabetically split into Characters & Timeilnes.
-- Folder: Sort alphabetically by parent directory.
-- Path: Display full path relative to res://.
-- None: Sort alphabetically with no categories."
+
+[node name="OptionsPopup" type="Popup" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Options"]
+unique_name_in_owner = true
+transparent_bg = true
+position = Vector2i(890, 65)
+size = Vector2i(165, 101)
+visible = true
+transparent = true
+
+[node name="OptionsPanel" type="PanelContainer" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Options/OptionsPopup"]
+unique_name_in_owner = true
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+
+[node name="VBox" type="VBoxContainer" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Options/OptionsPopup/OptionsPanel"]
+layout_mode = 2
+
+[node name="GroupingOptions" type="OptionButton" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Options/OptionsPopup/OptionsPanel/VBox"]
+unique_name_in_owner = true
+layout_mode = 2
+tooltip_text = "Grouping
+- None: No Grouping, sorted alphabetically
+- Type: Group by type (Characters/Timeilnes)
+- Folder: Group based on the parent folder name.
+- Path: Group based on folders."
 text_overrun_behavior = 1
 clip_text = true
 selected = 0
 item_count = 4
-popup/item_0/text = "Type"
-popup/item_1/text = "Folder"
+popup/item_0/text = "No Grouping"
+popup/item_1/text = "Type Grouping"
 popup/item_1/id = 1
-popup/item_2/text = "Path"
+popup/item_2/text = "Folder Grouping"
 popup/item_2/id = 2
-popup/item_3/text = "None"
+popup/item_3/text = "Path Grouping"
 popup/item_3/id = 3
 
-[node name="ResourceTree" type="Tree" parent="VBoxPrimary/Margin/VSplitContainer/VBox"]
+[node name="FolderColors" type="CheckBox" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Options/OptionsPopup/OptionsPanel/VBox"]
+unique_name_in_owner = true
+layout_mode = 2
+text = "Use Folder Colors"
+
+[node name="TrimFolderPaths" type="CheckBox" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Options/OptionsPopup/OptionsPanel/VBox"]
+unique_name_in_owner = true
+layout_mode = 2
+text = "Trim Folder Paths"
+
+[node name="ResourceTree" type="Tree" parent="VBoxPrimary/Margin/MainVSplit/VBox"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_vertical = 3
 allow_rmb_select = true
 hide_root = true
 scroll_horizontal_enabled = false
 
-[node name="HBoxContainer" type="HBoxContainer" parent="VBoxPrimary/Margin/VSplitContainer/VBox"]
+[node name="HBoxContainer" type="HBoxContainer" parent="VBoxPrimary/Margin/MainVSplit/VBox"]
 visible = false
 layout_mode = 2
 
-[node name="Label" type="Label" parent="VBoxPrimary/Margin/VSplitContainer/VBox/HBoxContainer"]
+[node name="Label" type="Label" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBoxContainer"]
 layout_mode = 2
 size_flags_vertical = 1
 text = "Sort Order"
 vertical_alignment = 1
 
-[node name="SortOption" type="OptionButton" parent="VBoxPrimary/Margin/VSplitContainer/VBox/HBoxContainer"]
+[node name="SortOption" type="OptionButton" parent="VBoxPrimary/Margin/MainVSplit/VBox/HBoxContainer"]
 layout_mode = 2
 size_flags_horizontal = 3
 item_count = 1
 popup/item_0/text = "Alphabetical (All)"
 
-[node name="ContentListSection" type="VBoxContainer" parent="VBoxPrimary/Margin/VSplitContainer"]
+[node name="ContentListSection" type="VBoxContainer" parent="VBoxPrimary/Margin/MainVSplit"]
 unique_name_in_owner = true
+custom_minimum_size = Vector2(0, 15)
 layout_mode = 2
 size_flags_vertical = 3
 
-[node name="ContentList" type="ItemList" parent="VBoxPrimary/Margin/VSplitContainer/ContentListSection"]
+[node name="ContentList" type="ItemList" parent="VBoxPrimary/Margin/MainVSplit/ContentListSection"]
 unique_name_in_owner = true
 layout_mode = 2
 size_flags_vertical = 3
@@ -168,8 +201,12 @@ clip_text = true
 unique_name_in_owner = true
 size = Vector2i(164, 100)
 
-[connection signal="gui_input" from="VBoxPrimary/Margin/VSplitContainer/VBox/Logo" to="." method="_on_logo_gui_input"]
-[connection signal="text_changed" from="VBoxPrimary/Margin/VSplitContainer/VBox/HBoxSearchSort/Search" to="." method="_on_search_text_changed"]
-[connection signal="text_submitted" from="VBoxPrimary/Margin/VSplitContainer/VBox/HBoxSearchSort/Search" to="." method="_on_search_text_submitted"]
+[connection signal="dragged" from="VBoxPrimary/Margin/MainVSplit" to="." method="_on_main_v_split_dragged"]
+[connection signal="gui_input" from="VBoxPrimary/Margin/MainVSplit/VBox/Logo" to="." method="_on_logo_gui_input"]
+[connection signal="text_changed" from="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Search" to="." method="_on_search_text_changed"]
+[connection signal="text_submitted" from="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Search" to="." method="_on_search_text_submitted"]
+[connection signal="pressed" from="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Options" to="." method="_on_options_pressed"]
+[connection signal="toggled" from="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Options/OptionsPopup/OptionsPanel/VBox/FolderColors" to="." method="_on_folder_colors_toggled"]
+[connection signal="toggled" from="VBoxPrimary/Margin/MainVSplit/VBox/HBoxSearchSort/Options/OptionsPopup/OptionsPanel/VBox/TrimFolderPaths" to="." method="_on_trim_folder_paths_toggled"]
 [connection signal="pressed" from="VBoxPrimary/CurrentVersion" to="." method="_on_current_version_pressed"]
 [connection signal="id_pressed" from="RightClickMenu" to="." method="_on_right_click_menu_id_pressed"]
diff --git a/addons/dialogic/Editor/Common/sidebar.gd b/addons/dialogic/Editor/Common/sidebar.gd
@@ -13,13 +13,13 @@ signal show_sidebar(show: bool)
 
 var current_resource_list: Array = []
 
-enum SortMode {
+enum GroupMode {
+	NONE,
 	TYPE,
 	FOLDER,
 	PATH,
-	NONE,
 }
-var sort_mode: SortMode = SortMode.TYPE
+var group_mode: GroupMode = GroupMode.TYPE
 
 
 func _ready() -> void:
@@ -43,10 +43,14 @@ func _ready() -> void:
 	(%CloseButton as Button).pressed.connect(_hide_sidebar)
 
 	var editor_scale := DialogicUtil.get_editor_scale()
+
 	## ICONS
 	%Logo.texture = load("res://addons/dialogic/Editor/Images/dialogic-logo.svg")
 	%Logo.custom_minimum_size.y = 30 * editor_scale
 	%Search.right_icon = get_theme_icon("Search", "EditorIcons")
+	%Options.icon = get_theme_icon("GuiTabMenuHl", "EditorIcons")
+	%OptionsPanel.add_theme_stylebox_override("panel", get_theme_stylebox("PanelForeground", "EditorStyles"))
+	%OptionsPopup.hide()
 
 	%ContentList.add_theme_color_override(
 		"font_hovered_color", get_theme_color("warning_color", "Editor")
@@ -55,16 +59,6 @@ func _ready() -> void:
 		"font_selected_color", get_theme_color("property_color_z", "Editor")
 	)
 
-	## MARGINS
-	%VBoxPrimary/Margin.set(
-		"theme_override_constants/margin_left",
-		get_theme_constant("base_margin", "Editor") * editor_scale
-	)
-	%VBoxPrimary/Margin.set(
-		"theme_override_constants/margin_bottom",
-		get_theme_constant("base_margin", "Editor") * editor_scale
-	)
-
 	## RIGHT CLICK MENU
 	%RightClickMenu.clear()
 	%RightClickMenu.add_icon_item(get_theme_icon("Remove", "EditorIcons"), "Remove From List", 1)
@@ -79,18 +73,23 @@ func _ready() -> void:
 	)
 
 	## SORT MENU
-	%SortOption.set_item_icon(0, get_theme_icon("AnimationTrackGroup", "EditorIcons"))
-	%SortOption.set_item_icon(1, get_theme_icon("Folder", "EditorIcons"))
-	%SortOption.set_item_icon(2, get_theme_icon("FolderBrowse", "EditorIcons"))
-	%SortOption.set_item_icon(3, get_theme_icon("AnimationTrackList", "EditorIcons"))
-	%SortOption.item_selected.connect(_on_sort_changed)
+	%GroupingOptions.set_item_icon(0, get_theme_icon("AnimationTrackGroup", "EditorIcons"))
+	%GroupingOptions.set_item_icon(1, get_theme_icon("Folder", "EditorIcons"))
+	%GroupingOptions.set_item_icon(2, get_theme_icon("FolderBrowse", "EditorIcons"))
+	%GroupingOptions.set_item_icon(3, get_theme_icon("AnimationTrackList", "EditorIcons"))
+	%GroupingOptions.item_selected.connect(_on_grouping_changed)
 
 	await get_tree().process_frame
 	if DialogicUtil.get_editor_setting("sidebar_collapsed", false):
 		_hide_sidebar()
 
-	%SortOption.select(DialogicUtil.get_editor_setting("sidebar_sort_mode", 0))
-	sort_mode = DialogicUtil.get_editor_setting("sidebar_sort_mode", 0)
+	%MainVSplit.split_offset = DialogicUtil.get_editor_setting("sidebar_v_split", 0)
+	group_mode = DialogicUtil.get_editor_setting("sidebar_group_mode", 0)
+	%GroupingOptions.select(%GroupingOptions.get_item_index(group_mode))
+
+	%FolderColors.button_pressed = DialogicUtil.get_editor_setting("sidebar_use_folder_colors", true)
+	%TrimFolderPaths.button_pressed = DialogicUtil.get_editor_setting("sidebar_trim_folder_paths", true)
+
 	update_resource_list()
 
 
@@ -175,8 +174,14 @@ func update_resource_list(resources_list: PackedStringArray = []) -> void:
 	# BUILD TREE
 	var root: TreeItem = resource_tree.create_item()
 
-	match sort_mode:
-		SortMode.TYPE:
+	match group_mode:
+		GroupMode.NONE:
+			all_items.sort_custom(_sort_by_item_text)
+			for item in all_items:
+				add_item(item, root, current_file)
+
+
+		GroupMode.TYPE:
 			character_items.sort_custom(_sort_by_item_text)
 			timeline_items.sort_custom(_sort_by_item_text)
 			if character_items.size() > 0:
@@ -190,13 +195,7 @@ func update_resource_list(resources_list: PackedStringArray = []) -> void:
 					add_item(item, timeline_tree, current_file)
 
 
-		SortMode.NONE:
-			all_items.sort_custom(_sort_by_item_text)
-			for item in all_items:
-				add_item(item, root, current_file)
-
-
-		SortMode.FOLDER:
+		GroupMode.FOLDER:
 			var dirs := {}
 			for item in all_items:
 				var dir := item.get_parent_directory() as String
@@ -211,7 +210,7 @@ func update_resource_list(resources_list: PackedStringArray = []) -> void:
 					add_item(item, dir_item, current_file)
 
 
-		SortMode.PATH:
+		GroupMode.PATH:
 			# Collect all different directories that contain resources
 			var dirs := {}
 			for item in all_items:
@@ -249,16 +248,21 @@ func update_resource_list(resources_list: PackedStringArray = []) -> void:
 					return x.get_slice("/", x.get_slice_count("/")-1) < y.get_slice("/", y.get_slice_count("/")-1)
 					)
 			var folder_colors := ProjectSettings.get_setting("file_customization/folder_colors", {})
+
 			for dir in sorted_dir_keys:
+				var display_name: String = dir
+				if not %TrimFolderPaths.button_pressed:
+					display_name = unique_folder_names[dir]
 				var dir_path: String = unique_folder_names[dir]
 				var dir_color_path := ""
 				var dir_color := Color.BLACK
-				for path in folder_colors:
-					if String("res://"+dir_path+"/").begins_with(path) and len(path) > len(dir_color_path):
-						dir_color_path = path
-						dir_color = folder_colors[path]
+				if %FolderColors.button_pressed:
+					for path in folder_colors:
+						if String("res://"+dir_path+"/").begins_with(path) and len(path) > len(dir_color_path):
+							dir_color_path = path
+							dir_color = folder_colors[path]
 
-				var dir_item := add_folder_item(dir, root, dir_color, dir_path)
+				var dir_item := add_folder_item(display_name, root, dir_color, dir_path)
 
 				for item in dirs[dir_path]:
 					var tree_item := add_item(item, dir_item, current_file)
@@ -423,14 +427,18 @@ func _on_right_click_menu_id_pressed(id: int) -> void:
 			)
 
 
-func _on_sort_changed(idx: int) -> void:
-	if (SortMode as Dictionary).values().has(idx):
-		sort_mode = idx
-		DialogicUtil.set_editor_setting("sidebar_sort_mode", idx)
+func _on_grouping_changed(idx: int) -> void:
+	var id : int = %GroupingOptions.get_item_id(idx)
+	if (GroupMode as Dictionary).values().has(id):
+		group_mode = id
+		DialogicUtil.set_editor_setting("sidebar_group_mode", id)
 		update_resource_list()
 	else:
-		sort_mode = SortMode.TYPE
-		print("Invalid sort mode: ", idx)
+		group_mode = GroupMode.TYPE
+		print("Invalid sort mode: ", id)
+
+	%FolderColors.disabled = group_mode != GroupMode.PATH
+	%TrimFolderPaths.disabled = group_mode != GroupMode.PATH
 
 
 func _sort_by_item_text(a: ResourceListItem, b: ResourceListItem) -> bool:
@@ -495,3 +503,21 @@ class ResourceListItem:
 				index, resource_list.get_theme_color("accent_color", "Editor")
 			)
 			sidebar.find_child("CurrentResource").text = metadata.get_file()
+
+
+func _on_options_pressed() -> void:
+	%OptionsPopup.popup_on_parent(Rect2(%Options.global_position+%Options.size*Vector2(0,1), Vector2()))
+
+
+func _on_folder_colors_toggled(toggled_on: bool) -> void:
+	DialogicUtil.set_editor_setting("sidebar_use_folder_colors", toggled_on)
+	update_resource_list()
+
+
+func _on_trim_folder_paths_toggled(toggled_on: bool) -> void:
+	DialogicUtil.set_editor_setting("sidebar_trim_folder_paths", toggled_on)
+	update_resource_list()
+
+
+func _on_main_v_split_dragged(offset: int) -> void:
+	DialogicUtil.set_editor_setting("sidebar_v_split", offset)