Recommendation is fixed when pointer is locked

controllers/prototype/views/prototype.jade

@@ -33,8 +33,8 @@ block content
                 button#redo.btn.btn-default.navbar-btn(style={'margin-right': '10px', 'margin-bottom':'10px'})
                     span.glyphicon.glyphicon-triangle-right('aria-hidden'="true")
 
-                input#fullarrow(type="checkbox", style={'margin-right': '10px', 'margin-bottom': '10px'})
+                //-input#fullarrow(type="checkbox", style={'margin-right': '10px', 'margin-bottom': '10px'})
-                label(for="fullarrow" style={'margin-right':'10px'}) Full arrow
+                //-label(for="fullarrow" style={'margin-right':'10px'}) Full arrow
 
                 input#lock(type="checkbox", style={'margin-right': '10px', 'margin-bottom': '10px'}, checked)
                 label(for="lock" style={'margin-right':'10px'}) Pointer lock
@@ -42,8 +42,8 @@ block content
                 input#showarrows(type="checkbox", style={'margin-right': '10px', 'margin-bottom': '10px'}, checked)
                 label(for="showarrows" style={'margin-right':'10px'}) Show arrows
 
-                input#recommendation(type="checkbox", style={'margin-right': '10px', 'margin-bottom': '10px'})
+                //-input#recommendation(type="checkbox", style={'margin-right': '10px', 'margin-bottom': '10px'})
-                label(for="recommendation" style={'margin-right':'10px'}) Fixed prev
+                //-label(for="recommendation" style={'margin-right':'10px'}) Fixed prev
 
                 audio#music(controls, volume=0.5)
                     source(src="/static/data/music/bobomb.ogg")

js/l3d/apps/prototype/ButtonManager.js

@@ -6,7 +6,8 @@ var ButtonManager = function(camera, cameras, previewer) {
     this.showArrows = true;
     this.beenFullscreen = false;
 
-    this.fullElement = document.getElementById('fullarrow');
+    // this.fullElement = document.getElementById('fullarrow');
+
     this.resetElement = document.getElementById('reset');
     this.undoElement = document.getElementById('undo');
     this.redoElement = document.getElementById('redo');
@@ -14,20 +15,20 @@ var ButtonManager = function(camera, cameras, previewer) {
     this.pointerLockElement = document.getElementById('lock');
     this.showarrowsElement = document.getElementById('showarrows');
 
-    this.recommendationElement = document.getElementById('recommendation');
+    // this.recommendationElement = document.getElementById('recommendation');
 
     (function(self) {
         self.undoElement.onclick = function() {self.camera.undo(); self.updateElements();};
         self.redoElement.onclick = function() {self.camera.redo(); self.updateElements();};
 
-        self.fullElement.onclick = function() {
+        // self.fullElement.onclick = function() {
-            self.cameras.map(function(camera) {
+        //     self.cameras.map(function(camera) {
-                if (!(camera instanceof PointerCamera)) {
+        //         if (!(camera instanceof PointerCamera)) {
-                    camera.fullArrow = self.fullElement.checked;
+        //             camera.fullArrow = self.fullElement.checked;
-                }
+        //         }
-            });
+        //     });
 
-        };
+        // };
 
         self.pointerLockElement.onchange = function() {
             self.camera.shouldLock = self.pointerLockElement.checked;
@@ -46,9 +47,9 @@ var ButtonManager = function(camera, cameras, previewer) {
             self.camera.reset();
         };
 
-        self.recommendationElement.onchange = function() {
+        // self.recommendationElement.onchange = function() {
-            previewer.fixedRecommendation(self.recommendationElement.checked);
+        //     previewer.fixedRecommendation(self.recommendationElement.checked);
-        };
+        // };
     })(this);
 
 };

js/l3d/apps/prototype/interactive/main.js

@@ -52,6 +52,20 @@ function main() {
     Coin.update();
     startCanvas.render(L3D.StartCanvas.Black);
 
+    // Bind previewer to renderer (for fixed option)
+    function bind() {
+        if (document.pointerLockElement || document.mozPointerLockElement || document.webkitPointerLockElement) {
+            // Lock event
+            previewer.fixed = true;
+        } else {
+            // Unlock event
+            previewer.fixed = false;
+        }
+    }
+    document.addEventListener('pointerlockchange', bind);
+    document.addEventListener('mozpointerlockchange', bind);
+    document.addEventListener('webkitpointerlockchange', bind);
+
     // Start rendering
     setInterval(render, 20);
 

js/l3d/apps/prototype/tutorial/main.js

@@ -20,8 +20,6 @@ var tutorial;
 
 function main() {
 
-    L3D.BD.disable();
-
     // Main container that holds everything
     container = document.getElementById('container');
 
@@ -44,6 +42,20 @@ function main() {
 
     startCanvas.render();
 
+    // Bind previewer to renderer (for fixed option)
+    function bind() {
+        if (document.pointerLockElement || document.mozPointerLockElement || document.webkitPointerLockElement) {
+            // Lock event
+            previewer.fixed = true;
+        } else {
+            // Unlock event
+            previewer.fixed = false;
+        }
+    }
+    document.addEventListener('pointerlockchange', bind);
+    document.addEventListener('mozpointerlockchange', bind);
+    document.addEventListener('webkitpointerlockchange', bind);
+
     // Start rendering
     setInterval(render, 20);
 

js/l3d/src/canvases/Previewer.js

@@ -89,8 +89,8 @@ L3D.Previewer.prototype.render = function(container_width, container_height) {
             left = Math.clamp(left, width / 5, this.renderer.domElement.width - 6 * width / 5);
 
         } else {
-            left = 0;
+            left = 20;
-            bottom = 0;
+            bottom = 20;
         }
 
         // Draw border