I’m attempting to alter Rhamej’s photo gallery to my needs and need a little help. The first thing I wanted to do was make it so that each thumbnail would link to the respective link from the XML file. I was able to do that. Now, I’m stuck.
I need to make it so that the respective caption for each XML entry is shown below the respective thumbnail. I’ve tried everything I can and I’m just out of ideas. Can someone alter my AS to do this and then explain why they made the changes they did? I learn best by example - I don’t just want someone to do this, I want to know what they did as well!
If you need anything else or if you need more clarification please let me know.
//// DO NOT CHANGE ANYTHING HERE UNLESS YOU KNOW WHAT YOU ARE DOING!! I AM NOT RESPONSIBLE IF YOU BREAK IT!!
stop();
//set the initial postitions/properties of every thing.
scroller.prevBtn._visible = false;
scroller.nextBtn._visible = false;
mtClip._alpha = 0;
if (nav == "nobuttons") {
scroller._x = 0;
scroller.mask._x = 0;
scroller.mask._width = Stage.width;
scroller.container._x = Stage.width/2;
scroller.counterText._x = Stage.width/2;
} else {
scroller._x = Stage.width/2-365;
}
media._x = Stage.width;
media._y = 0;
preloader_mc._x = Stage.width/2;
preloader_mc._y = Stage.height/2-50;
counterText_mc._y = Stage.height-120;
counterText_mc._x = Stage.width/2;
scroller._y = Stage.height-100;
mainBox._x = Stage.width/2-mainBox._width/2;
mainBox._y = Stage.height/2-mainBox._height/2-50;
mainBackground._x = 0;
mainBackground._y = 0;
timer_mc._x = 18;
timer_mc._y = 18;
mainBackground._width = Stage.width;
mainBackground._height = Stage.height;
infoBox._x = Math.floor(Stage.width/2);
infoBox._y = 13;
infoBox.useHandCursor = false;
mainBox._visible = false;
mainBox._width = 1;
mainBox._height = 1;
// define the stage resize events
var sl:Object = new Object();
sl.onResize = function() {
if (nav == "nobuttons") {
scroller.mask._width = Stage.width;
if (scroller.container._width>Stage.width) {
scroller.setRollOver();
} else {
scroller.container.tween("_x", Stage.width/2-scroller.container._width/2, stageResizeTweenSpeed, stageResizeTween);
delete scroller.onEnterFrame;
}
} else {
scroller.tween("_x", Stage.width/2-365, stageResizeTweenSpeed, stageResizeTween);
}
preloader_mc.tween("_y", Stage.height/2-50, stageResizeTweenSpeed, stageResizeTween);
preloader_mc.tween("_x", Stage.width/2, stageResizeTweenSpeed, stageResizeTween);
counterText_mc.tween("_y", Stage.height-120, stageResizeTweenSpeed, stageResizeTween);
counterText_mc.tween("_x", Stage.width/2, stageResizeTweenSpeed, stageResizeTween);
scroller.tween("_y", Stage.height-100, 0, stageResizeTween);
mainBox.tween("_x", Stage.width/2-mainBox._width/2, stageResizeTweenSpeed, stageResizeTween);
mainBox.tween("_y", Stage.height/2-mainBox._height/2-50, stageResizeTweenSpeed, stageResizeTween);
mtClip.tween("_x", Stage.width/2-mtClip._width/2, stageResizeTweenSpeed, stageResizeTween);
mtClip.tween("_y", Stage.height/2-mtClip._height/2-50, stageResizeTweenSpeed, stageResizeTween);
infoBox.tween("_x", Math.floor(Stage.width/2), stageResizeTweenSpeed, stageResizeTween);
infoBox._y = 13;
mainBackground._x = 0;
mainBackground._y = 0;
mainBackground._width = Stage.width;
mainBackground._height = Stage.height;
media._x = Stage.width;
media._y = 0;
};
Stage.addListener(sl);
sl.onResize();
// define the vars
var frwrd:Boolean = true;
var pictures:Array = new Array();
var p:Number = -1;
var z:Number;
var clickCount:Number = 0;
var howMclick:Number;
var slideCount:Number = -1;
var images:Array = new Array();
var numOfBtns:Array = new Array();
var xml:XML = new XML();
var fadeOut:Boolean;
var setIt:Boolean = false;
var playFast:Boolean;
var nextImage;
var mainColor;
var nextLink;
// set the colors
var btnPBGcolor:Color = new Color(scroller.prevBtn.bg);
btnPBGcolor.setRGB(btnBgColor);
var btnNBGcolor:Color = new Color(scroller.nextBtn.bg);
btnNBGcolor.setRGB(btnBgColor);
var btnPcolor:Color = new Color(scroller.prevBtn.arrows);
btnPcolor.setRGB(btnArrowColor);
var btnNcolor:Color = new Color(scroller.nextBtn.arrows);
btnNcolor.setRGB(btnArrowColor);
var mainBoxColor:Color = new Color(mainBox);
mainBoxColor.setRGB(mainImageColor);
var infoBoxColor:Color = new Color(infoBox.bg);
infoBoxColor.setRGB(infoColor);
var mainBGColor:Color = new Color(mainBackground);
mainBGColor.setRGB(mainBgColor);
var hoverBGColor:Color = new Color(follow_mc.followBg);
hoverBGColor.setRGB(hoverBgColor);
//Load the XML and set all the arrays, blah blah blah....
xml.ignoreWhite = true;
xml.onLoad = function(ok) {
if (ok) {
allData = this.firstChild.childNodes;
for (var i = 0; i<allData.length; i++) {
this.createTextField("desc_txt", 1, 66, 53, 300, 100);
desc_txt.multiline = true;
desc_txt.wordWrap = true;
desc_txt.text = "This is my first test field object text.";
var newBut:MovieClip = scroller.container.attachMovie("thumbMC", "thumb"+i, i);
var bgcolor:Color = new Color(newBut.thumbBg);
bgcolor.setRGB(thBgColor);
var preloaderColor:Color = new Color(newBut.bar);
preloaderColor.setRGB(barColor);
newBut.bgColor = allData*.attributes.color;
newBut.descript = allData*.firstChild.firstChild;
var caption = gallery*.childNodes[0].firstChild.nodeValue;
newBut.image = allData*.firstChild.nextSibling.firstChild;
newBut.link = (allData*.firstChild.nextSibling.nextSibling.firstChild);
newBut.onPress = function () {
getURL(this.link,"_blank");
}
pictures.push(allData*.firstChild.nextSibling.firstChild);
links.push(allData*.firstChild.nextSibling.nextSibling.firstChild);
numOfBtns* = "but"+i;
newBut.slideCounter = i;
newBut._visible = false;
newBut.endY = -1;
newBut.endX = i*(100);
if (nav == "buttons") {
newBut._x = i*(100);
} else {
mewBut._x = 0;
}
howMclick = Math.floor(scroller.container._width/700);
newBut.onRelease = function() {
checkThumbs();
if (showSlide == false) {
slideCount = this.slideCounter;
}
preloader_mc._visible = true;
preloader_mc.gotoAndPlay(2);
desc_text.text = newBut.descript;
nextImage = this.image;
mainColor = this.bgColor;
nextLink = this.link;
fadeOut = true;
fadeMain();
this.enabled = false;
};
newBut.onRollOver = function() {
this.thumbClip.fadeIn = true;
this.thumbClip.fade();
};
newBut.onRollOut = function() {
this.thumbClip.fadeIn = false;
this.thumbClip.fade();
};
}
// when all done with above caca, load the first thumb
if (showShow == true) {
playFast = true;
timer_mc.onRelease();
firstLoad = false;
}
nextPic();
}
};
// slide the info box down
function slideInfo(targY) {
infoBox.tween("_y", targY, .5, "easeOutQuad", 0);
}
infoBox.onRollOver = function() {
slideInfo(185);
};
infoBox.onRollOut = infoBox.onReleaseOutside=function () {
slideInfo(13);
};
////load each thumb incrementaliy
// Step one, check to see if p is less than pictures array
function nextPic() {
p++;
if (p<pictures.length) {
moveThumbs();
if (setIt == true) {
scroller.setRollOver();
}
if (p>6 && nav == "buttons") {
scroller.prevBtn._visible = true;
scroller.nextBtn._visible = true;
}
} else {
counterText_mc.loadingText.text = "";
}
}
// Step two, call the function to show the thumb
function moveThumbs() {
var but:MovieClip = scroller.container["thumb"+p];
but.showThumbs();
}
// Step three, show the thumb by sliding it up or blinking it in. After its showing, preload the image
MovieClip.prototype.showThumbs = function() {
if (nav == "buttons") {
if (navani == "slide") {
this._y = 120;
this._x = this.endX;
this._visible = true;
this.tween("_y", this.endY, thumbUpTweenSpeed, upEaseType, 0, loadThumbs);
}
if (navani == "blink") {
this._visible = true;
this._y = this.endY;
loadThumbs();
}
} else if (nav == "nobuttons") {
if (navani == "slide") {
this._visible = true;
this._y = 120;
this._x = this.endX;
scroller.container.tween("_x", Stage.width/2-scroller.container._width/2, .5, "easeOutQuad");
this.tween("_y", this.endY, thumbUpTweenSpeed, upEaseType, 0, loadThumbs);
if (this._x>Stage.width-this._width) {
setIt = true;
}
}
if (navani == "blink") {
this._visible = true;
this._y = 0;
this._x = this.endX;
scroller.container.tween("_x", Stage.width/2-scroller.container._width/2, .5, "easeOutQuad");
loadThumbs();
if (this._x>Stage.width+this._width) {
setIt = true;
}
}
}
};
// load the thumb image
function loadThumbs() {
var but:MovieClip = scroller.container["thumb"+p];
but.thumbClip.loadMovie("uploads/"+pictures[p]);
but.linksClip.loadMovie(links[p]);
var temp:MovieClip = _root.createEmptyMovieClip("temp"+p, p);
counterText_mc.loadingText.text = (p+1)+" / "+pictures.length;
temp.onEnterFrame = function() {
BL = but.thumbClip.getBytesLoaded();
BT = but.thumbClip.getBytesTotal();
percent = Math.round(BL/BT*100);
but.bar.gotoAndStop(percent);
if (BL == BT && but.thumbClip._width>1 && but.thumbClip._height>1) {
but.bar.gotoAndStop(1);
but.thumbClip._width = 80;
but.thumbClip._height = 80;
but.linksClip._width = 80;
but.linksClip._height = 80;
if (firstLoad == 1) {
but.onRelease();
but.fadeIn = true;
but.thumbClip._alpha = 100;
firstLoad = false;
} else {
but.fadeIn = false;
but.thumbClip.fade();
}
nextPic();
delete temp.onEnterFrame;
}
};
}
//re-enable the disabled thumb button when another is clicked
function checkThumbs() {
for (var j = 0; j<=numOfBtns.length; j++) {
var theThumb:MovieClip = scroller.container["thumb"+j];
if (theThumb.enabled == false) {
theThumb.enabled = true;
theThumb.thumbClip.fadeIn = false;
theThumb.thumbClip.fade();
}
}
}
// fade IN/OUT the thumb image on rollOver rollOut
MovieClip.prototype.fade = function() {
if (this.fadeIn == true) {
this.tween("_alpha", 100, .5, "easeOutQuad");
} else {
this.tween("_alpha", 30, .5, "easeOutQuad");
}
};
/*loadMain image. Even though it already preloaded in the thumb,
we want to make sure its there before we reveal it, plus we need to make sure all the other crap happens*/
function loadMainImage() {
mtClip.loadMovie("uploads/"+nextImage);
var temp:MovieClip = _root.createEmptyMovieClip("temp", 99999);
temp.onEnterFrame = function() {
trace('loading');
if (mtClip._width>5 && mtClip._height>5) {
if (showSlide == true) {
timer_mc.gotoAndPlay(2);
}
preloader_mc._visible = false;
preloader_mc.gotoAndStop(1);
mtClip._x = Stage.width/2-mtClip._width/2;
mtClip._y = Stage.height/2.-mtClip._height/2-50;
var mainBoxX:Number = mtClip._x-imageBorder;
var mainBoxY:Number = mtClip._y-imageBorder;
var mainBoxW:Number = mtClip._width+imageBorder*2;
var mainBoxH:Number = mtClip._height+imageBorder*2;
mainBox.tween("_width", mainBoxW, mainBoxTweenSpeed, mainBoxType, 0);
mainBox.tween("_height", mainBoxH, mainBoxTweenSpeed, mainBoxType, 0);
mainBox.tween("_x", mainBoxX, mainBoxTweenSpeed, mainBoxType, 0);
mainBox.tween("_y", mainBoxY, mainBoxTweenSpeed, mainBoxType, 0);
mainBackground.colorTo(mainColor, colorSpeed, "easeOutQuad");
mainBox._visible = true;
fadeOut = false;
fadeMain();
mtClip.onRelease = function() {
if (nextLink != null) {
getURL(nextLink, "_blank");
}
};
mtClip.onRollOver = function() {
follow_mc._visible = true;
onMouseMove = function () {
if (nextLink != null) {
follow_mc.follow_txt.text = rollOverText;
follow_mc.followBg._width = follow_mc.follow_txt._width+5;
} else {
follow_mc.follow_txt.text = emptyNodetext;
follow_mc.followBg._width = follow_mc.follow_txt._width+5;
}
follow_mc._x = Math.floor(_root._xmouse-follow_mc._width);
follow_mc._y = Math.floor(_root._ymouse);
};
};
mtClip.onRollOut = mtClip.onReleaseOutside=mtClip.onDragOver=function () {
follow_mc._visible = false;
};
delete temp.onEnterFrame;
trace('delted');
}
};
}
// fade IN/OUT the main image
function fadeMain() {
if (this.fadeOut == true) {
mtClip.tween("_alpha", 0, fadeOutMainSpeed, "easeOutQuad", 0, loadMainImage);
} else {
mtClip.tween("_alpha", 100, fadeInMainSpeed, "easeOutQuad", 0);
}
}
//slide the thumbs left or right if set to "buttons"
function slideMain() {
var overlap:Number = .03;
var count:Number = 0;
var decount:Number = pictures.length;
if (frwrd == true) {
for (z=0; z<decount; z++) {
var ending:Number = scroller.container["thumb"+z].endX-700;
count++;
scroller.container["thumb"+z].tween("_x", ending, thumbSlideTweenSpeed, slideType, overlap*count);
scroller.container["thumb"+z].endX = ending;
}
} else {
for (z=decount-1; z>=0; z--) {
var ending:Number = scroller.container["thumb"+z].endX+700;
count++;
scroller.container["thumb"+z].tween("_x", ending, thumbSlideTweenSpeed, slideType, overlap*count);
scroller.container["thumb"+z].endX = ending;
}
}
}
// slide show function
function slideShow() {
slideCount++;
if (showSlide == true) {
if (slideCount == pictures.length) {
slideCount = 0;
}
var butCount:MovieClip = scroller.container["thumb"+slideCount];
butCount.onRelease();
butCount.thumbClip._alpha = 100;
}
}
//button actions
scroller.nextBtn.onRelease = function() {
if (clickCount<howMclick) {
clickCount++;
frwrd = true;
slideMain();
}
};
scroller.prevBtn.onRelease = function() {
if (clickCount != 0) {
clickCount--;
frwrd = false;
slideMain();
}
};
media.onRelease = function() {
getURL("http://2210media.com", "_blank");
};
timer_mc.onRelease = function() {
if (showSlide == false) {
if (playFast == true) {
timer_mc.gotoAndPlay(timer_mc._totalframes-1);
playFast = false;
} else {
timer_mc.gotoAndPlay(2);
}
showSlide = true;
timer_mc.timerText.text = "on";
} else {
timer_mc.gotoAndStop(1);
timer_mc.timerText.text = "";
}
};
// fire it all off! BAM!
xml.load("gallery.xml");
<?xml version="1.0" encoding="iso-8859-1"?>
<gallery>
<image color="0x699AAF">
<description>Alone In The Dark</description>
<pic>200805290845220.WEBSITE IMAGE.jpg</pic>
<link>http://www.kirupa.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Battlefield Bad Company</description>
<pic>200805290839270.WEBSITE IMAGE.jpg</pic>
<link>http://www.google.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Bourne Conspiracy</description>
<pic>200805290832560.WEBSITE IMAGE.jpg</pic>
<link>http://www.yahoo.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Crisis Core FF VII</description>
<pic>200802260737460.WEBSITE IMAGE.jpg</pic>
<link>http://www.koltownproperties.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Dragonball Z Burst Limit</description>
<pic>200805290837280.WEBSITE IMAGE.jpg</pic>
<link>$30.00</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Enemy Territory Quake Wars</description>
<pic>200805020948570.WEBSITE IMAGE.jpg</pic>
<link>http://www.koltownproperties.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Final Fantasy Tactics A2</description>
<pic>200805290859060.WEBSITE IMAGE.jpg</pic>
<link>http://www.yahoo.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>God Of War Chains Of Olympus</description>
<pic>200802260740350.WEBSITE IMAGE.jpg</pic>
<link>http://www.koltownproperties.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Grand Theft Auto IV</description>
<pic>200803251441090.WEBSITE IMAGE.jpg</pic>
<link>http://www.yahoo.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Guitar Hero Aerosmith</description>
<pic>200805290851050.WEBSITE IMAGE.jpg</pic>
<link>http://www.koltownproperties.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Haze</description>
<pic>200710301436100.WEBSITE IMAGE.jpg</pic>
<link>http://www.yahoo.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Hellboy Science Of Evil</description>
<pic>200805290848350.WEBSITE IMAGE.jpg</pic>
<link>http://www.black.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Incredible Hulk</description>
<pic>200805290835490.WEBSITE IMAGE.jpg</pic>
<link>http://www.koltownproperties.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Iron Man</description>
<pic>200805020945300.WEBSITE IMAGE.jpg</pic>
<link>http://www.yahoo.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Mario Kart Wii w/ Wii Wheel</description>
<pic>200803251442440.WEBSITE IMAGE.jpg</pic>
<link>http://www.koltownproperties.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Metal Gear Solid 4</description>
<pic>200805290852300.WEBSITE IMAGE.jpg</pic>
<link>http://www.yahoo.com</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>NASCAR 09</description>
<pic>200805290838200.WEBSITE IMAGE.jpg</pic>
<link>$30.00</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Ninja Gaiden 2</description>
<pic>200805290832190.WEBSITE IMAGE.jpg</pic>
<link>$35.00</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Pokemon Mystery Dungeon Explorers Of Darkness</description>
<pic>200803251451110.WEBSITE IMAGE.jpg</pic>
<link>$20.00</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Pokemon Mystery Dungeon Explorers Of Time</description>
<pic>200803251449080.WEBSITE IMAGE.jpg</pic>
<link>$20.00</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Super Mario Galaxy</description>
<pic>200711211319150.1 mario.jpg</pic>
<link>$25.00</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Super Smash Bros. Brawl</description>
<pic>200802260727350.WEBSITE IMAGE.jpg</pic>
<link>$30.00</link>
<price>$30.00</price>
</image>
<image color="0x699AAF">
<description>Top Spin 3</description>
<pic>200805290842300.WEBSITE IMAGE.jpg</pic>
<link>$30.00</link>
<price>$30.00</price>
</image>
</gallery>