Hugging Face's logo

Spaces:
BirdL
/
CarryingCap
Running

App Files Community
puffy310 commited on
Commit
d875e86
·
verified ·
1 Parent(s): 2b0027d

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +193 -19
index.html CHANGED
@@ -1,19 +1,193 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>Evolution Simulation</title>
6
+ <script src="https://cdn.babylonjs.com/babylon.js"></script>
7
+ <style>
8
+ body, html {
9
+ width: 100%;
10
+ height: 100%;
11
+ margin: 0;
12
+ overflow: hidden;
13
+ }
14
+ #roundDisplay {
15
+ position: absolute;
16
+ top: 10px;
17
+ left: 10px;
18
+ color: white;
19
+ font-family: Arial, sans-serif;
20
+ font-size: 20px;
21
+ }
22
+ </style>
23
+ </head>
24
+ <body>
25
+ <canvas id="renderCanvas"></canvas>
26
+ <div id="roundDisplay">Round: 0</div>
27
+ <script>
28
+ const canvas = document.getElementById("renderCanvas");
29
+ const engine = new BABYLON.Engine(canvas, true);
30
+ const roundDisplay = document.getElementById("roundDisplay");
31
+
32
+ let round = 0;
33
+
34
+ const createScene = function () {
35
+ const scene = new BABYLON.Scene(engine);
36
+ const camera = new BABYLON.ArcRotateCamera("camera", -Math.PI / 2, Math.PI / 2.5, 3, new BABYLON.Vector3(0, 0, 0), scene);
37
+ camera.attachControl(canvas, true);
38
+ const light = new BABYLON.HemisphericLight("light", new BABYLON.Vector3(1, 1, 0), scene);
39
+ light.intensity = 0.7;
40
+
41
+ // Ground
42
+ const ground = BABYLON.MeshBuilder.CreateGround("ground", {width: 10, height: 10}, scene);
43
+
44
+ // Elephants
45
+ let elephants = [];
46
+ for (let i = 0; i < 5; i++) {
47
+ const elephant = BABYLON.MeshBuilder.CreateSphere("elephant", {diameter: 0.5}, scene);
48
+ elephant.position.y = 0.5;
49
+ elephant.position.x = Math.random() * 10 - 5;
50
+ elephant.position.z = Math.random() * 10 - 5;
51
+ elephants.push(elephant);
52
+ }
53
+
54
+ // Prey
55
+ let prey = [];
56
+ for (let i = 0; i < 10; i++) {
57
+ const p = BABYLON.MeshBuilder.CreateSphere("prey", {diameter: 0.3}, scene);
58
+ p.position.y = 0.3;
59
+ p.position.x = Math.random() * 10 - 5;
60
+ p.position.z = Math.random() * 10 - 5;
61
+ prey.push(p);
62
+ }
63
+
64
+ // Grass
65
+ const grass = [];
66
+ for (let i = 0; i < 20; i++) {
67
+ const g = BABYLON.MeshBuilder.CreateBox("grass", {size: 0.2}, scene);
68
+ g.position.y = 0.1;
69
+ g.position.x = Math.random() * 10 - 5;
70
+ g.position.z = Math.random() * 10 - 5;
71
+ g.material = new BABYLON.StandardMaterial("grassMat", scene);
72
+ g.material.diffuseColor = new BABYLON.Color3(0, 1, 0); // Green color
73
+ grass.push(g);
74
+ }
75
+
76
+ // Elephant behavior
77
+ scene.registerBeforeRender(function () {
78
+ elephants.forEach(elephant => {
79
+ const nearestPrey = prey.reduce((nearest, p) => {
80
+ return BABYLON.Vector3.Distance(elephant.position, p.position) < BABYLON.Vector3.Distance(elephant.position, nearest.position) ? p : nearest;
81
+ }, prey[0]);
82
+
83
+ const direction = nearestPrey.position.subtract(elephant.position);
84
+ direction.normalize();
85
+ elephant.position.addInPlace(direction.scale(0.01));
86
+
87
+ if (BABYLON.Vector3.Distance(elephant.position, nearestPrey.position) < 0.5) {
88
+ // Prey is eaten
89
+ nearestPrey.position.x = Math.random() * 10 - 5;
90
+ nearestPrey.position.z = Math.random() * 10 - 5;
91
+ }
92
+ });
93
+ });
94
+
95
+ // Prey behavior
96
+ scene.registerBeforeRender(function () {
97
+ prey.forEach(p => {
98
+ const randomDirection = new BABYLON.Vector3(Math.random() - 0.5, 0, Math.random() - 0.5);
99
+ p.position.addInPlace(randomDirection.scale(0.01));
100
+ });
101
+ });
102
+
103
+ // Grass regeneration
104
+ let grassTimer = 0;
105
+ scene.registerBeforeRender(function () {
106
+ grassTimer += scene.getEngine().getDeltaTime();
107
+ if (grassTimer > 1000) {
108
+ grassTimer = 0;
109
+ grass.forEach(g => {
110
+ g.scaling.addInPlace(new BABYLON.Vector3(0.1, 0.1, 0.1));
111
+ });
112
+ }
113
+ });
114
+
115
+ // Evolution mechanics
116
+ let elephantFitness = Array(elephants.length).fill(0);
117
+ let preyFitness = Array(prey.length).fill(0);
118
+
119
+ scene.registerBeforeRender(function () {
120
+ elephants.forEach((elephant, i) => {
121
+ const nearestPrey = prey.reduce((nearest, p) => {
122
+ return BABYLON.Vector3.Distance(elephant.position, p.position) < BABYLON.Vector3.Distance(elephant.position, nearest.position) ? p : nearest;
123
+ }, prey[0]);
124
+
125
+ if (BABYLON.Vector3.Distance(elephant.position, nearestPrey.position) < 0.5) {
126
+ elephantFitness[i] += 1;
127
+ preyFitness[prey.indexOf(nearestPrey)] -= 1;
128
+ } else {
129
+ preyFitness[prey.indexOf(nearestPrey)] += 0.1;
130
+ }
131
+
132
+ // Mutation
133
+ if (elephantFitness[i] > 10) {
134
+ elephantFitness[i] = 0;
135
+ elephant.position.x = Math.random() * 10 - 5;
136
+ elephant.position.z = Math.random() * 10 - 5;
137
+ }
138
+ });
139
+
140
+ prey.forEach((p, i) => {
141
+ if (preyFitness[i] < -10) {
142
+ preyFitness[i] = 0;
143
+ p.position.x = Math.random() * 10 - 5;
144
+ p.position.z = Math.random() * 10 - 5;
145
+ }
146
+ });
147
+
148
+ // Adjust number of elephants and prey based on performance
149
+ if (round % 10 === 0) {
150
+ const totalElephantFitness = elephantFitness.reduce((a, b) => a + b, 0);
151
+ const totalPreyFitness = preyFitness.reduce((a, b) => a + b, 0);
152
+
153
+ if (totalElephantFitness > 50) {
154
+ // Elephants are doing well, create more
155
+ for (let i = 0; i < 2; i++) {
156
+ const newElephant = BABYLON.MeshBuilder.CreateSphere("elephant", {diameter: 0.5}, scene);
157
+ newElephant.position.y = 0.5;
158
+ newElephant.position.x = Math.random() * 10 - 5;
159
+ newElephant.position.z = Math.random() * 10 - 5;
160
+ elephants.push(newElephant);
161
+ elephantFitness.push(0);
162
+ }
163
+ } else if (totalPreyFitness < -50) {
164
+ // Prey are doing poorly, create more
165
+ for (let i = 0; i < 2; i++) {
166
+ const newPrey = BABYLON.MeshBuilder.CreateSphere("prey", {diameter: 0.3}, scene);
167
+ newPrey.position.y = 0.3;
168
+ newPrey.position.x = Math.random() * 10 - 5;
169
+ newPrey.position.z = Math.random() * 10 - 5;
170
+ prey.push(newPrey);
171
+ preyFitness.push(0);
172
+ }
173
+ }
174
+ }
175
+
176
+ round++;
177
+ roundDisplay.textContent = `Round: ${round}`;
178
+ });
179
+
180
+ return scene;
181
+ };
182
+
183
+ const scene = createScene();
184
+ engine.runRenderLoop(function () {
185
+ scene.render();
186
+ });
187
+
188
+ window.addEventListener("resize", function () {
189
+ engine.resize();
190
+ });
191
+ </script>
192
+ </body>
193
+ </html>