Groups | Blog | Home
all groups > flash actionscript > january 2006 >

flash actionscript : Help with adapting gallery code


alanwallace4
1/29/2006 7:16:33 PM
Hi there,
Im trying to adapt this code but im finding it very hard to understand.
http://www.photo.alanwallace.co.uk is the gallery that i have at present. What
i would like to do is have the first image to be displayed when the page loads
up, rather than just have the space until a thumb is selected.
Basically the thumbs and images are loaded up from a xml file, i'll put a
sample of the xml code under the action script.
Here's the code

verticalspace = 20;
horizspace = 10;
originx =550;
originy = 100;
w = 20;
h = 20;
cloparray = ;
myxml = new XML();
myxml.ignoreWhite = true;
myxml.onload = parseMe;
createEmptyMovieClip("lc", 5423);
myxml.load("http://www.photo.alanwallace.co.uk/p.xml");
mainarray = ;
sectionarray = ;
function parseMe(success) {
if (success) {
for (var k = 0; k<this.firstChild.childNodes.length; k++) {
var pictures = this.firstChild.childNodes.childNodes;

_root = ;
for (var i = 0; i<pictures.length; i++) {
var obj = {};
for (var j in pictures.attributes) {
obj = pictures.attributes;
}
_root.push(obj);
}
mainarray.push(_root);
startfunction();
}
} else {
"FAILED TO LOAD DATA";
}
}
MovieClip.prototype.tweenTo = function(targetsObj, speed, callbackObj, func,
arg) {
var noo;
if (this.temp) {
noo = this.temp;
} else {
noo = this.createEmptyMovieClip("temp", this.depth++);
}
noo.targetsObj = targetsObj;
noo.onEnterFrame = function() {
var i;
for (var prop in this.targetsObj) {
this._parent += (this.targetsObj-this._parent)/speed;
if (Math.abs(this.targetsObj-this._parent)<1) {
this._parent = this.targetsObj;
delete this.targetsObj;
}
i++;
}
if (!i) {
callBackObj(arg);
this.removeMovieClip();
}
};
};
linem = function (top, fill) {
top.clear();
top.beginFill(fill);
top.lineStyle(0, 0xFF9900, 100);
top.lineTo(w, 0);
top.lineTo(w, h);
top.lineTo(0, h);
top.lineTo(0, 0);
top.endFill();
};

function section() {
for (var i = 0; i<sectionarray.length; i++) {
var mm = attachMovie("s", "s"+i, -5-i);
mm.myText.text = sectionarray;
mm.myText2.text = sectionarray;
mm._x = originx-spacing-mm._width;
mm._y = originy+i*(verticalspace+h);
}
}
function startfunction() {
section();
for (var i = 0; i<mainarray.length; i++) {
var clip = this.createEmptyMovieClip("holder"+i, i);
for (var j = 0; j<mainarray.length; j++) {
clop = clip.createEmptyMovieClip("h"+j, j);
clop.j = j;
clop.i = i;
clop._y = 700+random(500);
clop._x = random(4000)-2000;
clop.y = originy+i*(verticalspace+h);
clop.x = originx+j*(horizspace+w);
//clop.loadMovie(mainarray.image)
}
}
for (var obj in clip) {
if (typeof clip == "movieclip") {
cloparray.push({clip:clip, j:clip.j, i:clip.i, x:clip.x, y:clip.y});
}
}
loader();
}
function preloadf(mc) {
if (mc.getBytesLoaded()>=mc.getBytesTotal() && mc.getBytesTotal()>0) {
clearInterval(arguments.callee.interval);
var io = mc.createEmptyMovieClip("io", 10000);
linem(io);
for (var obj in cloparray) {
if (cloparray.clip == mc) {
cloparray.clip.startx = cloparray.x;
var o = {_x:cloparray.x, _y:cloparray.y};
cloparray.clip.tweenTo(o, 3, boo, "cb");
}
}
mc.onPress = mypress;
mc.onRollOver = myrollover;
mc.onRollOut = myrollout;
mc.enabled = false;
if (d<cloparray.length) {
d++;
loader();
}
}
}
var mmclip = createEmptyMovieClip("container", 2000);
mmclip._x = 500;
mmclip._y = 40;
function mypress() {
var gob =this
boo.onEnterFrame = function(){
container._alpha-=10
if(container._alpha <=0){
delete this.onEnterFrame


for (var obj in cloparray) {
linem(cloparray.clip.io);
if (cloparray.clip == gob) {


title.myText.text = sectionarray.i]+" "+mainarray.i].j].title;
container.loadMovie(mainarray.i].j].movie);
prel(container)
linem(cloparray.clip.io, 0xFFFFFF);
trace(cloparray.clip.io);

}
}
}
}
}
function myrollover() {
for (var obj in cloparray) {
if (cloparray.clip == this) {
//title.myText.text = mainarray.i].j].title;
var i = cloparray.i;
var j = cloparray.j;
var o = {_x:cloparray.clip.startx, _xscale:200, _yscale:200};
cloparray.clip.tweenTo(o, 5);
} else if (cloparray.i == i && cloparray.j>j) {
trace(cloparray.clip);
var o1 = {_x:cloparray.clip.startx+w, _xscale:100, _yscale:100};
cloparray.clip.tweento(o1, 5);
} else {
var o = {_x:cloparray.clip.startx, _xscale:100, _yscale:100};
cloparray.clip.tweenTo(o, 5);
}
}
}
var boo = this;
function myrollout() {
//title.myText.text = "";
for (var obj in cloparray) {
var o = {_x:cloparray.clip.startx, _xscale:100, _yscale:100};
cloparray.clip.tweenTo(o, 5);
}
}
var counter = 0;
function cb() {
counter++;
if (counter == cloparray.length) {
for (var obj in cloparray) {
cloparray.clip.enabled = true;
}
}
}
var d = 0;
function loader() {
clearInterval(preloadf.interval);
cloparray.clip.loadMovie(mainarray.i].j].image);
preloadf.interval = setInterval(preloadf, 40, cloparray.clip);
}
/*
for (var i = 0; i<4; i++) {
this.ivar = i;
this.onPress = pressf;
}
delete i;
function pressf() {
for (var obj in mainarray) {
trace(mainarray.image+" "+mainarray.caption);
}
}
*/

