-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
79 lines (74 loc) · 2.57 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Random Plant Planting Pot 2d</title>
</head>
<body>
<label for="key-rule">key-rule?</label> <input id="key-rule" style="width: 50em" value="X=B-[[X]+X]+B-L[-BL-Q+Q++Q]+[+BX-Q+Q++Q]-X-Q+Q++Q"><br><br>
<label for="maximum-age">maximum-age?</label> <input id="maximum-age" value="500"><br><br>
<button id="startbtn">restart</button><br><br>
<button id="spdupbtn">speedup</button>
<button id="spddownbtn">speeddown</button><br>
<canvas id='screen' width="1024" height="800"> upgrade browser plz.. </canvas>
<script language="JavaScript" src="plant.js"> </script>
<script>
var key_rule = document.getElementById("key-rule"),
maximum_age = document.getElementById("maximum-age"),
spdupbtn = document.getElementById("spdupbtn"),
spddownbtn = document.getElementById("spddownbtn"),
startbtn = document.getElementById("startbtn");
var ctx = document.getElementById("screen").getContext("2d");
var flower_pot_image = new Image();
flower_pot_image.src = "flower_pot.png";
var loop = null;
var growth_speed = 0.01;
spdupbtn.onclick = function(){ growth_speed *= 2; }
spddownbtn.onclick = function(){ growth_speed /= 2; }
function start(){
var example_l_system = new LSystem({
axiom: "S",
constants: "",
rules:
[
"S=X",
key_rule.value,
"Q=W",
"W=E",
"E=R",
"R=F",
"T=F",
"B=@B"
],
iterations: 1,
});
let energy = maximum_age.value*10;
var example_plant = new Plant(
example_l_system,
{seed: {energy: energy, mineral: energy, water: energy,},
flower: {energy: 1, mineral: 1},
leaf: {energy: 1, mineral: 1},
branch: {energy: 1}},
30
);
example_plant.feed({water:300});
var lastLoop = new Date();
var framelate = 0;
if(loop) clearInterval(loop);
loop = setInterval(function () {
var thisLoop = new Date;
framelate = 0.8*framelate + 0.2*(thisLoop - lastLoop);
lastLoop = thisLoop;
example_plant.grow(growth_speed);
ctx.clearRect(0, 0, 1000, 1000);
ctx.drawImage(flower_pot_image, 200, 572, 200, 200);
example_plant.draw(ctx, 0, 0, 600, 600);
//ctx.fillText("framerate: "+framelate+"ms", 0, 20);
ctx.fillText("plant age: "+ (example_plant.age*0.1).toFixed(1) + " days", 0, 20);
}, 20);
};
startbtn.onclick = start;
start();
</script>
</body>
</html>