game01.html

---
layout: base.html
title: Amstrad CPC 6128 - Bustout
---
<section class="side-by-side">
	<canvas class="game right" id="canvas" oncontextmenu="event.preventDefault()"></canvas>
	<div>
	<article>
		
		<h1>Bustout</h1>

<p>
	This is a game that is listed in the original Amstrad CPC 6128 user manual. Usually you'd
	have to type this in yourself, and then fix your typos. Lucky for you we've loaded it already
	and run it.
</p>
<pre>
RUN"bustout
</pre>
<p>
	Try playing for a minute or two. When you're ready to get into the code, press the Escape key twice to
	break out of the program.
</p>
<p>
	This game introduces colour, sound and some basic graphics, but you'll actually be able to read and understand
	quite a bit of it based upon what you already know. It's useful to be able to dive into code, reading just enough
	to gain some understanding, and then to be able to make changes.
</p>

<h2>Missions</h2>
<ol>
	<li>Change the game so you have 10 lives.</li>
	<li>Change the colour of the lines of bricks. Hint: you'll need to edit line 40.
		<p>This computer has 16 different "inks" it can set, and 27 different colours it can set them to.
		The <code class="command">INK</code> command takes two numbers; the first is the the ink number to set, and the second is the colour to set it to.
	The <code class="command">PEN</code> command chooses which "ink" colour to use.</p>
		<p>Check out the <a href="#colour-chart">colour chart</a> below for more detail and an example.</p>
	</li>
	<li>Add an extra line of yellow bricks. Hint: look at lines 140 and 150 and try typing the commands on those lines one at a time to see what they do.
		<p>The <code class="command">LOCATE</code> command moves the cursor to the X, Y coordinate given. <code>LOCATE 2,3</code> moves the cursor to the 2nd column
		on the 3rd row of the screen. When you next <code class="command">PRINT</code> this is where your text will appear.</p>
	</li>
	<li>Add two extra lines of the white bricks. Hint: look at line 160 and remember your loops!</li>
	<li>Change the shape of the bricks to something else. Check out the <a href="#graphics-character-set">graphics character set</a>
	below, and learn more about the <code>STRING$</code> function.</li>
	<li>Make your paddle wider. It's currently 4 characters wide, let's make it 8 characters wide. This mission will be split across multiple parts as we improve this change!</li>
	<li>Note that you can move your wider paddle too far to the right of the screen! Prevent your paddle from moving too far to the right.
		<p>You will need to know the <code class="command">INKEY(k)</code> function. It takes a key code as an argument and returns 0 if that
		key is currently pressed. Take a look at the <a href="#keyboard-codes">keyboard key codes</a> chart.</p>
		<p>You will also need to understand what the <code>bx</code> variable is used for. You've already seen where the paddle is drawn (as you changed it in the previous
		mission), so take a look at how <code>bx</code> is used there.</p>
	</li>
	<li>Finally note that even though your paddle is wider, and no longer goes off the right edge of the screen, you still can't catch
		the ball on the right hand side of your paddle! The ball thinks your paddle is still 4 characters wide.
	</li>
</ol>

<h2>Tips</h2>
<p>
	You are going to need to experiment with this code in order to achieve these missions. You’re going to need to try typing in parts
	of the code to see what it does. You’re going to need to try modifying the code to change things or remove things to see how the
	behaviour of the program changes.
</p>
<p>
	You’re going to need to read this program and try to understand what it does. What does each variable do?
</p>
<h3>REM</h3>
<p>
	If you add a <code>REM</code> command into a line of code, the rest of that line becomes a <em>remark</em> or a <em>comment</em>.
	The computer ignores it. That's a handy way to remove a line of code without having to delete it (and then re-type it).
</p>
<p>
	The apostrophe or <code>'</code> is the same as <code>REM</code>. You can see the <code>'</code> multiple times in the program
	listing below, such as on line 10. On line 110 the developer has used it just to make visible space in the program.
</p>
<p>
	Remember: everything after the <code>REM</code> or <code>'</code> is ignored.
</p>
<p>
	Let’s try quickly to use this trick. What does line 200 of this program do? Have a quick look at it below.
	Now try <code class="command">EDIT 200</code> and add a <code>'</code> at the beginning of the line. Now
	run the program. Do you see the difference in behaviour? Edit the line again and remove the <code>'</code>.
</p>

<h2>Program listing</h2>
<p>
	The game's program is listed below. You can also <code class="command">LIST</code> it in the emulator, if you've already run it,
	or after you've loaded it using <code>LOAD"BUSTOUT</code>.
