Bringing it back to basics

What did i get up to this week?

Small update from me this week. I worked a bit on my renderer early in the week but spent the rest of the week aggressively training Jiu-jitsu. So what exactly did i work on. Well i had previously been toying with a framework known as sokol in c. It’s a graphics abstraction that handles cross platform compilation really well. I highly recommend you go and check it out.

https://github.com/floooh/sokol

floooh is a genius and their work on this project is really really cool. It’s been a joy working with sokol.

So what did you actually do?

Right, so i stood on the shoulders of giants. There’s this great game developer named Randy who uses odin and sokol and promotes it quite extensively. Check them out here. Randy provided a pretty good skeleton for rendering in odin using sokol. I spent the early parts of the week cleaning up his code and moving it to a multi file structure so that it can more easily be worked on.

I also edited the code to handle movement on both the x and y axis instead of just the x. Removed the gravity that was applied in the demo & spent a lot of time reading and understanding how rendering was done in sokol. It essentially just a nicer abstraction on OpenGL.

1. You set up an index buffer. In this case we’re drawing quads so the index buffer is set up to draw those.

    index_buffer_count :: MAX_QUADS*6
        indices : [index_buffer_count]u16;
        i := 0;
        for i < index_buffer_count {
            // vertex offset pattern to draw a quad
            // { 0, 1, 2,  0, 2, 3 }
            indices[i + 0] = auto_cast ((i/6)*4 + 0)
            indices[i + 1] = auto_cast ((i/6)*4 + 1)
            indices[i + 2] = auto_cast ((i/6)*4 + 2)
            indices[i + 3] = auto_cast ((i/6)*4 + 0)
            indices[i + 4] = auto_cast ((i/6)*4 + 2)
            indices[i + 5] = auto_cast ((i/6)*4 + 3)
            i += 6;
        }
        app_state.bind.index_buffer = sg.make_buffer({
            type = .INDEXBUFFER,
            data = { ptr = &indices, size = size_of(indices) },
        })
   

2. Then set up your pipeline with some shader specific data, set up a swap chain & bobs your uncle.

    pipeline_desc : sg.Pipeline_Desc = {
            shader = sg.make_shader(quad_shader_desc(sg.query_backend())),
            index_type = .UINT16,
            layout = {
                attrs = {
                    ATTR_quad_position = { format = .FLOAT2 },
                    ATTR_quad_color0 = { format = .FLOAT4 },
                    ATTR_quad_uv0 = { format = .FLOAT2 },
                    ATTR_quad_bytes0 = { format = .UBYTE4N },
                    ATTR_quad_color_override0 = { format = .FLOAT4 }
                },
            }
        }
   

   I’m glossing over a bunch here, but its the basic setup for a graphics pipeline.

   

   So what’s the outcome of this weeks work?

   A cute little guy who moves in the cardinal directions & some code that has been cleaned up to be extendable for tile loading and processing next week.

So what’s this weeks lesson?

There are far smarter programmers than you who have done the hard yards to understand very complex ideas in code. It’s okay to stand on their shoulders, learn from them and extend their work to work for you. It’s one of the greatest things about open source software! You should never feel bad for taking some code, extending it, learning from it, and morphing it to suit your own needs and learnings.