Programming portals for my DOOM-style FPS

doom and games like it are pretty cool but I've always thought they're missing something important so today I'm gonna fix that and add portals and non-euclidean geometry to my Doom style 3D engine that look like this this and this do you think the first thing to get clarified is what exactly do I mean when I talk about portals and non-eucility in Geometry because if you remember back to my last video I talked quite a bit about portals portal Squirtle portal total portals to draw portals portal portal drawing portals that I mentioned earlier portals portals that are actually going to have something to do with gameplay those sorts of portals are not what I'm talking about today when I said all of that I was actually referring to the way that the 3D levels are drawn and the specifics of the software render and now I mean these kinds of portals as I said before portals that are actually going to have something to do with gameplay let's take a look at how our 3D software renderer works from last time and try to get it to draw these sorts of portals that have something to do with gameplay starting from the beginning and taking a look in the map editor I wrote in the last video we have a level defined by a 2d map made up of walls which can have up to two sides and then we have sectors on top of that which are any closed collection of sides you can see me highlighting them here wherever one ball has two sides which are both transparent we call this a portal that is a portal through which one sector can see another sector to render levels like this we just take all the sides in the current sector draw them according to their orientation and distance of the camera and then add any sectors which those sides had as portals into our queue of sectors to draw and repeat this process until they're no more visible sides to draw this skims over some of the finer details of course but if you want those you can check out the first video important thing right now is that all of this is done in a software renderer meaning that we're manually writing all of these pixels into memory without the help of any fancy Graphics API with that in mind how do we get the gameplay types of portal to work well let's start by defining our problem and the criteria for a solution I want to be able to walk through a wall in one spot and come out at another spot in the level seamlessly I also want to have the effect look convincing at the same time kinda like well portal let's try to get that implemented in our software render portal based an intuitive solution is just well instead of having a transparent side say hey when you hit me render the sector behind me like this we can just tell it to render another sector this variable drawn diagram should kind of explain what I mean with this in mind I programmed in a quick connect tool into the level editor to easily make portals between different sides you can see their color changes to Pink as well let's connect up a couple sides and give this a try and yeah this is just giving us holes in the level because the position of the level geometry is incorrect to refer to another expert level diagram and put it simply this doesn't work because the other sector is over here not here and just connecting the two sides doesn't move the level geometry itself or change its position relative to the camera lucky for us though we only need to apply a simple transformation at the level geometry in order to get things to look right to transform any point as though it's being looked at through a set of portals given an entry and an exit side all we need to do is subtract the points position relative to the entry side rotate the point by the relative angle between the two portals and translate The Point again to be relative to the exit side you can visualize it as doing this to the sector geometry behind the portal so we just take that point transform function and apply it to everything that the portal tries to render including recursive portals well there we go with really minimal changes to the software renderer this kind of just works where you don't need to worry about depth overdraw or anything of the sort you can see from the slower visualization of the software render that This lends itself really well to the way the software vendor implicitly keeps track of which vertical columns have already been drawn by keeping track of the shrinking horizontal Windows of space behind each side to get movement working with these simple portals it's a very similar story as we're trying to move between two portals if we hit the side of one portal we just need to translate the exit position according to those functions we defined earlier Additionally the camera gets rotated by the same angle and the velocity as its direction Vector is also rotated but not translated you can see here in code how this ends up working out and being applied to objects which hit portals and this is how it looks in practice the effect ends up being seamless because there are no clipping planes to deal with like there would be in a real 3D render and as expected we can walk between these two portals we've made infinitely and always end up in the same room so this working what all can we do now well some pretty non-euclidean things how about a square room with three corners this one doesn't look that confusing until you start trying to count the corners As you move and thinking about where the player actually should be in the Square as it moves foreign something that makes even less sense let's try an infinite hallway this one ends up being a little more obviously nonsensical especially when you can walk in the same direction for 10 minutes and always end up in the same spot and when I was working on the software vendor to add portals it also got some more updates namely the infamous viz planes from Doom that is instead of drawing horizontal floor and ceiling planes vertically we now draw them in horizontal strips of pixels to play more nicely with the CPU cache this is a video I posted to my Twitter to demo the change I also added the ability to draw portals on decals which did take a lot of work but the understanding is pretty intuitive I think if you just take a look at the rendering visualization basically these yellow pixels here are a special color which denotes that they're a part of the portalable area and can be drawn over when the portal sector is drawn and then as I was thinking about adding particles flooring ceiling decals and struggling to add doors I had a realization I need to scrap this whole software render thing if I want to ship a game before I'm 40. sure I could pretty quickly ship an exclusively doom-like game but when trying to add more things that would end up being pretty important for gameplay I realized that spending my time on the software render especially debugging it wasn't really helping my ultimate pursuit of making a game and also I don't think anybody wants to play a game with why sharing in 2023 so foreign welcome back to game development in today's video we're going to be trashing all of the code from the last video in the first half of this video and re-implementing it with a real 3D Graphics API so I don't go insane from debugging a software renderer let's get started Jokes Aside as I get the world famous starting triangle up and running in the background let me explain a bit for the re-implementation I'll be using the Fantastic so-called Library as my 3D API of choice as I had a really good time using it for the game Jam I did a few weeks back and I think it's better to Target something more cross-platform than say just bare metal opengl or something like that as I've done in previous project also it compiles platform independent Traders and to see headers with type info which is just beautiful so with our Windows setup triangle drawing a medium mode UI functional I worked out making the triangle spin then making the camera spin then giving us control of the camera and I encountered the first problem with the 3dification of this whole thing triangles see the old renderer used a bunch of hacks and while ordering rules to allow for the drawing of non-convex sectors that is sectors within or ankles greater than 180 degrees to allow for maximal freedom and level design with minimal pre-processing and notably no bsping step like Doom had and that's all well and good but now we're talking with the graphics card to draw things and as you all know it only speaks in Triangle and we don't have any of those so after a lot of reading of complicated math and some failed attempts at rolling my own triangulation code I decided that the best bet was what I've come to refer to as the ancient Rite of code necromancy see back in the day that is 25 years ago implementations of opengl used to ship with this Library called the opengl utility library or Glu which had a bunch of really useful functions for old 3D computer Graphics stuff of interest to us though is the Glu tests or gluteus header which includes routines for transforming a sequence of lines into a set of triangles exactly what we want and conveniently no open JL specifics involved so we can use it really easily with circle so after joining the code from a console who archived an implementation of Glu on GitHub we now have access to these ancient Glu functions and can begin to explore their Mysteries and by explore their Mysteries I mean feed the code a bunch of lines picking up each sector and get a triangulated shape back nice this can of course easily be used to make a 3D mesh which will eventually make up our sector for a ceiling so fast forwarding through the boring parts of re-implementing the render changing the entire code style of the project driven a bunch of dead code and generally getting things ready for the gameplay coming soon now that I had a coherent design behind the game so we can briefly appreciate this rather horrifying visual I got as I was testing things out uh what was this video about again oh right portals take a look at this with our now fully 3D test level here which will give a quick flyover to get a nice overview we have two spots where your portals are supposed to be you can see in the 2D level editor there here notice the pink normals from our connect tool well in the 3D version now we've just got Blank Space so how are we going to do this again now that we're out of our software render well you may say let's just do the same thing we did with the software render just draw all of the geometry relative to the exit portal and while that might work for some simple cases this will quickly fall apart without the same automatic cling mechanisms which exist in the software render and even with the current relatively simple level layout there would be a bunch of overlapping geometry that would work things pretty bad what can we do since the approach from the software renderer won't work well there are a few different possible approaches but we're going to use the stencil buffer which is basically an extra frame buffer like the color or dead buffer which stores an 8-bit value for each pixel which we can manipulate and then use to mask out certain parts of the scene basically telling some pixels to only draw when the stencil buffer has a specific value take a look at this example from blurred opengl.com for a good visual idea about how this works you can imagine how something like this might be useful for portals if we say do exactly where we want to draw a portal we could paint a specific value into the stencil buffer there and then till all the geometry we're drawing from the Portal's perspective to only draw if it had the same value as the stencil portal but this is only one part of the solution when we're drawing the sector behind each portal from the Portal's perspective how do we compute a camera that makes things look right something that does well this like we had in the software render thinking about R3 camera matrices the model Matrix The View Matrix and the projection Matrix we can start with the view matrix by basically applying the same code we used in our software render to transform points between portals but this time to an entire Matrix but the principle of translating relative to the entry portal rotating by the difference and then translating by the exit portal Remains the Same this isn't the entire fix though as if we just try this then we still have some flipping errors to deal with when the camera moves a little further away from our portals to solve this problem I performed another right of necromancy on the opengl forums this time and found my way to this post referring to this paper which shows how to compute an oblique near clipping plane which will basically let us construct a portal camera that doesn't draw anything behind this line you can visualize it in 2D like this this fixes the clipping issues that we had and gives us our first round of working 3D portals also please kindly ignore the fact that the level geometry changed and this fat debug output window over here this took a little while to get working as you might be able to tell anyway though they are working portals which is pretty cool though no walking through them yet without working though what about seeing portals through portals and seeing portals through those portals and those portals let's block the whole thing out in pseudocode so I can explain how this all gets implemented starting from our render function here where we draw the scene from the viewport of the camera breed sector we start by drawing each one of its portals using how these gentle buffer works we draw each portal on screen and increment the values in the stencil buffer such that when we recursively call the drawing function here to draw that Portal's perspective the only pixels that get drawn are these gentle ones those where we just incremented the stencil buffer with the portal geometry after that we decrement the stencil buffer where we've just drawn the portal and then paint the correct depth over it and then once we're done with all of the portals in the current sector we just draw regular sector geometry and move on to the next one and then up and out function though this could likely be optimized with AQ implementation instead of a recursive one it's not broken right now and that's a problem for another time in practice taking a look at the real implementation barring some more complicated looking C code what's basically happening is what's described in the pseudo code with a bunch of extra culling techniques scissor Rex and Magic opengl abuse which Circle might not be too happy about but it works and we can see portals through portals also kindly ignored their reskin of the level it took me a while to fix those bugs so a few changes of textures weren't ordered along the way I thought anyway though with a port of the old movement code from the software rendered version and a lot of bug fixes involving various clipping planes and being able to find really funny angles where the portals wouldn't look right I finally got everything working and movement basically works the same though now if the player is really close to a portal they get pulled through it to the other side to prevent the deer plane of the camera clipping through the portal plane and the effect is small enough that you barely notice it even if you're looking for it and not at all in regular movement while fixing the movement code too I was also able to find and fix about a million different ways to walk through walls and clip or just kind of vibrate your way out of the level and well that's portals so let's take a moment to appreciate some non-euclidean constructions in full 3d first we have this one of an ominous black pillar which has some stairs behind it leading to the same room then we have your classic infinite stairs very non-euclidean very confusing and finally three rooms all side by side all different colors that can't fit in that space I think this one is my favorite though the effect is kind of a little too obvious to maybe use an actual gameplay but we'll find out so anyway with the small task of portals done we don't have a lot of time for gameplay this time around but I'll leave you with this after getting portals implemented I added the first weapon of the game a handgun get it I took some beautiful pictures of my hand cropped them down pixelated them palletized them and animated them at some point in this process as well I added billboarded spritescape those are a couple stress tests and then tried to add particles to the handgun which kind of ended up just looking like popcorn the first time I tried them then I got proper Rey casting for shooting through the 3D levels working meaning that the handgun could also shoot through portals you can also appreciate that I got floor and ceiling decals working and we have these bullet holes wherever we shoot too this was initially tested with the old banana Sprites there's also sound now if you can do that and please ignore the debug lines but you know gotta be sure that those bullets should go into the right spot thank you also not too long ago I hacked together some hot code reloading first C which has been pretty invaluable in debugging this entire thing because it means that I don't need to restart the application every time I tweak a tiny value the map it had also got a lot of bug fixes and a whole lot of new tools letting me design some pretty cool things which I'm very excited to use to design a real game that will have to be next time though until then if you want to see the source code for this project or just like what I may get mono support it go check out my patreon and come join the Discord where I post regular progress updates on what I've been working on thanks to everyone already supporting me there too especially those who have been my top supporters throughout these last few months Coop mccorse and danish pirate I'm really hoping that sooner rather than later I'll be able to get some play tests of something with actual gameplay out to everyone on my patreon anyway though until then as always thank you very much for watching and I'll see you next time

Channel: jdh

Views: 128,557

Keywords: c++, programming, coding, opengl, graphics, java, gamedev, gaming, code, minecraft, indie, 3d, unity

Id: jlRdSdHD3Wg

Length: 17min 15sec (1035 seconds)

Published: Thu May 25 2023