From 0806844fdeaafce0b925d3901c7d7bd16b7d33bb Mon Sep 17 00:00:00 2001
From: Alexey Gulev <Alexey.Gulev@king.com>
Date: Mon, 29 Apr 2019 18:59:06 +0200
Subject: [PATCH] Full screen option for a game canvas (#65)

* Full screen option for a game canvas

* Gramma fixes
---
 README.md            |  6 ++++++
 fbinstant/index.html | 49 ++++++++++++++++++++++++++------------------
 game.project         |  3 +++
 3 files changed, 38 insertions(+), 20 deletions(-)

diff --git a/README.md b/README.md
index bb4e000..fb6cafa 100644
--- a/README.md
+++ b/README.md
@@ -36,6 +36,12 @@ It has been observed that the progress updates do not work properly on Android.
 		Module._fbinstant_inited = true;
 	});
 ```
+### 2.3 game.project options
+By default, game canvas fit into the browser window bounds. If you want to stretch canvas, add the following lines to your game.project file:
+```
+[fb_instant]
+stretch_canvas = 1
+```
 
 ## 3. Create a Facebook App
 You also need to create a Facebook App where Instant Games is enabled. Please refer to the [Getting Started documentation](https://developers.facebook.com/docs/games/instant-games/getting-started) on the Instant Games page for further instructions.
diff --git a/fbinstant/index.html b/fbinstant/index.html
index 7b111ec..f974b13 100644
--- a/fbinstant/index.html
+++ b/fbinstant/index.html
@@ -121,28 +121,37 @@
             var app_container = document.getElementById('app-container');
             var game_canvas = document.getElementById('canvas');
 
-            var dpi=window.devicePixelRatio || 1
-            var width=window.innerWidth;
-            var height=window.innerHeight;
-            var targetRatio = {{display.width}}/{{display.height}};
-            var actualRatio = width/height;
-            if (actualRatio > targetRatio) {
-                width = height * targetRatio;
-                app_container.style.marginLeft = ((window.innerWidth - width) / 2) + "px"
-                app_container.style.marginTop = "0px"
-            }
-            else {
-                height = width / targetRatio;
-                app_container.style.marginLeft = "0px"
-                app_container.style.marginTop = ((window.innerHeight - height) / 2) + "px"
+            var dpi = window.devicePixelRatio || 1;
+            var width = window.innerWidth;
+            var height = window.innerHeight;
+            var targetRatio = {{display.width}} / {{display.height}};
+            var actualRatio = width / height;
+
+            var isStretchCanvas = {{fb_instant.stretch_canvas}} + 0;
+            if (isStretchCanvas) {
+                app_container.style.width = width + "px";
+                app_container.style.height = height + "px";
+                game_canvas.width = width * dpi;
+                game_canvas.height = height * dpi;
+            } else {
+                if (actualRatio > targetRatio) {
+                    width = height * targetRatio;
+                    app_container.style.marginLeft = ((window.innerWidth - width) / 2) + "px"
+                    app_container.style.marginTop = "0px"
+                }
+                else {
+                    height = width / targetRatio;
+                    app_container.style.marginLeft = "0px"
+                    app_container.style.marginTop = ((window.innerHeight - height) / 2) + "px"
+                }
+
+                app_container.style.width = width+"px";
+                app_container.style.height = height+"px";
+
+                game_canvas.width = width*dpi;
+                game_canvas.height = height*dpi;
             }
 
-            app_container.style.width = width+"px";
-            app_container.style.height = height+"px";
-
-            game_canvas.width = width*dpi;
-            game_canvas.height = height*dpi;
-
             window.console.log("width: " + game_canvas.width + " > "+ game_canvas.style.width)
             window.console.log("height:" + game_canvas.height + " > "+ game_canvas.style.height)
         }
diff --git a/game.project b/game.project
index 05453b8..90f6be4 100644
--- a/game.project
+++ b/game.project
@@ -28,3 +28,6 @@ app_manifest = /tictactoe/tictactoe.appmanifest
 [graphics]
 texture_profiles = /tictactoe/tictactoe.texture_profiles
 
+[fb_instant]
+stretch_canvas = 0
+