Skip to content

Patch emscripten #347

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Moros1138 wants to merge 7 commits into
base: develop
Choose a base branch
from
Open

Patch emscripten #347

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
99b0c51
PGE 2.21
OneLoneCoder Nov 26, 2022
410cae6
Merge pull request #315 from OneLoneCoder/develop
OneLoneCoder Dec 29, 2022
d1da307
v2.23
OneLoneCoder Feb 28, 2023
5d85c7a
v2.23
OneLoneCoder Feb 28, 2023
147c25a
Updated Lic and Copy Years
OneLoneCoder Mar 4, 2023
b551062
use internal emscripten macro directly, preserve js in a string
Moros1138 Sep 10, 2023
318350f
remove leftover comment block
Moros1138 Sep 10, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion LICENCE.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# License (OLC-3)

Copyright 2018-2022 OneLoneCoder.com
Copyright 2018-2023 OneLoneCoder.com

Redistribution and use in source and binary forms, with or without
modification, are permitted provided that the following conditions
Expand Down
2 changes: 1 addition & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ Please see https://github.com/OneLoneCoder/olcPixelGameEngine/wiki

# License (OLC-3)

Copyright 2018, 2019, 2020, 2021 OneLoneCoder.com
Copyright 2018, 2019, 2020, 2021, 2022, 2023 OneLoneCoder.com

Redistribution and use in source and binary forms, with or without
modification, are permitted provided that the following conditions
Expand Down
100 changes: 3 additions & 97 deletions olcPixelGameEngine.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6284,7 +6284,8 @@ namespace olc
emscripten_set_focus_callback("#canvas", 0, 1, focus_callback);

#pragma warning disable format
EM_ASM( window.onunload = Module._olc_OnPageUnload; );

((void)emscripten_asm_const_int(CODE_EXPR("window.onunload = Module._olc_OnPageUnload;"), __em_asm_sig_builder<__typeof__(__em_asm_make_type_tuple())>::buffer));

// IMPORTANT! - Sorry About This...
//
Expand All @@ -6298,103 +6299,8 @@ namespace olc
// Wake up people! Of course theres a spoon. There has to be to keep feeding
// the giant web baby.

((void)emscripten_asm_const_int(CODE_EXPR("{ Module.olc_AspectRatio = $0 / $1; Module.olc_AssumeDefaultShells = (document.querySelectorAll('.emscripten').length >= 3) ? true : false; var olc_ResizeHandler = function() { let isFullscreen = (document.fullscreenElement != null); let width = (isFullscreen) ? window.innerWidth : Module.canvas.parentNode.clientWidth; let height = (isFullscreen) ? window.innerHeight : Module.canvas.parentNode.clientHeight; let viewWidth = width; let viewHeight = width / Module.olc_AspectRatio; if(viewHeight > height) { viewWidth = height * Module.olc_AspectRatio; viewHeight = height; } viewWidth = parseInt(viewWidth); viewHeight = parseInt(viewHeight); setTimeout(function() { if(Module.olc_AssumeDefaultShells) Module.canvas.parentNode.setAttribute('style', 'width: 100%; height: 70vh; margin-left: auto; margin-right: auto;'); Module.canvas.setAttribute('width', viewWidth); Module.canvas.setAttribute('height', viewHeight); Module.canvas.setAttribute('style', `width: ${viewWidth}px; height: ${viewHeight}px;`); Module._olc_PGE_UpdateWindowSize(viewWidth, viewHeight); Module.canvas.focus(); }, 200); }; var olc_Init = function() { if(Module.olc_AspectRatio === undefined) { setTimeout(function() { Module.olc_Init(); }, 50); return; } let resizeObserver = new ResizeObserver(function(entries) { Module.olc_ResizeHandler(); }).observe(Module.canvas.parentNode); let mutationObserver = new MutationObserver(function(mutationsList, observer) { setTimeout(function() { Module.olc_ResizeHandler(); }, 200); }).observe(Module.canvas.parentNode, { attributes: false, childList: true, subtree: false }); window.addEventListener('fullscreenchange', function(e) { setTimeout(function() { Module.olc_ResizeHandler();}, 200); }); }; Module.olc_ResizeHandler = (Module.olc_ResizeHandler != undefined) ? Module.olc_ResizeHandler : olc_ResizeHandler; Module.olc_Init = (Module.olc_Init != undefined) ? Module.olc_Init : olc_Init; Module.olc_Init(); }"), __em_asm_sig_builder<__typeof__(__em_asm_make_type_tuple(vWindowSize.x, vWindowSize.y))>::buffer, vWindowSize.x, vWindowSize.y));

