From bc22f095ea2ab99b9efa94d8f97653ca4da41a7b Mon Sep 17 00:00:00 2001
From: Thomas FORGIONE <thomas.forgione@gmail.com>
Date: Tue, 12 May 2015 15:45:23 +0200
Subject: [PATCH] Begining of fullscreen mode

---
 static/css/prototype.css    |  2 +-
 static/js/prototype/main.js | 50 +++++++++++++++++++++----------------
 2 files changed, 30 insertions(+), 22 deletions(-)

diff --git a/static/css/prototype.css b/static/css/prototype.css
index 7fb517e..6f4631a 100644
--- a/static/css/prototype.css
+++ b/static/css/prototype.css
@@ -1,5 +1,5 @@
 body {
-    overflow-y: hidden;
+    overflow: hidden;
 }
 
 html, body {
diff --git a/static/js/prototype/main.js b/static/js/prototype/main.js
index 4a695fc..150395a 100644
--- a/static/js/prototype/main.js
+++ b/static/js/prototype/main.js
@@ -14,6 +14,8 @@ var previewer;
 
 var loader;
 var coins;
+var beenFullscreen = false;
+var isFullscreen = false;
 
 var main_section = document.getElementById('main-section');
 var offset = function() {
@@ -24,11 +26,14 @@ var offset = function() {
 
 console.log(document.getElementById('main-div').offsetHeight);
 var container_size = {
-    width: function() { return main_section.clientWidth; },
+    width: function() { if (!isFullscreen) return main_section.clientWidth; else return screen.width;},
     height: function() {
-        return main_section.clientHeight
-            - document.getElementById('nav').offsetHeight
-            - document.getElementById('main-div').offsetHeight;
+        if (!isFullscreen)
+            return main_section.clientHeight
+                - document.getElementById('nav').offsetHeight
+                - document.getElementById('main-div').offsetHeight;
+        else
+            return screen.height;
     }
 };
 
@@ -138,6 +143,7 @@ function initListeners() {
 }
 
 function fullscreen() {
+    isFullscreen = true;
 
     if (!beenFullscreen) {
         beenFullscreen = true;
@@ -146,7 +152,7 @@ function fullscreen() {
 
     container.style.position = "absolute";
     container.style.cssFloat = "top-left";
-    container.style.top = "0px";
+    container.style.top = "50px";
     container.style.bottom = "0px";
     container.style.left = "0px";
     container.style.right = "0px";
@@ -154,21 +160,23 @@ function fullscreen() {
     container.style.height="";
     container.style.overflow = "hidden";
 
-    canvas.style.position = "absolute";
-    canvas.style.cssFloat = "top-left";
-    canvas.style.top = "0px";
-    canvas.style.bottom = "0px";
-    canvas.style.left = "0px";
-    canvas.style.right = "0px";
-    canvas.width=window.innerWidth;
-    canvas.height=window.innerHeight;
-    canvas.style.overflow = "hidden";
+    // canvas.style.position = "absolute";
+    // canvas.style.cssFloat = "top-left";
+    // canvas.style.top = "0px";
+    // canvas.style.bottom = "0px";
+    // canvas.style.left = "0px";
+    // canvas.style.right = "0px";
+    // canvas.width=window.innerWidth;
+    // canvas.height=window.innerHeight;
+    // canvas.style.overflow = "hidden";
 
     onWindowResize();
 }
 
 function stopFullscreen() {
-    container.style.position = "";
+    isFullscreen = false;
+
+    // container.style.position = "";
     container.style.cssFloat = "";
     container.style.width = container_size.width() + "px";
     container.style.height = container_size.height() + "px";
@@ -176,12 +184,12 @@ function stopFullscreen() {
 
     // canvas.style.position = "";
     // canvas.style.cssFloat = "";
-    canvas.style.top = "";
-    canvas.style.bottom = "";
-    canvas.style.left = "";
-    canvas.style.right = "";
-    canvas.width = container_size.width();
-    canvas.height = container_size.height();
+    // canvas.style.top = "";
+    // canvas.style.bottom = "";
+    // canvas.style.left = "";
+    // canvas.style.right = "";
+    // canvas.width = container_size.width();
+    // canvas.height = container_size.height();
     // canvas.style.overflow = "";
 
     onWindowResize();