4 Replies Latest reply on Jul 15, 2006 11:09 AM by Rothrock

    Controlling movie with mouse location

      I am a designer trying to be a flash programmer and I have a navigation idea that I've been struggling with. I am simply trying to do this: put a movie on the stage and as the mouse moves closer or farther from the movie, it plays forwards and backwards. The movie I made is a circular logo with navigation buttons curling out from it like a jack knife. My idea is to have the buttons curl out as the user moves the mouse closer to the logo and curl back in as the mouse moves away.

      I understand the coding concept - calculate where the cursor is on the stage, figure out the distance of the cursor to the logo movie, and just go to certain frames in the logo movie based on that distance.

      I have the stage, the logo movie, and even the code to figure out the the mouse location. But beyond that, I need help. I just don't know enough about actionscript syntax and although conceptually this seems like a basic exercise, I really don't know where to start. If anyone is willing to help, the .fla file can be downloaded here:


      Thanks so much for any help you can offer. null
        • 1. Re: Controlling movie with mouse location
          squasha Level 1
          Someone on another forum site helped me with this. If anyone is interested, this was the code they came up with:

          var maxDistance:Number = 300;
          var mDistance:Number = Math.sqrt(Math.pow(_xmouse-this._x,2)+Math.pow(_ymouse-this._y,2));
          var whichFrame:Number = Math.round((mDistance*mcLogo.navmovie._totalframes)/maxDistance);

          Works like a charm!
          • 2. Re: Controlling movie with mouse location
            Rothrock Level 5
            A few things about this could be improved. One is that it is going to happen on every frame and you won't be able to adjust it much. There maybe times where you want it to be more or less responsive and/or times where it should take a lower priority. To that end I would look toward the idea of redoing it to use a setInterval.

            Another thing is that the Math.pow and Math.sqrt take a bit of players time. Not a problem if this is all you have going on, but it could become a drag on performance. So you could do this and it should be quicker

            var dx=_xmouse-this._x;
            var dy=_ymouse-this._y;
            var mDistance=Math.sqrt(dx*dx+dy*dy);

            Also since you aren't actually measuring the distance you could just drop the sqrt. You will still get a number that gets bigger the further away it gets – just it will get bigger by the square. So you will just have to adjust the whichFrame by a different factor.
            • 3. Re: Controlling movie with mouse location
              squasha Level 1
              2 things:

              1. I am a REAL actionscrip novice and although it looks like you are pointing me towards good stuff, I don't know how to implement the code you wrote above. I see you are giving me new math code, but I don't know how to tie it into selecting the frame of navMovie.

              2. Once I added a second scene and published the fla file, it just flipped betwen the two scenes. How do I make it loop through the first scene until one of the nave buttons is clicked? Just adding a "gotoAndPlay(1);" script into frame 1 doesn't seem to do it.

              Thanks for any help you can offer...
              • 4. Re: Controlling movie with mouse location
                Rothrock Level 5
                You would replace the one mDistance line in your original with the three I've given you. But if you weren't able to figure that bit out, you might not be able to figure out how to modify the whichFrame line either? Do you have a conceptual understanding of what your code is doing? Being able to read the code and understand what it is doing is really central to Actionscript. So here goes:

                mcLogo.onEnterframe: this is attaching some code that will repeat at the frame rate of the movie to the mcLogo instance. Even if there is a stop() on the timeline, this code will continue to repeat at the framerate set by your movie. By attaching it to mcLogo your scope will be mcLogo.

                In both version the next line (or three in my case) say find the distance between the current mouse position and this._x (for example). Since we are inside an onEnterFrame which is attache to mcLogo, so "this" refers to that time line. So this._x is saying the _x location of the mcLogo clip.

                If you remember basic geometry a right hand triangle's long side (the hypotenuse) is given by h^2 = a^2 + b^2. (The square of the hypotenuse is equal to the sum of the squares of the other two sides.) So we are figuring out how far between mcLogo and the mouse in the x and the y directions. This gives us the other two sides. So the distance between the mouse and the clip is the square root of the sum of the squares of those two sides.

                Finally since you need to adjust the distance to some scale of the number of frames you have added to your clip. So your have some code that makes the distance proportional to the number for frames in your clip.

                As for the second part of your question, "Don't use scenes!" So that makes that easy. Scenes are great tools for organizing your timelines when you are just doing some timeline-based animations. But when using Actionscript there are some bugs and limitation in scenes and you are only asking for trouble.

                So if you have this code say on frame ten with a stop(). There is no looping that needs to happen. The onEnterFrame will continue doing the animation until someone clicks.

                Add maybe ten blank frames after 10 and then on frame 20 put your new thing you want – perhaps even give it a frame label called, "home" or "about" or whatever section it is about. Then you can use:


                Also don't forget that you will want to remove the onEnterFrame event because otherwise it will keep running. So you should probably also include:

                delete mcLogo.onEnterframe;