Picking Problems when Viewport X,Y are not 0

[JCPalmer]

Thought I had just finished Dialog extension, but there is just one more thing.  The last thing added was to align the Panel for centering or docking.  The place where the pick occurs is not actually over the "button", unless the Panel is aligned left-bottom though

 

Tester : https://googledrive.com/host/0B6-s6ZjHyEwUfjlzYXJKMC1zLXdIaV81REJhbjdfRmczQTJFOEpjWWg2SUIwZVRRS0VsR28

 

To see issue, go to the Modal Stack Menu, then click on the Top or Center buttons.  The Panel adjusts (immediately if using system camera), but pick area does not.  Then just slide the mouse to the left or right and click again.  Even though the Panel was moved it still thinks the buttons are still there.  (FYI, on Dock Panel, click in bottom right to dismiss).

 

Here is the code that adjust the camera:

/** * Adjusts camera ortho settings & viewport based on the top panel on the stack. * Called by pushPanel(), popPanel(), & window resize event registered for above */private static _adjustCameraForPanel() : void{     if (!DialogSys._dialogStack || DialogSys._dialogStack.length === 0) return;                 // work with the panel on the top of the stack     var panel = DialogSys._dialogStack[DialogSys._dialogStack.length - 1];    // assign the ortho, based on the half width & height    var halfWidth  = panel.getReqdWidth () / 2;    var halfHeight = panel.getReqdHeight() / 2;    DialogSys._camera.orthoTop    =  halfHeight;    DialogSys._camera.orthoBottom = -halfHeight;    DialogSys._camera.orthoLeft   = -halfWidth;    DialogSys._camera.orthoRight  =  halfWidth;    DialogSys._camera.getProjectionMatrix(); // required to force ortho to take effect after first setting                // keep dialog from being distorted by window size    var hScale = window.innerHeight / halfHeight;    var wScale = window.innerWidth  / halfWidth ;                var h = window.innerHeight * ((hScale > wScale) ? wScale/hScale : 1);    var w = window.innerWidth  * ((hScale < wScale) ? hScale/wScale : 1);                // derive height & width    var height = panel.maxViewportHeight * h / window.innerHeight;     var width  = panel.maxViewportWidth  * w / window.innerWidth ;                // assign x & y, based on layout of panel    var x : number;    switch(panel.horizontalAlignment){        case Panel.ALIGN_LEFT:            x = 0; break;                            case Panel.ALIGN_HCENTER:            x = (1 - width) / 2; break;                            case Panel.ALIGN_RIGHT:            x = 1 - width;    }                var y : number;    switch(panel.verticalAlignment){        case Panel.ALIGN_TOP:            y = 1 - height; break;                            case Panel.ALIGN_VCENTER:            y = (1 - height) / 2; break;                            case Panel.ALIGN_BOTTOM:            y = 0;    }    DialogSys._camera.viewport = new BABYLON.Viewport(x, y, width, height);}

Anybody have an idea?

 

Thanks,

 

Jeff

[Samuel Girardin]

Hi Jeff, 

 

I'm not sure it will solve your problem, but I had some picking problems with ortho mode. Maybe you can try to put your arcrotate camera more far from your object. For me it works. And as you are in ortho mode you don t really care of your camera position.

 

sam

[JCPalmer]

Sam,

Am using the FreeCamera for the system camera.  I positioned the camera all the way to Z: -2000, but did nothing different.  This only seems to affect anything when too close (-2), or behind.

 

Thanks anyway.

 

Jeff

[RaananW]

Hey Jeff,

 

I tried debugging the problem (it only affects the picking function when the window is smaller than the dialog).

I think the problem is in this function - https://github.com/BabylonJS/Babylon.js/blob/932165e1520265d793c4309d9fdff0ae270ba375/Babylon/babylon.scene.ts#L1951 (createPickingRay), thou i can't point the right place. I think it is the recalculation of y. But again, I am not really sure about it. Try checking the values coming back from this function and see if they correlate correctly to the position of the objects in the camera's viewport. 

I'll try debugging further, let's see what I find :-)

[JCPalmer]

The dimension you have the problem in depend on the shape of the panel.  I added a bunch of junk lines to the bottom to make it taller than it is wide, now the problem is in x.  Clicked the "right" button, cannot find anything now.

 

Will look into calling createPickingRay.

 

[JCPalmer]

Well,

Sam saying it worked for him, lead me to think I was doing something "special".  Took a while to think of it, but I had found an undocumented feature reading the Scene source code.  I thought, this sounds like something I should be doing:

DialogSys._scene.cameraToUseForPointers = DialogSys._camera;

Wrong.  I do not really know what this is, but it does not "work", whatever that is.  Works great without it.  Will leave it as comments for release.

 

This extension does not really operate correctly until 2.1.  Multiple cameras were possible, but those minor little adjustments to layermasks in 2.1 really make the approach a lot more useful.  (If this had been available when virtualJoysticks camera was written, perhaps it would have been written so that it worked on CocoonJS's canvas+, where it is most likely to be wanted).  If someone can explain or fix cameraToUseForPointers before 2.1 goes to production, I could get this back in before I release this.

 

BTW,  I updated the link above, so you can see it now works.

[surmariusz]

Hi,

I have discovered very recently that if you want to use more than one camera you should set cameraToUseForPointers. You cannot rely on activeCamera as it can be changed by engine in rendering process. This are my practical observations