Home Explore Help
Sign In
sdk3
/
livecodingspace-app
2
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

fix ARjs with window.visualViewport.width / height

Nikolay Suslov 6 years ago
parent
2e13f2734e
commit
75dcd38d5f
4 changed files with 15 additions and 14 deletions
Split View Show Diff Stats
  1. 4 3
      public/index.html
  2. 1 1
      public/vwf/view/aframe-arjs.js
  3. 8 8
      public/vwf/view/arjs/aframe-ar.js
  4. 2 2
      public/web/index-app.js

+ 4 - 3
public/index.html
View File 

@@ -7,9 +7,10 @@ Copyright (c) 2014-2018 Nikolai Suslov and the Krestianstvo.org project contribu
 
 <html lang="en">
 
 
 <head>
 
-    <meta charset="utf-8">
 
-    <meta name="viewport" content="initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
 
 
+    <meta charset="utf-8">
 
+    <meta name="viewport" content="initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /> 
+    
     <title>Live Coding Space 0.2</title>
 
     <!-- <script type="text/javascript" src="/lib/page.js"></script> -->
 
     <script type="text/javascript" src="/lib/yamljs/dist/yaml.js"></script>
 
@@ -97,7 +98,7 @@ Copyright (c) 2014-2018 Nikolai Suslov and the Krestianstvo.org project contribu
 
 
 </head>
 
 
-<body class="mdc-typography" style="overflow: hidden;">
 
+<body class="mdc-typography">
 
 
     <div id="load-progressbar" role="progressbar" class="mdc-linear-progress mdc-linear-progress--indeterminate loader visible">
 
         <div class="mdc-linear-progress__buffering-dots"></div>

+ 1 - 1
public/vwf/view/aframe-arjs.js
View File 

@@ -43,7 +43,7 @@ define(["module", "vwf/view", "vwf/view/arjs/signals/signals", "vwf/view/arjs/af
 
 			if (self.viewDriver.state.scenes[childID]) {
 
 				let scene = self.viewDriver.state.scenes[childID];
 
 				scene.setAttribute('embedded', {});
 
-				scene.setAttribute('arjs', {trackingMethod: "best", sourceType: "webcam", debugUIEnabled: "false"});
 
+				scene.setAttribute('arjs', {trackingMethod: "best", sourceType: "webcam", debugUIEnabled: "true"});
 
 			}
 
 
 			if (self.viewDriver.state.nodes[childID].extendsID == "http://vwf.example.com/aframe/acamera.vwf") {

+ 8 - 8
public/vwf/view/arjs/aframe-ar.js
View File 

@@ -4187,7 +4187,7 @@ THREE.WebAR.updateCameraMeshOrientation = function(vrDisplay, cameraMesh) {
 
 */
 
 THREE.WebAR.createVRSeeThroughCamera = function(vrDisplay, near, far) {
 
   var camera = new THREE.PerspectiveCamera( 60, 
-    window.innerWidth / window.innerHeight, near, far );
 
+    window.visualViewport.width / window.visualViewport.height, near, far );
 
   if (vrDisplay) {
 
     THREE.WebAR.resizeVRSeeThroughCamera(vrDisplay, camera);
 
   }
 
@@ -4200,9 +4200,9 @@ THREE.WebAR.createVRSeeThroughCamera = function(vrDisplay, near, far) {
 
 * @param {THREE.Camera} camera The ThreeJS camera instance to update its projection matrix depending on the current device orientation and see through camera properties.
 
 */
 
 THREE.WebAR.resizeVRSeeThroughCamera = function(vrDisplay, camera) {
 
-  camera.aspect = window.innerWidth / window.innerHeight;
 
+  camera.aspect = window.visualViewport.width / window.visualViewport.height;
 
   if (vrDisplay) {
 
-    var windowWidthBiggerThanHeight = window.innerWidth > window.innerHeight;
 
+    var windowWidthBiggerThanHeight = window.visualViewport.width > window.visualViewport.height;
 
     var seeThroughCamera = vrDisplay.getSeeThroughCamera();
 
     if (seeThroughCamera) {
 
       var cameraWidthBiggerThanHeight = 
@@ -6092,8 +6092,8 @@ ARjs.Source.prototype.domElementHeight = function(){
 
 
 ARjs.Source.prototype.onResizeElement = function(){
 
 	var _this = this
 
-	var screenWidth = window.innerWidth
 
-	var screenHeight = window.innerHeight
 
+	var screenWidth = window.visualViewport.width
 
+	var screenHeight = window.visualViewport.height
 
 
 	// sanity check
 
 	console.assert( arguments.length === 0 )
 
@@ -6146,7 +6146,7 @@ ARjs.Source.prototype.copyElementSizeTo = function(otherElement){
 
 
 ARjs.Source.prototype.copyElementSizeTo = function(otherElement){
 
 
-	if (window.innerWidth > window.innerHeight)
 
+	if (window.visualViewport.width > window.visualViewport.height)
 
 	{
 
 		//landscape
 
 		otherElement.style.width = this.domElement.style.width
 
@@ -6158,7 +6158,7 @@ ARjs.Source.prototype.copyElementSizeTo = function(otherElement){
 
 		//portrait
 
 		otherElement.style.height = this.domElement.style.height
 
 		otherElement.style.width = (parseInt(otherElement.style.height) * 4/3)+"px";
 
-		otherElement.style.marginLeft = ((window.innerWidth- parseInt(otherElement.style.width))/2)+"px";
 
+		otherElement.style.marginLeft = ((window.visualViewport.width- parseInt(otherElement.style.width))/2)+"px";
 
 		otherElement.style.marginTop = 0;
 
 	}
 
 
@@ -6207,7 +6207,7 @@ ARjs.Source.prototype.onResize	= function(arToolkitContext, renderer, camera){
 
 
 		this.copyElementSizeTo(arToolkitContext.arucoContext.canvas)	
 	}else if( trackingBackend === 'tango' ){
 
-		renderer.setSize( window.innerWidth, window.innerHeight )
 
+		renderer.setSize( window.visualViewport.width, window.visualViewport.height )
 
 	}else console.assert(false, 'unhandled trackingBackend '+trackingBackend)

+ 2 - 2
public/web/index-app.js
View File 

@@ -1015,8 +1015,8 @@ class IndexApp {
 
                                 }, 
                                     view:{
 
                                         'vwf/view/aframe' : null,
 
-                                        'vwf/view/aframe-arjs': null,
 
-                                        'vwf/view/editor-new': null
 
+                                        'vwf/view/aframe-arjs': null
 
+                                        //'vwf/view/editor-new': null
 
                                 }
 
                             }