HTML and CSS Reference
In-Depth Information
iif
(
camera
.
x
<=
0
) {
camera
.
x
=
0
;
colBuffer
=
0
;
}
else if
(
camera
.
x
>
(
world
.
width
-
camera
.
width
)
-
scrollRate
) {
camera
.
x
=
world
.
width
-
camera
.
width
;
colBuffer
=
0
;
}
else
else
{
colBuffer
=
1
;
}
Figure 9-16
shows an example of the right-side edge case.
Figure 9-17. The fine scrolling camera at position right-side edge
The data for the algorithm would look like this:
scrollRate
=
4
camera
.
x
=
320
camera
.
y
=
80
This returns buffer values as follows data:
colBuffer
=
0
rowBuffer
=
1
Because we are scrolled all the way to the right, the
camera.x
value is
320
. When we add the
camera.width
of
160
to this value
320
, we get
480
. This just so happens to be the width of
the world (
world.width
). Notice that we have to subtract the
scrollRate
to ensure that we
are always comparing a value that is less than where the player wants to go; if we didn't do
this, we could actually throw a null pointer error in the column array lookup.
The camera far down scrolled position
When the camera scrolls past the point at which an extra tile would need to be on the far bot-
tomofthegamescreenmap,weneedtosetitbacktothepositionitwasand
not
trytopaintan
extra row in
rowBuffer
, because the tile map world does not have any more tiles to display.
If we didn't do this, an error would be thrown in JavaScript, telling us we had hit a null in the
