XML Gallery

  • routhu
  • Beginner
  • Beginner
  • User avatar
  • Posts: 47
  • Loc: India

Post 3+ Months Ago

Hi all,

I already have thumbnail xml falsh gallery, It's working fine. But I need to add thumb title bellow of each thumbnail image. How can I achieve this task.

Can any one please help.

here is the code which I am using.

Code: [ Select ]
function loadXML(loaded) {
    if (loaded) {
        xmlNode = this.firstChild;
        thumbnails = [];
        titname = [];
         link = [];
        total = xmlNode.childNodes.length;
        for (i=0; i<total; i++) {
            thumbnails[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
            titname[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
            link[i] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
            thumbnails_fn(i);
            trace(titname[i]);
            trace(link[i]);
        }
        firstImage();
    } else {
        content = "file not loaded!";
    }
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("images.xml");
/////////////////////////////////////
listen = new Object();
listen.onKeyDown = function() {
    if (Key.getCode() == Key.LEFT) {
        prevImage();
    } else if (Key.getCode() == Key.RIGHT) {
        nextImage();
    }
};
Key.addListener(listen);
previous_btn.onRelease = function() {
    prevImage();
};
next_btn.onRelease = function() {
    nextImage();
};

/////////////////////////////////////
p = 0;
function thumbNailScroller() {
    // thumbnail code!
    this.createEmptyMovieClip("tscroller", 1000);
    scroll_speed = 8;
    tscroller.onEnterFrame = function() {
        if ((_root._ymouse>=thumbnail_mc._y) && (_root._ymouse<=thumbnail_mc._y+thumbnail_mc._height)) {
            if ((_root._xmouse>=(hit_right._x-350)) && (thumbnail_mc.hitTest(hit_right))) {
                thumbnail_mc._x -= scroll_speed;
            } else if ((_root._xmouse<=(hit_left._x+350)) && (thumbnail_mc.hitTest(hit_left))) {
                thumbnail_mc._x += scroll_speed;
            }
        } else {
            delete tscroller.onEnterFrame;
        }
    };
}
function thumbnails_fn(k) {
    thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
    tlistener = new Object();
    tlistener.onLoadInit = function(target_mc) {
        target_mc._x = hit_left._x+(target_mc._width+10)*k;
        target_mc.pictureValue = k;
        trace(target_mc.pictureValue);
        target_mc.onRelease = function() {
            p = this.pictureValue;
            nextImage();
            tit_name.text = titname[p];
          getURL(link[p], "_self");
            trace(link[p]);
};
        target_mc.onRollOver = function() {
            this._alpha = 80;
            thumbNailScroller();
        };
        target_mc.onRollOut = function() {
            this._alpha = 100;
        };
    };
    image_mcl = new MovieClipLoader();
    image_mcl.addListener(tlistener);
    image_mcl.loadClip(thumbnails[k], "thumbnail_mc.t"+k);
}
  1. function loadXML(loaded) {
  2.     if (loaded) {
  3.         xmlNode = this.firstChild;
  4.         thumbnails = [];
  5.         titname = [];
  6.          link = [];
  7.         total = xmlNode.childNodes.length;
  8.         for (i=0; i<total; i++) {
  9.             thumbnails[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
  10.             titname[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
  11.             link[i] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
  12.             thumbnails_fn(i);
  13.             trace(titname[i]);
  14.             trace(link[i]);
  15.         }
  16.         firstImage();
  17.     } else {
  18.         content = "file not loaded!";
  19.     }
  20. }
  21. xmlData = new XML();
  22. xmlData.ignoreWhite = true;
  23. xmlData.onLoad = loadXML;
  24. xmlData.load("images.xml");
  25. /////////////////////////////////////
  26. listen = new Object();
  27. listen.onKeyDown = function() {
  28.     if (Key.getCode() == Key.LEFT) {
  29.         prevImage();
  30.     } else if (Key.getCode() == Key.RIGHT) {
  31.         nextImage();
  32.     }
  33. };
  34. Key.addListener(listen);
  35. previous_btn.onRelease = function() {
  36.     prevImage();
  37. };
  38. next_btn.onRelease = function() {
  39.     nextImage();
  40. };
  41. /////////////////////////////////////
  42. p = 0;
  43. function thumbNailScroller() {
  44.     // thumbnail code!
  45.     this.createEmptyMovieClip("tscroller", 1000);
  46.     scroll_speed = 8;
  47.     tscroller.onEnterFrame = function() {
  48.         if ((_root._ymouse>=thumbnail_mc._y) && (_root._ymouse<=thumbnail_mc._y+thumbnail_mc._height)) {
  49.             if ((_root._xmouse>=(hit_right._x-350)) && (thumbnail_mc.hitTest(hit_right))) {
  50.                 thumbnail_mc._x -= scroll_speed;
  51.             } else if ((_root._xmouse<=(hit_left._x+350)) && (thumbnail_mc.hitTest(hit_left))) {
  52.                 thumbnail_mc._x += scroll_speed;
  53.             }
  54.         } else {
  55.             delete tscroller.onEnterFrame;
  56.         }
  57.     };
  58. }
  59. function thumbnails_fn(k) {
  60.     thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
  61.     tlistener = new Object();
  62.     tlistener.onLoadInit = function(target_mc) {
  63.         target_mc._x = hit_left._x+(target_mc._width+10)*k;
  64.         target_mc.pictureValue = k;
  65.         trace(target_mc.pictureValue);
  66.         target_mc.onRelease = function() {
  67.             p = this.pictureValue;
  68.             nextImage();
  69.             tit_name.text = titname[p];
  70.           getURL(link[p], "_self");
  71.             trace(link[p]);
  72. };
  73.         target_mc.onRollOver = function() {
  74.             this._alpha = 80;
  75.             thumbNailScroller();
  76.         };
  77.         target_mc.onRollOut = function() {
  78.             this._alpha = 100;
  79.         };
  80.     };
  81.     image_mcl = new MovieClipLoader();
  82.     image_mcl.addListener(tlistener);
  83.     image_mcl.loadClip(thumbnails[k], "thumbnail_mc.t"+k);
  84. }
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • routhu
  • Beginner
  • Beginner
  • User avatar
  • Posts: 47
  • Loc: India

Post 3+ Months Ago

Any One Please?
  • joebert
  • Fart Bubbles
  • Genius
  • User avatar
  • Posts: 13502
  • Loc: Florida

Post 3+ Months Ago

It's a pain to read through.
Rather than assigning properties to MovieClips, this little exerpt is used.
Code: [ Select ]
     thumbnails[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;

     titname[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;

     link[i] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
  1.      thumbnails[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
  2.      titname[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
  3.      link[i] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;


Here's a quick hack to demonstrate one way the title could be displayed.

1) Find the following line.
Code: [ Select ]
thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());


After that line add
Code: [ Select ]
// Just stash it on the MovieClip untill the content is loaded, so we know where it's going
thumbnail_mc["t"+k].title = titname[k];
  1. // Just stash it on the MovieClip untill the content is loaded, so we know where it's going
  2. thumbnail_mc["t"+k].title = titname[k];


2) Find the following line.
Code: [ Select ]
tlistener.onLoadInit = function(target_mc) {


After that line add
Code: [ Select ]
// Attach a text-field for the title
target_mc.createTextField("_title", target_mc.getNextHighestDepth(), 0, target_mc._height-20, target_mc._width, 20);
target_mc["_title"].background = true;
target_mc["_title"].text = target_mc.title;
  1. // Attach a text-field for the title
  2. target_mc.createTextField("_title", target_mc.getNextHighestDepth(), 0, target_mc._height-20, target_mc._width, 20);
  3. target_mc["_title"].background = true;
  4. target_mc["_title"].text = target_mc.title;


That should add a white backgrounded box with the title found in the XML to the bottom of the thumbnails, but I'm just going by what I see in the code & it might not work at all.
  • routhu
  • Beginner
  • Beginner
  • User avatar
  • Posts: 47
  • Loc: India

Post 3+ Months Ago

Hi joebert,

Thanks for ur repley . But i am not able to get the text at the bottom of the Image.

I am not able to solve that one from the last two days.

Can you please have a look in to my code.

I have implemented whatever u told , But not able to get .....

Can you check once. Here is the Code.

My Text Field Name is "desc_txt"

Code: [ Select ]
function loadXML(loaded) {
    if (loaded) {
        xmlNode = this.firstChild;
        thumbnails = [];
        titname = [];
         link = [];
        total = xmlNode.childNodes.length;
        for (i=0; i<total; i++) {
            thumbnails[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
            titname[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
            link[i] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
            thumbnails_fn(i);
            //trace(link[i]);
        }
        firstImage();
    } else {
        content = "file not loaded!";
    }
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("images.xml");
/////////////////////////////////////
listen = new Object();
listen.onKeyDown = function() {
    if (Key.getCode() == Key.LEFT) {
        prevImage();
    } else if (Key.getCode() == Key.RIGHT) {
        nextImage();
    }
};
Key.addListener(listen);
previous_btn.onRelease = function() {
    prevImage();
};
next_btn.onRelease = function() {
    nextImage();
};

/////////////////////////////////////
p = 0;
function thumbNailScroller() {
    // thumbnail code!
    this.createEmptyMovieClip("tscroller", 1000);
    scroll_speed = 8;
    tscroller.onEnterFrame = function() {
        if ((_root._ymouse>=thumbnail_mc._y) && (_root._ymouse<=thumbnail_mc._y+thumbnail_mc._height)) {
            if ((_root._xmouse>=(hit_right._x-350)) && (thumbnail_mc.hitTest(hit_right))) {
                thumbnail_mc._x -= scroll_speed;
            } else if ((_root._xmouse<=(hit_left._x+350)) && (thumbnail_mc.hitTest(hit_left))) {
                thumbnail_mc._x += scroll_speed;
            }
        } else {
            delete tscroller.onEnterFrame;
        }
    };
}
function thumbnails_fn(k) {
    thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
    thumbnail_mc["t"+k].title = titname[k];
    tlistener = new Object();
    tlistener.onLoadInit = function(target_mc) {
// Attach a text-field for the title

target_mc.createTextField("desc_txt", target_mc.getNextHighestDepth(), 0, target_mc._height-20, target_mc._width, 20);

target_mc["desc_txt"].background = true;

target_mc["desc_txt"].text = titname[k];

trace(titname[k]);


        target_mc._x = hit_left._x+(target_mc._width+10)*k;
        target_mc.pictureValue = k;
        //trace(target_mc.pictureValue);
        title_mc.desc_txt.text = description[k];
            //trace(description[p]);
        target_mc.onRelease = function() {
            p = this.pictureValue;
            nextImage();
          getURL(link[p], "_self");
            

};
        target_mc.onRollOver = function() {
            this._alpha = 80;
            thumbNailScroller();
        };
        target_mc.onRollOut = function() {
            this._alpha = 100;
        };
    };
    image_mcl = new MovieClipLoader();
    image_mcl.addListener(tlistener);
    image_mcl.loadClip(thumbnails[k], "thumbnail_mc.t"+k);
}
  1. function loadXML(loaded) {
  2.     if (loaded) {
  3.         xmlNode = this.firstChild;
  4.         thumbnails = [];
  5.         titname = [];
  6.          link = [];
  7.         total = xmlNode.childNodes.length;
  8.         for (i=0; i<total; i++) {
  9.             thumbnails[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
  10.             titname[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
  11.             link[i] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
  12.             thumbnails_fn(i);
  13.             //trace(link[i]);
  14.         }
  15.         firstImage();
  16.     } else {
  17.         content = "file not loaded!";
  18.     }
  19. }
  20. xmlData = new XML();
  21. xmlData.ignoreWhite = true;
  22. xmlData.onLoad = loadXML;
  23. xmlData.load("images.xml");
  24. /////////////////////////////////////
  25. listen = new Object();
  26. listen.onKeyDown = function() {
  27.     if (Key.getCode() == Key.LEFT) {
  28.         prevImage();
  29.     } else if (Key.getCode() == Key.RIGHT) {
  30.         nextImage();
  31.     }
  32. };
  33. Key.addListener(listen);
  34. previous_btn.onRelease = function() {
  35.     prevImage();
  36. };
  37. next_btn.onRelease = function() {
  38.     nextImage();
  39. };
  40. /////////////////////////////////////
  41. p = 0;
  42. function thumbNailScroller() {
  43.     // thumbnail code!
  44.     this.createEmptyMovieClip("tscroller", 1000);
  45.     scroll_speed = 8;
  46.     tscroller.onEnterFrame = function() {
  47.         if ((_root._ymouse>=thumbnail_mc._y) && (_root._ymouse<=thumbnail_mc._y+thumbnail_mc._height)) {
  48.             if ((_root._xmouse>=(hit_right._x-350)) && (thumbnail_mc.hitTest(hit_right))) {
  49.                 thumbnail_mc._x -= scroll_speed;
  50.             } else if ((_root._xmouse<=(hit_left._x+350)) && (thumbnail_mc.hitTest(hit_left))) {
  51.                 thumbnail_mc._x += scroll_speed;
  52.             }
  53.         } else {
  54.             delete tscroller.onEnterFrame;
  55.         }
  56.     };
  57. }
  58. function thumbnails_fn(k) {
  59.     thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
  60.     thumbnail_mc["t"+k].title = titname[k];
  61.     tlistener = new Object();
  62.     tlistener.onLoadInit = function(target_mc) {
  63. // Attach a text-field for the title
  64. target_mc.createTextField("desc_txt", target_mc.getNextHighestDepth(), 0, target_mc._height-20, target_mc._width, 20);
  65. target_mc["desc_txt"].background = true;
  66. target_mc["desc_txt"].text = titname[k];
  67. trace(titname[k]);
  68.         target_mc._x = hit_left._x+(target_mc._width+10)*k;
  69.         target_mc.pictureValue = k;
  70.         //trace(target_mc.pictureValue);
  71.         title_mc.desc_txt.text = description[k];
  72.             //trace(description[p]);
  73.         target_mc.onRelease = function() {
  74.             p = this.pictureValue;
  75.             nextImage();
  76.           getURL(link[p], "_self");
  77.             
  78. };
  79.         target_mc.onRollOver = function() {
  80.             this._alpha = 80;
  81.             thumbNailScroller();
  82.         };
  83.         target_mc.onRollOut = function() {
  84.             this._alpha = 100;
  85.         };
  86.     };
  87.     image_mcl = new MovieClipLoader();
  88.     image_mcl.addListener(tlistener);
  89.     image_mcl.loadClip(thumbnails[k], "thumbnail_mc.t"+k);
  90. }
  • routhu
  • Beginner
  • Beginner
  • User avatar
  • Posts: 47
  • Loc: India

Post 3+ Months Ago

Hi Joebert,

By the below code I am getting text. But the text not duplicating that is not scrolling.

can you look at once.

Thanks
krish

Code: [ Select ]
function thumbnails_fn(k) {
    thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
    tlistener = new Object();
    tlistener.onLoadInit = function(target_mc) {
        target_mc._x = hit_left._x+(target_mc._width+10)*k;
        target_mc.pictureValue = k;
        desc_txt.text = titname[p];
            //trace(description[p]);
        target_mc.onRelease = function() {
            p = this.pictureValue;
            nextImage();
          getURL(link[p], "_self");
            

};
  1. function thumbnails_fn(k) {
  2.     thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
  3.     tlistener = new Object();
  4.     tlistener.onLoadInit = function(target_mc) {
  5.         target_mc._x = hit_left._x+(target_mc._width+10)*k;
  6.         target_mc.pictureValue = k;
  7.         desc_txt.text = titname[p];
  8.             //trace(description[p]);
  9.         target_mc.onRelease = function() {
  10.             p = this.pictureValue;
  11.             nextImage();
  12.           getURL(link[p], "_self");
  13.             
  14. };
  • joebert
  • Fart Bubbles
  • Genius
  • User avatar
  • Posts: 13502
  • Loc: Florida

Post 3+ Months Ago

Quote:
I have implemented whatever u told , But not able to get .....

I forgot that MovieClips are "emptied" when they load content, the title variable was likely being trashed before it was used.

I'm out of ideas, sorry.
  • IceCold
  • Guru
  • Guru
  • User avatar
  • Posts: 1254
  • Loc: Ro

Post 3+ Months Ago

lier joebert ... better said you're out of patience :D
Always when dealing with thumbnails which contain both text and images,
make a holder for the thumb, add all the properties to it.
Next, just createEmptyMovieClip for an image movieclip in which you will load the picture.
i.e.:
Code: [ Select ]
this.createEmptyMovieClip("mcThumb0", 0);
mcThumb0.var1 = "something from xml";
mcThumb0.var2 = "something from xml";
mcThumb0.var3 = "something from xml";

// when loading a new image in the thumb
mcThumb0.createEmptyMovieClip("img", 0);
mcThumb0.img.loadMovie("some image");
  1. this.createEmptyMovieClip("mcThumb0", 0);
  2. mcThumb0.var1 = "something from xml";
  3. mcThumb0.var2 = "something from xml";
  4. mcThumb0.var3 = "something from xml";
  5. // when loading a new image in the thumb
  6. mcThumb0.createEmptyMovieClip("img", 0);
  7. mcThumb0.img.loadMovie("some image");
  • routhu
  • Beginner
  • Beginner
  • User avatar
  • Posts: 47
  • Loc: India

Post 3+ Months Ago

Hi IceCold,

Thanks for your Repley.

Can you please explain Very Clearly . I am not getting what u told.

I am trying solve this one from the last two days . But i am not able to sort this one.

Thanks,
Krish.
  • IceCold
  • Guru
  • Guru
  • User avatar
  • Posts: 1254
  • Loc: Ro

Post 3+ Months Ago

Do you want pictures and diagrams to explain this? Also probably a movie, it's better when it's action ... is not that boring like static images.
Just start a new simple project and use my example then you'll get the idea.

Post Information

  • Total Posts in this topic: 9 posts
  • Users browsing this forum: No registered users and 18 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
 
cron
 

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