Add accessibility settings, implement image preview field

addons/dialogic/Editor/Events/EventBlock/event_block.gd

@@ -55,6 +55,8 @@ func _ready() -> void:
 func initialize_ui() -> void:
 	var _scale := DialogicUtil.get_editor_scale()
 
+	add_theme_constant_override("margin_bottom", ProjectSettings.get_setting('dialogic/accessibility/event_block_margin', 0) * _scale)
+
 	$PanelContainer.self_modulate = get_theme_color("accent_color", "Editor")
 
 	# Warning Icon
@@ -168,6 +170,7 @@ var FIELD_SCENES := {
 	DialogicEvent.ValueType.VECTOR4: 			"res://addons/dialogic/Editor/Events/Fields/field_vector4.tscn",
 	DialogicEvent.ValueType.COLOR: 				"res://addons/dialogic/Editor/Events/Fields/field_color.tscn",
 	DialogicEvent.ValueType.AUDIO_PREVIEW: 		"res://addons/dialogic/Editor/Events/Fields/field_audio_preview.tscn",
+	DialogicEvent.ValueType.IMAGE_PREVIEW:		"res://addons/dialogic/Editor/Events/Fields/field_image_preview.tscn",
 	}
 
 func build_editor(build_header:bool = true, build_body:bool = false) ->  void:

addons/dialogic/Editor/Events/Fields/field_image_preview.gd

@@ -0,0 +1,74 @@
+@tool
+extends DialogicVisualEditorField
+
+
+var body: Control
+var image_path: String
+
+func _ready() -> void:
+	if _is_preview_enabled():
+		%HiddenLabel.hide()
+
+	body = find_parent('Body') as Control
+	body.visibility_changed.connect(_on_body_visibility_toggled)
+	custom_minimum_size.y = ProjectSettings.get_setting(
+		'dialogic/accessibility/image_preview_height', 50) * DialogicUtil.get_editor_scale()
+
+
+func _enter_tree() -> void:
+	%HiddenLabel.add_theme_color_override(
+		'font_color',
+		event_resource.event_color.lerp(get_theme_color("font_color", "Editor"), 0.8))
+
+
+#region OVERWRITES
+################################################################################
+
+
+## To be overwritten
+func _set_value(value:Variant) -> void:
+	if not _is_preview_enabled():
+		if ResourceLoader.exists(value):
+			image_path = value
+			return
+
+	if ResourceLoader.exists(value):
+		self.texture = load(value)
+		custom_minimum_size.y = ProjectSettings.get_setting(
+			'dialogic/accessibility/image_preview_height', 50)  * DialogicUtil.get_editor_scale()
+		image_path = value
+		minimum_size_changed.emit()
+	else:
+		self.texture = null
+		minimum_size_changed.emit()
+
+#endregion
+
+
+#region SIGNAL METHODS
+################################################################################
+
+
+func _on_body_visibility_toggled() -> void:
+	custom_minimum_size.y = 0
+
+	if not _is_preview_enabled():
+		self.texture = null
+		%HiddenLabel.show()
+		minimum_size_changed.emit()
+		return
+
+	if body.visible and ResourceLoader.exists(image_path):
+		%HiddenLabel.hide()
+		self.texture = load(image_path)
+		custom_minimum_size.y = ProjectSettings.get_setting(
+			'dialogic/accessibility/image_preview_height', 50)  * DialogicUtil.get_editor_scale()
+		minimum_size_changed.emit()
+	elif not body.visible:
+		self.texture = null
+		minimum_size_changed.emit()
+
+#endregion
+
+func _is_preview_enabled() -> bool:
+	return ProjectSettings.get_setting('dialogic/accessibility/image_preview_height', 50) != 0

addons/dialogic/Editor/Events/Fields/field_image_preview.tscn

