Skip to content

Commit 716bb17

Browse files
author
Walle Cyril
committed
prepare wasm trials
1 parent fad699d commit 716bb17

8 files changed

Lines changed: 183 additions & 0 deletions

File tree

‎general/wasm/css/canvas.css‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
2+
canvas {
3+
border: 1px solid black;
4+
}

‎general/wasm/js/canvas.js‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
2+
3+
4+
export {reduceDraw, initializeCanvas};
5+
6+
const reduceDraw = function (canvas, drawFunctions) {
7+
const context2D = canvas.getContext("2d");
8+
return function (world) {
9+
context2D.clearRect(0, 0, canvas.width, canvas.height)
10+
drawFunctions.forEach(function (drawFunction) {
11+
drawFunction(context2D, world);
12+
});
13+
};
14+
};
15+
16+
const initializeCanvas = function (canvas) {
17+
const resizeCanvas = function () {
18+
// makes it take 100% width and height
19+
const width = innerWidth;
20+
const height = innerHeight;
21+
canvas.width = width;
22+
canvas.height = height;
23+
};
24+
resizeCanvas();
25+
26+
window.addEventListener("resize", resizeCanvas, false);
27+
};

‎general/wasm/js/main.js‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import {d} from "../node_modules/dom99/source/dom99.js";
2+
import {generateRandomWorld, drawWorld, updateWorld} from "./world.js";
3+
import {reduceDraw, initializeCanvas} from "./canvas.js";
4+
5+
6+
const drawEverything = reduceDraw(d.elements.canvas, [
7+
drawWorld
8+
]);
9+
10+
const world = generateRandomWorld();
11+
12+
const loop = function () {
13+
requestAnimationFrame(loop);
14+
drawEverything(world);
15+
updateWorld(world);
16+
};
17+
18+
d.start(
19+
{
20+
21+
}, // functions
22+
{
23+
24+
}, // initial feed
25+
document.body, // start Element
26+
function () {
27+
// function executes after dom99 went through
28+
// here you can use d.elements
29+
30+
d.elements.loadingHint.remove();
31+
initializeCanvas(d.elements.canvas);
32+
requestAnimationFrame(loop);
33+
});

‎general/wasm/js/world.js‎

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
export {generateRandomWorld, drawWorld, updateWorld};
2+
3+
import {
4+
randomPositiveInt,
5+
randomInt,
6+
randomFloat
7+
} from "../node_modules/utilsac/random.js";
8+
import {
9+
fillArrayWithFunctionResult
10+
} from "../node_modules/utilsac/utility.js";
11+
12+
13+
/*
14+
*/
15+
const drawWorld = function (context, world) {
16+
world.creatures.forEach(function (creature) {
17+
const {x, y, width, height} = creature;
18+
context.strokeRect(x, y, width, height)
19+
});
20+
};
21+
22+
/*
23+
A world is a rectangle
24+
Inside a world there are living creatures with
25+
speed, direction, etc
26+
*/
27+
const generateRandomWorld = function (width = 300, height = 300) {
28+
const populationSize = 25;
29+
const world = {
30+
width,
31+
height,
32+
creatures : undefined
33+
};
34+
world.creatures = fillArrayWithFunctionResult(
35+
function () {
36+
return generateRandomCreature(world.width, world.height);
37+
},
38+
populationSize);
39+
return world;
40+
};
41+
42+
const generateRandomCreature = function (maxX, maxY) {
43+
const maxSize = 5;
44+
const maxSpeed2d = 1
45+
const creature = {
46+
width: randomPositiveInt(maxSize),
47+
height: randomPositiveInt(maxSize),
48+
speedX: randomFloat(-maxSpeed2d, maxSpeed2d),
49+
speedY: randomFloat(-maxSpeed2d, maxSpeed2d),
50+
x: 0,
51+
y: 0
52+
};
53+
creature.x = randomFloat(0, maxX - creature.width);
54+
creature.y = randomFloat(0, maxY - creature.height);
55+
return creature;
56+
};
57+
58+
const updateWorld = function (world) {
59+
world.creatures.forEach(function (creature) {
60+
creature.x = Math.min(world.width - creature.width, Math.max(0, creature.x + creature.speedX));
61+
creature.y = Math.min(world.height - creature.height, Math.max(0, creature.y + creature.speedY));
62+
});
63+
};

‎general/wasm/package-lock.json‎

Lines changed: 18 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎general/wasm/package.json‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"name": "wasm",
3+
"version": "1.0.0",
4+
"description": "",
5+
"scripts": {
6+
"test": "echo \"Error: no test specified\" && exit 1"
7+
},
8+
"author": "",
9+
"license": "ISC",
10+
"devDependencies": {},
11+
"dependencies": {
12+
"dom99": "^14.4.0",
13+
"utilsac": "^7.0.0"
14+
}
15+
}

‎general/wasm/readme.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
# wasm

‎general/wasm/wasm-disabled.html‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>wasm-disabled</title>
6+
<meta name="viewport" content="width=device-width">
7+
<link rel="stylesheet" href="css/canvas.css">
8+
<script src="js/main.js" type="module"></script>
9+
</head>
10+
11+
<body>
12+
13+
14+
<h1>wasm-disabled</h1>
15+
16+
<p data-element="loadingHint">Loading ...</p>
17+
18+
<canvas data-element="canvas"></canvas>
19+
20+
21+
</body>
22+
</html>

0 commit comments

Comments
 (0)