</p>
<pre>
10 'BUSTOUT by ALEXANDER MARTIN
20 'copyright (c) AMSOFT 1984
30 '
40 MODE 1:BORDER 1:INK 0,1:INK 1,26:INK 2,24:INK 3,6
50 SPEED KEY 15,2
60 ENV 1,1,18,0,11,0,10
70 ENT 1,10,2,2
80 ENV 3,1,0,16,5,-3,2
90 ENV 2,5,3,3,1,-21,22,9,-3,2
100 ENT -2,10,2,2,5,-7,1,2,11,3,2,-4,8
110 '
120 '
130 MOVE 30,32:DRAWR 0,400,1:MOVE 610,32:DRAWR 0,400,1
140 PEN 3:LOCATE 3,1:PRINT STRING$(36,143)
150 PEN 2:LOCATE 3,2:PRINT STRING$(36,143)
160 PEN 1:FOR r=5 TO 6:LOCATE 3,r:PRINT STRING$(36,143):NEXT r
170 bx=9
180 lives=5:score=0
190 PEN 1:GOSUB 680:CLEAR INPUT
200 IF INKEY$&lt;>CHR$(32) AND JOY(0)&lt;16 THEN 200
210 LOCATE 11,23:PRINT SPACE$(20):LOCATE 1,24:PRINT SPACE$(40);
220 GOSUB 690:GOSUB 660:GOTO 280
230 '
240 '
250 LOCATE bx,24:PRINT"  ";STRING$(4,131);"  ":RETURN
260 '
270 '
280 xa=1:ya=1:IF INT(RND*2)=1 THEN xa=-xa
290 PEN 1:GOSUB 250
300 ORIGIN 0,400
310 x=bx+4:y=11:x1=x:y1=y
320 '
330 '
340 x1=x+xa:y1=y+ya
350 IF x1=3 OR x1=38 THEN xa =-xa
360 GOSUB 540
370 IF y1=24 AND x1>bx+1 AND x1&lt;bx+6 THEN ya=-ya:y1=y1-2:SOUND 130,44,8,7,1,1:a=((x>bx+5)OR(x&lt;bx+2)):IF a=-1 THEN xa=xa*a:x1=x1+xa:y1=y1+1
380 IF y1=25 THEN LOCATE x,y:PRINT" ":GOTO 500
390 GOSUB 250
400 t=TEST((16*x1)-1,-(16*y1)-1)
410 IF t&lt;>0 THEN ya=-ya:xz=x1:yz=y1:y1=y1+ya:GOSUB 590:IF t=2 THEN score=score+10:GOSUB 660
420 IF t=3 THEN score=score+20:GOSUB 660
430 IF t=1 THEN score=score+5:GOSUB 660
440 IF y1=1 THEN ya=1
450 LOCATE X,Y:PRINT " ": LOCATE x1,y1:PRINT CHR$(233):x=x1:y=y1
468 IF y=1 OR x=3 OR x=38 THEN SOUND 129,78,8,7,1,1
470 GOTO 340
480 '
490 '
500 lives=lives-1:SOUND 132,19,46,12,2,2:IF lives=0 THEN GOTO 620
510 GOSUB 660:GOTO 280
520 '
530 '
540 IF (INKEY(8)=0 OR INKEY(74)=0) AND bx>2 THEN bx=bx-2:RETURN
550 IF (INKEY(1)=0 OR INKEY(75)=0) AND bx&lt;32 THEN bx=bx+2:RETURN
560 RETURN
570 '
580 '
590 LOCATE xz,yz:PRINT " ": RETURN
600 '
610 '
620 IF score>=hiscore THEN hiscore=score
630 GOSUB 660:score=0:lives=5:GOTO 130
640 '
650 '
660 SOUND 130,0,20,13,3,0,31:LOCATE 1,25:PRINT TAB(4)"HISCORE";hiscore;
670 LOCATE 18,25:PRINT"SCORE";score:LOCATE 30,25:PRINT"LIVES";lives:RETURN
680 LOCATE 11,23:PRINT"PRESS SPACE TO START":RETURN
690 LOCATE 1,25:PRINT SPACE$(40);:RETURN	
</pre>

</article>

{% include "colour-chart" %}

<article id="graphics-character-set">
	<h2>BASIC graphics character set</h2>
	<p>This computer can display 255 different characters. Some of them are letters, numbers and punctuation. Some of them are
		"control characters", which we'll ignore for the moment, and some of them are useful shapes that you can use in games.
		Bustout uses several of the standard graphics characters to draw the game.
	</p>
	<p>The <code class="command">STRING$(n, c)</code> function returns a string containing <code>n</code> copies of the character with
	the code <code>c</code>. Usually you use it with <code class="command">PRINT</code> in order to print the string on the screen.</p>
	<p>Take a look at the guide below, which is a screenshot from the computer manual showing the characters that Bustout uses. Note that
		each character is listed first with its base 10 character code (which we will use), and then with its base 16 (hexadecimal) and finally
		its binary character code.
	</p>
	<p>
		Try changing the number of characters (<code>n</code>) or the character code (<code>c</code>), re-run the program and see what happens.
	</p>
	<p>You can test printing any character number using either of the commands below:</p>
<pre>
PRINT CHR$(144)
PRINT STRING$(5, 144)
</pre>
	<center><img src="{{ base_uri }}/img/cpc/bustout-chars.png"></center>
</article>

{% include "keyboard-codes" %}
	</div>
</section>

<script>
window.onCpcLoad = function() {
	Module._webapi_load_file("../example/dsk/bustout.dsk")
}
</script>