Home Explore Help
Register Sign In
zhangyupeng
/
Babylon.js
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

move enter vr to click event as pointup is not a user action on mobile

Trevor Baron 7 years ago
parent
685b8f0f4b
commit
aeca8c4c0b
3 changed files with 21 additions and 16 deletions
Unified View Show Diff Stats
  1. 16 13
      Viewer/dist/basicExample.html
  2. 3 1
      Viewer/src/configuration/types/default.ts
  3. 2 2
      Viewer/src/viewer/defaultViewer.ts

+ 16 - 13
Viewer/dist/basicExample.html
View File 

@@ -8,27 +8,30 @@
 
         <title>BabylonJS Viewer - Basic usage</title>

         <title>BabylonJS Viewer - Basic usage</title>

         <style>

         <style>

             babylon {

             babylon {

-                max-width: 800px;

-                max-height: 500px;

-                width: 100%;

-                height: 600px;

+                width: 300px;

+                height: 200px;

             }

             }

         </style>

         </style>

     </head>

     </head>

 

 

     <body>

     <body>

-        <babylon id="babylon-viewer" configuration="config.json" model.title="Damaged Helmet" model.subtitle="BabylonJS" model.thumbnail="https://www.babylonjs.com/img/favicon/apple-icon-144x144.png"

-            model.url="https://www.babylonjs.com/Assets/DamagedHelmet/glTF/DamagedHelmet.gltf" camera.behaviors.auto-rotate="0"

-            templates.nav-bar.params.disable-on-fullscreen="true"></babylon>

+        <babylon id="babylon-viewer" model="https://models.babylonjs.com/boombox.glb">

+            <!-- Setting the vr object (or vr="true" in the <babylon tag) is enough to enable VR.

+                 The object-scale-factor is optional an can be used to scale the model in VR mode.

+                 If setting "2", the model will be twice the size of its normalized size.

+            -->

+            <vr object-scale-factor="2">

+            </vr>

+            <!-- This is needed in order to show the VR button. It is also possible to toggleVR() using javascript -->

+            <templates>

+                <nav-bar>

+                    <params hide-vr="false"></params>

+                </nav-bar>

+            </templates>

+        </babylon>

         <script src="viewer.js"></script>

         <script src="viewer.js"></script>

         <script>

         <script>

-            // The following lines are redundant. 

-            // They are only here to show how you could achive the tag initialization on your own.

 

 

-            // a simple way of disabling auto init 

-            BabylonViewer.disableInit = true;

-            // Initializing the viewer on specific HTML tags.

-            BabylonViewer.InitTags('babylon');

         </script>

         </script>

     </body>

     </body>

+ 3 - 1
Viewer/src/configuration/types/default.ts
View File 

@@ -62,8 +62,10 @@ export let defaultConfiguration: ViewerConfiguration = {
 
                 }

                 }

             },

             },

             events: {

             events: {

+                click: {

+                    '.navbar-control': true

+                },

                 pointerdown: {

                 pointerdown: {

-                    '.navbar-control': true,

                     '.help-button': true

                     '.help-button': true

                 },

                 },

                 input: {

                 input: {

+ 2 - 2
Viewer/src/viewer/defaultViewer.ts
View File 

@@ -120,7 +120,7 @@ export class DefaultViewer extends AbstractViewer {
 
         let navbar = this.templateManager.getTemplate('navBar');

         let navbar = this.templateManager.getTemplate('navBar');

         if (navbar) {

         if (navbar) {

             this.onFrameRenderedObservable.add(this._updateProgressBar);

             this.onFrameRenderedObservable.add(this._updateProgressBar);

-            this.templateManager.eventManager.registerCallback('navBar', this._handlePointerDown, 'pointerdown');

+            this.templateManager.eventManager.registerCallback('navBar', this._handlePointerClick, 'click');

             // an example how to trigger the help button. publiclly available

             // an example how to trigger the help button. publiclly available

             this.templateManager.eventManager.registerCallback("navBar", () => {

             this.templateManager.eventManager.registerCallback("navBar", () => {

                 // do your thing

                 // do your thing

@@ -158,7 +158,7 @@ export class DefaultViewer extends AbstractViewer {
 
     private _isAnimationPaused: boolean;

     private _isAnimationPaused: boolean;

     private _resumePlay: boolean;

     private _resumePlay: boolean;

 

 

-    private _handlePointerDown = (event: EventCallback) => {

+    private _handlePointerClick = (event: EventCallback) => {

 

 

         let pointerDown = <PointerEvent>event.event;

         let pointerDown = <PointerEvent>event.event;

         if (pointerDown.button !== 0) return;

         if (pointerDown.button !== 0) return;