@@ -0,0 +1,23 @@
+[gd_scene load_steps=2 format=3 uid="uid://bar0t74j5v4sa"]
+
+[ext_resource type="Script" path="res://addons/dialogic/Editor/Events/Fields/field_image_preview.gd" id="1_e5vbc"]
+
+[node name="Field_Image_Preview" type="TextureRect"]
+custom_minimum_size = Vector2(0, 100)
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+size_flags_horizontal = 3
+size_flags_vertical = 0
+expand_mode = 2
+stretch_mode = 4
+script = ExtResource("1_e5vbc")
+
+[node name="HiddenLabel" type="Label" parent="."]
+unique_name_in_owner = true
+layout_mode = 0
+tooltip_text = "Preview hidden because 'dialogic/accessibility/image_preview_height' is 0."
+mouse_filter = 1
+text = "(Hidden)"

addons/dialogic/Editor/Settings/settings_accessibility.gd

@@ -0,0 +1,39 @@
+@tool
+extends DialogicSettingsPage
+
+## Settings tab that holds dialogic editor accessibility settings.
+
+
+func _get_title() -> String:
+	return "Accessibility"
+
+
+func _get_priority() -> int:
+	return 98
+
+
+func _refresh() -> void:
+	%ImagePreviewHeight.value = ProjectSettings.get_setting('dialogic/accessibility/image_preview_height', 100)
+	%EventBlockMargin.value = ProjectSettings.get_setting('dialogic/accessibility/event_block_margin', 0)
+	%ShowEventNames.set_pressed_no_signal(ProjectSettings.get_setting('dialogic/accessibility/show_event_names', false))
+
+
+func _ready() -> void:
+	%ImagePreviewHeight.value_changed.connect(_on_ImagePreviewHeight_value_changed)
+	%EventBlockMargin.value_changed.connect(_on_EventBlockMargin_value_changed)
+	%ShowEventNames.toggled.connect(_on_ShowEventNames_toggled)
+
+
+func _on_ImagePreviewHeight_value_changed(value:float) -> void:
+	ProjectSettings.set_setting('dialogic/accessibility/image_preview_height', value)
+	ProjectSettings.save()
+
+
+func _on_EventBlockMargin_value_changed(value:float) -> void:
+	ProjectSettings.set_setting('dialogic/accessibility/event_block_margin', value)
+	ProjectSettings.save()
+
+
+func _on_ShowEventNames_toggled(toggled:bool) -> void:
+	ProjectSettings.set_setting('dialogic/accessibility/show_event_names', toggled)
+	ProjectSettings.save()

addons/dialogic/Editor/Settings/settings_accessibility.tscn

@@ -0,0 +1,86 @@
+[gd_scene load_steps=3 format=3 uid="uid://dbdmosh6v536s"]
+
+[ext_resource type="Script" path="res://addons/dialogic/Editor/Settings/settings_accessibility.gd" id="1_4mq0l"]
+[ext_resource type="PackedScene" uid="uid://dbpkta2tjsqim" path="res://addons/dialogic/Editor/Common/hint_tooltip_icon.tscn" id="2_7u84i"]
+
+[node name="Accessibility" type="VBoxContainer"]
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+script = ExtResource("1_4mq0l")
+
+[node name="TimelineTitle" type="HBoxContainer" parent="."]
+layout_mode = 2
+
+[node name="SectionTimelineTitle" type="Label" parent="TimelineTitle"]
+layout_mode = 2
+theme_type_variation = &"DialogicSettingsSection"
+text = "Visual Timeline"
+
+[node name="HintTooltip" parent="TimelineTitle" instance=ExtResource("2_7u84i")]
+layout_mode = 2
+texture = null
+hint_text = "These settings affect the visual timeline."
+
+[node name="HBoxContainer" type="HBoxContainer" parent="."]
+layout_mode = 2
+
+[node name="Label" type="Label" parent="HBoxContainer"]
+layout_mode = 2
+text = "Image preview height"
+
+[node name="HintTooltip" parent="HBoxContainer" instance=ExtResource("2_7u84i")]
+layout_mode = 2
+tooltip_text = "This is the amount of space between event blocks in the timeline."
+texture = null
+hint_text = "If set to 0, image previews will be disabled."
+
+[node name="ImagePreviewHeight" type="SpinBox" parent="HBoxContainer"]
+unique_name_in_owner = true
+layout_mode = 2
+rounded = true
+allow_greater = true
+update_on_text_changed = true
+suffix = "px"
+select_all_on_focus = true
+
+[node name="HBoxContainer2" type="HBoxContainer" parent="."]
+layout_mode = 2
+
+[node name="Label" type="Label" parent="HBoxContainer2"]
+layout_mode = 2
+text = "Event block bottom margin"
+
+[node name="HintTooltip" parent="HBoxContainer2" instance=ExtResource("2_7u84i")]
+layout_mode = 2
+tooltip_text = "These settings affect the visual timeline."
+texture = null
+hint_text = "This adds extra space at the bottom of event blocks. Requires reloading the visual timeline to take effect."
+
+[node name="EventBlockMargin" type="SpinBox" parent="HBoxContainer2"]
+unique_name_in_owner = true
+layout_mode = 2
+rounded = true
+allow_greater = true
+update_on_text_changed = true
+suffix = "px"
+select_all_on_focus = true
+
+[node name="HBoxContainer3" type="HBoxContainer" parent="."]
+layout_mode = 2
+
+[node name="Label" type="Label" parent="HBoxContainer3"]
+layout_mode = 2
+text = "Show event names in timeline"
+
+[node name="HintTooltip" parent="HBoxContainer3" instance=ExtResource("2_7u84i")]
+layout_mode = 2
+tooltip_text = "This is the amount of space between event blocks in the timeline."
+texture = null
+hint_text = "Enabling this prepends the event name at the beginning of event blocks. Requires reloading the visual timeline to take effect."
+
+[node name="ShowEventNames" type="CheckButton" parent="HBoxContainer3"]
+unique_name_in_owner = true
+layout_mode = 2

