17 Replies Latest reply on Sep 30, 2008 7:19 PM by Rothrock

    getNextHighestDepth insanity

    Mister Peanut Level 1
      Hello,

      Some months ago, I started a project involving clicking on a card, and having in flip over. I've finally solved the animation end of this project, but I have been stuck quite some time on putting multiple cards into a deck, pressing on the top card, having it flip to the side, and clicking on the next card, and so on.... I want each card to go to the top of the deck when pressed, and flip over. Here is a link to my file; please look at it as there are some nested animations that are absolutely necessary for the animation to look realistic:

      Card Flip

      Each card is a movie clip contained within a movie clip. I use the following code to flip the card back and forth:

      filingCabinet.flipFilingCabinet.onRelease=function(){
      filingCabinet.gotoAndPlay(2);
      filingCabinet.flipFilingCabinet.gotoAndPlay(2);
      filingCabinet.getNextHighestDepth();

      }

      The problem I'm having is that the cards seem to go in any order when flipping them back and forth, whereas I need the card that is clicked on to be on top of the deck always. Not sure why my code does not work. Any help, is really, really appreciated. I have had others look at the code who know javascript, but this is a different ballgame, and my skills are not enough to figure out why this isn't a simple matter to solve. As I said, my skills are not so good, so an example with y code would help me out best in understanding why this doesn't work. Chances are, if you just tell me something like "use x method" I will have no idea how to implement it. Extra explanation is greatly appreciated as I have been trying to figure this out for weeks...

      Cheers in advance

      P
        • 2. Re: getNextHighestDepth insanity
          Rothrock Level 5
          You haven't shown any code that changes the order of stacking. Look at the help files for getNextHighestDepth(). It returns a number. In other words it tells you where the highest free depth is, but it doesn't put anything there.

          What you might want is:

          filingCabinet.swapDepths(filingCabinet.getNextHighestDepth());

          But I don't know. filingCabinet seems like a strange name for a deck of cards. And in my mind I would want to swap each card to the top. But depending upon what you've done....
          • 3. Re: getNextHighestDepth insanity
            Mister Peanut Level 1
            Hello Rothrock,

            Thank you for responding, this has been a very frustrating ordeal for me. I have actually tried using the exact code you suggested. But it's not a swap that I want, at least I don't think it is; I don't need an exchange of two cards, I need the clicked card to go to the top. The names of the cards relate exactly to what is pictured on the card. Filing cabinet (there is a filing cabinet pictured on the card. It is a promotional piece for a company I work for.) is one single card placed on the stage and given that instance name. I have about 15 cards in total, each with a unique name. You would actually have to look at my attached fla to understand what I am trying to accomplish here. It is a file I cannot explain that easily in words. If you have time, please take a look at my fla, and you may be able to see how and why I set it up the way I did. Any help is greatly appreciated.

            Cheers,

            P
            • 4. Re: getNextHighestDepth insanity
              Rothrock Level 5
              I'm sorry, but I don't download files from the forum.

              Well the code you put in your first one will do nothing because it doesn't adjust the depths, it simply reports the next highest free one.

              There is no other way in actionscript to change the stacking order of things: swapDepths is the ONLY way! So it doesn't matter if you want to "swap" or not that is what you've got.

              if you do something like movieclip1.swapDepths(movieclip2) that will exchange them -- hence the name.

              But if you do something like movieclip1.swapDepths(5000) that will take movieclip 1 and put it at a depth of 5000 -- whether that is higher or lower in the stacking order depends upon where movieclip1 was before the command. If there was already an instance at 5000 then it would be swapped to wherever movieclip1 started.

              When you use getNextHighestDepth you make sure that the value of that number in the second example is free of previously existing clips.

              However I think I just realized what you might need.

              flipFilingCabinet.swapDepths(filingCabinet.getNextHighestDepth());

              I think you might want flipFilingCabinet, which presumably is a clip inside filingCabinet along with several other clips to come to the top of all the clips inside of filingCabinet. So for that reason you check the next highest inside filingCabinet, but you swap flip. Is that it?

              Otherwise you will have to find some way to explain it. Usually it is the quest to explain the problem to others that helps to make it clear to the one with the question.
              • 5. Re: getNextHighestDepth insanity
                Mister Peanut Level 1
                Hello Rothrock,

                Check out this link to view 1 card flipping:

                http://www.keyframer.com/forum/viewtopic.php?t=1620

                Thanks for your support. I hope I can explain a bit better, so here goes:

                The code I have attached shows three cards on the stage. Within each card (I'll use mailbox as an example) there are 2 animations going on: the flipMailbox contains another movie clip animation that is frame-by-frame of a card turning over in perspective. If you press flipMailbox, the card goes through the frame-by frame 7 frames until it is on its back. Clicking it again makes it go through the next 7 frames to flip it back over to the front. the flipMailbox mc, which acts as a container for frame-by-frame mc also has an animation. flipMailbox mc moves the card to the left and zooms in a bit as the card is at the top of the flip to give more perspective.

                To sum up the animation: flipMailbox contains a frame-by frame mc that stops at frame 7 on the first click, and at frame 14 on the second click. flip Mailbox is also animated to go left on the first click, and back to the right on the second. All of this is neatly packaged into a movie clip called mailbox.

                So what I need to do is whenever I click on mailbox, I need it to pop to the highest depth and stay there. The next card to be clicked has to go ABOVE the depth that the last card was placed on, and so on....

                As it is, the cards all stay on their depth once clicked, and when you flip some of them, they flip behind the previous card. This is my frustration. I've no idea how to solve this one....

                Thanks for listening.

                • 6. Re: getNextHighestDepth insanity
                  Rothrock Level 5
                  So filingCabinet, mailbox, and crayons are the ones that need to come to the top when clicked? They all share the same parent? Then it would be:

                  crayons.swapDepths(whevertheParentOfCrayonsIs.getNextHighestDepth());

                  Off the top of my head I'm not quite cliear on how to be sure that getNextHighestDepth is referencing the parent of those things. I'm really bad with scope in my head and always have to check it.

                  There is no way to swap the depths of a child clip to something higher than the parent. Imagined the stacking order like floors of a building (each floor is a parent object on the _root timeline) and contents inside each floor like children of those clips. You can even imagine children inside the children on the various floors.

                  In other words if filingCabinet is on the third floor and mailbox is on the second floor, then the highest thing in mailbox will be below the lowest thing in filingCabinet. But if you switch the whole floors the situation will be reversed.

                  One last thing is that I never used getNextHighestDepth(). It has problems if you are using the prebuilt components. Also it makes all kinds of trouble with the scoping. As you are find out.

                  In the end it just returns a number of the next highest free depth, but there is no reason that if you have stuff stack up to 537 that the next thing needs to go to 538! I prefer to handle depth swapping myself. In a cas like this I pick an arbitray high number say 50000 or 100000 and just swap them to that depth. You can combine that with a counter and just increment it each time you swap. If you used 100,000 then you only have about 948,575 times they can do it before you would get in trouble.

                  For more than you ever wanted to know about depths in Flash:

                  http://www.kirupa.com/developer/actionscript/depths.htm

                  Of course this is all different in the AS3 display list.

                  By the way, the flipping looks amazing!
                  • 7. Re: getNextHighestDepth insanity
                    Mister Peanut Level 1
                    From what you are describing, I need to swap "floors", no children and parent swapping involved here. I have not dynamically placed anything on the stage, either. I have physically placed each card on the stage, on the same frame. Maybe that's where I've gone wrong.... But there is some sort of swapping going on when I click on the cards, but the swapping goes all awry when you go through more than 2 cards, flipping back and forth.

                    Actually, what you said about starting at, say, 537, finding the next depth, and whatever card I click on next will go to 538 is EXACTLY what I need to do.... but... would I need to place each card on the stage dynamically, ie, load all of the cards into another movie clip? If so, can you assist me in this? Really, I did try to load all of the cards into an empty movie clip before, but nothing came of it. This is more than likely due to my lack of AS skills. I'm in above my head on this.

                    I will check out the kirupa link. Thanks.

                    I'm glad you like the effect: I'm pretty happy with it myself!!

                    P
                    • 8. Re: getNextHighestDepth insanity
                      Rothrock Level 5
                      When you physically place things on a timeline they all have depths. The depths for stage placed things start at a very low negative number and build from there. That is why there is a limit of 16,000 or so stage placed things. I think that is the number. Read the link above, especially the second page.

                      There are a few things to watch out for when you are doing timeline placed object depth swapping vs. dynamically placed depth swapping. Again the kirupa link explains it well.

                      You might want to get rid of your cards for a moment and just make a simple example for the purpose of learning how to swap depths.

                      Start with a brand new flash doc. Make three clips that are just simple rectangles. Make one red, one green, and one blue. Stack them on the main timeline in whatever order you want and give them instance names of red, green, and blue. Finally add the code:

                      red.onPress=blue.onPress=green.onPress=bringToTop
                      var count:Number=50000;

                      function bringToTop(){
                      this.swapDepths(count++);
                      }

                      That is all that is needed to bring one of three (or by extension many) to the front when you click it. Play with that a bit and see if it helps.

                      Also if you could post a link to one you have working as best you can that would help me see what is going on when you say, "the swapping goes all awry when you go through more than 2 cards."
                      • 9. Re: getNextHighestDepth insanity
                        Mister Peanut Level 1

                        Rothrock,

                        Please check out this link again. I have updated the card flip:

                        http://keyframer.com/forum/viewtopic.php?t=1620

                        This is the code I have.

                        I can get one thing working at a time: 1 the flip, or 2, the swap, but not both.

                        I've yet to delve into the Kirupa site, but I intend to do so shortly. I think the code is almost there, I just can't seem to make the movies withing movies play at the same time as putting the mc at the next highest position...

                        Cheers for your continued support,

                        P
                        • 10. Re: getNextHighestDepth insanity
                          Rothrock Level 5
                          Well inside the onRelease function you need to have parenthesis to call the function.

                          bringToTop();

                          And I think it might not be the right scope. I think you need to swap filingCabinet, not the flipFilingCabinet. So you'll need to check the scope to make sure. To check for that, add a line inside the bringToTop function

                          trace("Current scope is: "+this);

                          You want it to say filingCabinet, not flipFilingCabinet. So if it does change the line to:

                          trace("Current scope is: "+this._parent);

                          And if that is right, then put that in front of the swapDepths as well. Again this isn't the prettiest way to do this, but it should get it done.

                          Also here is an a design/structure thing that could make your work easier. Instead of naming each one flipFilingCabinet, and flipMailbox, etc. Instead you can just name the one inside each one theFlip or something. That way they all have the same name. Having each one inside a parent with a different name makes it unique. So in that case you could use the same function for all of them.
                          • 11. Re: getNextHighestDepth insanity
                            Rothrock Level 5
                            Well inside the onRelease function you need to have parenthesis to call the function.

                            bringToTop();

                            And I think it might not be the right scope. I think you need to swap filingCabinet, not the flipFilingCabinet. So you'll need to check the scope to make sure. To check for that, add a line inside the bringToTop function

                            trace("Current scope is: "+this);

                            You want it to say filingCabinet, not flipFilingCabinet. So if it does change the line to:

                            trace("Current scope is: "+this._parent);

                            And if that is right, then put that in front of the swapDepths as well. Again this isn't the prettiest way to do this, but it should get it done.

                            Also here is an a design/structure thing that could make your work easier. Instead of naming each one flipFilingCabinet, and flipMailbox, etc. Instead you can just name the one inside each one theFlip or something. That way they all have the same name. Having each one inside a parent with a different name makes it unique. So in that case you could use the same function for all of them.
                            • 12. Re: getNextHighestDepth insanity
                              Rothrock Level 5
                              I just realized this morning that I should ask you why you are attaching the release handlers to the child clip anyways? It would be easier to do if you attach the handler to the parent.

                              filingCabinet.onRelease=handleClick;
                              mailbox.onRelease=handleClick;
                              crayon.onRelease=handleClick;

                              var count:Number=5000;

                              function handleClick(){
                              this.swapDepths(count++);
                              this.gotoAndPlay(2)
                              this.theFlip.gotoAndPlay(2)
                              }

                              That should handle it. (If you took my advice and renamed the clips inside.)
                              • 13. Re: getNextHighestDepth insanity
                                Mister Peanut Level 1
                                Hi Rothrock,

                                I have been trying many variations of the code you have given me. I got the depths to switch with what you suggested, but only a partial part of the flip played. Working on it for some time, the attached code has gotten me closer than ever :it will flip once through the deck, swapping depths nicely, but when you flip the cards back, they keep their current position and stay there.

                                Please look at this link again to see (you may need to refresh):

                                flipping card

                                So, I think it's almost there, but as I said, my actionscript is weak. It's more helpful to me to type out everything repeatedly so I understand it better. Thanks for your continued support on this,

                                P
                                • 14. Re: getNextHighestDepth insanity
                                  Rothrock Level 5
                                  Okay. If typing the extra bits help you that is fine. But I often find that it also obscures what is going on and makes things more complex than they need to be. I'm not sure what is going on here. Since flipCrayons is where you have attached the onRelease and then you send flipCrayons to play from frame two, do you have similar code for the flipping back?

                                  I'm still wondering why you are attaching the event handlers to the flipCrayons inside of crayons?

                                  I don't think you want to trace count -- at least not with that trace statement. Scope is the timeline that the current code thinks is this. So in those replace count with this.

                                  But let's add another function to help see what is going on.

                                  function traceDepths(clip){
                                  trace("Just swapped: "+clip);
                                  trace("filingCabinet is at: "+filingCabinet.getDepth());
                                  trace("mailbox is at: "+mailbox.getDepth());
                                  trace("crayons is at: "+crayons.getDepth()+newline);
                                  }

                                  Then whenever you swap a specific clip you would add:

                                  traceDepths(crayons);

                                  Put whichever clip you are swapping inside those quotes. That should help you find out what depths things are at. If the clip that was swapped doesn't have the highest number then we need to figure out why!
                                  • 15. Re: getNextHighestDepth insanity
                                    Rothrock Level 5
                                    It is almost like the code that is setting your count variable is getting executed again and resetting to 50000. With all your gotoAndPlay() are you moving that timeline so that the variable is getting reset?
                                    • 16. Re: getNextHighestDepth insanity
                                      Mister Peanut Level 1
                                      This may confuse things far more.... but here is my code placed on frames 1, 18, and 38 the timeline of flipCrayons:

                                      FRAME 1

                                      stop();

                                      flipCrayons.onRelease=function(){
                                      gotoAndPlay(2);
                                      flipCrayons.gotoAndPlay(2);

                                      }


                                      FRAME 18
                                      stop();

                                      flipCrayons.onRelease=function(){
                                      gotoAndPlay(20);
                                      flipCrayons.gotoAndPlay(16);

                                      }


                                      FRAME 38
                                      stop();

                                      flipCrayons.onRelease=function(){
                                      gotoAndPlay(2);
                                      flipCrayons.gotoAndPlay(2);

                                      }

                                      There is similar code for the rest of the cards. I don't know why I reference crayons.flipCrayons on the main timeline, it just works that way. Anything else, doesn't play both animations in conjunction. Really, I just need the gotoAndPlays to work how they are set up, and switch the whole movie clips altogether. Maybe placing them in another movie clip? I really don't know. And I don't know why this can get so confusing! sigh. I really appreciate your perseverance.

                                      This is the message I get from adding your trace:

                                      Current scope is: 50001
                                      Just swapped: _level0.filingCabinet
                                      filingCabinet is at: 50000
                                      mailbox is at: -16382
                                      crayons is at: -16376

                                      Just swapped: _level0.filingCabinet
                                      filingCabinet is at: 50000
                                      mailbox is at: -16382
                                      crayons is at: -16376
                                      • 17. Re: getNextHighestDepth insanity
                                        Rothrock Level 5
                                        Well if you code in different places they will all need to have some kind of swapping or else you won't get things on the top when they flip back. This is also why it is good to do the code more like I was advocating. Instead of having to change code in 9 places you could only need to change it in 1! :)

                                        And what happens if you swap the filing cabinet and then the crayons? What kind of traces are you getting there? Also you haven't changed the code for the Current scope trace.

                                        Be sure that the line that sets the count to its starting value isn't ever executed again. Otherwise it won't work. You could do something like this:

                                        if(count==undefined){
                                        trace("Defining the count.");
                                        var count:Number=50000;
                                        }

                                        If you see that trace more than once we'll need to work that out.