6 Replies Latest reply on Jun 7, 2009 10:02 PM by KRKidKyle

    Run Time MovieClip eventListeners

    KRKidKyle

      I'm working on an image gallery which builds dynamically at runtime, simple enough.

       

      imageList is an array loaded with the images to display.

       

      (sorry for the mess, work in progress)

       

       

      var imageList:Array = _root.images.split(",");
      var imageArray = new Array();
      var count = 0;
      for( var i = 0; i < imageList.length; i++ ){
          _root.createEmptyMovieClip("myMC"+i, (i + 1));
          _root["tmpMCL"+i] = new MovieClipLoader();
          imageArray[i] = new Array();
          imageArray[i] = this.createEmptyMovieClip("myMC"+i, (i + 1) );
          _root["tmpMCL"+i].loadClip("imagemaker.php?src="+imageList[i], imageArray[i]);
      }


      imageArray[0]._x = 10;
      imageArray[0]._y = 10;
      for( i = 1; i < imageArray.length; i++ ) {
          imageArray[i]._x = (( i % 3 ) * 160 ) + 10;
          imageArray[i]._y = (Math.floor( i / 3 ) * 160 ) + 10;
      }

       

       

      The images load, in rows of 3, without any trouble.  However, I would like to create an onClick or onMouseUp event that will send out  a getURL('') command for each of the MovieClips, with differing urls for each obviously, for viewing the full size images.

       

      I've tried doing...

      imageArray[i].onMouseUp = function() {}

      imageArray[i].onClick = function() {}

      imageArray[i].addEventListener( MouseEvent.MOUSE_UP, function() {} )

      even a nested...

       

      imageArray[i].addEventListener( Event.ENTER_FRAME, function() { imageArray[i].onMouseUp = function () {} } )

       

      But nothing ever happens when I run the file and click on a thumbnail.

       

      Any suggestions?

        • 1. Re: Run Time MovieClip eventListeners
          kglad Adobe Community Professional & MVP

          try:

           

           

           

          var imageList:Array = _root.images.split(",");
          var imageArray = new Array();
          var count = 0;

          var dep:Number=0;

          var mcl:MovieClipLoader=new MovieClipLoader();
          for( var i = 0; i < imageList.length; i++ ){
              //_root["tmpMCL"+i] = new MovieClipLoader();  // you only need one mcl
            //  imageArray[i] = new Array();  // this doesn't look right

          var parentMC:MovieClip=this.createEmptyMovieClip("parentMC"+dep, dep++)

          var mc:MovieClip = parentMC.createEmptyMovieClip("myMC", dep++)

              imageArray.push(parentMC);

          parentMC.ivar=i;
          mcl.loadClip("imagemaker.php?src="+imageList[i], mc);

          parentMC.onRelease=function(){

          // getURL(something dependent on this.ivar);

          }

          }


          imageArray[0]._x = 10;
          imageArray[0]._y = 10;
          for( i = 1; i < imageArray.length; i++ ) {
              imageArray[i]._x = (( i % 3 ) * 160 ) + 10;
              imageArray[i]._y = (Math.floor( i / 3 ) * 160 ) + 10;
          }

           

           


          1 person found this helpful
          • 2. Re: Run Time MovieClip eventListeners
            KRKidKyle Level 1

            This made it so the clips would actually do something, though with some changes,

             

             

            var imageList:Array = _root.images.split(",");
            var imageArray = new Array();
            var count = 0;

            var dep:Number=0;

            var mcl:MovieClipLoader=new MovieClipLoader();
            for( var i = 0; i < imageList.length; i++ ){
                //_root["tmpMCL"+i] = new MovieClipLoader();  // you only need one mcl
              //  imageArray[i] = new Array();  // this doesn't look right

            var parentMC:MovieClip=this.createEmptyMovieClip("parentMC"+dep, dep++)

            var mc:MovieClip = parentMC.createEmptyMovieClip("myMC", dep++)

                imageArray.push(parentMC);

            parentMC.ivar=i;
            mcl.loadClip("imagemaker.php?src="+imageList[i], mc);

            parentMC.onRelease=function(){

            // getURL(something dependent on this.ivar);

            }

            }

             

            Yes, this made things work, with a little tweaking.  I used i instead of dep, no real reason to have two counters that I can see, having parentMC and mc on the same level ( i + 1 ) seems to work just fine.

             

            Also, using imageArray.push(parentMC) does not ensure that th parentMC.ivar assignment will be truthful, and ends up using the onRelease function for the wrong MC when I try clicking on one.  imageArray[i] = parentMC fixed the problem.

             

            I'm still not sure why mine didn't work, unless it was simply using onRelease over the other event types, along with some sloppy coding, hehe.

             

            One more thing, the images are not showing up when the page is viewed in IE, the flash file loads up fine, as I can see other, none-dynamic, elements in the flash file, but for some reason the gallery images themselves just dont show up.

             

            As you can see from my code, I filter every image through a php script (imagemaker.php) which turns every image into a thumbnail for faster viewing.  Does anyone know why the image in the gallery might now show up when viewed using Internet Explorer? ( I don't know if this problem persists with other browsers, only that it works on FireFox and not on IE )

            • 3. Re: Run Time MovieClip eventListeners
              kglad Adobe Community Professional & MVP

              the code i gave should work without any tweaking.  that said, you can change things or do things differently and that may work just as well.

               

              all the images (assuming your php file is returning the correct path/file names correctly) will load into the upper left because parentMC and mc aren't changed from their default positions.

               

              if you fail to see any images correctly, check your php file's return.

              • 4. Re: Run Time MovieClip eventListeners
                KRKidKyle Level 1

                Actually I just never posted the positioning code with the code that wasn't working, so I should probably rephrase.

                 

                In FireFox and Chrome (haven't test others) the images in the gallery load up fine, and in rows of 3 correctly spaced.  In IE the images do not load at all, however the flash file does load as I can see the other static elements of the file.  The php script I wrote works correctly as I can view it directly via an IE browser and the image displays just fine.  However, when viewing the website, the images never show up in the gallery generated by the flash file.

                 

                Recap: The flash file and php script both work independently via an IE browser, however they seem to be failing to work in conjunction with eachother on IE while working just fine on FF and Chrome.

                 

                 

                the code i gave should work without any tweaking.  that said, you can change things or do things differently and that may work just as well.


                I'm not sure why it works for you and not for me, but using the push() function caused the onRelease function to mix up the intended mc

                 

                like I said though, I fixed it with a simple direct key assignment

                • 5. Re: Run Time MovieClip eventListeners
                  kglad Adobe Community Professional & MVP

                  show the code you're using.

                   

                  and after that create a textfield that displays the php return so you can confirm those paths/names are correct.  ie, the path MUST be relative to your html file that embeds the main swf.

                  • 6. Re: Run Time MovieClip eventListeners
                    KRKidKyle Level 1

                    I'm sorry but I think you don't understand what I'm doing.

                     

                    If you review my AS code...


                    var imageArray = new Array();
                    var count = 0;
                    var mcl:MovieClipLoader = new MovieClipLoader()
                    for( var i = 0; i < imageList.length; i++ ){
                        var parentMC:MovieClip = this.createEmptyMovieClip("parentMC"+i, i+1)
                        var mc:MovieClip = parentMC.createEmptyMovieClip("myMC", i+1)
                        imageArray[i] = parentMC;
                        parentMC.ivar = i;
                        mcl.loadClip("imagemaker.php?src="+imageList[i], mc);
                        parentMC.onRelease = function(){

                             //do it
                        }
                    }

                     

                    The php script does not return a filepath, it IS the image, there is no path or value to return except the image itself, which displays just fine in FireFox and Chrome, and even in IE if typed directly in the address bar, as would any normal image file.

                     

                    If it helps then here is the script... http://www.kimscartoons.com/?p=portfolio

                    As you can see, it works if you use FireFox or Chrome (possibly others), but not IE, nothing shows except the navigation arrows.

                     

                    That is the only relevant code there is, if it boggles you, that's fine, it does me.

                     

                    Just to satisfy curiosity, here is the positioning code bit...


                    imageArray[0]._x = 15;
                    imageArray[0]._y = 20;
                    for( i = 1; i < imageArray.length; i++ ) {
                        imageArray[i]._x = (( i % 3 ) * 160 ) + 15;
                        imageArray[i]._y = (Math.floor( i / 3 ) * 190 ) + 20;
                    }