You are not logged in.

Dear visitor, welcome to krpano.com Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

michel

Professional

  • "michel" started this thread

Posts: 1,153

Location: ANDORRA

Occupation: TV

  • Send private message

1

Thursday, November 26th 2009, 1:21am

OnDoubleClick -- MoveTo() -- ScreenToSphere()

Hi,

This thread comes in trying to answer to a post from Richard.
I would just like it to "move to and center" on double-click - just like Google street view.

After some search in the forum it seems there is a way to do...
Look at these post from KLAUS.
Explanation of jsmouse.swf plugin
Example to download
Also, it seems that an ondoubleclick event it is not yet implemented (but planned)... see here for reference: Any way to "double-click" to zoom?

So, as Klaus explains on the post above, I have used the jsmouse.swf plugin to be able to retrieve the mouse coordinates mouse.x and mouse.y and the screentosphere() function (note: these variables seem to be already implemented in Krpano 1.0.8 beta9 but the screentosphere() function does not... so the jsmouse.swf plugin is needed ) ...
And I have made a pseudo krpanodbclick() function to simulate an ondoubleclick event ...
So a code would be:
xml file: (Edited: I forgot the jsmouse.swf plugin)

Source code

1
2
3
4
5
6
7
8
9
10
11
<krpano version="1.0.8">

<events onclick="js(krpanodbclick(movetoscreentosphere()));" />

<plugin name="jsmouse" url="jsmouse.swf" keep="true" />

<image>
    <cubestrip  url="pano.jpg" />
</image>

</krpano>


JavaScript to be added inside the html file:

Source code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<script type="text/javascript">
// <![CDATA[

function krpano() 
{
return document.getElementById("krpanoSWFObject");
}

function krpanodbclick(arg) {
setTimeout("numclick = 0",300);
numclick = numclick + 1;
if (numclick == 2) {
eval(arg);
}
}

function movetoscreentosphere(){

var mousex = krpano().get("mouse.x");
var mousey = krpano().get("mouse.y");
var hvs = krpano().get("screentosphere("+mousex +","+mousey +")");
var hva = hvs.split(",");

var ath = Number( hva[0] );
var atv = Number( hva[1] );

krpano().call("moveto("+ ath +","+ atv +")");

}

// ]]>
</script>


I have tried this and it works ;-) ...


SAlut.

This post has been edited 1 times, last edit by "michel" (Nov 26th 2009, 12:11pm)


bulp

Intermediate

Posts: 389

Location: Malaysia

  • Send private message

2

Thursday, November 26th 2009, 7:27am

tq michel.. i will try that code.... :)

michel

Professional

  • "michel" started this thread

Posts: 1,153

Location: ANDORRA

Occupation: TV

  • Send private message

3

Thursday, November 26th 2009, 12:04pm

Hi,

SORRY.... I forgot to put the jsmouse.swf plugin in the xml file example....
So, the xml would be:

Source code

1
2
3
4
5
6
7
8
9
10
11
<krpano version="1.0.8">

	<events onclick="js(krpanodbclick(movetoscreentosphere()));" />
	
	<plugin name="jsmouse" url="jsmouse.swf" keep="true" />

	<image>
    	<cubestrip  url="pano.jpg" />
	</image>
	
</krpano>


The jsmouse.swf plugin is needed on krpano 1.0.8 beta 8 and bellow... BUT NOT on krpano 1.0.8 beta 9


SAlut.

michel

Professional

  • "michel" started this thread

Posts: 1,153

Location: ANDORRA

Occupation: TV

  • Send private message

4

Thursday, November 26th 2009, 11:36pm

Move to mouse position on double click - examples

Hi,

Following, two examples online of the explained above:

SAlut

5

Tuesday, December 1st 2009, 12:46pm

Michel,

This is fantastic work :-) 'm surprised there is not more reaction to this.

I will be trying it on my next panorama next week. I notice that the beta8 version seems a bit smoother, perhaps because of the extra mouse plugin ?

Thanks for looking into this, I know many people have talked about it.

ps: Is that the view from your house ? very nice *g*

6

Wednesday, December 2nd 2009, 3:19pm

Hi Michel,

great work!
right, in 1.0.8 beta 9, there the "mouse.x" and "mouse.y" is already implemented,
so no need for an plugin there,

ps: Is that the view from your house ? very nice *g*
that's an holiday apartment in Croatia where I was making holidays some years ago
see here for "Balkon Apartment Rabac / Kroatien":
http://krpano.com/examples/multires/

best regards,
Klaus

7

Wednesday, November 10th 2010, 10:53am

Addition

I have an addition to the script provided in this thread, which is more production ready:

An action is defined as such:

Source code

1
2
3
4
5
  <action name="_onmousedown">
    js(Pano.registerClick());

    <!-- Do more magic -->
  </action>


And defined in javascript:

Source code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
// Pano is the component that we use to communicate between the actions in the .xml file and our javascript
// Pano.ui is a reference to the inner working of our plugin

Pano.registerClick = function() {
    // expose the current location of the mousepointer. This function is defined as
    // return { x: panoControl.get('mouse.x'), y: panoControl.get('mouse.y') };
    var loc = Pano.ui.getMouseFromViewer();
 
    // holder component to keep count of the clicks
    if (!Pano.clickRegister) Pano.clickRegister = { count: 0, x: 0, y: 0, fired: new Date().getTime() };

    // add 1 to the current clicks and check whether it's greater or equal to 2
    if (++Pano.clickRegister.count >= 2) {
        // The delta-x and delta-y should be within 20 pixels of the last click position, to prevent one from clicking
        // both in the left and right corner within 300 ms. and still have a doubleclick
        if (Math.abs(Pano.clickRegister.x - loc.x) < 20 && Math.abs(Pano.clickRegister.y - loc.y) < 20) {
            // the clicks should be within 300 ms.
            if (new Date().getTime() - Pano.clickRegister.fired < 300) {
                // here's the callback, do magic here
                Pano.ui.onSurfaceDoubleClick(loc.x, loc.y);
                // reset the number of clicks
                Pano.clickRegister.count = 0;
            }
        }
        else {
            // when the delta-x, delta-y is not within boundaries, set the number of clicks to 1
            Pano.clickRegister.count = 1;
        }
    }

    // set the meta-information about this last click
    Pano.clickRegister.x = loc.x;
    Pano.clickRegister.y = loc.y;
    Pano.clickRegister.fired = new Date().getTime();
}