update voronoi for weak hardware

backend/templates/visualizer.html.tera

@@ -31,18 +31,11 @@
         <p>{{game.name}}</p>
         <p>Turns: {{game.turns}}</p>
     </div>
-    {# {% else %}
-    <div class="option">
-        No options available
-    </div> #}
     {% endfor %}
     </div>
 </div>
 
 
 <noscript>This page contains webassembly and javascript content, please enable javascript in your browser.</noscript>
-<script>
-    console.log(window);
-</script>
 <script src="frontend/bootstrap.js"></script>
 {% endblock %}

frontend/www/index.ts

@@ -1,7 +1,7 @@
 import { Game } from "planetwars";
 import { memory } from "planetwars/planetwars_bg";
 import { Resizer, resizeCanvasToDisplaySize, FPSCounter, url_to_mesh, Mesh } from "./webgl/util";
-import { Shader, Uniform4f, Uniform2fv, Uniform3fv, Uniform1i, Uniform1f, Uniform2f, ShaderFactory, Uniform3f, UniformMatrix3fv } from './webgl/shader';
+import { Shader, Uniform4f, Uniform2fv, Uniform3fv, Uniform1i, Uniform1f, Uniform2f, ShaderFactory, Uniform3f, UniformMatrix3fv, UniformBool } from './webgl/shader';
 import { Renderer } from "./webgl/renderer";
 import { VertexBuffer, IndexBuffer } from "./webgl/buffer";
 import { VertexBufferLayout, VertexArray } from "./webgl/vertexBufferLayout";
@@ -79,6 +79,8 @@ class GameInstance {
     renderer: Renderer;
     planet_count: number;
 
+    vor_counter = 3;
+    use_vor = true;
     playing = true;    // 0 is paused, 1 is playing but not rerendered, 2 is playing and rerendered
     time_stopped_delta = 0;
     last_time = 0;
@@ -223,6 +225,16 @@ class GameInstance {
     render(time: number) {
         COUNTER.frame(time);
 
+        if (COUNTER.delta(time) < 30) {
+            this.vor_counter = Math.min(3, this.vor_counter + 1);
+        } else {
+            this.vor_counter = Math.max(-3, this.vor_counter - 1);
+        }
+
+        if (this.vor_counter < -2) {
+            this.use_vor = false;
+        }
+
         if (!this.playing) {
             this.last_time = time;
 
@@ -244,11 +256,13 @@ class GameInstance {
 
         this.vor_shader.uniform(GL, "u_viewbox", new Uniform4f(this.resizer.get_viewbox()));
         this.vor_shader.uniform(GL, "u_resolution", new Uniform2f(RESOLUTION));
+        this.vor_shader.uniform(GL, "u_vor", new UniformBool(this.use_vor));
 
         this.shader.uniform(GL, "u_time", new Uniform1f((time - this.last_time) / ms_per_frame));
         this.shader.uniform(GL, "u_mouse", new Uniform2f(this.resizer.get_mouse_pos()));
         this.shader.uniform(GL, "u_viewbox", new Uniform4f(this.resizer.get_viewbox()));
         this.shader.uniform(GL, "u_resolution", new Uniform2f(RESOLUTION));
+        this.shader.uniform(GL, "u_vor", new UniformBool(true));
 
         this.renderer.render(GL);
     }

frontend/www/static/shaders/frag/vor.glsl

@@ -7,11 +7,14 @@ uniform vec3 u_planet_colours[$PLANETS * 2];
 
 uniform float u_step_interval;
 uniform float u_time;
+uniform bool u_vor;
 
 varying vec2 v_pos;
 
 void main() {
     vec3 color = vec3(0.2);
+
+    if (u_vor) {
         float dis = 1000000.0;
 
         for(int i = 0; i < $PLANETS; i++) {
@@ -21,6 +24,7 @@ void main() {
                 color = u_planet_colours[2 * i];
             }
         }
+    }
 
     gl_FragColor = vec4(color, 0.2);
 }

frontend/www/webgl/shader.ts

@@ -312,3 +312,14 @@ export class UniformMatrix3fv implements Uniform {
     gl.uniformMatrix3fv(location, false, this.data);
   }
 }
+
+export class UniformBool implements Uniform {
+  data: boolean;
+  constructor(data: boolean) {
+    this.data = data;
+  }
+
+  setUniform(gl: WebGLRenderingContext, location: WebGLUniformLocation) {
+    gl.uniform1i(location, this.data ? 1 : 0);
+  }
+}

frontend/www/webgl/util.ts

@@ -35,19 +35,30 @@ export function resizeCanvasToDisplaySize(
 export class FPSCounter {
   last: number;
   count: number;
+  _delta: number;
+  _prev: number
   constructor() {
     this.last = 0;
     this.count = 0;
+    this._delta = 0;
+    this._prev = 0;
   }
 
   frame(now: number) {
     this.count += 1;
+    this._delta = now - this._prev;
+    this._prev = now;
+
     if (now - this.last > 1000) {
       this.last = now;
       console.log(this.count + " fps");
       this.count = 0;
     }
   }
+
+  delta(now: number): number {
+    return this._delta;
+  }
 }
 
 export class Resizer {