1 files changed, 18 insertions, 6 deletions

diff --git a/src/view/renderer/Renderer.ts b/src/view/renderer/Renderer.ts
index bf29797..344bccf 100644
--- a/src/view/renderer/Renderer.ts
+++ b/src/view/renderer/Renderer.ts
@@ -1,10 +1,13 @@
-import {mat4} from 'gl-matrix';
+import { mat4, vec2 } from 'gl-matrix';
 
 import Shaders from './Shaders';
 
 export default class Renderer {
 	private readonly gl: WebGLRenderingContext;
 	private readonly shaders: Shaders;
+
+	private readonly center: vec2 = vec2.create();
+	private readonly translation: vec2 = vec2.create();
 	private readonly viewport: mat4 = mat4.create();
 
 	constructor(private readonly canvas: HTMLCanvasElement) {
@@ -45,8 +48,19 @@ export default class Renderer {
 		return this.shaders.samplerLoc;
 	}
 
-	public setTranslation(v: Float32List) {
-		this.gl.uniform2fv(this.shaders.translateLoc, v);
+	public setCenter(v: vec2|number[]) {
+		vec2.copy(this.center, v);
+	}
+
+	public setTranslation(v: vec2|number[]) {
+		vec2.sub(this.translation, v, this.center);
+		this.gl.uniform2fv(this.shaders.translateLoc, this.translation);
+	}
+
+	public clear(): void {
+		this.gl.clear(this.gl.COLOR_BUFFER_BIT);
+
+		this.setTranslation([0, 0]);
 	}
 
 	private mkContext(): WebGLRenderingContext {
@@ -64,12 +78,10 @@ export default class Renderer {
 		const h = this.canvas.height;
 
 		this.gl.viewport(0, 0, w, h);
-		this.gl.clear(this.gl.COLOR_BUFFER_BIT);
+		this.clear();
 
 		mat4.identity(this.viewport);
 		mat4.scale(this.viewport, this.viewport, [2 * 64 / w, -2 * 64 / h, 1.0]);
 		this.gl.uniformMatrix4fv(this.shaders.viewportLoc, false, this.viewport);
-
-		this.setTranslation([-5, -5]);
 	}
 }