Tile Scrolling Platformer | 13. Level Progression & Editor Improvements

[Music] hello fellow scratchers i'm griff patch and in this part 13 of our tiled scrolling platformer series we are going to complete the work we started on our level editor and also bring in some new fun tiles to enhance our levels then to complete the episode we're going to squeeze in some basic level progression scripts yes we will be able to get to level two now if you've been following along from week to week and don't already have the orange platforming tiles in your project then you'll find them along with other new costumes in the updated asset project on my griffbatch tutor account as always there's a link under the video so let's open that up now and we'll simply backpack the entire tile sprite and the enemy sprite now my backpack is nice and empty you can keep it like this by right-clicking on items you don't want anymore and deleting them from your backpack good to know okay we can now open up our personal tile scrolling projects this would be a good time to make a backup using the file save as copy it's good practice to keep doing this especially between episodes right open your backpack and drag out the enemy and the tiles sprite this will result in us having an enemy 2 and a tiles 2 sprite let's start with the tiles 2 sprite if we check out the new costumes oh yeah here we go the first new costume is the bush at costume 31. if i switch to the original tile sprite i'll just confirm that the last costume we had before was the mushroom at costume 30. yeah there it is i hope that's the same for you so we can start copying these new costumes from tiles 2 into the original tile sprite one at a time counting as we go yep all the way to costumes 48 and 49. next we'll check out the costumes of our original enemy sprite okay the last one is another mushroom yeah it's costume number 21. click into the enemy 2 sprite and yes costume 21 is also a mushroom so let's begin copying costumes 22 and up into the original enemy sprite 22 23 24 and costume 25 and that's it i'm looking forward to making use of these costumes aren't you these are for the end of level progression later on in the video so stick around for that just checking that those costumes are all there in the enemy sprite great so we can safely delete the tiles 2 and enemy 2 sprites make sure you delete the right ones we don't want a disaster at this point do we our next job is to configure all the list data required by these sprites click into the editor sprite and make the tile key map list visible also the tile shape list and the tile groups list do you remember what each of these is for don't worry i'll go over these again quickly as we update each one start by clicking into the tiles sprite and enter the costume editor so our first list is the keymap list and this lets us assign a number key to a costume for use in the level editor then when we press that number key we can paint with that costume numbers 1 to four have been used for the normal blocks and key nine is for enemies we'll start at row 31 then that's the new bush costume assign that to key number two and the same for the cloud platform key2 next up we have the orange platforms all the way up to costume41 these can be set to key 3 just like our blue costumes were so yes enter a 3 for each row from 33 to 41 then we have four pipe costumes i'll enter these as keys one for rows 42 43 44 and 45. right now this star will be an enemy just like the new mushroom was so give it a key of nine and the same for the end box costume it should be treated as an enemy key nine the last two costumes are background tiles and key two will be fine for these i think the next list is the tile shapes list that is used to let our project know which tiles are solid which are platforms and which are not solid at all that is we can walk through them we start at row 32 this is the cloud platform it acts the same as the top of a drop through platform so we enter an equal symbol for that oh look the next three tiles are also the tops of platforms so rows 33 34 and 35 are also equals the rest of the platforms don't count as solid so we can skip through these but the pipe that will be fully solid for the time being so make rows until row 42 in the list and then enter a hash and the same for rows 43 44 and 45 2. that's four hashes and that's it for the solid list so on to the tile group list this was new in the last episode and it was used for the tile auto arranging scripts we use it to group tile costumes that should auto arrange that will apply to the new orange platforms and the pipes i'll just check what group numbers we've already used okay so one and two only so let's use three for the yellow platforms start at row 33 and enter the group numbers of 3 for all the rows up to row 41 like this the pipes are next these can be group 4. we'll set rows 42 43 44 and 45 to 4. now we could create a group for these black end tiles here but i don't want to bore you to death so i'm leaving them a b because next up we have to enter the costume recipes oh my i need to make the recipe list visible by going into the editor sprite again and we want the tile recipes list i'll make it nice and big and then go back to the tiles costume editor to see the costumes we are configuring we're starting with costume 33 again now if you need to remember how these codes work then please go back and watch part 12 again because we went into a lot of detail there on how to set these up i did it all again and i'm just going to give you the numbers are you ready the orange platforms starting at costume 33 row 33 just enter zero one one zero space zero one zero zero row thirty four enter zero one one one space zero zero one zero space zero zero zero zero space zero one zero one now row thirty five we have zero zero one one zero zero zero one row thirty six enter one one one zero row thirty seven enter one one one one row 38 enter one zero one one and finally row thirty nine enter one one zero zero i'll just scroll down a bit okay row 40 enter one one zero one and space and a one zero zero zero and row forty one enter one zero zero one now the pipes starting at costume 42 row 42 enter 0 1 1 0 space 0 1 0 0 row 43 we enter 0 0 1 1 space 0 0 zero one row forty four enter one one one zero space one one zero zero and lastly row forty five we enter one zero one one space one zero zero one for you if you find things are not connecting up after this just rewind the video and check these numbers again okay now i can hide these lists from the editor sprite and we'll give the project a run oh no music i've muted my audio i hope you don't mind now enter the level editor with the zero key press the number one key until you find the new green pipe let's place down these tiles they certainly look great when you make a perfect two-tile wide column love how the floor also self-arranges around them that's beautiful but i want to also show you a limitation we have not accounted for in our tile layouts placing a second pipe next to an existing one throws our layout engine into chaos it doesn't know what to do as soon as we split them apart from each other they perfectly reassemble so what's going on here well our tile arranger only works with solid blocks of tiles the pipes flush up against each other are therefore treated as a single mass of pipe not two single pipes and so the tile arranger doesn't know how to draw that let's start afresh press the three key and look at the blue and orange platforms now i'm loving how the platforms reassemble as we paint them over each other it's really neat but again there is an issue here if you saw how we use these platforms we actually want the orange platform to appear to be in front of the blue platform with the blue platform looking to stay behind not be rearranged to sit together like this so we have two similar problems here both requiring us to paint new tiles but in a way that does not end with us fighting the arrangement of existing tiles i have to say this problem was a real doozy i spent a long time racking my brains as how i could do this but keep it simple enough to convey in a tutorial and finally i struck upon this idea how about we have a special mode that when we paint the tile arranging behaves as if we are painting on a new blank level the new tiles would then only arrange to fit the pattern of the new shape and the level behind would not be affected the final result would be a fast way of layering new level elements over existing ones in a very localized way to pull this off all we need is to keep track of which tiles we have painted since the mouse was clicked and then ensure the costume fixer ignores tiles we have not specifically painted on this time that seems simple enough so let's give it a go make sure we are in the editor sprite and we'll create a new list to keep track of which new tiles have been painted i'll name it edited indexes making it for this sprite only we want this list to be emptied whenever we finish painting new tiles so locate the when i receive move player and here is where we check for the mouse not being pressed in this case we can delete all the edited indexes now find the define paint tile script scroll down a bit to where we check auto being greater than zero this is where we are painting and then about to auto arrange the costume and its neighbors we should make a record of the painted tile indexes at this point but it would be wasteful to allow us to add the same tile indexes to the list more than once so check if the tile index is already in the list using a not edited index contains tile index and only then add tile index to the edited index list without this the list would become huge stuff full of duplicate tile indexes okay excellent look at these usages of fix costume at below we are now keeping track of the painted tiles but we need to limit the fixing up of costumes to be only those tiles in the new list i don't want to do this four times once for each of the fixed costumes so instead let's put the check in the custom block itself navigate to the define fix costume at script and we'll add an if right at the top now here's something new i didn't mention how we were going to turn this local editing feature on and off i'm going to use the space key in my project but you may want to use a different key or add a mode toggle but i like the simplicity of holding down the space key so if key space pressed now when the space key is held down we can prevent the fixing up of costumes that are not already in our list if not edited indexes contains tile index then stop this script oh man hold on hold on this is wrong see i used the tile index variable here this should not have been that it should have been the input variable named idx that is the tile index we are fixing up tile index variable is the tile we are painting wow that would have really messed things up we can test what we have done so far the best way is to use the blue platforms i'll draw one large rectangle like normal but then i'll hold down the space key and draw another one by its side so what have we got here you can see that the first rectangle has not been affected by the newly drawn tiles that's a plus but on the downside this new rectangle is acting as if it was still connected to the old rectangle that is not what we want and it's like that because we have yet to tell the recipe builder to exclude tiles not in our new list of painted indexes find the define build recipe script edge index is the tile we are checking out at this time so again only if key space is pressed and if not edited indexes contains the edge index then we are considering a tile that we have not yet painted within so we want to treat it as a blank tile to do this set recipe to the join of recipe and the number zero there and finally stop this script right are you feeling good about this i am let's give it a test i'll draw a blue platform area as before and then holding down my space key i'll make a new rectangle in front of the first and yes look at that it works beautifully what a triumph it's very pleasing to be able to paint these new blocks in front of the old ones and this should work for pipes too and yes it does look at how i can now draw each pipe as an individual local paint session by holding down the space key that way they don't consider each other when laying themselves out and we are free to draw them anywhere we please yep even over the blue tiles too i think this is a really excellent solution to a complex issue now can i show you another editor feature we should improve i have the auto arranging turned on and i select the blue tile costume using the three key and draw with that now i want to draw an orange platform tile i have to click through all the blue platforms using the three key until i stumble across the orange tile well that's a bit wasteful isn't it in auto mode i only want to choose either a blue or an orange tile type i no longer need to click through all these different costumes just one of each group that would save us a lot of fiddling time finding the right costume so find the define next brush custom block this is triggering when i press a number key and at present it repeatedly moves on to the next costume stopping when the key mapping of the costume matches the key that was pressed so i'm now thinking we skip over all but the first costume from any tile group that is we'd allow the selection of the first blue platform tile but none of the others matter so they are all skipped to do that we need the tile group for the brush costume we'll first set tile group to item chosen brush of tile group first let's consider when we don't want to skip costumes when auto mode is disabled that is auto is less than one then we need to allow selection of every tile and then also when the costume is not part of any tile group that is when tile group equals the empty value in both these cases we can stop this script right away just as we used to do right if we got past that then the brush is part of a tile group we only want to stop if it is the first one of that group in the list so how do we find the first matching value in a list if item hash of tile group in tile groups that gives us the row number of the first item in the list matching the tile group variable so if we compare that with the current costume then this will only be true if the current costume is the first tile from that tile group i think that's quite clever so if it is the first costume of the tile group we can again stop this script otherwise we'll skip it and let the repeat loop look at the next costume in the list instead i think we dare test that now and entering the level editor and pressing 3 selects the blue tile and then again now goes straight on to the next tile type and then toggles back and forward without any of those in between tile costumes super that's just what i was aiming for see how quickly i can switch now as i paint the level the same applies to pipes and wooden blocks yay so there's one more editor tweak we should add before we are free to move on to other topics and that is to fix the eyedropper tool that's the e key where it lets us pick a brush from any tile on the screen and we use it right away and well there lies the problem you can't select any tile it doesn't work on the enemies well that's an easy fix luckily locate the when e key press block in the editor sprite do you remember how we store the enemies in lists object idx is a list of tile indexes and object type is a list of enemy types at those indexes so let's first look at the indexes we'll need a new variable we'll name it obj object hash for this sprite only now set object hash to item hash of tile index in object index object idx this will let us know if there are any enemies located at the tile index under the mouse cursor use an if else and we'll set the chosen brush in both cases check first where the object hash is greater than zero if it is then there was an enemy so we can look up which enemy type that was set the chosen brush to item object hash of object type good that should give us back the type of the enemy at the given tile location run the project now pressing e over a normal tile still sets my brushes before but here goes if i mouse over a gumba and press e here i can now pick up the gumba brush so much easier i love that and the same with this mushroom excellent and the great thing about this is that now it allows me to select and then click to remove an enemy much faster press an e and then click the level editor is becoming so cool don't you think but now time for something completely different have you seen how the level end screens look in super mario bros 3 advanced unlike traditional super mario we don't have the usual flag at the right hand side of the level instead we get an interesting dark area like we've run out of level and then in the middle is a box that contains a power up of some sort that is cycling away in the background i assume this is collected as an end of level perk before the level concludes and we are able to move on to the next level so how much of this can we cram into the last part of this video let's start with the end box sprite click into the enemy sprite and you should find that the n-boxes costumes are here where we put them earlier the first empty costume is named end box just as one word with a capital e and a capital b and there are three more costumes following that showing the different perks available we need to initially tell the enemy sprite how to clone this type of enemy find the define spawn type custom block and we'll duplicate the last if to define a new type of enemy we don't want this set frame to -1 so delete that to find the tile type we want to check the costume number of the tile sprite if we look up the end box in the tile sprite we find its costume number is 47. so back in the enemy sprite check if tile type equals 47 then in the set type custom block set the type to end box capital e capital b without a space the costume is the same end box and leave the width and height as 16. okay we are good to run the project and we can rush over to the right hand side of the entire level now we have some work to do press the 2 key until you find the dark square and now we need to paint a large area i'm standing so that the right hand wall is just off screen and now begin to fill in the entire background black this is actually quite therapeutic and then scrolling to the left a little i press two again until i find the black edge costume this i paint up the edge like so now if you want to challenge you could update the tile groups and recipes to make this auto arrange too because of this platform to the left i'm going to raise the height of the dark area just a little bit more there right and now we can place the end box press nine until it comes up and i think it wants placing around the middle point about there great the reason i made this an enemy in the first place was because the sprite is larger than a single tile so it otherwise would have to be made up of nine smaller costumes i didn't really fancy that so i did it this way there's no particular right or wrong in these things and you just have to weigh up the plus and minuses and then just go for it so exiting the level editor i can now check this out and it's looking pretty sweet all we need to make it look authentic is to add the animating perk in this box for that find the when i receive move enemy script and scroll right down to the bottom here is where we process each enemy type so again duplicate this last one and we'll check for a type of end box chuck away the tick life block and we'll handle this ourselves to animate the costume we'll use the frame variable change frame by 0.15 the larger this value the faster the perk will change next set costume to now i'll just check the costume number of the first nbox perk it's 23 okay so set the costume variable to 23 plus and then use a mod of three to cycle between the three costumes lastly on the left of the mod place a floor of frame remember that floor rounds the number down to the nearest whole number finally place the stop this script at the end of the if and we are ready to test oh yeah that's looking very authentic indeed i just need a way to be able to collect it to trigger the end of level now you'll note i can't walk off the right of the level because there's a wall there that we will have to work around but first things first we can make a simple collection script right here after setting the costume if touching mario then but i'm going to add another test to make things a little better checking if the distance to mario is less than 28 this is to ensure it doesn't trigger from too far away i want mario to overlap the tile a little bit since it otherwise includes the n-box border in the collision and then very similar to how we triggered the mario death we can broadcast a new message mario level complete this frees us up to script the end of the level any way we please however we probably want to make the end perk appear collected so let's replace the last costume with the empty end box now to do that we can set type to pretty much any unused value i'll pick the word costume to represent a single unchanging costume and then set the costume to end box capital e capital b without space there we can give that another quick test just hold on a second right so if i now jump into the end box oh nice we can collect the perk or at least it appears so at this point one day we'll have to do something with it won't we but this is not that day so now we have the end box triggering the level complete event i think we should put something together quickly to get mario to register this event click into the mario sprite and we can find existing when i receive mario lose life we want to do something quite similar here only the animation will be different and instead of the level of his setting we will reset to the next level instead therefore duplicate the when i receive mario lose life and we can drag it into some free space right what can we remove from this script first off we don't want to play this lose live sound or set the player action to lose life we can take this a block of script at a time so i'll move everything under the first repeat over to the right what we're leaving in is the stop other scripts in sprite that is what causes the other main game loop to end and this one to take over in its place so i watched more videos of how mario reacts to the end of level perk collisions i note he tends to stop dead in his tracks so we can do the same by setting speed x to zero now instead of repeating a fixed number of times bring in a repeat and till block mario will be in the middle of a jump so let's repeat until he's back on the ground how can we tell that well falling will be less than one this number is always increasing until we land on the ground now to decide what needs to go within this loop we are completely taking control of the main game loop so to enable mario to still finish his jump and fall to the ground we can first use the handle keys jump block and then the move sprite x and move sprite y blocks and lastly bring back the paint sprite and broadcast position tiles blocks the old repeat loop can be deleted this should now bring mario down to the ground but it should be completely uncontrollable by the player we can give this a quick test i'm just zooming over to the end of the level oh wow wait i almost messed up again look we left the when i receive event as mario lou's life so sorry change that to be when i receive mario level complete of course right i can now safely jump into the nbox and pow i fall to the ground i can confirm i have completely lost control of mario now that's perfect as we now just want him to run off screen to the right to conclude the level we'll begin that process by ensuring that we are facing right point in direction 90. now we'll repeat until their x position is greater than 250. that is he's off the right-hand edge of the screen oh now hold on isn't there a wall in the way of mario to his right yes there is but don't worry this ending animation is no longer going to obey any laws of the level we just change x by 5 to move them right change player frame by 0.6 to give them an animation and lastly add the paint sprite and broadcast position tiles to ensure everything is drawn correctly so with mario off-screen we are all but done if we had an in-between level fade or splash screen then we could trigger that now but as we don't how about we simply trigger the next level to load this should be super easy for us we already have the level reload when we died and the scripts are just here to the right i'll also keep the repeat 30 loop to pause a second before loading we can delete the rest of these old duplicated scripts now so to make the next level load instead of the same one we simply change level by one and drop it in just before the broadcast to level load like so simple before we test this though a quick shout out to channel member james who spotted a soundbug during early access that will teach me from using my audio while recording click into the sound sprite and we'll add a stop other scripts in sprite to the top of the define music script without this we get the awful crackly music in level 2. if you're interested why well it's because both of these two broadcast receivers end up running the same foreverloop script at the same time continually interrupting one another and only getting to play the tiniest part of the sound before the other interrupts and does the same thing continually forever yuck and this is it folks the final test for today let me get over to the level end and gosh will it work i'll jump at the end box now you can see mario correctly turned around and is walking off screen there's a pause and celebration this is indeed level two such that it is can you believe we finally got here now there's plenty of room for improvements but i really wanted to at least get things working and we certainly have that for those who would have liked to have seen a classic mario flag ending well that would be no problem here either you would just need to swap the end box for an end flagpole then fix up the end animation where mario drops down to be in time with your falling flag i think that would be quite possible when within your reach in reality it's not so different really what i am excited about is that we have reached a point where i don't have any obvious loose ends and that frees us up to look at more interesting topics next time gosh do we have a whole load of requests there i will shortly put up a new poll just to see what you guys would like to prioritize some possibilities include the original small mario power ups crouching new enemies sloping tiles checkpoints title screens and menus oh man so much to think about but that brings us to the end of another episode please smash the like button if you've enjoyed this video and i just want to say a massive thank you to all of you who have subscribed to this channel because wow i'm blown away with that we have reached the 50 000 subscriber milestone yay that's really amazing thank you if you still haven't subscribed and you're able then please do consider it as doing so helps promote my channel further and don't forget you guys also have the option to become channel members now if you're finding there's not enough griff patch to go around and you still need to ask me things you may find becoming a member helpful as members interactions take priority also depending on the membership level there's also extra perks like early access to videos and even to the projects themselves should you wish but enough of that this is the end subscribe now before you forget and i look forward to seeing you next time thanks for watching and scratch on guys