Sie sind nicht angemeldet.

stopping rotation animation on javascript event

landon.silla

Anfänger

  • »landon.silla« ist der Autor dieses Themas

Beiträge: 17

  • Nachricht senden

1

Montag, 4. April 2011, 20:04

stopping rotation animation on javascript event

I when I load a pano, I set some slow rotation so the user can just watch it spin if they want. I also have buttons at the bottom to spin you to north, south, east and west. The problem is that while it's in it's initial rotation mode, it won't listen to these events. I need to touch/click the screen to cause an interrupt and then call my north function. Looking at the api, it appears stopall(); or breakall(); would solve this for me. So I tried this:

Quellcode

 
1
2
3

function setHeading(x,y){
		document.getElementById("krpanoSWFObject").call('stopall();lookto('+x+','+y+',get("view.fov"))');
}



Quellcode

 
1
2

//call via a button in html
<a href="#" onclick="setHeading(90,0);return false;">east</a>


Well this doesn't work? How can I made a call to my javascript function setHeading() kill the rotation animation? Btw, this is the startup action in my xml file:

Quellcode

 
1
2
3
4
5
6
7
8

	<action name="startup">
		loadscene(get(scenename), null, MERGE); 

		oninterrupt(break);'./*this allows touching to stop the spinning*/'
		lookto(180, 0, 100, smooth(45,45,5));'./*spins the camera around*/'
		lookto(359, 0, 100, smooth(45,45,5));'./*spins the camera around*/'

	</action>

klaus.krpano

Administrator

Beiträge: 13 499

  • Nachricht senden

2

Montag, 4. April 2011, 21:40

Hi,

at the moment interrupting is only possible by a mousedown (Desktop) or touchdown (iPhone/iPad) event,
interrupting by javascript call is not possible yet,

you can try something like that - sending that events manually: (not tested)

Quellcode

 
1
2
3
4
5
6
7

var krpano = document.getElementById("krpanoSWFObject");
var eventDesktop = document.createEvent("MouseEvents");
var eventMobile = document.createEvent("MouseEvents");
eventDesktop.initEvent("mousedown", true, true);
eventMobile.initEvent("touchstart", true, true);
krpano.dispatchEvent(eventDesktop); 
krpano.dispatchEvent(eventMobile);


best regards,
Klaus

landon.silla

Anfänger

  • »landon.silla« ist der Autor dieses Themas

Beiträge: 17

  • Nachricht senden

3

Montag, 4. April 2011, 23:32

Well that didn't work for me. I tried a bunch of permutations with "faking" a touch/click and used a bunch of jquery stuff. None of it worked *blink*

But I found a work around for it if anybody is interested. Here's my xml file:

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

	<action name="startup">
		<!-- load the first scene -->
		loadscene(get(scenename), null, MERGE); 

		oninterrupt(break);
		set(continuespinning,true);
		spinloop();

	</action>
	
	<action name="spinloop">
		oninterrupt(break);
		
		add(hlookattemp,get(view.hlookat),5);
		lookto(get(hlookattemp), get(view.vlookat), get(view.fov), linear(10));
		if(continuespinning,spinloop())
	</action>


Basically, i set a boolean to true, then it loops through the spin loop function adding 5 degrees to the hlookat value everytime. So, now, all I need to do is to kill that boolean and it will stop spinning. It doesn't *technically* stop spinning when it's called, it finishss it's current 5 degree animation and then stops. But those 5 degree movements take a fraction of a second anyway, so it's pretty negligable. Then the javascript stuff is really simple:

Quellcode

 
1
2
3
4
5
6
7
8
9

function play(){
	document.getElementById("krpanoSWFObject").set('continuespinning','true');
	document.getElementById("krpanoSWFObject").call('spinloop()');
	$('#playpause').html('play | <a href="#" onclick="pause();return false;">pause</a>');
}
function pause(){
	document.getElementById("krpanoSWFObject").set('continuespinning','false');
	$('#playpause').html('<a href="#" onclick="play();return false;">play</a> | pause');		
}


The two functions just set the boolean "continuespinning" and then play will call that looping function. This seems to be a pretty good way of controlling spinning/animation via javascript without having control of a "kill process" function for the animation.

viadrupsteen

Anfänger

Beiträge: 15

  • Nachricht senden

4

Mittwoch, 27. November 2013, 10:40

Great solution!

Ähnliche Themen