Hi, welcome to this new video
on our series of week 5. We are working through the wave
function collapse project, and we have completed the first
loop of the algorithm. We are at a point where we need to fix
a few things and perhaps slow down and start visualizing a little bit
more clearly what's going on. We're going to be doing this video,
which is going to maybe not advance the algorithm itself, but we're going to
just add some visualization tools. We're going to visualize
the possibilities of a cell. So let's see the state we're in. We have a grid that has all
the possible states of each cell. So I would like to know, especially when we're evaluating a cell
that is going to be evaluated next with the kind of lowest entropy visualization
that we just did in the past video. What are the possible states in
which that cell could be, right? So as you can see here in this diagram, we
have a little rectangle on the top right, that shows us graphically
out of the tile set. The only two possible combinations that
match that particular cell would be the ones drawn below it. So that visualization is precisely what
we're going to be writing within our program. Just because we want to have the degree
of control, to be able to see graphically how the data is being handled, and
potentially use it as a form of debugging, as a way of understanding more deeply
how the algorithm is functioning. And it's in fact some errors or
something that we haven't accounted for that we don't understand, we can use this
tool to further improve our understanding. So let's jump into the code and
see how to write this. So again, we're continuing
with where we left of Nasweek. The first thing that I would like to
address is that you might have noticed when we ran this algorithm and remember that we're running
it through our keyboard now. Every time we press the key,
we execute a loop in the algorithm. But sometimes it crashes, because we know that we don't
have all the cells available. So for instance, in this case, I only
press the key once, but I have, in fact, two cells that have been collapsed. So what happened here, right? The first thing that we need to
understand is that this visualization of the cell changes every time that there's
only one possible option, right? So because we have a very
small number of tiles, it's possible that there's only one
tile that would match this tile here. So when we reduce the possibility space
of the adjacent cell is not that we have collapsed this cell, but this cell ended
up having only one possible option. Therefore, the current visualization
that we're using is not going to put a one here. It's going to change
that visualization for this graphic representation of the cell. So that cell is no longer
going to be evaluated. So in one loop we ultimately
collapsed two cells, right? Two cells ended up in states
of only one possible option that is represented graphically. So it's not an error per se, but it's a behavior that we would
like to understand better. It's something that might need
that we actually understand that. What are the possible options
that this cell has, right? So let's start drawing this function
that we just discussed of visualizing the possibilities of a cell to kind
of understand issues like this one. So we're going to be continuing
to work on the environment tab. So what I would like to do is,
let's just go to the run function, and write a little bit of the pseudo
code of what we're going to do here. So here, we're going to write
something that visualize, or display. Let's say, display,
we have been using display. The possibilities, right? That's what we have to write. We are displaying the lowest
entropy highlighter up here. So along those lines, we're going to
be displaying the possibility. So let's write that function. We're going to go all
the way to the bottom where we're actually writing
our display functions. So let's define this function as display_possibilities, and use self, possibilities, offset_x, and offset_y. So what are these variables that
we are giving as arguments? So the possibilities is
going to refer all the possible tiles that are available to that cell. Basically, its entropy,
and then, the offset. We want to make sure that this
visualization is not on top of the cell itself. It's actually displaced a little
bit to the left and the right, maybe kind of diagonally adjacent to. So we can actually manipulate
those numbers a little bit. We want to have some control over that. So yeah,
let's evaluate how we can do this. So let's start by defining tile size. We did this before. I think here it's the same
calculation that we want. And the offset_x, it's going to be that number times the tile_size + 60. So here's where we're going to
be doing the offset value. I mean, here, we're going to be passing the information
of the cell position, right? Let's do that for y. That's going to be y
times the tile_size- 60. So I'm using diagonally
moving up 60 pixels, and right, 60 pixels. Let's just do a stroke
that is white a fill. When I use a gray color here, you can actually change the graphic
representation a little bit yourself. Obviously you can visualize
it however you want. But I want to create a background
that is not black so that doesn't get confused with
the actual background of the cells. But it has some contrast of this black and
white. So I'm going for a gray color here, and the x_size. So the size of this rectangle will change,
right? It depends on how many
possibilities we have. So let's just evaluate the length of possibilities times the tile size. So let's imagine that you
have two possibilities. So you want to say, well, let's just multiply the number
two times the tile size, right? Which is the size of a cell, and
give it a little bit of an offset, so that each possibility has a little bit
of a gap with each other possibility. So we're going to give tile_size + 10,
so that there's a bit of an offset from each one of the cells, and
then an extra 10 on the edge, right? So we're going to be giving
probably 10 pixels on each side. So that would be the size of our rectangle that is going to be positioned at the coordinate 0, 0, 0, x_size. That's for the width of the rectangle. And let's do the height 60. But this 0 and 0,
it's not the actual coordinate. We could do it with push and
pop matrix, but this time we're going to
just add the offset_x. I'm going to keep that 0 there, because
we could put offset_x and offset_y. But here, I'm just going to make
sure that we think of this offset as an addition to that coordinate. Okay, so we have that. Now, let's just visualize that. Let's see if this is actually, well, what we should have at
this point is a rectangle. It's a gray rectangle that changes sizes
depending on the number of possibilities that we have. And what we would like to do
right now is actually draw each one of the possibilities. So what I would like to do for this is create a variable
called x_position, right? Which is going to be 10 + the offset_x. And we're creating this variable because
we're going to be looping through all the possibilities. Each time that we draw one instance
of the possible kind of cell, we are going to add the offset for
the next. So that's a way of dynamically be changing
the x_pos of each one of those cells. So it's going to be 10 + the offset. And let's do a for loop here. So for p in possibilities, is that the way we spell possibilities? I think that's correct. Possibilities. So we're looping through
the possibilities, right. And remember that this is, the
possibilities are already tiles, right. So we have a function to display them. So p.display, and we could use x_pos for
the x coordinate. The y could be a 10 + the y_offset. And then we can say the tile size. If you remember this function, this
function, we're using the display function here that requires x and y, the cell
size and an entropy number, right. So we could say x is going to be
this dynamic position that keeps changing to the right. Y is fixed, 10 pixels up from the offset. The tile_size,
it's going to be the size of that display. And then, given number 1 for entropy,
which it's not going to be used in this case, because we're
displaying the actual cell. But let's go with this for now. And then, at this point,
we've drawn that option, so that cell. Let's update the new x_pos. So e_pos += tile_size. So that's, sorry,
equals tile_size + 10, right? So what we're doing here is
dynamically we draw one cell, ten units offset to
the right on this rectangle. And then we kind of update this x_pos,
10 units, sorry, the size of that cell
to the right + 10 for creating a little gap between each one
of the cells that we're drawing, right? So that's the function. Let's see how it looks when we call it. So let's execute this function
where we said up here, display possibilities, right? So let's just call this
self.display possibilities. At this point, I would like to make sure that we have
to provide the possibilities, right? Remember that the argument, if you go
down here in the function, display possibilities requires the possibilities
and the offset x and y, right? So we're going to do this function. So we need to calculate the possibilities. The possibilities are the self.cells. And the cells that we're
evaluating is the next_cell_x, and the next_cell_y, right? So we're going to be using the next cell. We're not going to be using
a visualization of all the possible cells. We're going to only be visualizing
the next cell that we're going to be collapsing, right? Let's see all the possible states. It could be any. So from the cell, we're going to pick
the index of the next cell, right? And that's going to become our main
argument for the possibilities. And again, the offset_x and offset_y,
which is going to be the coordinates it's going to base on the index of
the next cell x and next cell y. That's all good. These two lines might end up in an error. So we're going to do an if statement here saying that if for some reason, this next cell x is not none and
next cell. Yeah. Is not none,
I would like to make sure that these two lines are only executed if those
are not empty for some reason. I think that's something that could
do happen through the loop and that would kind of crash our algorithm. So let's see what we have so far. Okay, so we have something funky going
on here, but let's visualize what we, what we have here. So we created a gray rectangle. So that's good that it's offset from
the next cell, which is highlighted here. And it should have drawn two cells,
but it drew this one and something somewhere else. So we have a kind of a graphic, some coordinate issue we're
going to fix in a minute. But let's go and find that mistake. Let's see. Okay, I see the problem. So when we update
the position here p display, we have the first tile positioned
correctly based on this coordinate, right? But the second one shouldn't be equal. We should say plus equal, right? Because we want to make it in
reference to what we have. Let's add a little bit to that so
that we keep the. There we go. So you can see that the second tile
is drawn with a slight offset, but then within this kind
of gray rectangle, right? So there's two options. We should have two cells. Two options. We should have two cells and
so forth, right? Let's just do a quick test here. I'm going to add a few more tiles. Doesn't matter if we copy-paste, I think. Let's just do a few more. I'm going to remove them in a minute. But I just wanted to make
sure that this rectangle is visualizing more options, right? So right now, we have a tile
set that has more variations. This entropy is actually a number 4,
not a number 2. So the, the size of
the rectangle has changed size. And the drawing of all the possible tiles
that are, in fact, compatible with this. You see that all the tiles that we
have within this group have the lower connector, red, and
the upper connector here is red. So they're compatible. So all of those should be compatible. These are ways to making sure that our
compatibility, the way we're kind of reducing the possibility space of a cell,
is in fact correct,. That the calculations are moving
forward without any errors. And as we are moving along,
we can continue visualizing what the cell could become. We're going to be picking one
of those four options for the collapsing of the cell in the next
loop until we crash the system. So let's just leave it here. We're going to be addressing this idea of
expanding the number of tiles that we're going to be using. We're going to also be introducing
how we work with textures so that we're not constrained with
something that we can draw within the coordinate system of processing. But rather, we could actually use
textures as well to do some kind of more interesting graphic
representation of the system. So we're going to be looking
at that in the next video. I'll see you then.