Hi everyone, this is my first post in this great site.
I’m building an XML based gallery, and I used the kirupa tutorials for that (both of them).
but I wanted a grid look for the thumbnails and I found this great post by ikim just for that:
So I managed to suit the code to my gallery and everything is going good.
but there is one problem:
when I press the button that loads the XML (WITH THE THUMBS), they load like they supposed to:
but when I press again on the button, they load like this:
and stays like this… Why is that?
here is the complete code I use to load the images and thumbnails:
function loadXML(loaded) {
if (loaded) {
xmlNode = this.firstChild;
image = [];
description = [];
thumbnails = [];
_global.total = xmlNode.childNodes.length;
for (i=0; i<total; i++) {
image* = xmlNode.childNodes*.childNodes[0].firstChild.nodeValue;
description* = xmlNode.childNodes*.childNodes[1].firstChild.nodeValue;
thumbnails* = xmlNode.childNodes*.childNodes[2].firstChild.nodeValue;
thumbnailer(i);
}
firstImage();
} else {
content = "file not loaded!";
}
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("xml/kitchen.xml");
/////////////////////////////////////
/////////////////////////////////////
p = 0;
this.onEnterFrame = function() {
filesize = picture.getBytesTotal();
loaded = picture.getBytesLoaded();
preloader._visible = true;
if (loaded != filesize) {
preloader.preload_bar._xscale = 100*loaded/filesize;
} else {
preloader._visible = false;
if (picture._alpha<100) {
picture._alpha += 10;
}
}
};
function nextImage() {
if (p<(total-1)) {
p++;
if (loaded == filesize) {
picture._alpha = 0;
picture.loadMovie(image[p], 1);
_global.desc_txt = description[p];
picture_num();
}
}
}
function prevImage() {
if (p>0) {
p--;
picture._alpha = 0;
picture.loadMovie(image[p], 1);
_global.desc_txt = description[p];
picture_num();
}
}
function firstImage() {
if (loaded == filesize) {
picture._alpha = 0;
picture.loadMovie(image[0], 1);
_global.desc_txt = description[0];
picture_num();
}
}
function picture_num() {
_global.current_pos = p+1;
_global.pos_txt = current_pos+"/"+total;
}
//////////Load clicked thumbnail Image Function////////////////////////////////////////////////
function callImage() {
if (loaded == filesize) {
picture._alpha = 0;
picture.loadMovie(image[p], 1);
_global.current_pos = p+1;
_global.pos_txt = current_pos+"/"+total;
}
}
//////////Thumbnail maker///////////////////////////////
function thumbnailer(k) {
loaded_counter = 0;
total_thumbs = _global.total;
var container = _parent.pages.gallery.thumbnails.thumbnail_mc.createEmptyMovieClip("th"+k, _parent.pages.gallery.thumbnails.thumbnail_mc.getNextHighestDepth());
container._visible = false;
container._alpha = 0;
var image = container.createEmptyMovieClip("img", container.getNextHighestDepth());
tlistener = new Object();
tlistener.onLoadInit = function(target_mc) {
target_mc.pictureValue = k;
target_mc.onRelease = function() {
p = this.pictureValue;
_global.desc_txt = description[p];
callImage();
};
target_mc.onRollOver = function() {
var myColor:Color = new Color(this);
var white:Object = {ra:100, rb:0, ga:100, gb:0, ba:100, bb:0, aa:100, ab:0};
myColor.setTransform(white);
this.onEnterFrame = function() {
white.rb += 20;
white.gb += 20;
white.bb += 20;
white.ab += 20;
myColor.setTransform(white);
if (white.rb>150) {
white.rb = 0;
white.gb = 0;
white.bb = 0;
white.ab = 0;
delete this.onEnterFrame;
}
};
};
target_mc.onRollOut = function() {
var myColor:Color = new Color(this);
var white:Object = {ra:100, rb:150, ga:100, gb:150, ba:100, bb:150, aa:100, ab:150};
myColor.setTransform(white);
this.onEnterFrame = function() {
white.rb -= 10;
white.gb -= 10;
white.bb -= 10;
white.ab -= 10;
myColor.setTransform(white);
if (white.rb<0) {
white.rb = 255;
white.gb = 255;
white.bb = 255;
white.ab = 255;
delete this.onEnterFrame;
}
};
};
loaded_counter++;
counting_txt = loaded_counter;
if (loaded_counter == total_thumbs) {
grid_maker_01();
}
};
image_mcl = new MovieClipLoader();
image_mcl.addListener(tlistener);
image_mcl.loadClip(thumbnails[k], "_parent.pages.gallery.thumbnails.thumbnail_mc.th"+k+".img");
}
///////////Layout Functions/////////////////////////////////////////////////////////////////////
MovieClip.prototype.grid_maker_01 = function(f) {
num = 0;
col = 3;
row = (_global.total/3)+1;
scale = 60;
space = 5;
for (l=0; l<row; l++) {
for (j=0; j<col; j++) {
if (num<_global.total) {
with (eval("_parent.pages.gallery.thumbnails.thumbnail_mc.th"+num)) {
_x = ((_width+space)*scale/100)*j;
_y = ((_height+space)*scale/100)*l;
_xscale = _yscale=scale;
_visible = true;
}
num++;
}
}
}
this.cascader();
};
//////////////////////////////////////////////////////////////////////////////////
MovieClip.prototype.cascader = function() {
inter = 200;
c = 0;
delayed_fade = function () {
if (c<_global.total) {
with (eval("_parent.pages.gallery.thumbnails.thumbnail_mc.th"+c)) {
fadein();
}
c++;
} else {
clearInterval(delay);
}
};
delay = setInterval(delayed_fade, inter);
};
///////////////////////////////////////////////////////////////////////////////
MovieClip.prototype.fadein = function() {
this.onEnterFrame = function() {
if (this._alpha<100) {
this._alpha = this._alpha+5;
} else {
this._alpha = 100;
delete this.onEnterFrame;
}
};
};
///////////////////////////////////////////////////////////////////////////////////////
MovieClip.prototype.positioner = function(xDest, yDest, rDest, aDest) {
this.onEnterFrame = function() {
this._x = xDest-(xDest-this._x)/1.2;
this._y = yDest-(yDest-this._y)/1.2;
this._alpha = aDest-(aDest-this._alpha)/1.2;
this._rotation = rDest-(rDest-this._rotation)/1.2;
if ((Math.abs(xDest-this._x)<=1) and (Math.abs(yDest-this._y)<=1)) {
delete this.onEnterFrame;
this._x = xDest;
this._y = yDest;
this._alpha = aDest;
this._rotation = rDest;
}
};
};
//////////////////////////////////////////////////////////////////////////////////
Any help? ;(
tnx in advance…
BTW, the button uses the loadMovie function.
