diff options
-rw-r--r-- | index.css | 4 | ||||
-rw-r--r-- | themes/LeafParticleRender.cpp | 4 | ||||
-rw-r--r-- | themes/Renderer2d.cpp | 27 | ||||
-rw-r--r-- | themes/Renderer2d.h | 3 | ||||
-rw-r--r-- | themes/TreeShape.cpp | 16 | ||||
-rw-r--r-- | themes/WebglContext.cpp | 32 | ||||
-rw-r--r-- | themes/WebglContext.h | 38 | ||||
-rw-r--r-- | themes/dist/output.js | 162 | ||||
-rwxr-xr-x | themes/dist/output.wasm | bin | 48362 -> 49375 bytes |
9 files changed, 157 insertions, 129 deletions
@@ -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 Binary files differindex 0b00b5d..17a1d97 100755 --- a/themes/dist/output.wasm +++ b/themes/dist/output.wasm |