This is my work in progress. Please have a look here in the gallery section. Link.
It runs well in IE Windows, but it behaves abruptly upon the gallery is loaded. Can someone give me an advise of this following code?
//handle loading of external images..
var slide:XML = new XML();
slide.ignoreWhite = true;
var largeImageUrl:Array = new Array();
var thumbUrl:Array = new Array();
var p:Number = 0;
slide.onLoad = function() {
largeImageUrl = [];
thumbUrl = [];
judul = [];
material = [];
size = [];
price = [];
xmlNode = this.firstChild;
var images:Array = this.firstChild.childNodes;
for (i=0; i<images.length; i++) {
thumbUrl* = xmlNode.childNodes*.childNodes[0].firstChild.nodeValue;
largeImageUrl* = xmlNode.childNodes*.childNodes[1].firstChild.nodeValue;
judul* = xmlNode.childNodes*.childNodes[2].firstChild.nodeValue;
material* = xmlNode.childNodes*.childNodes[3].firstChild.nodeValue;
size* = xmlNode.childNodes*.childNodes[4].firstChild.nodeValue;
price* = xmlNode.childNodes*.childNodes[5].firstChild.nodeValue;
//trace(xmlNode.childNodes*.childNodes[4].firstChild.nodeValue);
}
//p = 0;//reset p for different gallery loading
loadThumbs();//load our thumbnails images
Mouse.removeListener(mouseListener);//kill the mouselistener if it is added
};
slide.load("02_01_night_music/gallery1.xml");//load xml
var imageWidth:Number = 0;//default x position of our movieclips relative to containing movieclip
var buffer:Number = 4;//padding between images
function loadThumbs() {
//remove the movieclip loade listener on each iteration of this function
largeImage_mc._x = Stage.width/2-largeImage_mc._width/2;
Clip.removeListener(mclListener);
//attach and associate with a variable a MC to hold each loaded movieClip
var container:MovieClip = thumbMask_mc.thumbBox_mc.attachMovie("thumbBox", "thumbBox"+p, thumbMask_mc.thumbBox_mc.getNextHighestDepth(), {_x:imageWidth, _y:0});
//create a movieclip loader
var Clip:MovieClipLoader = new MovieClipLoader();
var mclListener:Object = new Object();
mclListener.onLoadStart = function(target_mc:MovieClip) {
preloaderThumbnail_mc._visible = true;
target_mc._alpha = 0;//set thumb alpha to be zero
};
//handle loading progress - simple counter here
mclListener.onLoadProgress = function(target_mc:MovieClip, loaded:Number, total:Number):Void {
//use this if you want to indicate loading of your thumbnails etc...
if(loaded==total){
preloaderThumbnail_mc._visible = false;
//_root.preloader_MC.percent_text._visible = false;
}else{
//_root.preloader_MC.progress_MC._width = _root.preloader_MC.base_MC._width *(bytesLoaded/bytesTotal);
preloaderThumbnail_mc.percent_text.text = "LOADING THUMBNAIL "+Math.round((loaded/total)*100)+"%" ;
}
//loadTxt.captions_txt.text = Math.floor(bytesLoaded/bytesTotal*100)+"%";
};
mclListener.onLoadInit = function(target_mc:MovieClip) {
//here we can access our loaded clips properties!
//here is where we attach functions to our clip so that we can dynamically create rollovers etc.
//make our thumbnails visible again
target_mc.alphaTo(100,0.5,"linear");
//subscribe all images to AS broadcast method
targetThumbs.addListener(this);
//based off image width this places our thumbs next to each other
imageWidth = (imageWidth+target_mc._width)+buffer;
//associate a variable here with our p value, we use this later to load in large images
target_mc.pictureValue = p;
//handle image rollovers these are active only on the thumb image!!! Watch the US spelling!
target_mc.onRollOver = function() {
this._alpha = 50;
};
target_mc.onRollOut = function() {
this._alpha = 100;
};
//handle a click on a thumbnail
target_mc.onRelease = function() {
//load large images
loadImages(this.pictureValue);
};
p++;//increment value to cycle through array
if (p<thumbUrl.length) {
loadThumbs();//create loop
}
if (p == thumbUrl.length) {
/*we set this variable here because this is where we know the length of our thumbnails containing mc.
After we have loaded all content in. Makes sense really!*/
mcWidth = thumbMask_mc.thumbBox_mc._width
/*add the mouse listener object to the thumbnail mask. We do this element of our script here so
we do not enable scrolling of our mc before the images have all loaded in. As this can cause issuse*/
Mouse.addListener(mouseListener);
}
};
Clip.addListener(mclListener);
Clip.loadClip(thumbUrl[p],container);
loadImages(0);
title_mc.desc_txt.text = judul[0];
material_mc.material_txt.text = material[0];
size_mc.size_txt.text = size[0];
price_mc.price_txt.text = price[0];
}
function loadImages(id:Number){
mcLoader.removeListener(listener);
//create a movieclip loader
var mcLoader:MovieClipLoader = new MovieClipLoader();
var listener:Object = new Object();
listener.onLoadStart = function(target_mc:MovieClip) {
//trace("// loading started...");
preloaderImage_mc._visible = true;
largeImage_mc._alpha=0;
};
listener.onLoadProgress = function(target:MovieClip, loaded:Number, total:Number):Void {
if(loaded==total){
preloaderImage_mc._visible = false;
}else{
//_root.preloader_MC.progress_MC._width = _root.preloader_MC.base_MC._width *(bytesLoaded/bytesTotal);
preloaderImage_mc.percent_text.text = "LOADING IMAGE "+Math.round((loaded/total)*100)+"%" ;
}
};
listener.onLoadInit = function(target:MovieClip):Void {
var ref:Reflection = new Reflection(largeImage_mc,50,100);
ref.drawIt();
ref.addBlur(5,5,5);
//largeImage_mc._alpha=100;
//largeImage_mc.slideTo((Stage.width/2-largeImage_mc._width/2),50,0.5,"linear",0.5);
largeImage_mc._x = Stage.width/2-largeImage_mc._width/2;
largeImage_mc.alphaTo(100,0.5,"linear",0.5);
};
mcLoader.addListener(listener);
//trace("// largeImageUrl: "+largeImage_mc.pictureValue);
//trace("// path: "+largeImageUrl[target_mc.pictureValue]);
mcLoader.loadClip(largeImageUrl[id],largeImage_mc);
title_mc.desc_txt.text = judul[id];
material_mc.material_txt.text = material[id];
size_mc.size_txt.text = size[id];
price_mc.price_txt.text = price[id];
}