Resizing working as intended

9 files changed, 157 insertions, 129 deletions

diff --git a/index.css b/index.css
index 4a338fb..32bd838 100644
--- a/index.css
+++ b/index.css
@@ -162,8 +162,8 @@ input:focus {
 }
 
 #theme_canvas {
-	width: 800px;
-	height: 600px;
+	width: 100%;
+	height: 100%;
 	z-index: -1;
 }
 
diff --git a/themes/LeafParticleRender.cpp b/themes/LeafParticleRender.cpp
index e119e22..1abdd49 100644
--- a/themes/LeafParticleRender.cpp
+++ b/themes/LeafParticleRender.cpp
@@ -22,8 +22,8 @@ void LeafParticleRender::load(Renderer2d *renderer, TreeShape *tree) {
     glEnableVertexAttribArray(renderer->attributes.color);
     glVertexAttribPointer(renderer->attributes.color, 4, GL_FLOAT, GL_FALSE, sizeof(Renderer2dVertex), (GLvoid *)offsetof(Renderer2dVertex, color));
 
-    glEnableVertexAttribArray(renderer->attributes.scale);
-    glVertexAttribPointer(renderer->attributes.scale, 2, GL_FLOAT, GL_FALSE, sizeof(Renderer2dVertex), (GLvoid *)offsetof(Renderer2dVertex, scale));
+    glEnableVertexAttribArray(renderer->attributes.transform);
+    glVertexAttribPointer(renderer->attributes.transform, 4, GL_FLOAT, GL_FALSE, sizeof(Renderer2dVertex), (GLvoid *)offsetof(Renderer2dVertex, transform));
 
     glBindBuffer(GL_ARRAY_BUFFER, 0);
     glBindVertexArray(0);
diff --git a/themes/Renderer2d.cpp b/themes/Renderer2d.cpp
index 44dc7df..3e29656 100644
--- a/themes/Renderer2d.cpp
+++ b/themes/Renderer2d.cpp
@@ -2,6 +2,7 @@
 #include "Shader.h"
 #include "WebglContext.h"
 #include "mathlib.h"
+#include <cstdio>
 
 // Note: In the 'transform' attribute, the transform.x is the scale,
 // transform.y is the rotation, and transform.zw is the translatiob.
@@ -13,7 +14,7 @@ const char* renderer2dVertexShader =
 "uniform mat4 model; \n"
 "varying lowp vec4 VertexColor; \n"
 "void main() { \n"
-"    vec4 fragmentPosition = projection * model * vec4(position.x * transform.x, position.y * transform.x, 1, 1); \n"
+"    vec4 fragmentPosition = projection * model * vec4(position.x + transform.x, position.y + transform.x, 1, 1); \n"
 "    gl_Position = fragmentPosition; \n"
 "    VertexColor = color; \n"
 "}";
@@ -24,19 +25,35 @@ const char* renderer2dFragmentShader =
 "    gl_FragColor = VertexColor; \n"
 "}";
 
-void Renderer2d::load(WebglContext* context) {
+EM_BOOL onScreenSizeChanged(int eventType, const EmscriptenUiEvent *uiEvent, void *userData) {
+    Renderer2d* renderer = (Renderer2d*)userData;
+    
+    renderer->context->width = uiEvent->documentBodyClientWidth;
+    renderer->context->height = uiEvent->documentBodyClientHeight;
+	EMSCRIPTEN_RESULT result = emscripten_set_canvas_element_size( renderer->context->query, renderer->context->width, renderer->context->height);
+	if (result != EMSCRIPTEN_RESULT_SUCCESS) {
+		printf("Failed to resize element at query: %s\n", renderer->context->query);
+	}
+
+    return true;
+}
+
+void Renderer2d::load(WebglContext* inContext) {
+	context = inContext;
 	printf("Compiling Renderer2d shader...\n");
 	shader = loadShader(renderer2dVertexShader, renderer2dFragmentShader);
 
 	useShader(shader);
 	attributes.position = getShaderAttribute(shader, "position");
 	attributes.color = getShaderAttribute(shader, "color");
-	attributes.scale = getShaderAttribute(shader, "scale");
+	attributes.transform = getShaderAttribute(shader, "transform");
 	uniforms.projection = getShaderUniform(shader, "projection");
 	uniforms.model = getShaderUniform(shader, "model");
 	projection = Mat4x4().getOrthographicMatrix(0, context->width, 0, context->height);
 
 	printf("Renderer2d shader compiled.\n");
+
+	emscripten_set_resize_callback(EMSCRIPTEN_EVENT_TARGET_WINDOW, this, false, onScreenSizeChanged);
 }
 	
 void Renderer2d::render() {
@@ -76,8 +93,8 @@ void Renderer2dShape::load(Renderer2dVertex* inVertices, uint32 inNumVertices, R
 	glEnableVertexAttribArray(renderer->attributes.color);
 	glVertexAttribPointer(renderer->attributes.color, 4, GL_FLOAT, GL_FALSE, sizeof(Renderer2dVertex), (GLvoid *)offsetof(Renderer2dVertex, color));
 
-	glEnableVertexAttribArray(renderer->attributes.scale);
-	glVertexAttribPointer(renderer->attributes.scale, 2, GL_FLOAT, GL_FALSE, sizeof(Renderer2dVertex), (GLvoid *)offsetof(Renderer2dVertex, scale));
+	glEnableVertexAttribArray(renderer->attributes.transform);
+	glVertexAttribPointer(renderer->attributes.transform, 2, GL_FLOAT, GL_FALSE, sizeof(Renderer2dVertex), (GLvoid *)offsetof(Renderer2dVertex, transform));
 
 	glBindBuffer(GL_ARRAY_BUFFER, 0);
 	glBindVertexArray(0);
diff --git a/themes/Renderer2d.h b/themes/Renderer2d.h
index 0297102..33e0dac 100644
--- a/themes/Renderer2d.h
+++ b/themes/Renderer2d.h
@@ -8,6 +8,7 @@
 struct WebglContext;
 
 struct Renderer2d {
+	WebglContext* context = NULL;
 	Mat4x4 projection;
 	uint32 shader;
     Vector4 clearColor;
@@ -31,7 +32,7 @@ struct Renderer2d {
 struct Renderer2dVertex {
 	Vector2 position;
 	Vector4 color;
-	Vector2 scale;
+	Vector4 transform;
 };
 
 struct Renderer2dShape {
diff --git a/themes/TreeShape.cpp b/themes/TreeShape.cpp
index b3d5c84..ec9e052 100644
--- a/themes/TreeShape.cpp
+++ b/themes/TreeShape.cpp
@@ -12,12 +12,12 @@ void TreeBranchLoadData::fillVertices(Renderer2dVertex* vertices, int branchTier
 
     topMidpoint = topLeft + (topRight - topLeft) / 2.f;
 
-    vertices[0] = { bottomLeft, color, Vector2(1, 1) };
-    vertices[1] = { bottomRight, color, Vector2(1, 1) };
-    vertices[2] = { topLeft, color, Vector2(1, 1) };
-    vertices[3] = { topLeft, color, Vector2(1, 1) };
-    vertices[4] = { topRight, color, Vector2(1, 1) };
-    vertices[5] = { bottomRight, color, Vector2(1, 1) };
+    vertices[0] = { bottomLeft, color, Vector4(0, 0, 0, 0) };
+    vertices[1] = { bottomRight, color, Vector4(0, 0, 0, 0) };
+    vertices[2] = { topLeft, color, Vector4(0, 0, 0, 0) };
+    vertices[3] = { topLeft, color, Vector4(0, 0, 0, 0) };
+    vertices[4] = { topRight, color, Vector4(0, 0, 0, 0) };
+    vertices[5] = { bottomRight, color, Vector4(0, 0, 0, 0) };
 };
 
 inline float32 randomFloatBetween(float32 min, float32 max) {
@@ -53,8 +53,8 @@ void TreeShape::load(Renderer2d* renderer) {
     glEnableVertexAttribArray(renderer->attributes.color);
     glVertexAttribPointer(renderer->attributes.color, 4, GL_FLOAT, GL_FALSE, sizeof(Renderer2dVertex), (GLvoid *)offsetof(Renderer2dVertex, color));
 
-    glEnableVertexAttribArray(renderer->attributes.scale);
-	glVertexAttribPointer(renderer->attributes.scale, 2, GL_FLOAT, GL_FALSE, sizeof(Renderer2dVertex), (GLvoid *)offsetof(Renderer2dVertex, scale));
+    glEnableVertexAttribArray(renderer->attributes.transform);
+	glVertexAttribPointer(renderer->attributes.transform, 4, GL_FLOAT, GL_FALSE, sizeof(Renderer2dVertex), (GLvoid *)offsetof(Renderer2dVertex, transform));
 
     glBindBuffer(GL_ARRAY_BUFFER, 0);
     glBindVertexArray(0);
diff --git a/themes/WebglContext.cpp b/themes/WebglContext.cpp
index 3346280..11a201b 100644
--- a/themes/WebglContext.cpp
+++ b/themes/WebglContext.cpp
@@ -1,12 +1,32 @@
 #include "WebglContext.h"
 #include <cstdio>
 
-EM_BOOL onScreenSizeChanged(int eventType, const EmscriptenUiEvent *uiEvent, void *userData) {
-    printf("Here\n");
-    WebglContext* context = (WebglContext*)userData;
 
+void WebglContext::init(const char* inQuery) {
+    strcpy(query, inQuery);
+    float64 inWidth, inHeight;
+    emscripten_get_element_css_size(query, &inWidth, &inHeight);
+    width = static_cast<int32>(inWidth);
+    height = static_cast<int32>(inHeight);
+    emscripten_set_canvas_element_size( query, width, height);
     
-    context->width = uiEvent->documentBodyClientWidth;
-    context->height = uiEvent->documentBodyClientHeight;
-    return true;
+    EmscriptenWebGLContextAttributes attrs;
+    emscripten_webgl_init_context_attributes(&attrs);
+
+    attrs.enableExtensionsByDefault = 1;
+    attrs.majorVersion = 3;
+    attrs.minorVersion = 0;
+
+    context = emscripten_webgl_create_context(query, &attrs);
+    makeCurrentContext();
+
+    glClearColor(0, 0, 0, 0.0f);
+};
+
+void WebglContext::makeCurrentContext() {
+    emscripten_webgl_make_context_current(context);
+};
+
+void WebglContext::destroy() {
+    emscripten_webgl_destroy_context(context);
 }
diff --git a/themes/WebglContext.h b/themes/WebglContext.h
index 366c675..71540f0 100644
--- a/themes/WebglContext.h
+++ b/themes/WebglContext.h
@@ -1,42 +1,18 @@
 #pragma once
 #include "types.h"
+#include <cstring>
 #include <emscripten.h>
 #include <emscripten/html5.h>
 #include <GLES2/gl2.h>
 #include <EGL/egl.h>
 
-EM_BOOL onScreenSizeChanged(int eventType, const EmscriptenUiEvent *uiEvent, void *userData);
-
 struct WebglContext {
 	EMSCRIPTEN_WEBGL_CONTEXT_HANDLE context;
-	int width = 800;
-	int height = 600;
-
-	void init(const char* query, int inWidth = 800, int inHeight = 600) {
-		width = inWidth;
-		height = inHeight;
-		emscripten_set_canvas_element_size( query, width, height);
-		
-		EmscriptenWebGLContextAttributes attrs;
-		emscripten_webgl_init_context_attributes(&attrs);
-
-		attrs.enableExtensionsByDefault = 1;
-		attrs.majorVersion = 3;
-		attrs.minorVersion = 0;
-
-		context = emscripten_webgl_create_context(query, &attrs);
-		makeCurrentContext();
-
-		glClearColor(0, 0, 0, 0.0f);
+	int32 width = 800;
+	int32 height = 600;
+	char query[128];;
 
-        emscripten_set_resize_callback(query, this, false, onScreenSizeChanged);
-	};
-	
-	void makeCurrentContext() {
-		emscripten_webgl_make_context_current(context);
-	};
-	
-	void destroy() {
-		emscripten_webgl_destroy_context(context);
-	}
+	void init(const char* inQuery);
+	void makeCurrentContext();
+	void destroy() ;
 };
diff --git a/themes/dist/output.js b/themes/dist/output.js
index 4e2bcc0..2dd2a7d 100644
--- a/themes/dist/output.js
+++ b/themes/dist/output.js
@@ -1780,77 +1780,6 @@ var ASM_CONSTS = {
       abort();
     }
 
-  function _emscripten_memcpy_big(dest, src, num) {
-      HEAPU8.copyWithin(dest, src, src + num);
-    }
-
-  function _emscripten_request_animation_frame_loop(cb, userData) {
-      function tick(timeStamp) {
-        if (wasmTable.get(cb)(timeStamp, userData)) {
-          requestAnimationFrame(tick);
-        }
-      }
-      return requestAnimationFrame(tick);
-    }
-
-  function emscripten_realloc_buffer(size) {
-      try {
-        // round size grow request up to wasm page size (fixed 64KB per spec)
-        wasmMemory.grow((size - buffer.byteLength + 65535) >>> 16); // .grow() takes a delta compared to the previous size
-        updateGlobalBufferAndViews(wasmMemory.buffer);
-        return 1 /*success*/;
-      } catch(e) {
-        err('emscripten_realloc_buffer: Attempted to grow heap from ' + buffer.byteLength  + ' bytes to ' + size + ' bytes, but got error: ' + e);
-      }
-      // implicit 0 return to save code size (caller will cast "undefined" into 0
-      // anyhow)
-    }
-  function _emscripten_resize_heap(requestedSize) {
-      var oldSize = HEAPU8.length;
-      requestedSize = requestedSize >>> 0;
-      // With pthreads, races can happen (another thread might increase the size in between), so return a failure, and let the caller retry.
-      assert(requestedSize > oldSize);
-  
-      // Memory resize rules:
-      // 1. Always increase heap size to at least the requested size, rounded up to next page multiple.
-      // 2a. If MEMORY_GROWTH_LINEAR_STEP == -1, excessively resize the heap geometrically: increase the heap size according to 
-      //                                         MEMORY_GROWTH_GEOMETRIC_STEP factor (default +20%),
-      //                                         At most overreserve by MEMORY_GROWTH_GEOMETRIC_CAP bytes (default 96MB).
-      // 2b. If MEMORY_GROWTH_LINEAR_STEP != -1, excessively resize the heap linearly: increase the heap size by at least MEMORY_GROWTH_LINEAR_STEP bytes.
-      // 3. Max size for the heap is capped at 2048MB-WASM_PAGE_SIZE, or by MAXIMUM_MEMORY, or by ASAN limit, depending on which is smallest
-      // 4. If we were unable to allocate as much memory, it may be due to over-eager decision to excessively reserve due to (3) above.
-      //    Hence if an allocation fails, cut down on the amount of excess growth, in an attempt to succeed to perform a smaller allocation.
-  
-      // A limit is set for how much we can grow. We should not exceed that
-      // (the wasm binary specifies it, so if we tried, we'd fail anyhow).
-      // In CAN_ADDRESS_2GB mode, stay one Wasm page short of 4GB: while e.g. Chrome is able to allocate full 4GB Wasm memories, the size will wrap
-      // back to 0 bytes in Wasm side for any code that deals with heap sizes, which would require special casing all heap size related code to treat
-      // 0 specially.
-      var maxHeapSize = 2147483648;
-      if (requestedSize > maxHeapSize) {
-        err('Cannot enlarge memory, asked to go up to ' + requestedSize + ' bytes, but the limit is ' + maxHeapSize + ' bytes!');
-        return false;
-      }
-  
-      // Loop through potential heap size increases. If we attempt a too eager reservation that fails, cut down on the
-      // attempted size and reserve a smaller bump instead. (max 3 times, chosen somewhat arbitrarily)
-      for (var cutDown = 1; cutDown <= 4; cutDown *= 2) {
-        var overGrownHeapSize = oldSize * (1 + 0.2 / cutDown); // ensure geometric growth
-        // but limit overreserving (default to capping at +96MB overgrowth at most)
-        overGrownHeapSize = Math.min(overGrownHeapSize, requestedSize + 100663296 );
-  
-        var newSize = Math.min(maxHeapSize, alignUp(Math.max(requestedSize, overGrownHeapSize), 65536));
-  
-        var replacement = emscripten_realloc_buffer(newSize);
-        if (replacement) {
-  
-          return true;
-        }
-      }
-      err('Failed to grow the heap from ' + oldSize + ' bytes to ' + newSize + ' bytes, not enough memory!');
-      return false;
-    }
-
   var JSEvents = {inEventHandler:0,removeAllEventListeners:function() {
         for (var i = JSEvents.eventHandlers.length-1; i >= 0; --i) {
           JSEvents._removeHandler(i);
@@ -1970,6 +1899,92 @@ var ASM_CONSTS = {
       var domElement = specialHTMLTargets[target] || (typeof document !== 'undefined' ? document.querySelector(target) : undefined);
       return domElement;
     }
+  
+  function getBoundingClientRect(e) {
+      return specialHTMLTargets.indexOf(e) < 0 ? e.getBoundingClientRect() : {'left':0,'top':0};
+    }
+  function _emscripten_get_element_css_size(target, width, height) {
+      target = findEventTarget(target);
+      if (!target) return -4;
+  
+      var rect = getBoundingClientRect(target);
+      HEAPF64[((width)>>3)] = rect.width;
+      HEAPF64[((height)>>3)] = rect.height;
+  
+      return 0;
+    }
+
+  function _emscripten_memcpy_big(dest, src, num) {
+      HEAPU8.copyWithin(dest, src, src + num);
+    }
+
+  function _emscripten_request_animation_frame_loop(cb, userData) {
+      function tick(timeStamp) {
+        if (wasmTable.get(cb)(timeStamp, userData)) {
+          requestAnimationFrame(tick);
+        }
+      }
+      return requestAnimationFrame(tick);
+    }
+
+  function emscripten_realloc_buffer(size) {
+      try {
+        // round size grow request up to wasm page size (fixed 64KB per spec)
+        wasmMemory.grow((size - buffer.byteLength + 65535) >>> 16); // .grow() takes a delta compared to the previous size
+        updateGlobalBufferAndViews(wasmMemory.buffer);
+        return 1 /*success*/;
+      } catch(e) {
+        err('emscripten_realloc_buffer: Attempted to grow heap from ' + buffer.byteLength  + ' bytes to ' + size + ' bytes, but got error: ' + e);
+      }
+      // implicit 0 return to save code size (caller will cast "undefined" into 0
+      // anyhow)
+    }
+  function _emscripten_resize_heap(requestedSize) {
+      var oldSize = HEAPU8.length;
+      requestedSize = requestedSize >>> 0;
+      // With pthreads, races can happen (another thread might increase the size in between), so return a failure, and let the caller retry.
+      assert(requestedSize > oldSize);
+  
+      // Memory resize rules:
+      // 1. Always increase heap size to at least the requested size, rounded up to next page multiple.
+      // 2a. If MEMORY_GROWTH_LINEAR_STEP == -1, excessively resize the heap geometrically: increase the heap size according to 
+      //                                         MEMORY_GROWTH_GEOMETRIC_STEP factor (default +20%),
+      //                                         At most overreserve by MEMORY_GROWTH_GEOMETRIC_CAP bytes (default 96MB).
+      // 2b. If MEMORY_GROWTH_LINEAR_STEP != -1, excessively resize the heap linearly: increase the heap size by at least MEMORY_GROWTH_LINEAR_STEP bytes.
+      // 3. Max size for the heap is capped at 2048MB-WASM_PAGE_SIZE, or by MAXIMUM_MEMORY, or by ASAN limit, depending on which is smallest
+      // 4. If we were unable to allocate as much memory, it may be due to over-eager decision to excessively reserve due to (3) above.
+      //    Hence if an allocation fails, cut down on the amount of excess growth, in an attempt to succeed to perform a smaller allocation.
+  
+      // A limit is set for how much we can grow. We should not exceed that
+      // (the wasm binary specifies it, so if we tried, we'd fail anyhow).
+      // In CAN_ADDRESS_2GB mode, stay one Wasm page short of 4GB: while e.g. Chrome is able to allocate full 4GB Wasm memories, the size will wrap
+      // back to 0 bytes in Wasm side for any code that deals with heap sizes, which would require special casing all heap size related code to treat
+      // 0 specially.
+      var maxHeapSize = 2147483648;
+      if (requestedSize > maxHeapSize) {
+        err('Cannot enlarge memory, asked to go up to ' + requestedSize + ' bytes, but the limit is ' + maxHeapSize + ' bytes!');
+        return false;
+      }
+  
+      // Loop through potential heap size increases. If we attempt a too eager reservation that fails, cut down on the
+      // attempted size and reserve a smaller bump instead. (max 3 times, chosen somewhat arbitrarily)
+      for (var cutDown = 1; cutDown <= 4; cutDown *= 2) {
+        var overGrownHeapSize = oldSize * (1 + 0.2 / cutDown); // ensure geometric growth
+        // but limit overreserving (default to capping at +96MB overgrowth at most)
+        overGrownHeapSize = Math.min(overGrownHeapSize, requestedSize + 100663296 );
+  
+        var newSize = Math.min(maxHeapSize, alignUp(Math.max(requestedSize, overGrownHeapSize), 65536));
+  
+        var replacement = emscripten_realloc_buffer(newSize);
+        if (replacement) {
+  
+          return true;
+        }
+      }
+      err('Failed to grow the heap from ' + oldSize + ' bytes to ' + newSize + ' bytes, not enough memory!');
+      return false;
+    }
+
   function findCanvasEventTarget(target) { return findEventTarget(target); }
   function _emscripten_set_canvas_element_size(target, width, height) {
       var canvas = findCanvasEventTarget(target);
@@ -1979,9 +1994,6 @@ var ASM_CONSTS = {
       return 0;
     }
 
-  function getBoundingClientRect(e) {
-      return specialHTMLTargets.indexOf(e) < 0 ? e.getBoundingClientRect() : {'left':0,'top':0};
-    }
   function fillMouseEventData(eventStruct, e, target) {
       assert(eventStruct % 4 == 0);
       HEAPF64[((eventStruct)>>3)] = e.timeStamp;
@@ -2441,6 +2453,7 @@ var ASM_CONSTS = {
       var success = GL.makeContextCurrent(contextHandle);
       return success ? 0 : -5;
     }
+  Module["_emscripten_webgl_make_context_current"] = _emscripten_webgl_make_context_current;
 
   function flush_NO_FILESYSTEM() {
       // flush anything remaining in the buffers during shutdown
@@ -2993,6 +3006,7 @@ function intArrayToString(array) {
 
 var asmLibraryArg = {
   "abort": _abort,
+  "emscripten_get_element_css_size": _emscripten_get_element_css_size,
   "emscripten_memcpy_big": _emscripten_memcpy_big,
   "emscripten_request_animation_frame_loop": _emscripten_request_animation_frame_loop,
   "emscripten_resize_heap": _emscripten_resize_heap,
diff --git a/themes/dist/output.wasm b/themes/dist/output.wasm
index 0b00b5d..17a1d97 100755
--- a/themes/dist/output.wasm
+++ b/themes/dist/output.wasm