EM_ASM({

// olc_ApsectRatio
//
// Used by olc_ResizeHandler to calculate the viewport from the
// dimensions of the canvas container's element.
Module.olc_AspectRatio = $0 / $1;

// HACK ALERT!
//
// Here we assume any html shell that uses 3 or more instance of the class "emscripten"
// is using one of the default or minimal emscripten page layouts
Module.olc_AssumeDefaultShells = (document.querySelectorAll('.emscripten').length >= 3) ? true : false;

// olc_ResizeHandler
//
// Used by olc_Init, and is called when a resize observer and fullscreenchange event is triggered.
var olc_ResizeHandler = function()
{
// are we in fullscreen mode?
let isFullscreen = (document.fullscreenElement != null);

// get the width of the containing element
let width = (isFullscreen) ? window.innerWidth : Module.canvas.parentNode.clientWidth;
let height = (isFullscreen) ? window.innerHeight : Module.canvas.parentNode.clientHeight;

// calculate the expected viewport size
let viewWidth = width;
let viewHeight = width / Module.olc_AspectRatio;

// if we're taller than the containing element, recalculate based on height
if(viewHeight > height)
{
viewWidth = height * Module.olc_AspectRatio;
viewHeight = height;
}

// ensure resulting viewport is in integer space
viewWidth = parseInt(viewWidth);
viewHeight = parseInt(viewHeight);

setTimeout(function()
{
// if default shells, apply default styles
if(Module.olc_AssumeDefaultShells)
Module.canvas.parentNode.setAttribute('style', 'width: 100%; height: 70vh; margin-left: auto; margin-right: auto;');

// apply viewport dimensions to teh canvas
Module.canvas.setAttribute('width', viewWidth);
Module.canvas.setAttribute('height', viewHeight);
Module.canvas.setAttribute('style', `width: ${viewWidth}px; height: ${viewHeight}px;`);

// update the PGE window size
Module._olc_PGE_UpdateWindowSize(viewWidth, viewHeight);

// force focus on our PGE canvas
Module.canvas.focus();
}, 200);
};


// olc_Init
//
// set up resize observer and fullscreenchange event handler
var olc_Init = function()
{
if(Module.olc_AspectRatio === undefined)
{
setTimeout(function() { Module.olc_Init(); }, 50);
return;
}

let resizeObserver = new ResizeObserver(function(entries)
{
Module.olc_ResizeHandler();
}).observe(Module.canvas.parentNode);

let mutationObserver = new MutationObserver(function(mutationsList, observer)
{
setTimeout(function() { Module.olc_ResizeHandler(); }, 200);
}).observe(Module.canvas.parentNode, { attributes: false, childList: true, subtree: false });

window.addEventListener('fullscreenchange', function(e)
{
setTimeout(function() { Module.olc_ResizeHandler();}, 200);
});
};

// set up hooks
Module.olc_ResizeHandler = (Module.olc_ResizeHandler != undefined) ? Module.olc_ResizeHandler : olc_ResizeHandler;
Module.olc_Init = (Module.olc_Init != undefined) ? Module.olc_Init : olc_Init;

// run everything!
Module.olc_Init();

}, vWindowSize.x, vWindowSize.y); // Fullscreen and Resize Observers
#pragma warning restore format
return olc::rcode::OK;
}
Expand Down