And the Xml is.....

<?xml version="1.0" encoding="iso-8859-1"?>
<pictures>
<1.>
<pic image="http://www.photo.alanwallace.co.uk/t1.jpg" title="Alicia
Wallace" title2="Alicia Wallace blah blah"
movie="http://www.photo.alanwallace.co.uk/p1.jpg"/>
<pic image="http://www.photo.alanwallace.co.uk/t2.jpg" title="Picture 2"
movie="http://www.photo.alanwallace.co.uk/p2.jpg"/>

And so on.
Any help isvery much apreciated
Cheers
Alan
alanwallace4
1/29/2006 10:12:14 PM
Hi,
Anyone got any ideas on this?
Cheers
danloaiza NO[at]SPAM yahoo.com
1/30/2006 10:29:07 AM
you have a tweenTo prototype function in AS1.0, take care when you
compile with flashmx2004 or flash 8.0 its not a actualized code
on the second hand I recommend you to update your code to AS2.0 with mx
tween class.
tralfaz
1/30/2006 12:48:27 PM

[quoted text, click to view]

// create a function to load the first picture in
function loadFirstPicture()
{
container.loadMovie("p1.jpg");
prel(container);
title.myText.text = "hello";
}

//last line of actionscript
loadFirstPicture();

This is a good example of why I hate templates. They are written in
the most cryptic fashion making them a nightmare to modify. (probably
on purpose to discourage copying) The same functionality can be done
with a lot more clarity. I didn't dig out the right code to extract
the database titles to put the right title for the first picture
except just to put a hard coded word there.. "hello" It's all I had
the patience for today!
tralfaz

tralfaz
1/30/2006 3:06:25 PM
[quoted text, click to view]

Where will the text come from.. the XML file? As you said..it's easy
enough to make a text box but the hard part is using the right data
node for the text. I'll have a look at it again but wouldn't you be
better off using a template that is more manageable? That one is
really awful (the way it's programmed). Every time you need to make
changes to it in the future you are going to be having to solve a big
puzzle first. It's not supposed to be that way.

Regarding my previous post.. there really isn't a need for the extra
function that I gave you. That was left over from when it had a lot
more lines of code in it. After I whittled it down to the 3 lines of
functionality then no function was needed anymore since it doesn't
take parameters. You can remove the function and just put this at the
end..

container.loadMovie("p1.jpg");
prel(container);
title.myText.text = "something goes here";

tralfaz

tralfaz
1/30/2006 4:48:10 PM

[quoted text, click to view]

Ok.. the code stores the data in an array that you can use later, but
we need to make sure that the data is fully loaded before using it.
To have the first picture load up on startup, at the end of the data
loading sequence, add a call to a function we added earlier.
Here is part of the code with the new lines added..

_root["array" + k].push(_loc3);
}
mainarray.push(_root["array" + k]);
startfunction();
++k;
}
/**************************************
// add the following lines...
// load in the first picture now..
container.loadMovie(_root.array0[0].movie);
prel(container); // start preloading it
title.myText.text = _root.array0[0].title;
// another text box loads title2
title.moreText.text = _root.array0[0].title2;
/**************************************
return;
}
"FAILED TO LOAD DATA";
}


Add the code between the ******'s to load the first picture and title
after the xml file finishes loading.

I also added one line to put another title into another text box
called moreText.

The data is being loaded into an array that you can use. There are 6
image sections called array0 to array5
The first item of array0 is like this..

_root.array0[0].image = "t1.jpg"
_root.array0[0].title="Alicia Wallace"
_root.array0[0].title2="Alicia Wallace blah blah"
_root.array0[0].movie="p1.jpg"

The 2nd item in the first row..
_root.array0[1].image="t2.jpg"
_root.array0[1].title="Picture 2"
_root.array0[1].movie="p2.jpg"

Skipping down to the last item in the 3rd row..
_root.array2[5].image="t18.jpg"
_root.array2[5].title="Picture 18"
_root.array2[5].movie="p18.jpg"

hope that helps
tralfaz




tralfaz
1/30/2006 4:52:27 PM
[quoted text, click to view]

That code works well, but it's just not structured well.

In my previous post I mentioned calling the 'previous function' but I
had removed that function and put the code by itself.
tralfaz

alanwallace4
1/30/2006 5:44:49 PM
Hi,
Anyone?
Cheers
alanwallace4
1/30/2006 9:51:37 PM
Great stuff Tralfaz.
Thanks for taking the timeout to look.
Thanks Again
alanwallace4
1/30/2006 10:27:55 PM
Oh, and one more thing,
How would i go about making more than one text box? Obviously im able to make
up the box but not sure how the code works for it.
As you said, its pretty cryptic stuff.
Cheers
Alan
alanwallace4
1/31/2006 12:23:57 AM
Hi,
yes the text will come from the xml file. In the xml file the current text is
called "title" ...........

<pic image="http://www.photo.alanwallace.co.uk/t1.jpg" title="Alicia Wallace"
movie="http://www.photo.alanwallace.co.uk/p1.jpg"/>

So, i was hoping to put a "title2" in with a few words.

Its basically a source from kirupa which i liked. I didnt realise it was badly
coded.
Cheers
Alan

alanwallace4
1/31/2006 2:13:36 PM
Thanks Tralfaz youre a wizard.
Cheers
tralfaz
1/31/2006 4:10:46 PM
[quoted text, click to view]

Look for the function called parseMe:

function parseMe(success)
{
if(success)
{
(more lines of code here)

/******
// the new code goes just above the return..
/******
return;
}
// "FAILED TO LOAD DATA";
}

That other array information at the bottom was just for you to see how
the data was stored so you could use it later on.
If you are going to expand the website later you will need to know how
to access the data that came out of the xml, but for right now you can
ignore that stuff.

tralfaz



alanwallace4
1/31/2006 11:26:06 PM
Hi,
Sorry to be a pain in the butt Tralfaz.
When ive finally got around to trying out your code I ve become a bit lost.
Firstly the code that you give is different to the code that i have at present
- by this i mean on either side of the ****lines.
Secondly the bit at the bottom where you explaining the arrays - im lost with
that.
Sorry
Thanks for your help.
Cheers
Alan
tralfaz
2/1/2006 11:13:57 AM
[quoted text, click to view]

Great. Glad you got it ok.
tralfaz

alanwallace4
2/1/2006 2:23:49 PM
Hi,
Thanks for your time.
There is no "return" in my code there is an "else" i presume this is what you
mean or do i need to change it to "return"?
Also, do i need to keep the code that you have previously given me in the
previous posts or just use the new code.
Once again im sorry for being a pain.
Cheer
Alan
tralfaz
2/1/2006 3:20:28 PM

[quoted text, click to view]

Yeah, the pictures and thumbnails are generated dynamically with
Actionscript so there isn't anything on the timeline that effects
those. You can turn the visibility off for those using AS. in
gal.fla, create a new actionscript keyframe at frame number 46 and
add this code..

mmclip._visible = false;
box._visible = false;
Bbox._visible = false;

// hide thumbnails
for (var _loc1 in cloparray)
{
cloparray[_loc1].clip._visible = false;
}

In gal2.fla do the same thing at frame 47. (they have outtro in a
different frame number)

Your site is really coming together nicely. I really like the look of
it and the new colors.
tralfaz

alanwallace4
2/1/2006 3:21:21 PM
Hi,
Its ok i figured it out.
Cheers again
alanwallace4
2/1/2006 9:16:28 PM
Hi,
Me again!
I seem to be having a bit difficulty with removing the gallery from my screen.
I have the gallery in an external swf which im loading into my main movie. In
fact, i plan to have 10 different galleries.
So, i load a swf in using the intro - outro method so i can have a transition
between the external swfs.
I have my gallery code on the last frame of the "intro" section. The next
frame along is a blank one but when the movie plays that section(the "outro"
section) the gallery is still visible?

You can see this http://www.photo.alanwallace.co.uk, using the first 2
thumbnails in the bottom scroller to go between the 2 pages.

Take a look at the fla if you want to. The codes located on frame 45 of layer
1. The outro section begins a couple of frames after that but the gallery is
still visible.
http://www.photo.alanwallace.co.uk/gal2.fla

Cheers
Alan
alanwallace4
2/1/2006 11:47:07 PM
Tremendous!!
It's just what i wanted.
Thanks for your help Tralfaz, great stuff.
Oh and thanks for the compliment. Hopefully it'll turn out well.
Cheers
AddThis Social Bookmark Button