Problem generating clickable movieclips actionscript

  • vinid3
  • Novice
  • Novice
  • vinid3
  • Posts: 17

Post 3+ Months Ago

Hi everybody! This is my first post here, I heard this board was full of actionscript pros, so I decided to get in contact with your community, I'm not such a board-fanatic, but maybe I could become one fast :wink:

This is my actionscript problem (AS2)
The aim if this script is to load images from a xml, show them on screan, and when clicking on one of them, show the big one. I know there are a lot of ready-made scripts, but as I would like to learn AS, I try to do it myself....

Now the problem actually is the onRelease... in this example whatever the picture i clic, I always get: "clicked on image: 5" as output.. (when 5 images are loaded...)

Anybody has a clue?

I suppose there are a lot of mistakes and maybe better ways to do in this script, but as I said, I'm a newbie, so don't hesitate to tell me!

Thanks a lot!!!

Vincent (French speaking)


Code: [ Select ]
//////////////////////////
//PARAMETERS
//////////////////////////
espacement = 10;//l'espacement en px entre les images
displayinterval = 200;//interval de chargement des images en ms
xmlfile = "test.xml";//fichier xml a utiliser (peut etre variable);




//////////////////////////
//LOADING IMAGES AND LINKING
//////////////////////////
Fichier_XML = new XML();
Fichier_XML.ignoreWhite = true;
Fichier_XML.load(xmlfile);
Fichier_XML.onLoad = function(Reussite)
{
    if (Reussite)
        {
            _root.x = Fichier_XML.childNodes[0];//Is the main Node: <main>
            for(i = 0; x.childNodes[i] != undefined; i++)
            {
                var mc = createEmptyMovieClip("picture"+i, i);
                mc.createEmptyMovieClip("thumb", 0);
                loadMovie(x.childNodes[i].childNodes[2].firstChild,mc.thumb); //the node here contains an jpg URL
                mc.onRelease = function ()
                {
                    trace("clicked on image: "+i);
                }
            }
            totalpictures = i;//to know how many images have been loaded...
    }
}



//////////////////////////
//POSITIONING
//////////////////////////
this.onEnterFrame = function()
{
    nombreparrangee = 3;
    for(i=0;i<totalpictures;i++)
    {
        //colonne de 0
        colonne = Math.ceil((i+1)/nombreparrangee)-1;
                
        //ligne (0,1,2) a partir de 0
        ligne = (i-(colonne*nombreparrangee));
                
        //le saut par bloc
        saut = picture0._width+espacement;    
        
        //Application des parametres
        this["picture"+i]._x -= (this["picture"+i]._x-(espacement + (colonne*saut)))/5;
        this["picture"+i]._y -= (this["picture"+i]._y-(espacement + (ligne*saut)))/5;
    }
}
        
  1. //////////////////////////
  2. //PARAMETERS
  3. //////////////////////////
  4. espacement = 10;//l'espacement en px entre les images
  5. displayinterval = 200;//interval de chargement des images en ms
  6. xmlfile = "test.xml";//fichier xml a utiliser (peut etre variable);
  7. //////////////////////////
  8. //LOADING IMAGES AND LINKING
  9. //////////////////////////
  10. Fichier_XML = new XML();
  11. Fichier_XML.ignoreWhite = true;
  12. Fichier_XML.load(xmlfile);
  13. Fichier_XML.onLoad = function(Reussite)
  14. {
  15.     if (Reussite)
  16.         {
  17.             _root.x = Fichier_XML.childNodes[0];//Is the main Node: <main>
  18.             for(i = 0; x.childNodes[i] != undefined; i++)
  19.             {
  20.                 var mc = createEmptyMovieClip("picture"+i, i);
  21.                 mc.createEmptyMovieClip("thumb", 0);
  22.                 loadMovie(x.childNodes[i].childNodes[2].firstChild,mc.thumb); //the node here contains an jpg URL
  23.                 mc.onRelease = function ()
  24.                 {
  25.                     trace("clicked on image: "+i);
  26.                 }
  27.             }
  28.             totalpictures = i;//to know how many images have been loaded...
  29.     }
  30. }
  31. //////////////////////////
  32. //POSITIONING
  33. //////////////////////////
  34. this.onEnterFrame = function()
  35. {
  36.     nombreparrangee = 3;
  37.     for(i=0;i<totalpictures;i++)
  38.     {
  39.         //colonne de 0
  40.         colonne = Math.ceil((i+1)/nombreparrangee)-1;
  41.                 
  42.         //ligne (0,1,2) a partir de 0
  43.         ligne = (i-(colonne*nombreparrangee));
  44.                 
  45.         //le saut par bloc
  46.         saut = picture0._width+espacement;    
  47.         
  48.         //Application des parametres
  49.         this["picture"+i]._x -= (this["picture"+i]._x-(espacement + (colonne*saut)))/5;
  50.         this["picture"+i]._y -= (this["picture"+i]._y-(espacement + (ligne*saut)))/5;
  51.     }
  52. }
  53.         
  • vinid3
  • Novice
  • Novice
  • vinid3
  • Posts: 17

Post 3+ Months Ago

i Got it working!!! :D this is the answer:

