- #16 change

Davidobot · Davidobot · commit a5635ed26e67 · 2021-04-13T20:15:56.000+01:00
canvas-appearing behaviour. Seems to break resizing love callback
   unless special canvas properties are set (see issue)
 - better error reporting
 - websocket API support (in theory?)
diff --git a/package.json b/package.json
@@ -15,7 +15,7 @@
     "postversion": "git push && git push --tags"
   },
   "bin": {
-    "love-js": "./index.js"
+    "love.js": "./index.js"
   },
   "repository": {
     "type": "git",
diff --git a/src/compat/index.html b/src/compat/index.html
@@ -3,6 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, minimum-scale=1, maximum-scale=1">
     <title>{{title}}</title>
 
     <!-- Load custom style sheet -->
@@ -12,20 +13,25 @@
     <center>
       <div>
         <h1>{{title}}</h1>
-        <canvas id="canvas" oncontextmenu="event.preventDefault()"></canvas>
         <canvas id="loadingCanvas" oncontextmenu="event.preventDefault()" width="800" height="600"></canvas>
+        <canvas id="canvas" oncontextmenu="event.preventDefault()"></canvas>
       </div>
     </center>
 
     <script type='text/javascript'>
       function goFullScreen(){
-          var canvas = document.getElementById("canvas");
-          if(canvas.requestFullScreen)
-              canvas.requestFullScreen();
-          else if(canvas.webkitRequestFullScreen)
-              canvas.webkitRequestFullScreen();
-          else if(canvas.mozRequestFullScreen)
-              canvas.mozRequestFullScreen();
+            var canvas = document.getElementById("canvas");
+            if(canvas.requestFullScreen)
+                canvas.requestFullScreen();
+            else if(canvas.webkitRequestFullScreen)
+                canvas.webkitRequestFullScreen();
+            else if(canvas.mozRequestFullScreen)
+                canvas.mozRequestFullScreen();
+      }
+      function FullScreenHook(){
+        var canvas = document.getElementById("canvas");
+        canvas.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
+        canvas.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
       }
       var loadingContext = document.getElementById('loadingCanvas').getContext('2d');
       function drawLoadingText(text) {
@@ -69,7 +75,7 @@ <h1>{{title}}</h1>
             drawLoadingText(text);
           } else if (Module.remainingDependencies === 0) {
             document.getElementById('loadingCanvas').style.display = 'none';
-            document.getElementById('canvas').style.display = 'block';
+            document.getElementById('canvas').style.visibility = 'visible';
           }
         },
         totalDependencies: 0,
diff --git a/src/compat/love.wasm b/src/compat/love.wasm
diff --git a/src/compat/theme/love.css b/src/compat/theme/love.css
@@ -43,6 +43,7 @@ a:hover {
 /* the canvas *must not* have any border or padding, or mouse coords will be wrong */
 #canvas {
     padding-right: 0;
-    display: none;
+    display: display;
     border: 0px none;
+    visibility: hidden;
 }
diff --git a/src/release/index.html b/src/release/index.html
@@ -3,6 +3,7 @@
   <head>
     <meta charset="utf-8">
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, minimum-scale=1, maximum-scale=1">
     <title>{{title}}</title>
 
     <!-- Load custom style sheet -->
@@ -12,20 +13,25 @@
     <center>
       <div>
         <h1>{{title}}</h1>
-        <canvas id="canvas" oncontextmenu="event.preventDefault()"></canvas>
         <canvas id="loadingCanvas" oncontextmenu="event.preventDefault()" width="800" height="600"></canvas>
+        <canvas id="canvas" oncontextmenu="event.preventDefault()"></canvas>
       </div>
     </center>
 
     <script type='text/javascript'>
       function goFullScreen(){
-          var canvas = document.getElementById("canvas");
-          if(canvas.requestFullScreen)
-              canvas.requestFullScreen();
-          else if(canvas.webkitRequestFullScreen)
-              canvas.webkitRequestFullScreen();
-          else if(canvas.mozRequestFullScreen)
-              canvas.mozRequestFullScreen();
+            var canvas = document.getElementById("canvas");
+            if(canvas.requestFullScreen)
+                canvas.requestFullScreen();
+            else if(canvas.webkitRequestFullScreen)
+                canvas.webkitRequestFullScreen();
+            else if(canvas.mozRequestFullScreen)
+                canvas.mozRequestFullScreen();
+      }
+      function FullScreenHook(){
+        var canvas = document.getElementById("canvas");
+        canvas.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
+        canvas.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
       }
       var loadingContext = document.getElementById('loadingCanvas').getContext('2d');
       function drawLoadingText(text) {
@@ -69,7 +75,7 @@ <h1>{{title}}</h1>
             drawLoadingText(text);
           } else if (Module.remainingDependencies === 0) {
             document.getElementById('loadingCanvas').style.display = 'none';
-            document.getElementById('canvas').style.display = 'block';
+            document.getElementById('canvas').style.visibility = 'visible';
           }
         },
         totalDependencies: 0,
diff --git a/src/release/love.wasm b/src/release/love.wasm
diff --git a/src/release/theme/love.css b/src/release/theme/love.css
@@ -43,6 +43,7 @@ a:hover {
 /* the canvas *must not* have any border or padding, or mouse coords will be wrong */
 #canvas {
     padding-right: 0;
-    display: none;
+    display: display;
     border: 0px none;
+    visibility: hidden;
 }

Original file line number	Diff line number	Diff line change
`@@ -43,6 +43,7 @@ a:hover {`
`43`	`43`	`/* the canvas must not have any border or padding, or mouse coords will be wrong */`
`44`	`44`	`#canvas {`
`45`	`45`	`padding-right: 0;`
`46`		`- display: none;`
	`46`	`+ display: display;`
`47`	`47`	`border: 0px none;`
	`48`	`+ visibility: hidden;`
`48`	`49`	`}`