Created
March 25, 2015 14:38
-
-
Save dominiccooney/c990a32985c25c6f4ba8 to your computer and use it in GitHub Desktop.
Translate a Commodore PET BASIC graphics demo to JavaScript and HTML Canvas
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<style> | |
canvas { | |
width: 640px; | |
height: 480px; | |
background: black; | |
} | |
</style> | |
<title>80 COLUMN GRAPHICS</title> | |
<canvas></canvas> | |
<script> | |
var c = document.querySelector('canvas').getContext('2d'); | |
// The ad says the graphics unit has a 320x200 display; so do we. | |
c.canvas.width = 320; | |
c.canvas.height = 200; | |
var p = 160; | |
var q = 100; | |
var xp = 144; | |
var xr = 1.5 * Math.PI; | |
var yp = 56; | |
var yr = 1; | |
var zp = 64; | |
var xf = xr / xp; | |
var yf = yp / yr; | |
var zf = xr / zp; | |
for (var zi = -q; zi < q; zi++) { | |
if (zi < -zp || zi > zp) { | |
continue; | |
} | |
var zt = zi * xp / zp; | |
var zz = zi; | |
var xl = Math.round(Math.sqrt(xp * xp - zt * zt)); | |
for (var xi = -xl; xi <= xl; xi++) { | |
var xt = Math.sqrt(xi * xi + zt * zt) * xf; | |
var xx = xi; | |
var yy = (Math.sin(xt) + 0.4 * Math.sin(3 * xt)) * yf; | |
var x1 = xx + zz + p; | |
var y1 = yy - zz + q; | |
c.beginPath(); | |
c.strokeStyle = 'green'; | |
c.moveTo(x1, c.canvas.height - y1); | |
c.lineTo(x1, c.canvas.height - (y1 - 1)); | |
c.stroke(); | |
c.beginPath(); | |
c.strokeStyle = 'black'; | |
c.moveTo(x1, c.canvas.height - (y1-1)); | |
c.lineTo(x1, c.canvas.height); | |
c.stroke(); | |
} | |
} | |
</script> | |
<p> | |
Translated from this Commodore PET BASIC code in an ad for a | |
“MTU K-1008-43” | |
in <a href="https://archive.org/stream/creativecomputing-1981-06/Creative_Computing_v07_n06_1981_June?ui=embed#page/n49/mode/2up"><i>Creative | |
Computing,</i> June 1981, p. 47:</a> | |
<pre> | |
10 VISMEM: CLEAR | |
20 P=160: Q=100 | |
30 XP=144: XR=1.5*3.1415927 | |
40 YP=56: YR=1: ZP=64 | |
50 XF=XR/XP: YF=YP/YR: ZF=XR/ZP | |
60 FOR ZI=-Q TO Q-1 | |
70 IF ZI<-ZP OR ZI>ZP GOTO 150 | |
80 ZT=ZI*XP/ZP: ZZ=ZI | |
90 XL=INT(.5+SQR(XP*XP-ZT*ZT)) | |
100 FOR XI=-XL TO XL | |
110 XT=SQR(XI*XI+ZT*ZT)*XF: XX=XI | |
120 YY=(SIN(XT)+.4*SIN(3*XT))*YF | |
130 GOSUB 170 | |
140 NEXT XI | |
150 NEXT ZI | |
160 STOP | |
170 X1=XX+ZZ+P | |
180 Y1=YY-ZZ+Q | |
190 GMODE 1: MOVE X1,Y1: WRPIX | |
200 IF Y1=0 GOTO 220 | |
210 GMODE 2: LINE X1,Y1-1,X1,0 | |
220 RETURN | |
</pre> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment