Follow Mouse Plugin

Administrator

Dienstag, 17. März 2009, 09:06

Hello,

I was asked about a follow mouse control mode,
such control mode doesn't exists currently in krpano,
but it would be very easy to implement it as plugin:

add a ENTER_FRAME handler
look for the mouse coordinates
modify the hlookat_moveforce / vlookat_moveforce values accordingly

here is an example plugin source code:

AS3 plugin code:

Quellcode

package
{
  import flash.display.Sprite;
  import flash.events.Event;

  import krpano_as3_interface;


  public class followmouse extends Sprite
  {
    private var krpano : krpano_as3_interface = null;

    public function followmouse()
    {
      if (stage == null)
        this.addEventListener(Event.ADDED_TO_STAGE, startplugin);
    }

    private function startplugin(evt:Event):void
    {
      krpano = krpano_as3_interface.getInstance();

      if ( krpano.get("version") < "1.0.7" )
      {
        krpano.call("error(followmouse plugin - wrong krpano version! 1.0.7 or higher needed);");
        return;
      }

      // disable default mouse control
      krpano.set("control.mousetype", "off");

      // add frame listener
      addEventListener(Event.ENTER_FRAME, enterFrameHandler);
    }


    private function enterFrameHandler(event:Event):void
    {
      var mx:Number = stage.mouseX;
      var my:Number = stage.mouseY;
      var sx:Number = stage.stageWidth  * 0.5;
      var sy:Number = stage.stageHeight * 0.5;

      // calc motion vectors: -1.0 to +1.0
      var vx:Number = (mx - sx) / sx;
      var vy:Number = (my - sy) / sy;

      // advance it a little bit:
      // - make moving slower in the middle
      // - and faster in the outer regions
      vx = (vx < 0 ? -1.0 : +1.0) * Math.pow(Math.abs(vx), 2.0);
      vy = (vy < 0 ? -1.0 : +1.0) * Math.pow(Math.abs(vy), 2.0);

      // stop very slow moving
      if (Math.abs(vx) < 0.01)  vx = 0;
      if (Math.abs(vy) < 0.01)  vy = 0;

      // set move forces
      krpano.set("hlookat_moveforce", vx);
      krpano.set("vlookat_moveforce", vy);
    }
  }
}

here an online example with it:
Follow Mouse Plugin Example

download the plugin and source here:
followmouse_plugin.zip
followmouse_sourcecode.zip

best regards,
Klaus

Zum Seitenanfang

Job.1

Profi

Beiträge: 647

2

Dienstag, 17. März 2009, 19:27

wahou !!!
a great one

tx a lot Klaus *thumbsup*

Plugin Shop Le Chaudron iPad Interface ACM

Zum Seitenanfang

housser

Anfänger

Beiträge: 11

3

Samstag, 4. April 2009, 00:11

can't disable

Hi Klaus,

The plugin works great, and makes total sense.

One issue I'm having is disabling it... Here's my XML:

<plugin name="followmouse"
url="followmouse.swf"
enabled="false"
capture="false"
/>

The reason I'm doing this, is because I don't want to enable it until my initial animation sequence has finished. Have I typoed in my XML, or is there a problem with disabling this plugin? This is the first time I've tried disabling a plugin, next step will be for me to figure out how to re-enable it ;-)

Thanks for the help,
John

Zum Seitenanfang

klaus.krpano

Administrator

Beiträge: 13 499

4

Samstag, 4. April 2009, 01:12

Hi,

with enabled="false" only the clicking possibility of an plugin will be disabled

to enable/disable it the plugin must be extended with an option for that,

or try to remove and add it dynamically with "removeplugin() " and "addplugin() "
this could also work,

best regards,
Klaus

Zum Seitenanfang

kingtrush

Anfänger

Beiträge: 3

5

Donnerstag, 21. Mai 2009, 17:37

disenabled followmouse

Hi Klauss !
I don't why but addplugin() and removeplugin() can't disenabled the followmouse ...
can u help me ???? *confused*

Zum Seitenanfang

klaus.krpano

Administrator

Beiträge: 13 499

6

Mittwoch, 27. Mai 2009, 10:19

Hi, that's just because this plugin doesn't listen for removing, sorry

here is an updated plugin code with a remove event,
now removeplugin() will work:

AS3 plugin code:

Quellcode

package
{
    import flash.display.Sprite;
    import flash.events.Event;

    import krpano_as3_interface;


    public class followmouse extends Sprite
    {
        private var krpano : krpano_as3_interface = null;

        private var control_mousetype_backup:String = null;

        public function followmouse()
        {
            if (stage == null)
            {
                this.addEventListener(Event.ADDED_TO_STAGE, startplugin);
                this.addEventListener(Event.REMOVED_FROM_STAGE, stopplugin);
            }
        }

        private function startplugin(evt:Event):void
        {
            krpano = krpano_as3_interface.getInstance();

            if ( krpano.get("version") < "1.0.7" )
            {
                krpano.call("error(followmouse plugin - wrong krpano version! 1.0.7 or higher needed);");
                return;
            }

            // save current control mode
            control_mousetype_backup = krpano.get("control.mousetype");
            
            // disable default mouse control
            krpano.set("control.mousetype", "off");

            // add frame listener
            addEventListener(Event.ENTER_FRAME, enterFrameHandler);
        }
        
        private function stopplugin(evt:Event):void
        {
            // remove frame listener
            removeEventListener(Event.ENTER_FRAME, enterFrameHandler);
                    
            // restore old controlmode
            krpano.set("control.mousetype", control_mousetype_backup);
        }

        private function enterFrameHandler(event:Event):void
        {
            var mx:Number = stage.mouseX;
            var my:Number = stage.mouseY;
            var sx:Number = stage.stageWidth  * 0.5;
            var sy:Number = stage.stageHeight * 0.5;

            // calc motion vectors: -1.0 to +1.0
            var vx:Number = (mx - sx) / sx;
            var vy:Number = (my - sy) / sy;

            // advance it a little bit:
            // - make moving slower in the middle
            // - and faster in the outer regions
            vx = (vx < 0 ? -1.0 : +1.0) * Math.pow(Math.abs(vx), 2.0);
            vy = (vy < 0 ? -1.0 : +1.0) * Math.pow(Math.abs(vy), 2.0);
            
            // stop very slow moving
            if (Math.abs(vx) < 0.01)    vx = 0;
            if (Math.abs(vy) < 0.01)    vy = 0;

            // set move forces
            krpano.set("hlookat_moveforce", vx);
            krpano.set("vlookat_moveforce", vy);
        }
    }
}

and here an updated swf:
followmouse_v2.zip

best regards,
Klaus

Zum Seitenanfang

klaus.krpano

Administrator

Beiträge: 13 499

7

Dienstag, 9. Februar 2010, 10:31

Hi,

here another follow mouse plugin variant:

it follows the mouse only on the outer area of the pano,
and allows normal control in the center,
and as addition in this plugin the movement stops when the mouse leaves the screen/pano,

here the as3 code:

Quellcode

package
{
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.events.MouseEvent;

    import krpano_as3_interface;

    public class followmouse extends Sprite
    {
        private var krpano : krpano_as3_interface = null;

        public function followmouse()
        {
            if (stage == null)
            {
                this.addEventListener(Event.ADDED_TO_STAGE, startplugin);
                this.addEventListener(Event.REMOVED_FROM_STAGE, stopplugin);
            }
        }

        private function startplugin(evt:Event):void
        {
            krpano = krpano_as3_interface.getInstance();

            if ( krpano.get("version") < "1.0.7" )
            {
                krpano.call("error(followmouse plugin - wrong krpano version! 1.0.7 or higher needed);");
                return;
            }

            stage.addEventListener(Event.MOUSE_LEAVE,     mouse_out);
            stage.addEventListener(MouseEvent.MOUSE_MOVE, mouse_move);
        }

        private function stopplugin(evt:Event):void
        {
            stage.removeEventListener(Event.MOUSE_LEAVE,     mouse_out);
            stage.removeEventListener(MouseEvent.MOUSE_MOVE, mouse_move);
        }

        private function mouse_move (event:MouseEvent):void
        {
            var mx:Number = stage.mouseX;
            var my:Number = stage.mouseY;
            var sx:Number = stage.stageWidth  * 0.5;
            var sy:Number = stage.stageHeight * 0.5;


            // calc motion vectors: -1.0 to +1.0
            var vx:Number = (mx - sx) / sx;
            var vy:Number = (my - sy) / sy;

            if ( event.buttonDown || (vx > -0.5 && vx < 0.5 && vy > -0.5 && vy < 0.5) )
            {
                // middle area - normal control

                krpano.set("hlookat_moveforce", 0);
                krpano.set("vlookat_moveforce", 0);
            }
            else
            {
                // outer area - automatic followmouse movement

                vx = 2.0 * (vx < 0 ? -1.0 : +1.0) * (Math.max(Math.abs(vx),0.5) - 0.5);
                vy = 2.0 * (vy < 0 ? -1.0 : +1.0) * (Math.max(Math.abs(vy),0.5) - 0.5);

                // stop very slow moving
                if (Math.abs(vx) < 0.01)    vx = 0;
                if (Math.abs(vy) < 0.01)    vy = 0;

                // set move forces
                krpano.set("hlookat_moveforce", vx);
                krpano.set("vlookat_moveforce", vy);
            }
        }

        private function mouse_out(event:*):void
        {
            krpano.set("hlookat_moveforce", 0);
            krpano.set("vlookat_moveforce", 0);
        }
    }
}

and here as download: (.swf and .as)
followmouse_v3.zip

best regards,
Klaus

Zum Seitenanfang

AGRID

Anfänger

Beiträge: 11

8

Mittwoch, 24. Februar 2010, 15:52

Thanks Klaus, it's great!!!

Zum Seitenanfang

weirk

Anfänger

Beiträge: 1

9

Freitag, 23. April 2010, 22:43

hovering over a map

Klaus,

I have a map that slides out from the side on hover, and I was wondering if there was a way to disable this plug in
when the mouse is hovered over the map

thanks so much for the help

you truly are the pano king

-K

Zum Seitenanfang

maaike

Schüler

Beiträge: 143

10

Donnerstag, 13. Mai 2010, 19:09

Nice plugin! Tried it with the area-tag, but that doesn't work. Any ideas how to get that working?

Zum Seitenanfang

maaike

Schüler

Beiträge: 143

11

Mittwoch, 19. Mai 2010, 12:05

var mx:Number = stage.mouseX;
var my:Number = stage.mouseY;
var sx:Number = stage.stageWidth * 0.5;
var sy:Number = stage.stageHeight * 0.5;

Maybe 'stage' must be something else when using an area. area instead of stage? Don't think so?

Zum Seitenanfang

Tuur

Erleuchteter

Beiträge: 3 839

Wohnort: Netherlands

Beruf: Krpano custom coding / Virtual Tours / Photography / Musician / Recording engineer

12

Mittwoch, 19. Mai 2010, 14:33

maybe stupid but did you try parent="area" ?
if that's possible in the first place..

Tuur *thumbsup*

https://www.virtualtuur.com
Panimator: https://krpano.com/plugins/userplugins/panimator/#top
ToolBox: https://bit.ly/3TTnd6U
Measure in 360 photos

: https://pame.virtualtuur.com
Moving Hotspots V2: https://krpano.com/plugins/userplugins/movinghotspots/#top
Donations
https://bit.ly/3NnpynC

Zum Seitenanfang

maaike

Schüler

Beiträge: 143

13

Mittwoch, 19. Mai 2010, 15:03

parent area not found (ofzoiets). Doesn't work :(.

Zum Seitenanfang

klaus.krpano

Administrator

Beiträge: 13 499

14

Donnerstag, 20. Mai 2010, 13:22

Hi,

Zitat von »maaike«

var mx:Number = stage.mouseX;
var my:Number = stage.mouseY;
var sx:Number = stage.stageWidth * 0.5;
var sy:Number = stage.stageHeight * 0.5;

Maybe 'stage' must be something else when using an area. area instead of stage? Don't think so?

right, to get it working with area you need to use also the area size and position,

e.g.

Quellcode

var area:Object = krpano.get("area");

var mx:Number = stage.mouseX - area.pixelx;
var my:Number = stage.mouseY - area.pixely;
var sx:Number = area.pixelwidth  * 0.5;
var sy:Number = area.pixelheight * 0.5;

best regards,
Klaus

Zum Seitenanfang

maaike

Schüler

Beiträge: 143

15

Donnerstag, 20. Mai 2010, 13:35

Thank you. Does this also work with a non-fixed pixelheight/width? So with percentages?

I'll try later @ home. Thanks!

Zum Seitenanfang

klaus.krpano

Administrator

Beiträge: 13 499

16

Donnerstag, 20. Mai 2010, 13:49

Hi,

yes, the area.pixel* values are the calculated pixels values,

best regards,
Klaus

Zum Seitenanfang

Pauli Bauer

Anfänger

Beiträge: 17

17

Sonntag, 13. Juni 2010, 08:19

klaus, danke nochmals für die hilfe!
funktioniert jetzt und ich kann im panorma nur durch kopfbewegung navigieren (mittels track-ir und diodenkappe).
allerdings ist die bewegung sehr schnell.kann man die geschwinkdigkeit, trägheit etc. auf einfachen weg gut einstellen, ansonsten dreht es viel zu schnell, wenn ich nur ein bißchen denkopf bewege. stelle es mir so vor, wie beim ms-flight-simulator, da funktionioerts perfekt mit der kopfdrehung/bilddrehung (aussicht aus dem flugzeug z.b.).
danke
lg pauli

Zum Seitenanfang

Tuur

Erleuchteter

Beiträge: 3 839

Wohnort: Netherlands

Beruf: Krpano custom coding / Virtual Tours / Photography / Musician / Recording engineer

18

Sonntag, 13. Juni 2010, 11:55

He Pauli,

do you use those virtual goggles??

Which ones? i'm looking forward to use those as well..

can you provide some info??

I think you can probably change the turning with the settings with the plugin where you also can see the lookto etc ..
have a play with that..

I think it's the options plugin.. else the editor..

Cheers

Tuur *thumbsup*

https://www.virtualtuur.com
Panimator: https://krpano.com/plugins/userplugins/panimator/#top
ToolBox: https://bit.ly/3TTnd6U
Measure in 360 photos

: https://pame.virtualtuur.com
Moving Hotspots V2: https://krpano.com/plugins/userplugins/movinghotspots/#top
Donations
https://bit.ly/3NnpynC

Zum Seitenanfang

milotimbol

Fortgeschrittener

Beiträge: 242

Wohnort: Philippines

Beruf: Software Developer

19

Donnerstag, 8. Juli 2010, 02:02

Nice plugin! I'm trying to create a toggle on/off mouse follow option on my tour. However when I do this

	Quellcode
1 2 3	<action name="mouseFollowOff"> removeplugin(mousefollow); </action>

the player wont stop looking at the sky. The plugin is disabled but when I try to drag the view back to the center, it would go back looking at the sky.

Here's how i declared the plugin.