Ok, I think I fixed it, or at least have a solution.
In the
updateCanvasDimensions function I added some hardcoded values for the canvas width and height. The smaller the values, the larger the canvas (weird, I don't get it). I set the values to 640x384, which if you look at the console when Nomad's app loads is the dimensions outputted. Matching those dimensions, the page will scale to fullscreen at whatever resolution your monitor is at. (I tested at 1080 and 4k)
All I did was add those dimensions like so:
if (Browser.resizeCanvas) {
if (canvas.width != w) canvas.width = w;
if (canvas.height != h) canvas.height = h;
if (typeof canvas.style != "undefined") {
canvas.style.removeProperty("width");
canvas.style.removeProperty("height");
if (fullscreen) {
canvas.width = 640; // added this
canvas.height = 384; // added this
canvas.parentNode.style.setProperty("width", "100%", "important");
canvas.parentNode.style.setProperty("height", "100%", "important");
canvas.style.setProperty("width", "100%", "important");
canvas.style.setProperty("height", "100%", "important")
}
}
}
I'm not super knowledgeable with canvas, but my guess is without hard set dimensions, the parent node doesn't know how to resize the children when using a percentage. This chunk of code (minus my change) is identical between studio and regular agk, so the problem technically lies elsewhere.
You can see Virtual Nomad's studio project here and verify the fullscreen working:
https://purpletoken.com/agk/2/
Here's the "fixed" version, unminified and minified (about 160kb difference).
https://purpletoken.com/agk/2/AGKPlayer.js
https://purpletoken.com/agk/2/AGKPlayer.min.js
There's still the same error that existed in the regular agk version as well but it doesn't seem to affect anything that I can tell:
AGKPlayer.js:7815 Uncaught (in promise) TypeError: Failed to execute 'exitFullscreen' on 'Document': Document not active
Hopefully this gives TGC a better idea what the cause might be and they can officially fix it.
Here's the weird thing. When I put
console.log(Module["canvas"]); it clearly shows the property values for each canvas attribute (width, height). But calling on the specific attribute such as
Module["canvas"].width it displays 1631 instead of 640. Also, I just realized this doesn't preserve the aspect ratio.