Use viewport for fluid rendering instead of mask color 💦 (#78)

Marking as draft at the moment since the camera is broken.

---------

Co-authored-by: Dragos Daian <daian.dragos@yahoo.com>

bin/samples/godot-rapier2d/Fluid2DRenderer.gd

@@ -1,23 +1,20 @@
 class_name Fluid2DRenderer
 extends MultiMeshInstance2D
 
-@onready var fluid :Fluid2D = get_parent()
+@export var fluid: Fluid2D
 @export var color: Color
 
 func _ready():
 	multimesh = multimesh.duplicate(true)
 
 func _process(_delta):
+	global_position = fluid.global_position
 	var index = 0
 	multimesh.instance_count = fluid.points.size()
 	var points = fluid.points
-	var create_times = fluid.get_create_times()
-	var current_time = Time.get_ticks_msec()
 	for i in points.size():
 		var point = points[i]
-		var created_at = create_times[i]
-		var new_transform: Transform2D = Transform2D()
-		new_transform.origin = point - position
+		var new_transform: Transform2D = Transform2D(0, Vector2(5, 5), 0, point)
 		multimesh.set_instance_transform_2d(index, new_transform)
 		multimesh.set_instance_color(index, color)
 		index += 1

bin/samples/godot-rapier2d/Fluid2DShaderRenderer.gd

@@ -0,0 +1,15 @@
+extends CanvasLayer
+
+@export var camera: Camera2D
+@export var fluid: Fluid2D
+@export var water_material: Material = load("res://samples/godot-rapier2d/water_shader.tres")
+@onready var fluid_renderer: Fluid2DRenderer = $SubViewportContainer/SubViewport/Fluid2DRenderer
+@onready var inside_camera: Camera2D = $SubViewportContainer/SubViewport/Camera2D
+@onready var subviewport_container = $SubViewportContainer
+
+func _ready() -> void:
+	inside_camera.offset = camera.offset
+	inside_camera.zoom = camera.zoom
+	inside_camera.transform = camera.transform
+	fluid_renderer.fluid = fluid
+	subviewport_container.material = water_material

bin/samples/godot-rapier2d/fluid_2d_shader.tscn

@@ -0,0 +1,39 @@
+[gd_scene load_steps=6 format=3 uid="uid://chujsborpvqgu"]
+
+[ext_resource type="Script" path="res://samples/godot-rapier2d/Fluid2DShaderRenderer.gd" id="1_fcfg8"]
+[ext_resource type="Material" uid="uid://clnmfvqslf2ka" path="res://samples/godot-rapier2d/water_shader.tres" id="2_onxbk"]
+[ext_resource type="MultiMesh" uid="uid://d0bhettx43xt1" path="res://samples/godot-rapier2d/fluid_multi_mesh.tres" id="3_hgekb"]
+[ext_resource type="Texture2D" uid="uid://cho3shol3rky2" path="res://samples/godot-rapier2d/Radial2D.svg" id="4_rnpc1"]
+[ext_resource type="Script" path="res://samples/godot-rapier2d/Fluid2DRenderer.gd" id="5_q35nb"]
+
+[node name="Fluid2DShader" type="CanvasLayer" node_paths=PackedStringArray("camera", "fluid")]
+script = ExtResource("1_fcfg8")
+camera = NodePath("")
+fluid = NodePath("")
+water_material = ExtResource("2_onxbk")
+
+[node name="SubViewportContainer" type="SubViewportContainer" parent="."]
+material = ExtResource("2_onxbk")
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+stretch = true
+
+[node name="SubViewport" type="SubViewport" parent="SubViewportContainer"]
+disable_3d = true
+transparent_bg = true
+handle_input_locally = false
+size = Vector2i(1920, 1080)
+render_target_update_mode = 4
+
+[node name="Fluid2DRenderer" type="MultiMeshInstance2D" parent="SubViewportContainer/SubViewport" node_paths=PackedStringArray("fluid")]
+multimesh = ExtResource("3_hgekb")
+texture = ExtResource("4_rnpc1")
+script = ExtResource("5_q35nb")
+fluid = NodePath("")
+color = Color(1, 1, 1, 1)
+
+[node name="Camera2D" type="Camera2D" parent="SubViewportContainer/SubViewport"]
+position = Vector2(521, 1448)

bin/samples/godot-rapier2d/test_fluid.tscn

@@ -1,14 +1,41 @@
-[gd_scene load_steps=17 format=3 uid="uid://dudno1v5vtvh"]
+[gd_scene load_steps=19 format=3 uid="uid://dudno1v5vtvh"]
 
 [ext_resource type="Script" path="res://samples/godot-rapier2d/Faucet2D.gd" id="1_omq0c"]
-[ext_resource type="MultiMesh" uid="uid://d0bhettx43xt1" path="res://samples/godot-rapier2d/fluid_multi_mesh.tres" id="3_880wm"]
-[ext_resource type="Texture2D" uid="uid://cho3shol3rky2" path="res://samples/godot-rapier2d/Radial2D.svg" id="3_py844"]
-[ext_resource type="Script" path="res://samples/godot-rapier2d/Fluid2DRenderer.gd" id="5_2rahx"]
-[ext_resource type="Material" uid="uid://clnmfvqslf2ka" path="res://samples/godot-rapier2d/water_shader.tres" id="6_2yb6s"]
+[ext_resource type="PackedScene" uid="uid://chujsborpvqgu" path="res://samples/godot-rapier2d/fluid_2d_shader.tscn" id="2_uoda0"]
+[ext_resource type="Shader" path="res://samples/godot-rapier2d/water_shader.gdshader" id="3_etfmw"]
 
 [sub_resource type="FluidEffect2DSurfaceTensionAKINCI" id="FluidEffect2DSurfaceTensionAKINCI_iggvj"]
 fluid_tension_coefficient = 10.0
-boundary_adhesion_coefficient = 10.0
+
+[sub_resource type="FluidEffect2DViscosityArtificial" id="FluidEffect2DViscosityArtificial_dqv47"]
+
+[sub_resource type="FastNoiseLite" id="FastNoiseLite_t8jc5"]
+noise_type = 4
+domain_warp_enabled = true
+domain_warp_type = 1
+
+[sub_resource type="NoiseTexture2D" id="NoiseTexture2D_j6i71"]
+generate_mipmaps = false
+seamless = true
+normalize = false
+noise = SubResource("FastNoiseLite_t8jc5")
+
+[sub_resource type="ShaderMaterial" id="ShaderMaterial_6w0ys"]
+shader = ExtResource("3_etfmw")
+shader_parameter/threshold = 0.85
+shader_parameter/water_color = Color(0, 0.639216, 0.996078, 0.615686)
+shader_parameter/test_color = Color(1, 0, 1, 1)
+shader_parameter/speed = 0.1
+shader_parameter/amplitude = 0.1
+shader_parameter/water_texture = SubResource("NoiseTexture2D_j6i71")
+
+[sub_resource type="FluidEffect2DSurfaceTensionAKINCI" id="FluidEffect2DSurfaceTensionAKINCI_kud64"]
+fluid_tension_coefficient = 30.0
+boundary_adhesion_coefficient = 30.0
+
+[sub_resource type="FluidEffect2DViscosityXSPH" id="FluidEffect2DViscosityXSPH_8d0tk"]
+fluid_viscosity_coefficient = 2.0
+boundary_viscosity_coefficient = 2.0
 
 [sub_resource type="RectangleShape2D" id="RectangleShape2D_8y86f"]
 size = Vector2(2676, 1041)
@@ -33,26 +60,13 @@ size = Vector2(80, 260)
 
 [sub_resource type="CircleShape2D" id="CircleShape2D_k12t3"]
 
-[sub_resource type="FastNoiseLite" id="FastNoiseLite_y42gw"]
-noise_type = 4
-fractal_gain = 0.59
-domain_warp_enabled = true
-domain_warp_type = 1
-
-[sub_resource type="NoiseTexture2D" id="NoiseTexture2D_4as7b"]
-generate_mipmaps = false
-seamless = true
-normalize = false
-noise = SubResource("FastNoiseLite_y42gw")
-
 [node name="Node2D" type="Node2D"]
 
 [node name="Water" type="Fluid2D" parent="."]
 points = PackedVector2Array(1827, 1651, 1867, 1651, 1907, 1651, 1947, 1651, 1987, 1651, 1827, 1691, 1867, 1691, 1907, 1691, 1947, 1691, 1987, 1691)
-density = 80.0
+density = 60.0
 lifetime = 20.0
-effects = Array[FluidEffect2D]([SubResource("FluidEffect2DSurfaceTensionAKINCI_iggvj")])
-debug_draw = false
+effects = Array[FluidEffect2D]([SubResource("FluidEffect2DSurfaceTensionAKINCI_iggvj"), SubResource("FluidEffect2DViscosityArtificial_dqv47")])
 modulate = Color(0.654902, 0.768627, 1, 1)
 position = Vector2(414, -1750)
 script = ExtResource("1_omq0c")
@@ -62,34 +76,28 @@ max_particles = 1500
 wait_time = 0.1
 autostart = true
 
-[node name="Fluid2DRenderer" type="MultiMeshInstance2D" parent="Water"]
-position = Vector2(-220, -59)
-multimesh = ExtResource("3_880wm")
-texture = ExtResource("3_py844")
-script = ExtResource("5_2rahx")
-color = Color(1, 0, 1, 1)
+[node name="WaterShader" parent="." node_paths=PackedStringArray("camera", "fluid") instance=ExtResource("2_uoda0")]
+camera = NodePath("../Camera2D")
+fluid = NodePath("../Water")
+water_material = SubResource("ShaderMaterial_6w0ys")
 
-[node name="Water2" type="Fluid2D" parent="."]
+[node name="Mud" type="Fluid2D" parent="."]
 points = PackedVector2Array(1827, 1651, 1867, 1651, 1907, 1651, 1947, 1651, 1987, 1651, 1827, 1691, 1867, 1691, 1907, 1691, 1947, 1691, 1987, 1691)
 density = 80.0
 lifetime = 20.0
-effects = Array[FluidEffect2D]([SubResource("FluidEffect2DSurfaceTensionAKINCI_iggvj")])
-debug_draw = false
+effects = Array[FluidEffect2D]([SubResource("FluidEffect2DSurfaceTensionAKINCI_kud64"), SubResource("FluidEffect2DViscosityXSPH_8d0tk")])
 modulate = Color(0.654902, 0.768627, 1, 1)
 position = Vector2(-3485, -1736)
 script = ExtResource("1_omq0c")
 max_particles = 1500
 
-[node name="Timer" type="Timer" parent="Water2"]
+[node name="Timer" type="Timer" parent="Mud"]
 wait_time = 0.1
 autostart = true
 
-[node name="Fluid2DRenderer" type="MultiMeshInstance2D" parent="Water2"]
-position = Vector2(-220, -59)
-multimesh = ExtResource("3_880wm")
-texture = ExtResource("3_py844")
-script = ExtResource("5_2rahx")
-color = Color(1, 0, 1, 1)
+[node name="MudShader" parent="." node_paths=PackedStringArray("camera", "fluid") instance=ExtResource("2_uoda0")]
+camera = NodePath("../Camera2D")
+fluid = NodePath("../Mud")
 
 [node name="StaticBody2D" type="StaticBody2D" parent="."]
 position = Vector2(126, 282)
@@ -208,7 +216,7 @@ position = Vector2(1962, 953)
 shape = SubResource("CircleShape2D_mdcyi")
 
 [node name="Camera2D" type="Camera2D" parent="."]
-position = Vector2(521, 1448)
+position = Vector2(384, 1587)
 zoom = Vector2(0.3, 0.3)
 
 [node name="PinJoint2D" type="PinJoint2D" parent="."]
@@ -267,20 +275,9 @@ text = "Godot Rapier2D Fluid"
 
 [node name="Polygon2D" type="Polygon2D" parent="."]
 z_index = -100
-color = Color(0.345098, 0.541176, 1, 1)
+color = Color(0.913725, 0.698039, 0.0235294, 1)
 polygon = PackedVector2Array(-5417, -1545, 6372, -1559, 6316, 5057, -5249, 4917)
 
-[node name="CanvasLayer" type="CanvasLayer" parent="."]
-
-[node name="Water" type="TextureRect" parent="CanvasLayer"]
-material = ExtResource("6_2yb6s")
-anchors_preset = 15
-anchor_right = 1.0
-anchor_bottom = 1.0
-grow_horizontal = 2
-grow_vertical = 2
-texture = SubResource("NoiseTexture2D_4as7b")
-
 [connection signal="timeout" from="Water/Timer" to="Water" method="_on_timer_timeout"]
-[connection signal="timeout" from="Water2/Timer" to="Water2" method="_on_timer_timeout"]
+[connection signal="timeout" from="Mud/Timer" to="Mud" method="_on_timer_timeout"]
 [connection signal="body_entered" from="PinJoint2D2/RigidBody2D" to="PinJoint2D2/RigidBody2D" method="_on_body_entered"]

bin/samples/godot-rapier2d/water_shader.gdshader

@@ -1,24 +1,21 @@
 shader_type canvas_item;
 
-uniform float threshold = 0.8;
-uniform vec4 water_color: source_color = vec4(0,1,1,1);
+uniform float threshold = 0.85;
+uniform vec4 water_color: source_color = vec4(0,1,1,0.7);
 uniform vec4 test_color: source_color = vec4(1,0,1,1);
 
 uniform float speed = 0.1; // Speed of movement
 uniform float amplitude = 0.1; // Amplitude of movement
 
-uniform sampler2D screen_texture: hint_screen_texture, filter_linear_mipmap;
+uniform sampler2D water_texture;
 
 void fragment(){
 	float displacement = sin(TIME * speed) * amplitude;
-	vec4 screen_tex = textureLod(screen_texture, SCREEN_UV, 2.5).rgba;
-
-	// check if the color is pink i.e ff00ff
-	// if it is set it to the new color else set it to transparent
-	float color_distance = distance(test_color.rgb, screen_tex.rgb);
-	if (color_distance < threshold) {
-		COLOR = texture(TEXTURE, SCREEN_UV + displacement).rgba * water_color;
-		COLOR.a = (1.0-color_distance) * 100.0;
+	vec4 screen_tex = texture(TEXTURE, SCREEN_UV).rgba;
+
+	float color_distance = screen_tex.r;
+	if (color_distance > threshold) {
+		COLOR = texture(water_texture, SCREEN_UV + displacement).rgba * water_color;
 	} else {
 		COLOR = vec4(0.0);
 	}

bin/samples/godot-rapier2d/water_shader.tres

@@ -1,11 +1,24 @@
-[gd_resource type="ShaderMaterial" load_steps=2 format=3 uid="uid://clnmfvqslf2ka"]
+[gd_resource type="ShaderMaterial" load_steps=4 format=3 uid="uid://clnmfvqslf2ka"]
 
 [ext_resource type="Shader" path="res://samples/godot-rapier2d/water_shader.gdshader" id="1_idpys"]
 
+[sub_resource type="FastNoiseLite" id="FastNoiseLite_y42gw"]
+noise_type = 2
+frequency = 0.0182
+domain_warp_enabled = true
+domain_warp_type = 1
+
+[sub_resource type="NoiseTexture2D" id="NoiseTexture2D_4as7b"]
+generate_mipmaps = false
+seamless = true
+noise = SubResource("FastNoiseLite_y42gw")
+
 [resource]
+resource_local_to_scene = true
 shader = ExtResource("1_idpys")
-shader_parameter/threshold = 0.83
-shader_parameter/water_color = Color(0, 1, 1, 1)
+shader_parameter/threshold = 0.6
+shader_parameter/water_color = Color(0.662745, 0.396078, 0.235294, 0.803922)
 shader_parameter/test_color = Color(1, 0, 1, 1)
 shader_parameter/speed = 0.1
 shader_parameter/amplitude = 0.1
+shader_parameter/water_texture = SubResource("NoiseTexture2D_4as7b")