16 Replies Latest reply on Nov 17, 2011 1:43 PM by kglad

    draggable images and replacing positions

    burgerjohnson96

      i have 6 images, draggable ones that replace the position of the new image you drag it to.

       

       

      actionscript:

       

       

      on (press) {

                dragsound.start();

                startDrag("_root.facebook");

                this.swapDepths(1000);                               //bring icon to the front

                facebookposOLDy = getProperty(_root.facebook, _y);   //gets position of original facebook icon

                facebookposOLDx = getProperty(_root.facebook, _x);

                ebayposy = getProperty(_root.ebay, _y);

                ebayposx = getProperty(_root.ebay, _x);

                googleplusposy = getProperty(_root.googleplus, _y);

                googleplusposx = getProperty(_root.googleplus, _x);

                twitterposy = getProperty(_root.twitter, _y);

                twitterposx = getProperty(_root.twitter, _x);

                googleposy = getProperty(_root.google, _y);

                googleposx = getProperty(_root.google, _x);

                youtubeposy = getProperty(_root.youtube, _y);

                youtubeposx = getProperty(_root.youtube, _x);

      }

      on (release) {

                dropsound.start();

                stopDrag();

                if (_root.facebook._droptarget == "/ebay") {

                          _root.facebook._x = ebayposx;

                          _root.facebook._y = ebayposy;

                          _root.ebay._x = facebookposOLDx;

                          _root.ebay._y = facebookposOLDy;

                } else if (_root.facebook._droptarget == "/googleplus") {

                          _root.facebook._x = googleplusposx;

                          _root.facebook._y = googleplusposy;

                          _root.googleplus._x = facebookposOLDx;

                          _root.googleplus._y = facebookposOLDy;

                } else if (_root.facebook._droptarget == "/twitter") {

                          _root.facebook._x = twitterposx;

                          _root.facebook._y = twitterposy;

                          _root.twitter._x = facebookposOLDx;

                          _root.twitter._y = facebookposOLDy;

                } else if (_root.facebook._droptarget == "/google") {

                          _root.facebook._x = googleposx;

                          _root.facebook._y = googleposy;

                          _root.google._x = facebookposOLDx;

                          _root.google._y = facebookposOLDy;

                } else if (_root.facebook._droptarget == "/youtube") {

                          _root.facebook._x = youtubeposx;

                          _root.facebook._y = youtubeposy;

                          _root.youtube._x = facebookposOLDx;

                          _root.youtube._y = facebookposOLDy;

                } else {

                          _root.facebook._x = facebookposOLDx;

                          _root.facebook._y = facebookposOLDy;

                }

      }

       

       

       

      i know theres probably a shorter way to go about doing it, but can somebody tell me why it works when i grab the first image and can replace any other...but when i grab a 2nd image after moving the first..i can replace any other image except the one that has been moved before.

        • 1. Re: draggable images and replacing positions
          kglad Adobe Community Professional & MVP

          use the trace() function to see your drop target.

          • 2. Re: draggable images and replacing positions
            burgerjohnson96 Level 1

            im completely new to actionscript sorry. how would i implement that in the code there?

            • 3. Re: draggable images and replacing positions
              kglad Adobe Community Professional & MVP

              remove all code from all objects.  add this code to your main timeline and test:

               

               

              var iconA:Array = [facebook,ebay,googleplus,twitter,google,youtube];

               

              for(var i:Number=0;i<iconA.length;i++){

                  iconA.onPress=function(){

                      this.swapDepths(1000);

                      this.startDrag();

                  }

                  iconA.onRelease=function(){

                      this.stopDrag();

                      for(var j:Number=0;j<iconA.length;j++){

                          if(j!=this.ivar&&this._droptarget==iconA[j]){

                              this._x=iconA[j].origX;

                              this._y=iconA[j].origY;

                              iconA[j]._x=this.origX;

                              iconA[j]._y=this.origY;

                          }

                      }

                  }

                  iconA[i].ivar=i;

                  iconA[i].origX=iconA[i]._x;

                  iconA[i].origY=iconA[i]._y;

              }

              • 4. Re: draggable images and replacing positions
                burgerjohnson96 Level 1

                nope doesnt work, wont even drag the buttons

                • 5. Re: draggable images and replacing positions
                  kglad Adobe Community Professional & MVP

                  that should be:

                   

                   

                  var iconA:Array = [facebook,ebay,googleplus,twitter,google,youtube];

                   

                  for(var i:Number=0;i<iconA.length;i++){

                      iconA[i].onPress=function(){

                          this.swapDepths(1000);

                          this.startDrag();

                      }

                      iconA[i].onRelease=function(){

                          this.stopDrag();

                          for(var j:Number=0;j<iconA.length;j++){

                              if(j!=this.ivar&&this._droptarget==iconA[j]){

                                  this._x=iconA[j].origX;

                                  this._y=iconA[j].origY;

                                  iconA[j]._x=this.origX;

                                  iconA[j]._y=this.origY;

                              }

                          }

                      }

                      iconA[i].ivar=i;

                      iconA[i].origX=iconA[i]._x;

                      iconA[i].origY=iconA[i]._y;

                  }

                  • 6. Re: draggable images and replacing positions
                    burgerjohnson96 Level 1

                    looks the same, i tried it anyway but still doesnt work. you said somethign about trace?

                    • 7. Re: draggable images and replacing positions
                      burgerjohnson96 Level 1

                      facebook.as :

                       

                      on (press) {

                                dragsound.start();

                                startDrag("_root.facebook");

                                this.swapDepths(1000);                               //bring icon to the front

                                facebookposOLDy = getProperty(_root.facebook, _y);   //gets position of original icon

                                facebookposOLDx = getProperty(_root.facebook, _x);

                                ebayposy = getProperty(_root.ebay, _y);

                                ebayposx = getProperty(_root.ebay, _x);

                                googleplusposy = getProperty(_root.googleplus, _y);

                                googleplusposx = getProperty(_root.googleplus, _x);

                                twitterposy = getProperty(_root.twitter, _y);

                                twitterposx = getProperty(_root.twitter, _x);

                                googleposy = getProperty(_root.google, _y);

                                googleposx = getProperty(_root.google, _x);

                                youtubeposy = getProperty(_root.youtube, _y);

                                youtubeposx = getProperty(_root.youtube, _x);

                      }

                      on (release) {

                                dropsound.start();

                                stopDrag();

                                if (_root.facebook._droptarget == "/ebay") {

                                          _root.facebook._x = ebayposx;

                                          _root.facebook._y = ebayposy;

                                          _root.ebay._x = facebookposOLDx;

                                          _root.ebay._y = facebookposOLDy;

                                } else if (_root.facebook._droptarget == "/googleplus") {

                                          _root.facebook._x = googleplusposx;

                                          _root.facebook._y = googleplusposy;

                                          _root.googleplus._x = facebookposOLDx;

                                          _root.googleplus._y = facebookposOLDy;

                                } else if (_root.facebook._droptarget == "/twitter") {

                                          _root.facebook._x = facebookposx;

                                          _root.facebook._y = facebookposy;

                                          _root.twitter._x = facebookposOLDx;

                                          _root.twitter._y = facebookposOLDy;

                                } else if (_root.facebook._droptarget == "/google") {

                                          _root.facebook._x = googleposx;

                                          _root.facebook._y = googleposy;

                                          _root.google._x = facebookposOLDx;

                                          _root.google._y = facebookposOLDy;

                                } else if (_root.facebook._droptarget == "/youtube") {

                                          _root.facebook._x = youtubeposx;

                                          _root.facebook._y = youtubeposy;

                                          _root.youtube._x = facebookposOLDx;

                                          _root.youtube._y = facebookposOLDy;

                                } else {

                                          _root.facebook._x = facebookposOLDx;

                                          _root.facebook._y = facebookposOLDy;

                                }

                      }

                       

                      twitter.as :

                       

                      on (press) {

                                dragsound.start();

                                startDrag("_root.twitter");

                                this.swapDepths(1000);                               //bring icon to the front

                                twitterposOLDy = getProperty(_root.twitter, _y);   //gets position of original icon

                                twitterposOLDx = getProperty(_root.twitter, _x);

                                ebayposy = getProperty(_root.ebay, _y);

                                ebayposx = getProperty(_root.ebay, _x);

                                googleplusposy = getProperty(_root.googleplus, _y);

                                googleplusposx = getProperty(_root.googleplus, _x);

                                facebookposy = getProperty(_root.facebook, _y);

                                facebookposx = getProperty(_root.facebook, _x);

                                googleposy = getProperty(_root.google, _y);

                                googleposx = getProperty(_root.google, _x);

                                youtubeposy = getProperty(_root.youtube, _y);

                                youtubeposx = getProperty(_root.youtube, _x);

                      }

                      on (release) {

                                dropsound.start();

                                stopDrag();

                                if (_root.twitter._droptarget == "/ebay") {

                                          _root.twitter._x = ebayposx;

                                          _root.twitter._y = ebayposy;

                                          _root.ebay._x = twitterposOLDx;

                                          _root.ebay._y = twitterposOLDy;

                                } else if (_root.twitter._droptarget == "/googleplus") {

                                          _root.twitter._x = googleplusposx;

                                          _root.twitter._y = googleplusposy;

                                          _root.googleplus._x = twitterposOLDx;

                                          _root.googleplus._y = twitterposOLDy;

                                } else if (_root.twitter._droptarget == "/facebook") {

                                          _root.twitter._x = facebookposx;

                                          _root.twitter._y = facebookposy;

                                          _root.facebook._x = twitterposOLDx;

                                          _root.facebook._y = twitterposOLDy;

                                } else if (_root.twitter._droptarget == "/google") {

                                          _root.twitter._x = googleposx;

                                          _root.twitter._y = googleposy;

                                          _root.google._x = twitterposOLDx;

                                          _root.google._y = twitterposOLDy;

                                } else if (_root.twitter._droptarget == "/youtube") {

                                          _root.twitter._x = youtubeposx;

                                          _root.twitter._y = youtubeposy;

                                          _root.youtube._x = twitterposOLDx;

                                          _root.youtube._y = twitterposOLDy;

                                } else {

                                          _root.twitter._x = twitterposOLDx;

                                          _root.twitter._y = twitterposOLDy;

                                }

                      }

                       

                       

                      maybe its something small im not noticing? remembering the position or something, i have no idea

                      • 8. Re: draggable images and replacing positions
                        kglad Adobe Community Professional & MVP

                        use the code i suggested with the two changes below in bold.  remove all your code.

                         

                        what's the following trace() (also in bold) show:

                         

                        var iconA:Array = [facebook,ebay,googleplus,twitter,google,youtube];

                         

                        for(var i:Number=0;i<iconA.length;i++){

                            iconA[i].onPress=function(){

                                this.swapDepths(1000);

                                this.startDrag();

                            }

                            iconA[i].onRelease=function(){

                                this.stopDrag();

                        trace(eval(this._droptarget));

                                for(var j:Number=0;j<iconA.length;j++){

                                    if(j!=this.ivar&&eval(this._droptarget)==iconA[j]){

                                        this._x=iconA[j].origX;

                                        this._y=iconA[j].origY;

                                        iconA[j]._x=this.origX;

                                        iconA[j]._y=this.origY;

                        this.origX=this._x;

                        this.origY=this._y;

                                    }

                                }

                            }

                            iconA[i].ivar=i;

                            iconA[i].origX=iconA[i]._x;

                            iconA[i].origY=iconA[i]._y;

                        }

                        1 person found this helpful
                        • 9. Re: draggable images and replacing positions
                          burgerjohnson96 Level 1

                          they get all screwy once you start moving some around, start overlapping and stuff. getting outputs saying undefined.

                          • 10. Re: draggable images and replacing positions
                            burgerjohnson96 Level 1

                            i wouldnt be able to manipulate that code after anyway cause i dont understand. in my original code do you see where the problem would be? with original locations being reset or not being able to drag onto them again once theyve been moved.

                            • 11. Re: draggable images and replacing positions
                              kglad Adobe Community Professional & MVP

                              you must be doing something wrong that's not explained in this forum.  the code i last suggested works.

                               

                              as for your code, i can't tell you what's wrong but i know the code you're showing is a mess and i know there's a lot more code than you're showing .

                               

                              you could add a trace() functions to your on(release) handlers to see what you're doing:

                               

                              on (release) {

                                        dropsound.start();

                                        stopDrag();

                              trace(_root.twitter._droptarget);

                                        if (_root.twitter._droptarget == "/ebay") {

                              1 person found this helpful
                              • 12. Re: draggable images and replacing positions
                                burgerjohnson96 Level 1

                                the code is literally what i have. heres whats on the stage: all the icons as movie clips, inside each is the respective button with the code i added above to each one. their instance names are their respective names

                                 

                                main stage:

                                facebook mc *instance facebook* > facebook button *instance facebook* (actions on this button is the code)

                                 

                                possible error it has 2 instance names the same?..i tried removing one but got the same result. do i have to change one and integrate it into the code somehow i dont know.

                                • 13. Re: draggable images and replacing positions
                                  kglad Adobe Community Professional & MVP

                                  it's problematic to attach code to objects but you might be able to solve your problems by removing all the buttons and attaching your code to the movieclips.

                                  1 person found this helpful
                                  • 14. Re: draggable images and replacing positions
                                    burgerjohnson96 Level 1

                                    i added the trace, and this is what happens. when i drag ebay ontop of googleplus it traces back /googleplus/googleplus, then when i try to drag googleplus back onto ebay it traces /ebay/ebay

                                     

                                    now if i were to drag twitter onto google, it only traces back one /google.

                                     

                                    as with your script..it works for like 2 drags, and then they start losing positions and jumble ontop of each other

                                    • 15. Re: draggable images and replacing positions
                                      burgerjohnson96 Level 1

                                      removing the code from the button worked. only thing is it loses the correct position sometimes

                                      1 person found this helpful
                                      • 16. Re: draggable images and replacing positions
                                        kglad Adobe Community Professional & MVP

                                        good.

                                         

                                        please mark helpful/correct responses, if there are any.