tangent128/2024.js
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

sketchout a canvas applet

Browse source
This commit is contained in:
Tangent Wantwight 2024-01-12 20:21:58 -05:00
parent a7300c16b7
commit d106823e19
2 changed files with 36 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
island.html Normal file
View file

@ -0,0 +1,11 @@
<html>
<head>
<title>ProcGen Island</title>
</head>
<body>
<script src="js/island.js"></script>
<script>
document.body.append(...IslandApplet());
</script>
</body>
</html>

25
island.ts Normal file
View file

@ -0,0 +1,25 @@
const BLOWUP = 4;
const WIDTH = 240;
const HEIGHT = 135;
export function IslandApplet() {
const canvas = Object.assign(document.createElement("canvas"), {
width: WIDTH * BLOWUP,
height: HEIGHT * BLOWUP,
} satisfies Partial<HTMLCanvasElement>);
const cx = canvas.getContext("2d");
if (!cx) {
throw new Error("2D rendering context not supported");
}
cx.scale(BLOWUP, BLOWUP);
cx.fillStyle = "red";
cx.fillRect(0, 0, WIDTH, HEIGHT);
cx.fillStyle = "blue";
cx.fillRect(1, 1, WIDTH - 2, HEIGHT - 2);
return [canvas];
}
(globalThis as any).IslandApplet = IslandApplet;