Code: [ Select ]
if (Reussite)
        {
            _root.x = Fichier_XML.childNodes[0];//Is the main Node: <main>
            for(i = 0; x.childNodes[i] != undefined; i++)
            {
                
                mc = createEmptyMovieClip("picture"+i, i);
                mc.createEmptyMovieClip("thumb", 0);
                loadMovie(x.childNodes[i].childNodes[2].firstChild,mc.thumb); //the node here contains an jpg URL
                mc.indice = i;
                mc.onRelease = function()
                {
                    trace(this.indice);
                }
            }
            totalpictures = i;//to know how many images have been loaded...
    }
  1. if (Reussite)
  2.         {
  3.             _root.x = Fichier_XML.childNodes[0];//Is the main Node: <main>
  4.             for(i = 0; x.childNodes[i] != undefined; i++)
  5.             {
  6.                 
  7.                 mc = createEmptyMovieClip("picture"+i, i);
  8.                 mc.createEmptyMovieClip("thumb", 0);
  9.                 loadMovie(x.childNodes[i].childNodes[2].firstChild,mc.thumb); //the node here contains an jpg URL
  10.                 mc.indice = i;
  11.                 mc.onRelease = function()
  12.                 {
  13.                     trace(this.indice);
  14.                 }
  15.             }
  16.             totalpictures = i;//to know how many images have been loaded...
  17.     }
  • graphixboy
  • Control + Z
  • Mastermind
  • User avatar
  • Posts: 1828
  • Loc: In the Great White North

Post 3+ Months Ago

Thats what I would have recommended. Do you understand what happened?
  • vinid3
  • Novice
  • Novice
  • vinid3
  • Posts: 17

Post 3+ Months Ago

Yes, I do, At least I think, The function is only called when you clic on the movieclip, and at that moment, well, it is worth its last value, long after flash has finished with the 'for'


Am I right?

I've got another question, not that problematic, but anyway:
How could transform this, to have a picture appearing, let's say, every 200 ms ? I cant see a way to use setInterval here....

Have you got an idea?

Thanks!
  • IceCold
  • Guru
  • Guru
  • User avatar
  • Posts: 1254
  • Loc: Ro

Post 3+ Months Ago

Code: [ Select ]
// first hide all pictures:
for(var pIndex = 0; pIndex < totalpictures; pIndex++)
{
  this["picture" + pIndex]._visible = false;  
}

var pictureIndex = 0; // starting picture index
var intervalID = setInterval(ShowPicture, 200);
function ShowPicture()
{
  this["picture" + pictureIndex]._visible = true;
  pictureIndex++; // set next picture index
  if (pictureIndex >= totalpictures)
    pictureIndex = 0; // start again from 0
}
  1. // first hide all pictures:
  2. for(var pIndex = 0; pIndex < totalpictures; pIndex++)
  3. {
  4.   this["picture" + pIndex]._visible = false;  
  5. }
  6. var pictureIndex = 0; // starting picture index
  7. var intervalID = setInterval(ShowPicture, 200);
  8. function ShowPicture()
  9. {
  10.   this["picture" + pictureIndex]._visible = true;
  11.   pictureIndex++; // set next picture index
  12.   if (pictureIndex >= totalpictures)
  13.     pictureIndex = 0; // start again from 0
  14. }
  • vinid3
  • Novice
  • Novice
  • vinid3
  • Posts: 17

Post 3+ Months Ago

Cool, thanks for the code, sounds logical!
But there is still an issue with my main code, I have the feeling i cannot call my movieclipinstance...

when i put this:
_root.picture1._visible = false;
hardcoded, well, picture1 is still visible :(

although, when i put it in a onEnterFrame, then it dissapears, so I assume this must be due to the fact that this vibility command is set before de loadmovie action, and as the loadmovie action erases all movieclip properties... it appears again (I think)
  • IceCold
  • Guru
  • Guru
  • User avatar
  • Posts: 1254
  • Loc: Ro

Post 3+ Months Ago

Strange, because you don't load the image inside _root.picture1
you create a thumb and then load the image in that thumb movieclip, so only that get all it's properties reseted.

I used to load images in as2, but i forgot if the ._visible property set on the parent actually works. Anyway, the ._alpha = 0 works for sure, so you can set it in the beginning, then after all the movies are loaded you can set the _visible = false and ._alpha to 100.
You can add a fairly easy test in onEnterFrame to check when all of them are loaded.
Code: [ Select ]
function TestLoaded()
{
  var picturesLoaded = 0;
  for(var pIndex = 0; pIndex < totalpictures; pIndex++)
  {
   crtPicture = this["picture" + pIndex];
   if (crtPicture.bytestotal > 0)
   {
     if (crtPicture.bytesloaded >= crtPicture.bytestotal)
       picturesLoaded++;
   }
  }
  if (picturesLoaded == totalpictures)
   return true;
  else
   return false;
}
  1. function TestLoaded()
  2. {
  3.   var picturesLoaded = 0;
  4.   for(var pIndex = 0; pIndex < totalpictures; pIndex++)
  5.   {
  6.    crtPicture = this["picture" + pIndex];
  7.    if (crtPicture.bytestotal > 0)
  8.    {
  9.      if (crtPicture.bytesloaded >= crtPicture.bytestotal)
  10.        picturesLoaded++;
  11.    }
  12.   }
  13.   if (picturesLoaded == totalpictures)
  14.    return true;
  15.   else
  16.    return false;
  17. }

this will tell you when all the pictures have been loaded, and adding this test in onEnterFrame, after it returns true, you can start hiding the pictures and set alpha to 100
  • vinid3
  • Novice
  • Novice
  • vinid3
  • Posts: 17

Post 3+ Months Ago

Thanks for all those replies!!

Post Information

  • Total Posts in this topic: 8 posts
  • Users browsing this forum: No registered users and 7 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.