More work ..

Author: einarf

arcade/context.py

@@ -99,18 +99,18 @@ def __init__(
         self.sprite_list_program_cull["sprite_texture"] = 0
         self.sprite_list_program_cull["uv_texture"] = 1
 
-        # self.sprite_list_program_no_geo = self.load_program(
-        #     vertex_shader=":system:shaders/sprites/sprite_list_simple_vs.glsl",
-        #     fragment_shader=":system:shaders/sprites/sprite_list_simple_fs.glsl",
-        # )
-        # self.sprite_list_program_no_geo["sprite_texture"] = 0
-        # self.sprite_list_program_no_geo["uv_texture"] = 1
-        # # Per-instance data
-        # self.sprite_list_program_no_geo["pos_data"] = 2
-        # self.sprite_list_program_no_geo["size_data"] = 3
-        # self.sprite_list_program_no_geo["color_data"] = 4
-        # self.sprite_list_program_no_geo["texture_id_data"] = 5
-        # self.sprite_list_program_no_geo["index_data"] = 6
+        self.sprite_list_program_no_geo = self.load_program(
+            vertex_shader=":system:shaders/sprites/sprite_list_simple_vs.glsl",
+            fragment_shader=":system:shaders/sprites/sprite_list_simple_fs.glsl",
+        )
+        self.sprite_list_program_no_geo["sprite_texture"] = 0
+        self.sprite_list_program_no_geo["uv_texture"] = 1
+        # Per-instance data
+        self.sprite_list_program_no_geo["pos_data"] = 2
+        self.sprite_list_program_no_geo["size_data"] = 3
+        self.sprite_list_program_no_geo["color_data"] = 4
+        self.sprite_list_program_no_geo["texture_id_data"] = 5
+        self.sprite_list_program_no_geo["index_data"] = 6
 
         self.sprite_program_single = self.load_program(
             vertex_shader=":system:shaders/sprites/sprite_single_vs.glsl",

arcade/resources/system/shaders/lib/sprite.glsl

@@ -1,4 +1,4 @@
-// Fetch texture coordiantes from uv texture
+// Fetch texture coordinates from uv texture
 void getSpriteUVs(sampler2D uvData, int texture_id, out vec2 uv0, out vec2 uv1, out vec2 uv2, out vec2 uv3) {
     texture_id *= 2;
     // Calculate the position in the texture. Basic "line wrapping".
@@ -14,3 +14,26 @@ void getSpriteUVs(sampler2D uvData, int texture_id, out vec2 uv0, out vec2 uv1,
     uv2 = data_2.xy;
     uv3 = data_2.zw;
 }
+
+// Functions for fetching per-instance data from textures.
+// These are used with the shader program that uses instancing to render sprites
+// meaning there is no geo shader involved. This should work for WebGL.
+vec4 getInstancePosRot(sampler2D posData, int index) {
+    return texelFetch(posData, ivec2(index, 0), 0);
+}
+
+vec2 getInstanceSize(sampler2D sizeData, int index) {
+    return texelFetch(sizeData, ivec2(index, 0), 0).xy;
+}
+
+vec4 getInstanceColor(sampler2D colorData, int index) {
+    return texelFetch(colorData, ivec2(index, 0), 0);
+}
+
+int getInstanceTextureId(isampler2D textureIdData, int index) {
+    return texelFetch(textureIdData, ivec2(index, 0), 0).x;
+}
+
+int getInstanceIndex(isampler2D indexData, int index) {
+    return texelFetch(indexData, ivec2(index, 0), 0).x;
+}

arcade/resources/system/shaders/sprites/sprite_list_simple_fs.glsl

@@ -18,5 +18,5 @@ void main() {
     if (base_color.a == 0.0) {
         discard;
     }
-    f_color = base_color;
+    f_color = base_color + vec4(0.5, 0.5, 0.5, 1.0);
 }

arcade/resources/system/shaders/sprites/sprite_list_simple_vs.glsl

@@ -1,6 +1,11 @@
 #version 330
 // vert/frag only version of the sprite list shader
 
+uniform WindowBlock {
+    mat4 projection;
+    mat4 view;
+} window;
+
 // Texture atlas
 uniform sampler2D sprite_texture;
 // Texture containing UVs for the entire atlas
@@ -17,21 +22,60 @@ uniform isampler2D index_data;
 // 0.0 is no offset, 1.0 is half a pixel offset
 uniform float uv_offset_bias;
 
-// Per sprite/instance data
-in vec3 in_instance_pos;
 // Instanced geometry (rectangle as triangle strip)
 in vec2 in_pos;
 
+// Output to frag shader
 out vec2 uv;
 out vec4 color;
 
 #include :system:shaders/lib/sprite.glsl
 
 void main() {
+    // Reading per-instance data from textures.
+    // First we need take the index texture into account to get the correct rendering order.
+    int index = getInstanceIndex(index_data, gl_InstanceID);
+    vec4 pos_rot = getInstancePosRot(pos_data, index);
+    vec2 size = getInstanceSize(size_data, index);  
+    vec4 color = getInstanceColor(color_data, index);
+    int texture_id = getInstanceTextureId(texture_id_data, index);
     // Read texture coordinates from UV texture here
     vec2 uv0, uv1, uv2, uv3;
-    getSpriteUVs(uv_texture, int(in_instance_texture), uv0, uv1, uv2, uv3);
+    getSpriteUVs(uv_texture, texture_id, uv0, uv1, uv2, uv3);
+
+    vec3 center = pos_rot.xyz;
+    float angle = radians(pos_rot.w);
+    mat2 rot = mat2(
+        cos(angle), -sin(angle),
+        sin(angle),  cos(angle)
+    );
+
+    mat4 mvp = window.projection * window.view;
 
     // TODO: Half pixel offset
-    // TODO: Position, rotation, size, color, uvs
+
+    int vertex_id = gl_VertexID % 4;
+    color = color;
+    switch (vertex_id) {
+        case 0:
+            // Upper left
+            gl_Position = mvp * vec4(rot * size + center.xy, center.z, 1.0);
+            uv = uv0;
+            break;
+        case 1:
+            // lower left
+            gl_Position = mvp * vec4(rot * size + center.xy, center.z, 1.0);
+            uv = uv2;
+            break;
+        case 2:
+            // upper right
+            gl_Position = mvp * vec4(rot * size + center.xy, center.z, 1.0);
+            uv = uv1;
+            break;
+        case 3:
+            // lower right
+            gl_Position = mvp * vec4(rot * size + center.xy, center.z, 1.0);
+            uv = uv3;
+            break;
+    }
 }

arcade/sprite_list/sprite_list.py

@@ -20,7 +20,7 @@
 )
 
 from arcade import Sprite, SpriteType, SpriteType_co, get_window, gl
-from arcade.gl import Program, Texture2D
+from arcade.gl import Program, Texture2D, BufferDescription
 from arcade.gl.buffer import Buffer
 from arcade.gl.types import BlendFunction, OpenGlFilter, PyGLenum
 from arcade.gl.vertex_array import Geometry
@@ -293,9 +293,17 @@ def _init_deferred(self) -> None:
         self.ctx = get_window().ctx
         if not self._atlas:
             self._atlas = self.ctx.default_atlas
-        self._spritelist_data = SpriteListBufferData(
+
+        # NOTE: Instantiate the appropriate spritelist data class here
+        # Desktop GL (with geo shader)
+        # self._spritelist_data = SpriteListBufferData(
+        #     self.ctx, capacity=self._buf_capacity, atlas=self._atlas
+        # )
+        # WebGL (without geo shader)
+        self._spritelist_data = SpriteListTextureData(
             self.ctx, capacity=self._buf_capacity, atlas=self._atlas
         )
+
         self._initialized = True
 
         # Load all the textures and write texture coordinates into buffers.
@@ -1569,19 +1577,29 @@ def __init__(self, ctx: ArcadeContext, capacity: int, atlas: TextureAtlasBase) -
         self._atlas = atlas
 
         # Program without geo shader
-        self.program = self.ctx.load_program(
-            vertex_shader=":system:shaders/sprites/sprite_list_simple_vs.glsl",
-            fragment_shader=":system:shaders/sprites/sprite_list_simple_fs.glsl",
-        )
-        self._geometry: Geometry | None = None
+        self.program = self.ctx.sprite_list_program_no_geo
         self._atlas = atlas or self.ctx.default_atlas
 
+        # fmt: off
+        self._instance_buffer = self.ctx.buffer(
+            data=array("f", [
+                -0.5, +0.5,  # Upper left
+                -0.5, -0.5,  # lower left
+                +0.5, +0.5,  # upper right
+                +0.5, -0.5,  # lower right
+            ]),
+        )
+        # fmt: on
+        self._geometry = self.ctx.geometry(
+            [BufferDescription(self._instance_buffer, "2f", ["in_pos"], instanced=True)],
+        )
+
         # Texture buffers for per-sprite data. These are looked up using gl_InstanceID
         self._pos_angle_texture = self.ctx.texture(size=(capacity, 4), dtype="f4")
         self._size_texture = self.ctx.texture(size=(capacity, 2), dtype="f4")
         self._color_texture = self.ctx.texture(size=(capacity, 4), dtype="f4")
-        self._texture_id_texture = self.ctx.texture(size=(capacity, 1), dtype="I4")
-        self._index_texture = self.ctx.texture(size=(capacity, 1), dtype="I4")
+        self._texture_id_texture = self.ctx.texture(size=(capacity, 1), dtype="i4")
+        self._index_texture = self.ctx.texture(size=(capacity, 1), dtype="i4")
 
     def write_sprite_buffers_to_gpu(
         self,
@@ -1598,7 +1616,40 @@ def write_sprite_buffers_to_gpu(
         sprite_texture_changed: bool = True,
         sprite_index_changed: bool = True,
     ) -> None:
-        pass
+        """
+        Write the sprite buffers to the GPU.
+
+        Args:
+            sprite_pos_angle_data: Array of sprite positions.
+            sprite_size_data: Array of sprite sizes.
+            sprite_color_data: Array of sprite colors.
+            sprite_texture_data: Array of sprite texture IDs.
+            sprite_index_data: Array of sprite indices.
+            sprite_pos_angle_changed: Whether the position data has changed.
+            sprite_size_changed: Whether the size data has changed.
+            sprite_color_changed: Whether the color data has changed.
+            sprite_texture_changed: Whether the texture data has changed.
+            sprite_index_changed: Whether the index data has changed.
+        """
+        if sprite_pos_angle_changed:
+            self._pos_angle_texture.write(sprite_pos_angle_data)
+            self._sprite_pos_angle_changed = False
+
+        if sprite_size_changed:
+            self._size_texture.write(sprite_size_data)
+            self._sprite_size_changed = False
+
+        if sprite_color_changed:
+            self._color_texture.write(sprite_color_data)
+            self._sprite_color_changed = False
+
+        if sprite_texture_changed:
+            self._texture_id_texture.write(sprite_texture_data)
+            self._sprite_texture_changed = False
+
+        if sprite_index_changed:
+            self._index_texture.write(sprite_index_data)
+            self._sprite_index_changed = False
 
     def grow_sprite_buffers(self) -> None:
         """Double the internal storage"""
@@ -1687,7 +1738,7 @@ def render(
         self._geometry.render(
             self.program,
             mode=self.ctx.POINTS,
-            vertices=count,
+            instances=count,
         )
 
         # Leave global states to default