16 Replies Latest reply on Jul 19, 2011 10:07 AM by Ron Colmen

    function(file:FileReference):Void {

    Ron Colmen Level 2

      In my webpage I'm allowing the user to upload 5 different images in to 5 movieclips. Each movieclip holds a unique image. When an image is uploaded a preview is displayed on a side of the webpage. Imagin the image previews are stored like the tool bar in flash.

       

      How do I enable the user to be able to drag each preview image on to the stage area and the relavant image should appear. How can I achieve this?

       

      //load image 1 to targetMC

      RefL.onComplete = function(file:FileReference):Void {

      myFile = "Images/"+file.name;

      if(this.contents.holder_mc.targetMC._width>0){

      this.contents.holder_mc.targetMC.swapDepths(dep);

      this.contents.holder_mc.targetMC.removeMovieClip();

      this.contents.holder_mc.createEmptyMovieClip("targetMC",dep++);

      this.contents.holder_mc.targetMC._x = tl.contents.holder_mc.targetMCX;

      this.contents.holder_mc.targetMC._y = tl.contents.holder_mc.targetMCY;

      }

      this.contents.holder_mc.targetMC._alpha = 0;

      previewMCL.loadClip(myFile,this.contents.holder_mc.targetMC);

      }

        • 1. Re: function(file:FileReference):Void {
          kglad Adobe Community Professional & MVP

          assign each target movieclip a property (eg, fileName) to store file.name (or whatever's needed to reference the full-sized image), assign startDrag() to the preview target movieclip and on stopDrag(), load your full-sized image into the target movieclip if the target movieclip is in the stage area.

          1 person found this helpful
          • 2. Re: function(file:FileReference):Void {
            Ron Colmen Level 2

            Thanks Kglad.

             

            I need a way to give the user to drag and drop multiple images from a thumbnail. How can I do this? Also I need a way to be able to recoganize each draged movieclip by clicking on them.

            What I want to do is to allow the user to drag multiple images out of each image thumbnail and then give the freedom to click on a dragged image and resize it.

             

            origX = targetMC1._x;

            origY = targetMC1._y;

             

            targetMC1.onPress=function(){

            startDrag(this)

            }

            targetMC1.onRelease=function(){

            stopDrag()

            if (eval(this._droptarget) == _root.new_mc.new2_mc) {

            _root.attachMovie("square","square_new",this.getNextHighestDepth());// I don't know if this attachMovie will do what I need

                } else {

                this._x = origX;

                this._y = origY;

                }

            }

            • 3. Re: function(file:FileReference):Void {
              kglad Adobe Community Professional & MVP

              are these uploaded images that you want to be able to drag and drop and create duplicates?

              • 4. Re: function(file:FileReference):Void {
                Ron Colmen Level 2

                Yes. (Sorry for the late reply)

                • 5. Re: function(file:FileReference):Void {
                  kglad Adobe Community Professional & MVP

                  normally, you would use duplicateMovieClip() to duplicate a movieclip.  but you can't use that on the target of an image load.

                   

                  so, you'll need to use the bitmapdata class'es draw() method to duplicate your loaded image, attach the bitmap to a new movieclip and assign your drag and drop to that new movieclip.

                  • 6. Re: function(file:FileReference):Void {
                    Ron Colmen Level 2

                    Thanks Kglad.

                     

                    origX = targetMC1._x;

                    origY = targetMC1._y;

                    targetMC1.onPress=function(){

                    startDrag(this)

                    }

                     

                    targetMC1.onRelease = function() {

                    stopDrag()

                    if (eval(this._droptarget) == _root.gmb_mc) {

                    _root.gmb_mc.createEmptyMovieClip("logoz_mc", this.getNextHighestDepth());

                    var bmd:BitmapData = new BitmapData(250, 160, true); //question 1

                    var mat:Matrix=new Matrix();

                    mat.a=mat.d=1;

                    bmd.draw(_root.targetMC1,mat,null,null,null,true);

                    _root.gmb_mc.logoz_mc.attachBitmap(bmd,1,"Auto",true);

                    targetMC1._x = origX;

                    targetMC1._y = origY;

                    }

                    };

                     

                    1. How can I get the exact size of the image which was uploaded?

                    2. How make the hight of the 'logoz_mc' 100pixels after it's dragged on to the target (width to change accordingly)?

                    3. How can I enable the user to drag the same thumbnail more than once?

                    • 7. Re: function(file:FileReference):Void {
                      kglad Adobe Community Professional & MVP

                       

                      1. How can I get the exact size of the image which was uploaded?

                      after loading is complete (use the moviecliploader class'es onLoadInit), you can use the load target's width and height

                      2. How make the hight of the 'logoz_mc' 100pixels after it's dragged on to the target (width to change accordingly)?

                      var aspectRatio:Number=logoz_mc.width/logoz_mc.height;

                      logoz_mc.height=100;

                      logoz_mc.width=logoz_mc.height*aspectRatio

                      3. How can I enable the user to drag the same thumbnail more than once?

                      add drag and drop code to _root.gmb_mc.logoz_mc

                       

                      1 person found this helpful
                      • 8. Re: function(file:FileReference):Void {
                        Ron Colmen Level 2

                        var logoOnC:Number;

                        var logoA:Array = [dragLogo_mc1,dragLogo_mc2,dragLogo_mc3];

                         

                        origX = dragLogo_mc1._x;

                        origY = dragLogo_mc1._y;

                        var DraggedOnC:Array = [logoz_mc1, logoz_mc2, logoz_mc3];  //QUESTION 2

                         

                        for (k=0; k<dgLogo.length; k++) {

                        dgLogo[k].onPress=function(){

                        startDrag(this)

                        }

                        dgLogo[k].onRelease=function(){

                        stopDrag()

                        if(logoOnC < DraggedOnC.length) {

                                  logoOnC++;

                             } else {

                                  logoOnC = 0;

                             }

                        if (eval(this._droptarget) == _root.gmb_mc.gmb_mc2) {

                        _root.gmb_mc.createEmptyMovieClip(logoOnC++, this.getNextHighestDepth()); //QUESTION 1

                        var bmd:BitmapData = new BitmapData(55, 55, true);

                        var mat:Matrix=new Matrix();

                        mat.a=mat.d=1;

                        bmd.draw(this,mat,null,null,null,true);

                        _root.gmb_mc.logoz_mc.attachBitmap(bmd,1,"Auto",true);

                        this._x = origX;

                        this._y = origY ;

                            } else {

                            this._x = origX;

                            this._y = origY;

                            }

                        }

                        }

                         

                        1. How do I create movieclips in a sequence? (eg. logoz_mc1, logoz_mc2, logoz_mc3... etc)

                         

                        2. Is there a wa to create unlimited number of movieclips in a sequence?  (eg. logoz_mc1, logoz_mc2, logoz_mc3,... logoz_mc100000)

                        • 9. Re: function(file:FileReference):Void {
                          kglad Adobe Community Professional & MVP

                          :

                           

                          // initialize a variable:

                          var mcNum:Number=1;

                           


                          //whenever you want to create a movieclip logoz_mc1,...


                          createEmptyMovieClip("logoz_mc"+mcNum++,this.getNextHighestDepth());

                          • 10. Re: function(file:FileReference):Void {
                            Ron Colmen Level 2

                            Thanks Kglad.

                            How do I reffer logoz_mc"+mcNum++ when i use attachBitmap?

                             

                            _root.gmb_mc.createEmptyMovieClip("logoz_mc"+mcNum++,this.getNextHighestDepth());

                            var bmd:BitmapData = new BitmapData(55, 55, true);

                            var mat:Matrix=new Matrix();

                            mat.a=mat.d=1;

                            bmd.draw(this,mat,null,null,null,true);

                            _root.gmb_mc.logoz_mc1.attachBitmap(bmd,1,"Auto",true);

                            • 11. Re: function(file:FileReference):Void {
                              kglad Adobe Community Professional & MVP

                              the easiest is to use:

                               


                               

                               

                              var mc:MovieClip = _root.gmb_mc.createEmptyMovieClip("logoz_mc"+mcNum++,this.getNextHighestDepth());

                              var bmd:BitmapData = new BitmapData(55, 55, true);

                              var mat:Matrix=new Matrix();

                              mat.a=mat.d=1;

                              bmd.draw(this,mat,null,null,null,true);

                              mc.attachBitmap(bmd,1,"Auto",true);

                               

                              but you can also use:

                               


                               

                              _root.gmb_mc.createEmptyMovieClip("logoz_mc"+mcNum++,this.getNextHighestDepth());

                              var bmd:BitmapData = new BitmapData(55, 55, true);

                              var mat:Matrix=new Matrix();

                              mat.a=mat.d=1;

                              bmd.draw(this,mat,null,null,null,true);

                              _root.gmb_mc["logoz_mc"+(mcNum-1)].attachBitmap(bmd,1,"Auto",true);

                              • 12. Re: function(file:FileReference):Void {
                                Ron Colmen Level 2

                                That makes scence.

                                Thank you Kglad...

                                • 13. Re: function(file:FileReference):Void {
                                  Ron Colmen Level 2

                                  I want to assign the drag to the newly crated mcs. Any idea why this is not working?

                                   

                                  for (m=1; m<1000; m++) {

                                  this.onEnterFrame = function() {

                                  this.gmb_mc["logoz_mc"+m].onPress=function(){

                                  startDrag(this)

                                  }

                                  this.gmb_mc["logoz_mc"+m].onRelease=function(){

                                  stopDrag()

                                  }

                                  }

                                  }

                                  • 14. Re: function(file:FileReference):Void {
                                    Ron Colmen Level 2

                                    I got it working. But I want to be able to Drag multiple images out of one thumbnail. But it's just adding only 1 from each thumbnail. How can I make it to drag multiple images from each thumbnail and be able to assign the Drag to those individual images as well?

                                     

                                    var logoOnC:Number;

                                    var mcNum:Number=1;

                                    var dgLogo:Array = [dragLogo_mc1,dragLogo_mc2];

                                    var DraggedOnC:Array = [logoz_mc1, logoz_mc2, logoz_mc3];

                                     

                                    for (k=0; k<dgLogo.length; k++) {

                                    dgLogo[k].onPress=function(){

                                    origX = this._x;

                                    origY = this._y;

                                    startDrag(this)

                                    }

                                    dgLogo[k].onRelease=function(){

                                    stopDrag()

                                    if(logoOnC < DraggedOnC.length) {

                                    logoOnC++;

                                    } else {

                                    logoOnC = 0;

                                    }

                                    if (eval(this._droptarget) == _root.gmb_mc.gmb_mc2) {

                                    _root.gmb_mc.createEmptyMovieClip("logoz_mc"+mcNum++,this.getNextHighestDepth());

                                    var bmd:BitmapData = new BitmapData(55, 55, true);

                                    var mat:Matrix=new Matrix();

                                    mat.a=mat.d=1;

                                    bmd.draw(this,mat,null,null,null,true);

                                    _root.gmb_mc["logoz_mc"+(mcNum-1)].attachBitmap(bmd,1,"Auto",true);

                                    this._x = origX;

                                    this._y = origY ;

                                        } else {

                                        this._x = origX;

                                        this._y = origY;

                                        }

                                    }

                                    }

                                     

                                     

                                    onEnterFrame = function() {

                                    for (m=1; m<100; m++) {

                                    this.gmb_mc["logoz_mc"+m].onPress=function(){ // be abel to drag more than 1

                                    origX = this._x;

                                    origY = this._y;

                                    startDrag(this)

                                    }

                                    this.gmb_mc["logoz_mc"+m].onRelease=function(){

                                    stopDrag()

                                    //delete this.onEnterFrame;

                                    }

                                    }

                                    }

                                    • 15. Re: function(file:FileReference):Void {
                                      kglad-zqbLf4 Level 3

                                      use:

                                       


                                      var logoOnC:Number;

                                      var mcNum:Number=1;

                                      var dgLogo:Array = [dragLogo_mc1,dragLogo_mc2];

                                      var DraggedOnC:Array = [logoz_mc1, logoz_mc2, logoz_mc3];

                                       

                                      for (k=0; k<dgLogo.length; k++) {

                                      dgLogo[k].onPress=function(){

                                      origX = this._x;

                                      origY = this._y;

                                      startDrag(this)

                                      }

                                      dgLogo[k].onRelease=function(){

                                      stopDrag()

                                      if(logoOnC < DraggedOnC.length) {

                                      logoOnC++;

                                      } else {

                                      logoOnC = 0;

                                      }

                                      if (eval(this._droptarget) == _root.gmb_mc.gmb_mc2) {

                                      _root.gmb_mc.createEmptyMovieClip("logoz_mc"+mcNum++,this.getNextHighe stDepth());

                                       

                                      this.gmb_mc["logoz_mc"+(mcNum-1)].onPress=function(){ // be abel to drag more than 1

                                      origX = this._x;

                                      origY = this._y;

                                      startDrag(this)

                                      }

                                      this.gmb_mc["logoz_mc"+m].onRelease=function(){

                                      stopDrag()

                                      //delete this.onEnterFrame;

                                      }

                                       

                                      var bmd:BitmapData = new BitmapData(55, 55, true);

                                      var mat:Matrix=new Matrix();

                                      mat.a=mat.d=1;

                                      bmd.draw(this,mat,null,null,null,true);

                                      _root.gmb_mc["logoz_mc"+(mcNum-1)].attachBitmap(bmd,1,"Auto",true);

                                      this._x = origX;

                                      this._y = origY ;

                                          } else {

                                          this._x = origX;

                                          this._y = origY;

                                          }

                                      }

                                      }

                                       

                                       


                                      • 16. Re: function(file:FileReference):Void {
                                        Ron Colmen Level 2

                                        Thanks Kglad. Appriciate it. But it's not working. I staill can not get these 3 happening.

                                        1. After draging a thumbnail on the droptarget I can not move it anymore. (I should be able to move it at anytime)

                                        2. Can not drag a thumbnail more than once. (Need to drag the same thumbnail multiple times to get more than 1 copy of the same image)

                                        3. All dragged items should be a fixed size. (When a thumbnail is dragged it need them to appear 55pixels X 55pixels)

                                         

                                        var logoOnC:Number;

                                        var mcNum:Number=1;

                                        var dgLogo:Array = [dragLogo_mc1,dragLogo_mc2,dragLogo_mc3];

                                        var DraggedOnC:Array = [logoz_mc1, logoz_mc2, logoz_mc3];

                                         

                                        for (k=0; k<dgLogo.length; k++) {

                                        dgLogo[k].onPress=function(){

                                        origX = this._x;

                                        origY = this._y;

                                        startDrag(this)

                                        }

                                        dgLogo[k].onRelease=function(){

                                        stopDrag()

                                        if(logoOnC < DraggedOnC.length) {

                                        logoOnC++;

                                        } else {

                                        logoOnC = 0;

                                        }

                                        if (eval(this._droptarget) == _root.gmb_mc.gmb_mc2) {

                                        _root.gmb_mc.createEmptyMovieClip("logoz_mc"+mcNum++,this.getNextHighestDepth());

                                         

                                        this.gmb_mc["logoz_mc"+(mcNum-1)].onPress=function(){

                                        origX = this._x;

                                        origY = this._y;

                                        startDrag(this)

                                        }

                                        this.gmb_mc["logoz_mc"+(mcNum-1)].onRelease=function(){

                                        stopDrag()

                                        }

                                         

                                        var bmd:BitmapData = new BitmapData(55, 55, true); // need all draged thumbnails to be a fixed size

                                        var mat:Matrix=new Matrix();

                                        mat.a=mat.d=1;

                                        bmd.draw(this,mat,null,null,null,true);

                                        _root.gmb_mc["logoz_mc"+(mcNum-1)].attachBitmap(bmd,1,"Auto",true);

                                        this._x = origX;

                                        this._y = origY ;

                                            } else {

                                            this._x = origX;

                                            this._y = origY;

                                            }

                                        }

                                        }