Added color Averaging (#822)

src/UI/ColorPickers/ColorPickers.gd

@@ -2,12 +2,17 @@ extends Container
 
 onready var left_picker := $ColorPickersHorizontal/LeftColorPickerButton
 onready var right_picker := $ColorPickersHorizontal/RightColorPickerButton
+onready var average_color = $"%AverageColor"
+onready var transparent_checker = $"%TransparentChecker"
 
 
 func _ready() -> void:
 	Tools.connect("color_changed", self, "update_color")
 	left_picker.get_picker().presets_visible = false
 	right_picker.get_picker().presets_visible = false
+	_average(left_picker.color, right_picker.color)
+	transparent_checker.rect_position = average_color.rect_position
+	transparent_checker.rect_size = average_color.rect_size
 
 
 func _on_ColorSwitch_pressed() -> void:
@@ -17,6 +22,15 @@ func _on_ColorSwitch_pressed() -> void:
 func _on_ColorPickerButton_color_changed(color: Color, right: bool):
 	var button := BUTTON_RIGHT if right else BUTTON_LEFT
 	Tools.assign_color(color, button)
+	_average(left_picker.color, right_picker.color)
+
+
+func _on_ToLeft_pressed():
+	Tools.assign_color(average_color.color, BUTTON_LEFT)
+
+
+func _on_ToRight_pressed():
+	Tools.assign_color(average_color.color, BUTTON_RIGHT)
 
 
 func _on_ColorPickerButton_pressed() -> void:
@@ -38,3 +52,27 @@ func update_color(color: Color, button: int) -> void:
 		left_picker.color = color
 	else:
 		right_picker.color = color
+	_average(left_picker.color, right_picker.color)
+
+
+func _average(color_1: Color, color_2: Color) -> void:
+	var average_r = (color_1.r + color_2.r) / 2.0
+	var average_g = (color_1.g + color_2.g) / 2.0
+	var average_b = (color_1.b + color_2.b) / 2.0
+	var average_a = (color_1.a + color_2.a) / 2.0
+	var average := Color(average_r, average_g, average_b, average_a)
+
+	var copy_button = average_color.get_parent()
+	copy_button.hint_tooltip = str("Average Color:\n#", average.to_html(), "\n(Press to Copy)")
+	average_color.color = average
+
+
+func _on_CopyAverage_button_down():
+	transparent_checker.visible = false
+	average_color.visible = false
+	OS.clipboard = average_color.color.to_html()
+
+
+func _on_CopyAverage_button_up():
+	transparent_checker.visible = true
+	average_color.visible = true

src/UI/ColorPickers/ColorPickers.tscn

@@ -1,15 +1,30 @@
-[gd_scene load_steps=6 format=2]
+[gd_scene load_steps=10 format=2]
 
 [ext_resource path="res://assets/graphics/misc/color_defaults.png" type="Texture" id=1]
 [ext_resource path="res://assets/graphics/misc/color_switch.png" type="Texture" id=2]
 [ext_resource path="res://src/UI/ColorPickers/ColorPickers.gd" type="Script" id=3]
+[ext_resource path="res://src/UI/Nodes/TransparentChecker.tscn" type="PackedScene" id=4]
+[ext_resource path="res://src/Shaders/TransparentChecker.shader" type="Shader" id=5]
+[ext_resource path="res://assets/graphics/timeline/move_arrow.png" type="Texture" id=6]
 
 [sub_resource type="InputEventAction" id=20]
 action = "switch_colors"
 
 [sub_resource type="ShortCut" id=19]
 shortcut = SubResource( 20 )
 
+[sub_resource type="ShaderMaterial" id=1]
+shader = ExtResource( 5 )
+shader_param/size = 10.0
+shader_param/alpha = 1.0
+shader_param/color1 = Color( 0.7, 0.7, 0.7, 1 )
+shader_param/color2 = Color( 1, 1, 1, 1 )
+shader_param/offset = Vector2( 0, 0 )
+shader_param/scale = Vector2( 0, 0 )
+shader_param/rect_size = Vector2( 0, 0 )
+shader_param/follow_movement = false
+shader_param/follow_scale = false
+
 [node name="ColorPickers" type="PanelContainer"]
 margin_left = 958.0
 margin_top = 170.0
@@ -21,51 +36,144 @@ script = ExtResource( 3 )
 margin_left = 7.0
 margin_top = 7.0
 margin_right = 311.0
-margin_bottom = 52.062
+margin_bottom = 55.0
 custom_constants/separation = 13
 alignment = 1
 
 [node name="LeftColorPickerButton" type="ColorPickerButton" parent="ColorPickersHorizontal"]
-margin_left = 62.0
-margin_top = 6.0
-margin_right = 126.0
-margin_bottom = 38.0
+margin_left = 19.0
+margin_top = 8.0
+margin_right = 83.0
+margin_bottom = 40.0
 rect_min_size = Vector2( 64, 32 )
 hint_tooltip = "Choose a color for the left tool"
 mouse_default_cursor_shape = 2
 size_flags_horizontal = 0
 size_flags_vertical = 4
 
 [node name="ColorButtonsVertical" type="VBoxContainer" parent="ColorPickersHorizontal"]
-margin_left = 139.0
-margin_right = 164.0
-margin_bottom = 45.0
+margin_left = 96.0
+margin_right = 207.0
+margin_bottom = 48.0
 alignment = 1
 
 [node name="ColorSwitch" type="TextureButton" parent="ColorPickersHorizontal/ColorButtonsVertical" groups=["UIButtons"]]
-margin_top = 13.0
-margin_right = 25.0
-margin_bottom = 20.0
+margin_left = 43.0
+margin_right = 68.0
+margin_bottom = 7.0
 hint_tooltip = "Switch left and right colors
 (%s)"
 mouse_default_cursor_shape = 2
+size_flags_horizontal = 4
 shortcut_in_tooltip = false
 shortcut = SubResource( 19 )
 texture_normal = ExtResource( 2 )
 
-[node name="ColorDefaults" type="TextureButton" parent="ColorPickersHorizontal/ColorButtonsVertical"]
-margin_top = 24.0
+[node name="HBoxContainer" type="HBoxContainer" parent="ColorPickersHorizontal/ColorButtonsVertical"]
+margin_top = 11.0
+margin_right = 111.0
+margin_bottom = 36.0
+alignment = 1
+
+[node name="ToLeft" type="Button" parent="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer"]
 margin_right = 25.0
-margin_bottom = 32.0
+margin_bottom = 25.0
+rect_min_size = Vector2( 25, 25 )
+hint_tooltip = "Interpolate the (Left Color)
+towards the (Right Color)"
+
+[node name="TextureRect" type="TextureRect" parent="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer/ToLeft"]
+anchor_right = 1.0
+anchor_bottom = 1.0
+margin_left = 4.0
+margin_top = 4.0
+margin_right = -4.0
+margin_bottom = -4.0
+texture = ExtResource( 6 )
+expand = true
+stretch_mode = 6
+flip_h = true
+__meta__ = {
+"_editor_description_": ""
+}
+
+[node name="Line1" type="HSeparator" parent="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer"]
+margin_left = 29.0
+margin_right = 39.0
+margin_bottom = 25.0
+rect_min_size = Vector2( 10, 0 )
+size_flags_horizontal = 3
+
+[node name="CopyAverage" type="Button" parent="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer"]
+margin_left = 43.0
+margin_right = 68.0
+margin_bottom = 25.0
+rect_min_size = Vector2( 25, 25 )
+
+[node name="TransparentChecker" parent="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer/CopyAverage" instance=ExtResource( 4 )]
+unique_name_in_owner = true
+material = SubResource( 1 )
+anchor_right = 1.0
+anchor_bottom = 1.0
+margin_right = 0.0
+margin_bottom = 0.0
+__meta__ = {
+"_editor_description_": ""
+}
+
+[node name="AverageColor" type="ColorRect" parent="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer/CopyAverage"]
+unique_name_in_owner = true
+anchor_left = 0.5
+anchor_top = 0.5
+anchor_right = 0.5
+anchor_bottom = 0.5
+margin_left = -10.5
+margin_top = -10.5
+margin_right = 10.5
+margin_bottom = 10.5
+mouse_filter = 2
+
+[node name="Line2" type="HSeparator" parent="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer"]
+margin_left = 72.0
+margin_right = 82.0
+margin_bottom = 25.0
+rect_min_size = Vector2( 10, 0 )
+size_flags_horizontal = 3
+
+[node name="ToRight" type="Button" parent="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer"]
+margin_left = 86.0
+margin_right = 111.0
+margin_bottom = 25.0
+rect_min_size = Vector2( 25, 25 )
+hint_tooltip = "Interpolate the (Right Color)
+towards the (Left Color)"
+
+[node name="TextureRect" type="TextureRect" parent="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer/ToRight"]
+anchor_right = 1.0
+anchor_bottom = 1.0
+margin_left = 4.0
+margin_top = 4.0
+margin_right = -4.0
+margin_bottom = -4.0
+texture = ExtResource( 6 )
+expand = true
+stretch_mode = 6
+
+[node name="ColorDefaults" type="TextureButton" parent="ColorPickersHorizontal/ColorButtonsVertical"]
+margin_left = 43.0
+margin_top = 40.0
+margin_right = 68.0
+margin_bottom = 48.0
 hint_tooltip = "Reset the colors to their default state (black for left, white for right)"
 mouse_default_cursor_shape = 2
+size_flags_horizontal = 4
 texture_normal = ExtResource( 1 )
 
 [node name="RightColorPickerButton" type="ColorPickerButton" parent="ColorPickersHorizontal"]
-margin_left = 177.0
-margin_top = 6.0
-margin_right = 241.0
-margin_bottom = 38.0
+margin_left = 220.0
+margin_top = 8.0
+margin_right = 284.0
+margin_bottom = 40.0
 rect_min_size = Vector2( 64, 32 )
 hint_tooltip = "Choose a color for the right tool"
 mouse_default_cursor_shape = 2
@@ -77,6 +185,10 @@ color = Color( 1, 1, 1, 1 )
 [connection signal="popup_closed" from="ColorPickersHorizontal/LeftColorPickerButton" to="." method="_on_ColorPickerButton_popup_closed"]
 [connection signal="pressed" from="ColorPickersHorizontal/LeftColorPickerButton" to="." method="_on_ColorPickerButton_pressed"]
 [connection signal="pressed" from="ColorPickersHorizontal/ColorButtonsVertical/ColorSwitch" to="." method="_on_ColorSwitch_pressed"]
+[connection signal="pressed" from="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer/ToLeft" to="." method="_on_ToLeft_pressed"]
+[connection signal="button_down" from="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer/CopyAverage" to="." method="_on_CopyAverage_button_down"]
+[connection signal="button_up" from="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer/CopyAverage" to="." method="_on_CopyAverage_button_up"]
+[connection signal="pressed" from="ColorPickersHorizontal/ColorButtonsVertical/HBoxContainer/ToRight" to="." method="_on_ToRight_pressed"]
 [connection signal="pressed" from="ColorPickersHorizontal/ColorButtonsVertical/ColorDefaults" to="." method="_on_ColorDefaults_pressed"]
 [connection signal="color_changed" from="ColorPickersHorizontal/RightColorPickerButton" to="." method="_on_ColorPickerButton_color_changed" binds= [ true ]]
 [connection signal="popup_closed" from="ColorPickersHorizontal/RightColorPickerButton" to="." method="_on_ColorPickerButton_popup_closed"]