addons/dialogic/Editor/Settings/settings_editor.gd

@@ -25,6 +25,7 @@ func _ready() -> void:
 		return
 
 	register_settings_section("res://addons/dialogic/Editor/Settings/settings_general.tscn")
+	register_settings_section("res://addons/dialogic/Editor/Settings/settings_accessibility.tscn")
 	register_settings_section("res://addons/dialogic/Editor/Settings/settings_translation.tscn")
 	register_settings_section("res://addons/dialogic/Editor/Settings/settings_modules.tscn")
 

addons/dialogic/Modules/Background/event_background.gd

@@ -13,7 +13,11 @@ extends DialogicEvent
 var scene := ""
 ## The argument that is passed to the background scene.
 ## For the default scene it's the path to the image to show.
-var argument := ""
+var argument := "":
+	set(value):
+		if argument != value:
+			argument = value
+			ui_update_needed.emit()
 ## The time the fade animation will take. Leave at 0 for instant change.
 var fade: float = 0.0
 ## Name of the transition to use.
@@ -138,6 +142,9 @@ func build_event_editor() -> void:
 			'_arg_type == ArgumentTypes.IMAGE or _scene_type == SceneTypes.DEFAULT')
 	add_header_edit('argument', ValueType.SINGLELINE_TEXT, {}, '_arg_type == ArgumentTypes.CUSTOM')
 
+	add_body_edit("argument", ValueType.IMAGE_PREVIEW, {'left_text':'Preview:'}, '(_arg_type == ArgumentTypes.IMAGE or _scene_type == SceneTypes.DEFAULT) and !argument.is_empty()')
+	add_body_line_break('(_arg_type == ArgumentTypes.IMAGE or _scene_type == SceneTypes.DEFAULT) and !argument.is_empty()')
+
 	add_body_edit("transition", ValueType.DYNAMIC_OPTIONS,
 			{'left_text':'Transition:',
 			'empty_text':'Simple Fade',

addons/dialogic/Resources/event.gd

@@ -93,7 +93,7 @@ enum ValueType {
 	NUMBER,
 	VECTOR2, VECTOR3, VECTOR4,
 	# Other
-	CUSTOM, BUTTON, LABEL, COLOR, AUDIO_PREVIEW
+	CUSTOM, BUTTON, LABEL, COLOR, AUDIO_PREVIEW, IMAGE_PREVIEW
 }
 ## List that stores the fields for the editor
 var editor_list: Array = []
@@ -466,6 +466,8 @@ func get_event_editor_info() -> Array:
 		else:
 			editor_list = []
 
+		if ProjectSettings.get_setting('dialogic/accessibility/show_event_names', false):
+			add_header_label(event_name)
 		build_event_editor()
 		return editor_list
 	else: