Howd he do this? Resizing slideshow

[dude9er]

how do I create this kind of concept without any thumbnails and next buttons. I just want it to cycle depending on what frame my mainMC is on? I've tried taking apart the code but can't figure it out.

I'm working with MX, thanks for any help!!!

[scotty]

http://www.kirupa.com/forum/showthread.php?t=51430&page=20&pp=15
post #295 and further :)

scotty(-:

[DiGiTi]

Scotty ,

great slideshow , i love the simplicity for updating with xml. I did the kirupa tut also with some tekst. But i would like to know how i do transitions with xml. Like on the news sections @ www.drawingart.org

How is that slide done ? Could you plz help

Thnx
DiGiTi

[riverdog]

This script is great. Thank you very much. A quick question though. I am loading this gallery through an empty movieclip in my main movie, and for some reason, the border resizes with the image, but the image is not being displayed? Is anyone else having this issue.....or I am just completely missing a step. Thanks again for your help and time.

Kevin

[riverdog]

This script is great. Thank you very much. A quick question though. I am loading this gallery through an empty movieclip in my main movie, and for some reason, the border resizes with the image, but the image is not being displayed? Is anyone else having this issue.....or I am just completely missing a step. Thanks again for your help and time.

Kevin

[scotty]

@ DiGiTi: It's done with a mask and easing in. To keep this thread a little gallery orientated I suggest you start a new thread on your question :)

@ riverdog: Check if your jpg's are of a non-progressive format.
In Photoshop if you save for web uncheck the progressive box. Another thing could be the path to your pics...

scotty(-:

[riverdog]

scotty - i really appreciate your time.....i made sure they were saved with the progressive box unchecked, and the paths are correct. so you tink this might have something to do with the loadmovie or clipholder variable?

regards
kevin



@ DiGiTi: It's done with a mask and easing in. To keep this thread a little gallery orientated I suggest you start a new thread on your question :)

@ riverdog: Check if your jpg's are of a non-progressive format.
In Photoshop if you save for web uncheck the progressive box. Another thing could be the path to your pics...

scotty(-:

[scotty]

Does the empty mc has an instancename "containerMC" w/o quotes ?

scotty(-:

[3jorn]

I have been wondering about something too...
When you use these galleries with the thumbnails, is there away that you could make a next back button, that goes to the next/previous image?
So that the thumbnail would be the sub navigation, and then you could just go back and forward by clicking back and next buttons...?

[PaintedSwan]

Hi Scotty, wonderful work with this picture gallery! I was wondering if there was any way to combine the preloader that's on "V3" with the "V3_thumbs" gallery...which actually doesn't include a preloader like V3 does. I'm trying to mess with the script on V3_thumbs and c&p the preloader from V3, but I'm having a heck of a time. Any help would be appreciated. :)

[scotty]

@3jorn, have a look at the 'basic' V3 zip, that one has the next and previous buttons

@PaintedSwan, make a loadbar mc, give it the instancename 'bar' and copy all 'bar actions' from V3 and paste them in v3 tumbs (there are 3 lines)

scotty(-:

[PaintedSwan]

@3jorn, have a look at the 'basic' V3 zip, that one has the next and previous buttons

@PaintedSwan, make a loadbar mc, give it the instancename 'bar' and copy all 'bar actions' from V3 and paste them in v3 tumbs (there are 3 lines)

scotty(-:

Which bar actions exactly? If I go by my newbie-vision, I see more than three lol.

[PaintedSwan]

@3jorn, have a look at the 'basic' V3 zip, that one has the next and previous buttons

@PaintedSwan, make a loadbar mc, give it the instancename 'bar' and copy all 'bar actions' from V3 and paste them in v3 tumbs (there are 3 lines)

scotty(-:

Okay nevermind, I underestimated myself, I figured it out. :) That gives me the loadbar, is there an easy way to get the percentage in there too? What I kept having trouble with is for the percentage to stay on top of the pic like it does in the V3, and it kept conflicting with the description of the thumbs.

[scotty]

Not tested

MovieClip.prototype.loadPic = function(pic, id) {
info.text = "";
this._alpha = 0;
this.loadMovie(pic);
//set the loadbar visible
bar._visible = 1;
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
//determine the percentage
var per = Math.round((l/t)*100);
//set the bar it's width
bar._xscale = per;
//set percentage text
info.text = per+" % loaded";
if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
//set the loadbar invisible
bar._visible = 0;
var w = container._width+spacing, h = container._height+spacing;
border.resizeMe(w, h, id);
delete this.onEnterFrame;
}
};
};

scotty(-:

[scotty]

And to have the text ease with the border, put this line (in the resizeMe function)

info._y = Math.round(this._y+this._height/2+spacing/2);
before the first if statement i/o after it :)

scotty(-:

[PaintedSwan]

And to have the text ease with the border, put this line (in the resizeMe function)

info._y = Math.round(this._y+this._height/2+spacing/2);
before the first if statement i/o after it :)

scotty(-:

Thanks so much for the code, Scotty...I'm getting closer. :) I'm not sure what you mean by "i/o after it", so I'm not sure if I'm doing this right. I pasted in the new code, and it's a bit jerky. The text starts out at the very bottom of the screen, pops in the middle of the picture once loaded, then finally pops onto the bottom of the picture with the description. I'm not sure if it's because I'm not placing that last bit of code you mentioned correctly. This:

info._y = Math.round(this._y+this._height/2+spacing/2);


was already within the original code, after the if statement. I tried putting it before the if statement as well, and it's still jerking around. Any thoughts?

[PaintedSwan]

Okay, I messed around with the script a bit, and I think I placed it more properly. The only problem now is that the percentage first pops up at the bottom of the screen...after it loads the first picture, it eases as it should with the border, it's just the position while it loads the first time is wrong. I'll tinker around a bit, but let me know if you have any ideas. Thanks so much again. :D

[PaintedSwan]

=) Yayyy I figured it out. I just set the y of info to 440 at the beginning. Thanks so much for the awesome code, you never cease to amaze! :D

[scotty]

no problem :thumb:

[FxpForce]

wow :thumb: what a tread!!! Great work Scotty, btw i'm new here so expect some questions real soon. :D is there a way to print this whole tread? beside doing it page/page??

[PaintedSwan]

I was wondering how I could modify the script you gave me to put a little more space between the bottom of the picture and the text. I tried tinkering with the "2+spacing/2", but that had very bad results lol. Thanks. :)

[PaintedSwan]

My apologies for all my many questions lol. Something else I also noticed...the text lags behind a bit in the easing with the border...so if the picture goes from small to large, there's a brief period where the text and picture overlap. Here's the way the code looks right now:


MovieClip.prototype.resizeMe = function(w, h, id) {
var speed = 3;
container._alpha = 0;
this.onEnterFrame = function() {
info._y = Math.round(this._y+this._height/2+spacing/2);
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
shadowFollow();
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
container._x = this._x-this._width/2+spacing/2;
container._y = this._y-this._height/2+spacing/2;
container._alpha += 5;
info.text = id;
if (container._alpha>90) {
container._alpha = 100;
delete this.onEnterFrame;
}
}
};
};


Any help would be great. :)

[scotty]

MovieClip.prototype.resizeMe = function(w, h, id) {
var speed = 3;
container._alpha = 0;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
//put it here, right after the new height is defined
info._y = Math.round(this._y+this._height/2+spacing/2);
shadowFollow();
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
container._x = this._x-this._width/2+spacing/2;
container._y = this._y-this._height/2+spacing/2;
container._alpha += 5;
info.text = id;
if (container._alpha>90) {
container._alpha = 100;
delete this.onEnterFrame;
}
}
};
};
;)

scotty(-:

[PaintedSwan]

MovieClip.prototype.resizeMe = function(w, h, id) {
var speed = 3;
container._alpha = 0;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
//put it here, right after the new height is defined
info._y = Math.round(this._y+this._height/2+spacing/2);
shadowFollow();
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
container._x = this._x-this._width/2+spacing/2;
container._y = this._y-this._height/2+spacing/2;
container._alpha += 5;
info.text = id;
if (container._alpha>90) {
container._alpha = 100;
delete this.onEnterFrame;
}
}
};
};
;)

scotty(-:

Haha, what an obvious mistake...here's to being a newbie lol. :D Thanks so much for that. I also wondered what part of the script controls the space between the info text and the bottom of the border, since I'd like to put a little more space between them.

[scotty]

It's the spacing/2. If you want it eg 50 pixels beneath the border, put

info._y = Math.round(this._y+this._height/2+50);

scotty(-:

[PaintedSwan]

It's the spacing/2. If you want it eg 50 pixels beneath the border, put

info._y = Math.round(this._y+this._height/2+50);

scotty(-:

Thanks so much, Scotty, I appreciate the time you took to answer all my many questions lol. You rock! :D

[scotty]

welcome :cool:

[Alyosha]

THIS IS GREAT!
A QUEESTION.
ONCE YOU OPEN THE .JPG FILE, I WOULD LOVE TO HAVE THE OPTION TO THEN USE THE PIC TO OPEN ANOTHER FILE.
LET ME SEE IF I CAN EXPLAIN MYSELF BETTER.
I have the icon, forom there I open the image with resizeBorder, and form there I would love to have the page vewers the option to click in the resizeimage to open a bigger image in a new page.
Any help how could I achieve this?
THANK YOU!!!

[PaintedSwan]

THIS IS GREAT!
A QUEESTION.
ONCE YOU OPEN THE .JPG FILE, I WOULD LOVE TO HAVE THE OPTION TO THEN USE THE PIC TO OPEN ANOTHER FILE.
LET ME SEE IF I CAN EXPLAIN MYSELF BETTER.
I have the icon, forom there I open the image with resizeBorder, and form there I would love to have the page vewers the option to click in the resizeimage to open a bigger image in a new page.
Any help how could I achieve this?
THANK YOU!!!

Hi there :). You might want to hit "reply" to one of the expert's posts, since that might help you get a faster answer...this reply went to me, and I am a newbie. :D

[PaintedSwan]

THIS IS GREAT!
A QUEESTION.
ONCE YOU OPEN THE .JPG FILE, I WOULD LOVE TO HAVE THE OPTION TO THEN USE THE PIC TO OPEN ANOTHER FILE.
LET ME SEE IF I CAN EXPLAIN MYSELF BETTER.
I have the icon, forom there I open the image with resizeBorder, and form there I would love to have the page vewers the option to click in the resizeimage to open a bigger image in a new page.
Any help how could I achieve this?
THANK YOU!!!

Ah nevermind it probably went to me cuz I'm subscribed to this thread. Geez I need some sleep. :D

[sky_vault]

load bar problems
Scotty: i pasted in your load bar code from post #751 just up from here
and on first load you can see the load bar just hanging out @ 100% and
then it disapears and does its load animation. any clue how to fix this?
edit: and actually it flashes @ 100% w/ every new image before it does its
thing.

(#2) i would like for the load bar width to always be equal to that of the
container clip/image and with a (y) position that is always centered with
the container clip. thanks in advance.

[PaintedSwan]

load bar problems
Scotty: i pasted in your load bar code from post #751 just up from here
and on first load you can see the load bar just hanging out @ 100% and
then it disapears and does its load animation. any clue how to fix this?

(#2) i would like for the load bar width to always be equal to that of the
container clip/image and with a (y) position that is always centered with
the container clip. thanks in advance.

Scotty can no doubt help you with the second problem (he's awesome! :D)...but in regards to your first problem, I had the same issue happen, so I just set


bar._visible = 0;


and I placed that at the very top before the 'MovieClip.prototype'. Hope that helps. :D

[sky_vault]

Thanks PaintedSwan that half fixed it but when it first shows up on the stage now it still flashes @ 100% width just before it begins the loading animation. I think for some reason it is being set to visible just before the loading begins therefor it flashes just for a second at its full width. Any more ideas or anyone else having this problem?
:::::::::::::::::::::::::::::::::::::::::::::::::: ::::::::::::::::::::::::::::::::::::
edit: ok i figured it out !!! i just moved the
bar._visible = 1; i put inside the
onEnterFrame = function() instead of just before it and now it works.

so now if someone(Scotty please!!!) can help me with setting the load bar so its width is always the same width as the container clip i will be set. thanks again in advance.

[scotty]

Or you could set the _xscale to 0 if the picture is fully loaded :)

scotty(-:

[sky_vault]

Thanks Scotty ... any clue on question #2 about setting it so the load bar is always the same width as the container clip ?

[scotty]

//curwidth is the width of the current picture
//give it a value if you want to use it for the first pic as well
var curwidth;
MovieClip.prototype.loadPic = function(pic, id) {
info.text = "";
//set bar its x position to container x
bar._x = this._x;
this._alpha = 0;
this.loadMovie(pic);
bar._visible = 1;
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
var per = Math.round((l/t)*100);
//set the bar it's width
bar._width = Math.round((l/t)*curwidth);
info.text = per+" % loaded";
if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
bar._visible = 0;
bar._xscale = 0;
var w = container._width+spacing, h = container._height+spacing;
//set curwidth
curwidth = w;
border.resizeMe(w, h, id);
delete this.onEnterFrame;
}
};
};

for the y position, the container is scaled from the center, if you set it's _y to border y, it will allways be centered :)

scotty(-:

[sky_vault]

thank you so much Scotty :thumb:
and now you are def. going to want to shoot me
as i just cant seem to wrap my poor little brain around setting the value so it works
on the first picture ... so could you give me an example of doing this please?
thanks again :)

[scotty]

:whistle:


var curwidth=border._width-spacing;
bar._x = border._x-curwidth/2;

scotty(-:

[sky_vault]

thank you :) but it didnt work [most likely because i did something wrong;)]
please take a look at how i have things and let me know if i have messed anything up

var tnNr;
spacing = 10;
container._alpha = 0;
var curLength;
bar._visible = 0;
var curwidth;
var curwidth=border._width-spacing;
bar._x = border._x-curwidth/2;
//curwidth is the width of the current picture
//give it a value if you want to use it for the first pic as well
MovieClip.prototype.loadPic = function(pic, id) {
info.text = "";
//set bar its x position to container x
bar._x = this._x;
this._alpha = 0;
this.loadMovie(pic);
bar._visible = 1;
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
var per = Math.round((l/t)*100);
//set the bar it's width
bar._width = Math.round((l/t)*curwidth);
info.text = per+" % loaded";
if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
bar._visible = 0;
bar._xscale = 0;
var w = container._width+spacing, h = container._height+spacing;
//set curwidth
curwidth = w;
border.resizeMe(w, h, id);
delete this.onEnterFrame;
}
};
};

with how it is now... on first load the bar is not associating its x/y with that of the border/container and it is flashing @ full width and then showing the progress animation and it works perfect for all other images+galleries its just only having these problems on loading the very first image.
thanks again for all your help and sorry to be such a pain and quite clueless on this end. let me know if you need anything additional from this end that may help solve this issue.
thanks
sky

[scotty]

Hmm I've overlooked something...
replace

bar._x = border._x-curwidth/2;
with
container._x = border._x-curwidth/2;
//added to set y dynamically
container._y= border._y

Hope that works (not tested), if not post your fla :)

scotty(-:

[sky_vault]

yeah still not working Scotty
here is my file

V3_thumbs_sky.fla (http://home.earthlink.net/~d03t03o75/kirupa/V3_thumbs_sky.fla)

thanks

[scotty]

Okay I've set the initial width to 0 to prevent flashing, there was a mistake on my side with the code and you had some setting for the bar it's _y in the resizeMe function I've commented all additions changes with '//*'

scotty(-:

[sky_vault]

Thank you! so much Scotty :thumb:
pm me and let me know how you like to be credited
because i plan on using this on my personal porfolio site soon and you
def. deserve the props for all your hard work :)

oh and of course i cant let you off that easy ;)
curious as to how hard would it be to have all the same functionality but instead of
loading consecutive jpg thumbs ... to have just basic buttons instead like how you have it in the playground section of your site.

i have also run into a little problem when loading a swf instead of a jpg
the container clip is much bigger than the actual swf and it has dead space
to the bottom and the right. any ideas ?

[lunatic]

Howdy. I borrowed sky_vault's code (hope you don't mind :ne: ) to throw up a quick gallery of a recent rafting trip for friends and family.

My bar isn't showing - just a blank screen until the first photo fades in and then it says 100% in the info box. What am I missing here?

*edit* Nevermind - I got it working! However I was wondering if there was a way to have the preloader apply to loading the thumbs? I have 167 photos in one of the galleries and it takes a long time to load. Or maybe be able to load a photo as soon as it's thumb appears? Any ideas?

:hr:

[scotty]

I knew you could do it ;)

You can do both (preloader/first pic)
If I have time today I'll put something together:)

scotty(-:

[scotty]

To make the first picture appear while loading the thumbs put

container.loadPic(pArray[0], iArray[0]);
in the makeButtons functions (the place where you call the loadButtons function)

If you want a preloader for your thumbs have a look at the attached fla, the changes I've made are commented :)

*Note with this code you can't do both, the preloader will screw up;)

scotty(-:

[lunatic]

Awesome - I knew YOU could do it! :P :love:

I'll have a look when I get home from work. But what do you mean by "*Note with this code you can't do both, the preloader will screw up"? Does that mean you can't preload the thumbs AND preload the images?

:hr:

[scotty]

LOL, no I gave two possibilities (preloader for thumbs and/or load the first (big) picture). If you want to use them both the preloader will screw up.
But you can preload your thumbs with the preloader and after that use it for the big pics;)

scotty(-:

[lunatic]

Sweet - that's all I need then. As long as users have an idea how long it will take they can go and grab a snack etc. while my buttload of pictures loads. :hugegrin:

Is it possible to implement kirupa auto advance (like a true slideshow) feature into this? I'll have to tinker with that this weekend.

:hr:

[scotty]

Check this thread
http://www.kirupa.com/forum/showthread.php?t=97841 post #6

If I remember well all modifications are commented, if you have problems implementing it let me know ;)

scotty(-:

[lunatic]

:lol: how'd I know this would already have been done and that you would have been the major player?

thanks :love:

[scotty]

:love: you're welcome ;)

[sky_vault]

ok so when i use this Scotty

container.loadPic(pArray[0], iArray[0]);
it loads up some and then once the actual thumb loads on up it
starts over to load from 0% and then completes.
any ideas?

[scotty]

You'll see a similar line in line 134, skip that one;)

scotty(-:

[sky_vault]

thanks :)
im still having problems loading swf's instead of images ... the container clip is not matching the size of the swf ... what ya think i might be doing wrong?

[scotty]

If you're using swf's, give them a solid (transparent) background, else Flash might retrieve the wrong dimensions ;)

scotty(-:

[sky_vault]

thanks again :thumb:
im serious you need to let me know how you want to be credited for this :)

[PaintedSwan]

To make the first picture appear while loading the thumbs put

container.loadPic(pArray[0], iArray[0]);
in the makeButtons functions (the place where you call the loadButtons function)

If you want a preloader for your thumbs have a look at the attached fla, the changes I've made are commented :)

*Note with this code you can't do both, the preloader will screw up;)

scotty(-:

Hi Scotty. :) I was wondering if you could take a look at my .fla...I have a slightly different concept of what kind of loading bar I want, and I'm trying to apply this new code for preloading the thumbs to my current code. I'm having some problems making it translate...the loading bar for the thumbs just keeps increasing in size each time I click on a different gallery. If you have time to look at it, that would be great. Thanks :D

my file is here:
www.swanflighthaven.homestead.com/v3_paintedswan.zip (http://www.swanflighthaven.homestead.com/v3_paintedswan.zip)

[scotty]

My bad, I've overlooked the multiple galleries, so variable totPer isn't reset and starts where it left after loading the first one.
To avoid this, add

totPer = 0;
in the top of the galleryChoice() function :)

scotty(-:

[PaintedSwan]

My bad, I've overlooked the multiple galleries, so variable totPer isn't reset and starts where it left after loading the first one.
To avoid this, add

totPer = 0;
in the top of the galleryChoice() function :)

scotty(-:

Thanks Scotty! That worked great. Now the only problem I'm having is that the loading bar goes over the width that it should if I have a lot of thumbnails, say around 40. Any idea how to fix this?

[lunatic]

A note to anyone who uses the V3_lunatic file - there is one path problem that is very simple to fix.

Anwhere you see "th_nav" make sure there is a "scroll" in front of it as th_nav resides inside the scroll movieclip.

So for example

this.th_nav

should be


this.scroll.th_nav

Then it will work perfectly as all of Scotty's galleries do! :love:

[lunatic]

Hey Scotty sorry to trouble you but I am having one spot of trouble on implementing the slideshow feature.

In the slideshow fla the loadpic function only takes one variable "nr". The "cur" variable is then set to "nr".



MovieClip.prototype.loadPic = function(nr) {
//clear the interval
clearInterval(slideInterval);
info.text = "";
this._alpha = 0;
this.loadMovie(pArray[nr]);
cur = nr;


In the more recent versions of V3 here the function takes two variables "pic" and "id" - one for the image and one for it's description.

So I set cur = pic which should work. The problem I am having is that somewhere (I think in the slideshow function?) where each pic gets increased by one to advance to the next image the variable is getting added to the end of the file name. In other words, it is looking for pic1.jpg1 instead of just pic1.jpg.

Any words of wisdom? :)

[spacerjoe]

WOW! This is some thread!! :hugegrin:

Thanks very much to everyone that posted on this, I've learned tonnes!

Just wondering though if anyone knows of a way of adding rollover features to the thumbs? I tried creating a function similar to the disButtons function on the menu buttons, but it didn't work.

Has anybody any ideas on this?

Thanks again

Joe

[scotty]

lunatic, yep there are two versions, one has in the loadPic function

this.loadMovie(pArray[nr]);
and the other version

this.loadMovie(pic);
where pic is defined in the onRelease (something like)

btn.onRelease =function(){
container.loadPic(pArray[nr]);
}
If you have the latest version in loadPic(), cur is set to pic1.jpg and if you increase that with 1 in the slide function you'll get pic1.jpg1
If you need help with... let me know:love:

spacerjoe: If you look in the make buttons function you'll see the onRelease, you can add your rollover actions there :)

scotty(-:

[PaintedSwan]

Hey Scotty. :) Thanks for fixing the earlier loadbar problem I was having. Did you catch my question regarding what happens to the loadbar if I have a lot of thumbs?

[scotty]

I did, but after testing, the problem didn't occur for me?

scotty(-:

[PaintedSwan]

I did, but after testing, the problem didn't occur for me?

scotty(-:

To see the problem, if you take the V3_lunatic.fla file (after adding the totPer = 0; on the gallery function) and put 40 pics in the xml for the 2nd gallery, the loadbar goes beyond the picture border when you click the 2nd gallery button.

[scotty]

I've just tested it with 42 thumbs (in the second gallery) and it's working...

scotty(-:

[PaintedSwan]

I've just tested it with 42 thumbs (in the second gallery) and it's working...

scotty(-:

Okay, this goes down as one of the strangest problems I've ever had. If I put the thumbs to 42, it works fine, but not at 40! Haha, what's up with that?

edit** okay, so far I notice this problem happens only if the number of thumbs is between 32-40 or if the number of thumbs ends in a 0, like 10, 20, 30...but you have to keep clicking back and forth between galleries to see it. Perhaps it won't bother anyone else lol. :)

[scotty]

It has to do with the Math.round...skip it in the var per definition

var per =((bl/bt)*100)/tArray.length;

scotty(-:

[PaintedSwan]

It has to do with the Math.round...skip it in the var per definition

var per =((bl/bt)*100)/tArray.length;

scotty(-:
You're brilliant! That took care of it...it's been bothering me for days, thanks! :love:

[lunatic]

If you have the latest version in loadPic(), cur is set to pic1.jpg and if you increase that with 1 in the slide function you'll get pic1.jpg1
If you need help with... let me know:love:


Yes I'm a moron and need help! :P
I guess I need to increase cur outside the slide function? I need pic1.jpg to advance to pic2.jpg and then pic3.jpg, not pic1.jpg to pic1.jpg1 to pic1.jpg2 to pic1.jpg3 etc. :trout:

It seems to work fine with the old version that uses nr - I tried it with my own images and it's great! I went over the code from both and matched them almost perfectly - so what am I doing wrong?



MovieClip.prototype.loadPic = function(pic, id) {
//clear the interval
clearInterval(slideInterval);
info.text = "";
bar._x = this._x;
this._alpha = 0;
this.loadMovie(pic);
cur = pic;
bar._visible = 1;
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
var per = Math.round((l/t)*100);
bar._width = Math.round((l/t)*curwidth);
info.text = per+" % loaded";
if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
bar._visible = 0;
bar._xscale = 0;
var w = container._width+spacing, h = container._height+spacing;
curwidth = w;
border.resizeMe(w, h, id);
delete this.onEnterFrame;
}
};
};




function slideshow() {
if (cur == pArray.length-1) {
container.loadPic(0);
} else {
container.loadPic(cur+1);
}
}
play_slide.onRelease = function() {
slide = 1;
slideInterval = setInterval(slideshow, 4000);
};
stop_slide.onRelease = function() {
slide = 0;
clearInterval(slideInterval);
};

[scotty]

LOL, you're no moron, it's very confusing :puzzled:
The easiest way is to change the slideshow function

function slideshow() {
if (cur == pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur+1]);
}
}

scotty(-:

[lunatic]

Awesome - I'll try it out tonight. And no, I never would have thought of that! :P

thanks :love:

[simpleSoft]

Ok can someone please take a look at this...http://www.simplifiedsoftware.org/patriotpress/test_1.htm



Click the button on the stage and notice that when the window resizes the thickness of the boarder changes. Why? Should I apply a scale to it? Or what?

The script is attached. The part of the clip that actually does the resizing is in the function setupWindow(). I don't think that I have changed any other bit of the script other than placing it in a class file. Variables/attributes w & h have stayed the same. So I am a bit lost.

Also, the AS file is attached as well as the FLA. Which is hosted on my site.
http://www.simplifiedsoftware.org/patriotpress/flash/mock_1.fla

Please any help would be greatly appreciated.

[scotty]

Make your border stroke size 'hairline' i/o giving it a thickness (eg 1)

scotty(-:

[3jorn]

Hi again Scott.
I had problem with getting the next back button to work with the thumb script.
I have now been trying to get it to work for a week or so, but I just can't figure it out.
I think the problem is that the thumbnail gallery needs:
pArray.push(gallery.childNodes[i].attributes.source);
But the next button needs the same thing, and I can't have two of the same functions. (I think).
I triend making a new array for the next and back button,
gArray.push(gallery2.childNodes[g].attributes.source);
but I can't get that to work either...

I have the fla file here: www.3jorn.com/stuff/V3_thumbs_mx_almost.fla
If you have the time to take a look :D
Thanks in advanced, and thanks for this thread, it really is the best one ever!

[simpleSoft]

Ok for some reason my shapes don't look as clean as this...http://www.communicationresponsable.com/

See how the windows resize as they come in..? I just am not getting the results. You can see the updated SWF & FLA at the same links that I have posted above. Do you think he drew his rounded boxes outside of flash. Then imported them into flash? Or is he dynamically drawing those shapes as the movie plays?

I figured your stuff on resizing the box would be similar...but obviously not :(

Thanks for all the help.

[scotty]

I think outside flash, see
http://www.kirupa.com/forum/showthread.php?t=87388
how the resize with shadow is done :)

scotty(-:

[simpleSoft]

Scotty thanks for this resource...I am currently going throught the code trying to get a grasp on it's line by line function.

Quick question is...when I take your black outline and turn it into a "rounded" corner...the corners seem to distort. If you were a guessing man you would say this occurs because the aspect ratios skew and thus adjust the corners and make them look trashy...? So if I were to come up with ratios for the window and try that do you think that would help the corners hold their shape?

**EDIT**
Can you take a look at the movie now? http://www.simplifiedsoftware.org/patriotpress/test_1.htm

I have just copied and pasted your pieces into the class file...as well as the same MovieClips...when the MovieClip is generated...notice that the shadow is off of the movieclip? Why...

FLA: http://www.simplifiedsoftware.org/patriotpress/flash/mock_1.fla

[PaintedSwan]

Hey Scotty. :D Since I am extremely inept at actionscript math, I was hoping you could help me with the placing of the 'info' on the V3 gallery with thumbs. I was hoping to put the 'info' at the top instead of the bottom of the pic, but the tinkering I'm doing on the code isn't working, and I've come to the conclusion that I just suck at actionscript if it involves math of any kind lol. :lol:



info._y = Math.abs(this._y+this._height/2+spacing/2+6);


Any help would be great. :)

[scotty]

@PaintedSwan: the _y of the border is in the center, the way the code is it will increase info._y with half borders heigth (so it touches the bottom line) =plus spacing/2+6 which will give you a gap between the border and the textfield.
Now you want it on top, so you have to decrease those values

info._y = Math.abs(this._y-this._height/2-spacing/2-6);

@simpleSoft: in the original code the borders registration point is in the centre, I guess you have it topleft, so I guess you'll have to adjust the code for the x/y settings of the shadow. I'll have a look at your fla later, but I think you can adjust that yourself =)

scotty(-:

[PaintedSwan]

@PaintedSwan: the _y of the border is in the center, the way the code is it will increase info._y with half borders heigth (so it touches the bottom line) =plus spacing/2+6 which will give you a gap between the border and the textfield.
Now you want it on top, so you have to decrease those values

info._y = Math.abs(this._y-this._height/2-spacing/2-6);

scotty(-:

Thanks for replying Scotty! :) Are there any other lines I need to change? Unfortunately, just replacing this line of code with the code you gave me puts the text slightly above the bottom of the pic.

[scotty]

Yes, I forgot there are two lines...

MovieClip.prototype.resizeMe = function(w, h, id) {
var speed = 3;
container._alpha = 0;
this.onEnterFrame = function() {
//changes here
info._y = Math.round(this._y-this._height/2-spacing-10);
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
container._x = this._x-this._width/2+spacing/2;
container._y = this._y-this._height/2+spacing/2;
//changes here
info._y = Math.round(this._y-this._height/2-spacing-10);
bar._x = this._x-this._width/2+spacing/2;
container._alpha += 5;
if (container._alpha>90) {
info.text = id;
container._alpha = 100;
delete this.onEnterFrame;
}
}
};
};

btw there's no need for the Math.abs should read Math.round

scotty(-:

[PaintedSwan]

Yayy! That worked brilliantly, thank you for your help! You rock. :D

[scotty]

no problem ;)

[spacerjoe]

Hi

I was wanting to add a button to the gallery that allows people to download the current photo, but have now realised I have know idea what the code is for downloading files in Flash?

I know it's a pretty basic question but can anybody tell me what the command is? I can't find it anywhere!!

I know it must go in the activate buttons function, just don't kow how to call it!! :puzzled:

download.onRelease = function() {
"download code" (pArray[this.id]); }


cheers
Joe

[maxray]

I know it's a pretty basic question but can anybody tell me what the command is? I can't find it anywhere!!

I know it must go in the activate buttons function, just don't kow how to call it!! :puzzled:

download.onRelease = function() {
"download code" (pArray[this.id]); }


cheers
Joe

Havent taken time to actually think about it but surely it will just be a getUrl ?

[yamyam21]

Hi there,

sorry to but in, however does anyone know how i can add a link to the xml, so that when the images change they have a new set of text/info and a link to another site/flash movie it in.

any ideas would be really helpful, its doing my nut in.

Ta

Yam

[imported_Mrrufus]

Hullo,

I'm trying to modify the "resize height" gallery code so that it would scale from the bottom right rather than from the center top, but I can't figure out how to change the registration point...?
Anybody managed to do this?

Rufus

[imported_Mrrufus]

Ok,

Got it...For anyone who wants to know: if you want to rescale from the bottom with a fixed y position in the "resize height" gallery:
replace this line (line 44 in the original file):

containerMC._y = this._y+spacing/2;

with this:

containerMC._y = (this._y+spacing/2)-this._height;

duh...just subtract the entire height... :drool:
Been said here a million times, but thanks Scotty for the sweet code!!

Rufus

[sky_vault]

hey Mrrufus
is there more to it than just that one line of code?
because it dont work for me

also Scotty if you could help me figure this one out
its about making a button thats onRelease action
changes with each new image and is defined in the XML doc
as in im trying to set the button the either open a larger version
of the image in a new window or even open up a specific website

i posted my question over in serverside and it got moved over to actionscript
here is a link http://www.kirupa.com/forum/showthread.php?t=100684
i guess i should have just posted it in this thread to begin with ... oh well.

if you could help me figure this out ... well that would be great :)

thanks*

[imported_Mrrufus]

Hey Sky_vault,

That's strange...it should just work like this. Can you post your fla or code?

Rufus

[sky_vault]

well all it did was give each picture a fixed _y position when it faded in (or i should
say the same _y position) but im sure ive just used it incorrectly;)

[MAG1CO]

EDITED:
i did a bit of what i was after
basically all i need to know is if anyone ANYONE
can please post some code so that when another "gallery" link is clicked - it replaces the scroll bar back to its start position at the top. i think it would be a nice touch and would definatly fit the site im working on.
any help or info much appreciated
thanks in advance!

[yamyam21]

hi there, could anyone help me (gently prod me in the right direction) to how i go about changing the image gallery so i can add links into the xml.

any help would be most useful.

cheers

Yam.

[antnb]

hi there,

could anyone help me to adapt the code so that iArray loads a .txt file into 'info' rather than the text in the 'title=' section of the XML file.

any help would be most useful.

cheers

antnb

[lunatic]

I'm back! :beam:

Well I finally got some time to sit down and try to get this thing working again. I'm still having problems with the slideshow functionality.

*edit* I know what my problem is but not how to fix it. I've got this code that Scotty gave me:



function slideshow() {
if (cur == pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur+1]);
}
}


when you trace cur you get the name of the image, like
"mypics/pic1.jpg"

so flash doesn't know what to do with "mypics/pic1.jpg" + 1

Any ideas on how to grab the current spot of the array instead of the name of the pic? Or some other way of advancing to the next pic?

[tgfx]

LOL, no I gave two possibilities (preloader for thumbs and/or load the first (big) picture). If you want to use them both the preloader will screw up.
But you can preload your thumbs with the preloader and after that use it for the big pics;)

scotty(-:

Scotty, thanks a lot for all of your work with this! You've done an amazing job.

I've been trying to figure out how to stop the first pic from being displayed. Is there a way to do this? Whenever you click on a certain gallery it defaults to show the first pic/thumb. Thanks again.

[lunatic]

Hey gang,

I just figured out how to change the tint of the thumb to show which picture is currently loaded.

In this function add the lines that are commented:


function disButtons2(d) {
for (var i = 0; i<tArray.length; i++) {
//set a new color object
boxcolor = new Color(this.scroll.th_nav["thmb"+i].box);
//set a new color transform object
//use rgb values gotten from the slider
//a sets alpha value (transparency)
//b sets the rgb color
//this sets it to a purplish color w/80 percent alpha
boxcolortransform = {ra: 80, rb: 102, ga: 80, gb: 51, ba: 80, bb: 255};
//this resets the colors and alpha to normal
boxcolornormal = {ra: 100, rb: 0, ga: 100, gb: 0, ba: 100, bb: 0}
if (i != d) {
this.scroll.th_nav["thmb"+i].enabled = 1;
this.scroll.th_nav["thmb"+i].box._alpha = 100;
//set the color to normal
boxcolor.setTransform(boxcolornormal);
this.scroll.th_nav["thmb"+i].gotoAndStop(1);
} else {
this.scroll.th_nav["thmb"+i].enabled = 0;
//set the color to purple when clicked
boxcolor.setTransform(boxcolortransform);
this.scroll.th_nav["thmb"+i].gotoAndStop(2);
}
}
}


You can see it in action here:
color tint in action (http://freeflowdesigns.com/GreenRiver.swf)

let me know if you have any questions!

:hr:

[scotty]

Nice job :love:

scotty(-:

[lunatic]

Thanks! :love: I feel inexplicably proud of myself for figuring out something so simple. :lol:

Any ideas on the slide show? :ne:

[scotty]

@lunatic: can you post your fla so I can have a look? It seems that stalker took his thumb with scroller fla from the server and I don't have it :hurt:

@tgfx: depends on what version you're using but look in the code for

containerMC.loadPic(0)
//or
container.loadPic(pArray[0], iArray[0]);
and skip that line:)

@antnb: make a new function where you load the text and call that function in the onRelease

@yamyam21: you can add some onRelease actions after the picture is fully loaded (so eg at the end of the resizeMe function)

@MAG1CO: see my answer to lunatic, I need to have the fla for that

scotty(-:

[lunatic]

emailed :love:

[flashwillkill]

Ola,
I am having somewhat the same problem lunatic is having (advancing my images).
I want when the big image is open to have a prev and next button, like in the regular V3.zip,
but I can not make it happen ...

The issue was adressed here (post #814 and post #823) but you guys lost me ...
http://www.kirupa.com/forum/showthread.php?t=132588&page=55&pp=15

I use the V3_with_thumbs and I am totally confused with all the "pic", "id", "cur"
and loadPic(somethingArray[this.id]);
This does not work right:


prev_btn.onRelease = function() {
cur--;
if (cur<0) {
container.loadPic(pArray.length-1);
} else {
container.loadPic(pArray[cur]);
}
};
next_btn.onRelease = function() {
cur++;
if (cur>pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur]);
}
};

Here the loadPic function and the onRelease that are important.
Someone? (If this was adressed already, excuse me for posting ... ;) sorry.


MovieClip.prototype.loadPic = function(pic, id) {
info.htmlText = "";
this._alpha = 0;
this.loadMovie(pic);
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
var per = Math.round((l/t)*100);
loadBar._xscale = per;
if (Math.round(l/t) == 1 && t>4) {
loadBar._xscale = 0;
container.fader("fadeIn", 10, 100);
delete this.onEnterFrame;
}
};
};

function activateButtons() {
mainButtons();
for (var i = 0; i<pArray.length; i++) {
var but = thumbs.th_nav["thmb"+i];
but.id = i;
but.onRelease = function() {
container.loadPic(pArray[this.id], iArray[this.id], mArray[this.id]);
//disButtons2(this.id);
info.htmlText = iArray[this.id];
media.htmlText = mArray[this.id];
};
}
//container.loadPic(pArray[0], iArray[0]);
//disButtons2(0);
}

Thanks :)

[lunatic]

trace cur in the prevBtn function - what do you get?

[scotty]

Set cur in the onRelease to this id

var cur;
function activateButtons() {
mainButtons();
for (var i = 0; i<pArray.length; i++) {
var but = thumbs.th_nav["thmb"+i];
but.id = i;
but.onRelease = function() {
container.loadPic(pArray[this.id], iArray[this.id], mArray[this.id]);
//added
cur = this.id;
info.htmlText = iArray[this.id];
media.htmlText = mArray[this.id];
};
}
//container.loadPic(pArray[0], iArray[0]);
//disButtons2(0);
}

scotty(-:

[flashwillkill]

:stunned: That was fast ...


trace cur in the prevBtn function - what do you get?

:ponder:
like this?

prev_btn.onRelease = function() {
cur--;
if (cur<0) {
container.loadPic(pArray.length-1);
} else {
container.loadPic(pArray[cur]);
}
trace(cur);
};

Output:
-1
Error opening URL "file:///D|/%5FExamples/Galleries/01/5"
:eye: hm, ... 01 is my main folder. What is 5?
For testing I have 6 images (6-1)?

[flashwillkill]

:sen: lol, I wish I could think that fast!

scotty, that worked :thumb: , but ............
when i have the first image and click prev, it does
what i wrote to lunatic (-1, errow sth) and when I have
the last image and click next, it loads the last image over
and over again ...

:ponder: but we did a function setPrefPop(id) in the xml portfolio
from senocular and enabled the buttons for those 2 cases
(first no prev butt and last no next butt)!!

Let me try that, I'll be back ;)
(Or are there better options?)

[scotty]

Can you post your fla?

scotty(-:

[flashwillkill]

you've got mail :hr:

[vnuk]

Hi there! Since im a noob Im having some problems :) im using the multiple_resize gallery and now I want to add thumbnails and still be able to change galleries.

like on this site: http://braingiants.com/noriomatsumoto/gallery.html

but I can not make it happen...

any help would be useful. thanks!

[flashwillkill]

Hi vnuk,
the V3_with_thumbs.zip here ...
http://www.kirupa.com/forum/showthread.php?t=87388
has multiple galleries and thumbs.

stalkers version has scrolling thumbs ;)

[vnuk]

Oh! didnt see that one...feel stupid :thumb:

thanks alot! ill check that one out. I want the scroll to move horizontal thou...but maybe thats not so hard to edit.

[flashwillkill]

lol, we all get tunnel vision sometimes :eye:

issue horizontal ... dont have the file infront of me but as a recall
play around with/change the x and y's and the heigth and the width
for the dragger thingy ...

2nd guess: search this thread. I am a gazillion sure that it has
been asked before (-:

[vnuk]

thank you for your fast answers! this thread is awsome! Really nice of you guys.

Ill sure be back with some newbie questions for you :)

[vnuk]

here we go again :tb:

I cant get my dragger to move in the x direction.

i want my thumbnails to be lined up like this: http://www.kirupa.com/forum/showthread.php?t=72457&page=2&pp=15

like in the the navHor.fla

[MEvsYOU]

http://www.podlob.com/
click on #1. under "flash Research"

Ive tried searching these forums for resizing and slideshow but dont get what im looking for.

Im trying to learn how to build a thumbnail gallery that when you click on the thumbnail the photo will load in an empty movie clip and the emptymovieclip will resize itself to the size of the photo.

i guess i dont know what its called. but that link is pretty much what im looking for if I could turn those little numbers hes got there into thumbnails....

Hi! I love how that Mp3 Player looks man. I can use that on my website? How can i get the player/fla? Thx.

[lunatic]

I think you are in the wrong thread for that. :P

Voetsjoeba has a wicked mp3 player on his website - you should check it out:

http://www.voetsjoeba.com/lab.php?i=16

:hr:

[spacerjoe]

Havent taken time to actually think about it but surely it will just be a getUrl ?

Hi there

Yeah, that's what I had tried but it just put the variable name in the address line of the browser.

Not sure how to fix this??

cheers
Joe

[MAG1CO]

@MAG1CO: see my answer to lunatic, I need to have the fla for that

scotty(-:

i shall post my flash on here? or email? whats best...
thanks again :)

[neltay]

Hi, I'm trying to add a preloader using what has been done in V3 with thumbs.

How do I incorporate a movie clip as a preloader while the picture is loading?

Something like what has been done here:
http://www.danielfloss.com/

Also a bar preloader for the swf. I tried doing it but i think i messed up the code...

Pls help...

Thanks!!
Nel.

[authentik]

http://www.myflashxml.com/swf.asp?page=http://www.Myflashxml.com/003/swf/n_black/index.html

I want to add those menus from the right and left part and i don't know how.
An example or code shoul be usefull.
Thanks!

[neltay]

does anyone have the fla mx version for v3 scrolling thumbnails? (http://www.2rdesign.com/gallery/zip/V3_with_thumbs_scrolled.zip)

Would be a great help!!!

Nel.

[PaintedSwan]

Hey Scotty. :) I was wondering, is it possible at all to configure the art gallery to be able to read .gif as well as .jpg? Thanks.

[PaintedSwan]

Hey Scotty. :) I was wondering, is it possible at all to configure the art gallery to be able to read .gif as well as .jpg? Thanks.
I'm assuming this is the answer to my question. :( http://www.kirupa.com/forum/showthread.php?t=67284&highlight=gif

That's a pretty cruddy reality if you ask me.:sigh:

[motionsync]

I have follow question:

We have

function disButtons(d) {
for (var i = 0; i<butArray.length; i++) {
if (i != d) {
this[butArray[i]].enabled = 1;
this[butArray[i]].gotoAndStop(1);
} else {
this[butArray[i]].enabled = 0;
this[butArray[i]].gotoAndStop(3);
}
}
}

Now I like to do this:

On rollOver this[butArray[i]].gotoAndStop(2);

On rollOut this[butArray[i]].gotoAndStop(1);

How I can put it in my code?

[medina_green]

Hi guys!

- first of I must say I've learned more from KirupaForums then any class and book combined... thanks a million to all of you...for what you have going here -

Now, I've been following this thread since the beginning and I can't believe this question has not come up (or has it and I've just totally missed it :pa: ) I have seen tutorials for similar things, but not for the resizing slideshow used in this forum.

how do you add an external link, to either the "title" or the "image" ???

(ie. click on the title and it opens a new window to a dif site)

[scotty]

Welcome to kirupaforums =)

Which version of the resize fla you're using?

scotty(-:

[medina_green]

Welcome to kirupaforums =)

Which version of the resize fla you're using?

scotty(-:


Thanks scotty!

The version I've been working with is, V3_thumbs_scrolled :sure:

[scotty]

In your xml add a new attribute 'link'

<image source="pics/pic1.jpg" thumb="pics/th1.jpg" title="Earth" link="pic1.html"/>
//or
<image source="pics/pic1.jpg" thumb="pics/th1.jpg" title="Earth" link="http://www.kirupa.com"/>
In the fla I've made a new array that holds the links. Most important is that you give the picture it's onRelease actions after the picture is fully loaded :)
Change are commented in the AS.

scotty(-:

[hybred]

hello

i've been watching this great thread since the beginning and saw somewhere how to make the V3 gallery (w. thumbs) auto rotate through the pics..

now for the life of me i can't find it again (searched and searched)
can anyone help?!

ps. thanks for all the great posts already!

[scotty]

hybred, it has been discussed before (around page 55) but the link I gave lunatic points at an invalid thread, so here's the file again:)

scotty(-:

[hybred]

ah fantastic, thanks so much.

thought i might put a spin on the V3 gallery. i'm generating the XML code from an ASP page linked to a database. this allows me to easily add and remove galleries, text pics etc. however i'm having trouble even starting to think about how the configure the flash AS to read the number of galleries in the XML dynamically (phew) :h:

gonna hit the books to try and work it out but any suggestions would be great!

thanks again for the post scotty :beam:

[scotty]

You're welcome=)

I haven't a clue how to do it with ASP, but it's possible with PHP, maybe this will help
http://www.kirupa.com/forum/showthread.php?t=57082&highlight=Gallery+php

scotty(-:

[hybred]

ah yes.. i've been reading that one.. v. cool
i was more looking at modifying the AS in the latest gallery on this thread to dynamically reflect the addition and removal of galleries in the external XML.

but i'm still scratching my head... :q: more reading needed :nerd:

cheers

[medina_green]

In your xml add a new attribute 'link'

<image source="pics/pic1.jpg" thumb="pics/th1.jpg" title="Earth" link="pic1.html"/>
//or
<image source="pics/pic1.jpg" thumb="pics/th1.jpg" title="Earth" link="http://www.kirupa.com"/>
In the fla I've made a new array that holds the links. Most important is that you give the picture it's onRelease actions after the picture is fully loaded :)
Change are commented in the AS.

scotty(-:


scotty you ROCK
works like a charm!!!! the comments were great now I know how it works! thanks a MILLION!
:love: :love:

[scotty]

medina_green: you're welcome =)

hybred: ah, I've misread your post. It isn't that hard to retrieve the number of galleries in the xml. You can use 'this.firstChild.childNodes.length' for that (and eg create buttons according to this number)

scotty(-:

[hybred]

thanks scotty..
i wish your post had made me say 'ah ha, of course'. but i'm too much of a newbie at actionscript.. :puzzled:
gonna have a play though :book:

cheers :beer:

[PaintedSwan]

Hey Scotty :D

I was wondering how I would go about continuing to preload the other images in the background after the thumbnails load and the first image is displayed. Perhaps show the progress by some kind of preloader on the thumbnail itself?

If this has been addressed before, please direct me to the thread...I searched and searched, but this thread is so long I easily might have missed it lol. Thanks. :)

***Edit***

Okay, I found something Stringy put together that displays what I'm talking about quite well, in terms of the thumbnails anyway:

http://www.fmx6.com/loadvis.swf
http://www.kirupa.com/forum/showthread.php?t=185881&highlight=load

-swan

[scotty]

Maybe this will help as well
http://www.kirupa.com/forum/showthread.php?t=173615 post #2

scotty(-:

[PaintedSwan]

Maybe this will help as well
http://www.kirupa.com/forum/showthread.php?t=173615 post #2

scotty(-:

Thanks for the reply, Scotty. :) I wish I was advanced enough in my knowlege of AS to combine all of these things, but I'm not quite there yet. If you could give me a point in the right direction on how to apply this to the resize gallery, I'd be very grateful. =)

-swan

[wo1olf]

question?
how can i add under the slideshow a dynamic menu, that move following the size of the window (border of the container mc) ? For example if the boder get bigger, then the menu goes down, if the border get smaller the menu goes up.
the menuewould be made of thumbnails of pics that are to be loaded when clicked
wo1olf

[wo1olf]

how can i add a preloader that display the size of the image loaded ?

[hybred]

hello all

been trying to dynamically retrieve the number of galleries but with no luck..
I can't seem to get my head around looping through a new array and referencing it to the existing code...
any help would be fantastic..


numtitle = this.firstChild.childNodes.length;
spacing = 70;
for (i=0; i<numtitle; i++) {
titleHolder = this.firstChild.childNodes[i];
mainHolder = mainTitle.duplicateMovieClip("mainTitle"+i, i);
mainHolder._y = i*spacing;

mainHolder.title = titleHolder.attributes.name;

mainTitle.main.text = mainHolder.title;
};

butArray = new Array();
butArray = mainTitle ;
function mainButtons() {
for (var i = 0; i<butArray.length; i++) {
this[butArray[i]].id = i;
this[butArray[i]].onRelease = function() {
galleryChoice(this.id);
disButtons(this.id);
};
}
}


messy as hell i know!

thanks

[hybred]

hello again.. i've got this far but can't load the respective galleries...

function GenerateList(my_xml) {
var mainList = my_xml.firstChild.childNodes;
for (var i = 0; i<mainList.length; i++) {
var currentTitle = mainList[i];
var currentTitle_mc = mainBut_mc.duplicateMovieClip("mainBut_mc"+i, i);
currentTitle_mc._y = i*(i+50);
currentTitle_mc.duplicateMovieClip("mainBut_mc"+i, i);
currentTitle_mc.mainBut_mc[i].loadMovie(currentTitle.attributes.name);
currentTitle_mc.but.text = currentTitle.attributes.name;
//trace(currentTitle.attributes.name);

currentTitle_mc.onRelease = function() {
galleryChoice(i);
disButtons(i);
};

}
}

var my_xml = new XML();
my_xml.ignoreWhite = true;
my_xml.onLoad = function(success){
if (success) GenerateList(this);
else trace("Error loading XML file");
}
my_xml.load("gallery.xml");

it's also duplicating one to many list items.. doh

many thanks as always

[hybred]

Apologies... i should work on a bit more before i post things..
with a little tweeking i managed it..
i'm still getting the list plus the original movie clip but maybe someone has an idea on this...
anyway thanks v.much

function GenerateList(my_xml) {
var mainList = my_xml.firstChild.childNodes;
for (var i = 0; i<mainList.length; i++) {
var currentTitle = mainList[i];
var currentTitle_mc = mainBut_mc.duplicateMovieClip("mainBut_mc"+i, i);
currentTitle_mc._y = (i+i)*10;
currentTitle_mc.duplicateMovieClip("mainBut_mc"+i, i);
currentTitle_mc.mainBut_mc[i].loadMovie(currentTitle.attributes.name);
currentTitle_mc.but.text = currentTitle.attributes.name;
//trace(currentTitle.attributes.name);
currentTitle_mc.id = i;
currentTitle_mc.onRelease = function() {
galleryChoice(this.id);
disButtons(this.id);
}
}
}

[PaintedSwan]

This question is for Scotty, Lunatic, or anyone else familiar with the resize gallery. I'm trying to add the disable buttons code to the infinte menu version, and it's only *sorta* working. For some reason, the thumbnail flickers if I rollover the other thumbnails. I assume it has something to do with one of the onEnterFrames. Anyhow, any help would be appreciated...I'm sure it would only take a slight bit of tweeking.

function makeMenu() {
clearInterval(delay);
var item = sub_menu.createEmptyMovieClip("pic"+q, q);
item.loadMovie(pictArray[p]);
var temp = _parent.createEmptyMovieClip("tmp", 9999+q);
temp.onEnterFrame = function() {
var tot = item.getBytesTotal();
var loa = item.getBytesLoaded();
var per = Math.round(((loa/tot)*100)/(pictArray.length*2));
loadBar._xscale = loadper+per;
if (tot == loa && tot>4) {
item.id = p;
loadper += per;
if (q>0) {
item._x = sub_menu["pic"+(q-1)]._x+sub_menu["pic"+(q-1)]._width;
} else {
item._x = 0;
}
item.onRelease = function() {
containerMC.loadPic(this.id);
disButtons2(this.id);
};
nextItem();
delete this.onEnterFrame;
}
};
}
var center = Stage.width/2;
var speed = .05;
function activateMenu() {
menu.onEnterFrame = function() {
var distance = _root._xmouse-center;
if (mask.hitTest(_root._xmouse, _root._ymouse)) {
this._x += (-distance*speed);
if (this._x<-sub_menu._width/2) {
this._x = 0;
}
if (this._x>0) {
this._x = -sub_menu._width/2;
}
}
};
containerMC.loadPic(0);
disButtons2(0);
}
function disButtons2(d) {
for (var i = 0; i<pictArray.length; i++) {
//trace(sub_menu["pic"+i]);
if (i != d) {
sub_menu["pic"+i].enabled = 1;
sub_menu["pic"+i]._alpha = 100;
} else {
sub_menu["pic"+i].enabled = 0;
sub_menu["pic"+i]._alpha = 50;
}
}
}

[freddie]

hey scotty, is it possible to have a sort of horizontal scrubber / bar that would allow you to scrub along the images / and the bar moves with each newly loaded image.... sorry if this is confusing or if this has already been asked, i searched but i didnt find anything that could help me out...

i found a sample of what i am hoping to achieve
http://www.boostmobilestreetball.com/ - under the photo link

thanks to all who could help out ,....

[PaintedSwan]

In the hopes someone might answer my question about the infinite gallery thumbs, I've attached my .fla. :)

[Sparky_J]

hybred, did you get that to work? I think we are trying to do the same thing. At load, dynamically make the buttons for the galleries with a scroller, so basically you could load as many pics and galleries you want, only having to edit the XML files and graphics.

[hybred]

hi Sparky_J, yeah i did get it to work eventually, though i used the duplicate movieclip as then i didn't know much about the create textbox action. i'll attach my as. for you to look at.. whats driving me crazy at the moment is trying to create an asp page that can use nested repets to create the XML code.. but i think that's for another thread:ne: , anyone??

[darylws]

I just wanted to say a HUGE Thankyou!! to everyone who's been contributing to this thread! I needed a quick Gallery facility this week and this fitted the bill perfectly - I had to ake some alterations and although the code is probably less than perfect it seems to do the job very well.

If anyone wants to see the end result it's at the bottom of this page:
http://www.south-milford.co.uk/events/

If anyone wants to see the hash I made of the code I'd be more than willing to post it.

Cheers again guys!!

Daryl

[Nosmo King]

nice job daryls...

I like the dynamic gallery buttons.

If you could post the code... I would like to see how you done it.

TIA

[jerryj]

hi,

I modified Scotty's code, integrating Laco tweens. You can find this modification and actually all the versions and modifications up til now at this seperate thread:

http://www.kirupa.com/forum/showthread.php?t=87388 (http://www.kirupa.com/forum/showthread.php?t=87388)

Jerryj.

[Ubik]

Hello, i will add a question to this infinite thread ! I'm using the v3 with thumbs, it works excellentfully well offline but online it shows only the thumbnail and won't load any pictures, i don't know what it could, i didn't modified the AS, only the xml and i kept the structure. You can see the issue on www.mikaelfalke.com (http://www.mikaelfalke.com) click on see and choose a gallery.
Any help appreciated,
Thanks

Ubik

[darylws]

Cheers Nosmo!

Here's the code and XML without the pictures - It could do with a bit of tidying up as the XML is loaded in the second scene (where the array is created for the dynamic gallery buttons) then again in the main movie - if I get a chance to work on it some more I'll post it again but in the meantime.......

Amendments:
- Added Movie preloader in Scene1
- Added XML loader in Scene 2 to create Dynamic Gallery buttons
- Altered XML to incorporate Gallery title attributes
- Changed the thumbnail alignment (now vertical)
- Added vertical scroll buttons for thumbnails (still needs some work)
- Added image preloader
- Added Highlight state for first gallery
- Added titles to thumbnails (relevant to this project)

Here's the link (http://www.south-milford.co.uk/events/index.htm) again to the finished gallery.

Cheers!

Daryl

[Ubik]

This is fixed, sorry. Was a problem of naming the jpeg, i didn't know it was case sensitive on the server, good to know !:hugegrin:

[jasmine]

V3_thumbs_scrolled

hello, i am trying to figure out how i would enable the thumbnail buttons before the entire set of thumbnails loads (i will have over 100 photos in one gallery, so it would take a very long time for all the thumbs to load before the viewer is able to click on photos) - so i want the thumbnail buttons to be active as soon as it is loaded.

any help would be greatly appreciated.

thanks so much,
van

[jasmine]

hello, i have been searching the entire forum trying to find a fix for this - some other people have talked about it - but i still can't get it to work correctly.

i'm trying to use next_btn and pre_btn with v3_thumbs_scrolled - but can't seem to get it to work right - all it does is end up on the second picture and it just stays there...

please please help!



prevb.onRelease = function() {
if (cur == pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur+1]);
}
}
nextb.onRelease = function() {
if (cur == pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur+1]);
}
}
disButtons(0);
galleryChoice(0);



here is the entire code, incase this helps at all...

var tnNr;
spacing = 10;
container._alpha = 0;
var curLength;
MovieClip.prototype.loadPic = function(pic, id) {
info.text = "";
this._alpha = 0;
this.loadMovie(pic);
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
var w = container._width+spacing, h = container._height+spacing;
border.resizeMe(w, h, id);
delete this.onEnterFrame;
}
};
};
MovieClip.prototype.resizeMe = function(w, h, id) {
var speed = 3;
container._alpha = 0;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
container._x = this._x-this._width/2+spacing/2;
container._y = this._y-this._height/2+spacing/2;
container._alpha += 5;
if (container._alpha>90) {
info.text = id;
container._alpha = 100;
delete this.onEnterFrame;
}
}
};
};
function galleryChoice(q) {
pArray = new Array();
tArray = new Array();
iArray = new Array();
my_xml = new XML();
for (var j = 0; j<curLength; j++) {
this.scroll.th_nav["thmb"+j].removeMovieClip();
}
my_xml.ignoreWhite = true;
my_xml.onLoad = function(loaded) {
if (loaded) {
gallery = this.firstChild.childNodes[q];
curLength = gallery.childNodes.length;
gallery_txt.text = gallery.attributes.info;
for (var i = 0; i<gallery.childNodes.length; i++) {
pArray.push(gallery.childNodes[i].attributes.source);
tArray.push(gallery.childNodes[i].attributes.thumb);
iArray.push(gallery.childNodes[i].attributes.title);
}
}
delay = setInterval(makeButtons, 50);
};
my_xml.load("gallery.xml");
}
function makeButtons() {
tnNr = 0;
clearInterval(delay);
for (var i = 0; i<tArray.length; i++) {
var thb = scroll.th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i);
thb.id = i;
thb._x = i%4*50;
thb._y = Math.floor(i/4)*50;
}
loadButtons();
}
function loadButtons() {
var tbox = scroll.th_nav["thmb"+tnNr].box;
tbox.loadMovie(tArray[tnNr]);
temp = this.createEmptyMovieClip("tmp"+tnNr, 999);
temp.onEnterFrame = function() {
bt = tbox.getBytesTotal();
bl = tbox.getBytesLoaded();
if (bt == bl && bt>4) {
nextButton();
delete this.onEnterFrame;
}
};
}
var totPer;
function loadButtons() {
var tbox = scroll.th_nav["thmb"+tnNr].box;
tbox.loadMovie(tArray[tnNr]);
temp = this.createEmptyMovieClip("tmp"+tnNr, 999);
temp.onEnterFrame = function() {
container._alpha = 0;
bar._visible = true;
box._visible = true;
bt = tbox.getBytesTotal();
bl = tbox.getBytesLoaded();
var per = Math.round(((bl/bt)*100)/tArray.length);
bar._width = ((totPer+per));
info.text = "Loading Photo "+(tnNr+1)+" of "+tArray.length+"";
if (bt == bl && bt>4) {
nextButton();
totPer += per;
delete this.onEnterFrame;
}
};
}
function nextButton() {
if (tnNr<tArray.length-1) {
tnNr++;
loadButtons();
} else {
activateButtons();
}
}
function activateButtons() {
mainButtons();
for (var i = 0; i<pArray.length; i++) {
var but = scroll.th_nav["thmb"+i];
but.id = i;
but.onRelease = function() {
container.loadPic(pArray[this.id], iArray[this.id]);
disButtons2(this.id);
};
}
container.loadPic(pArray[0], iArray[0]);
disButtons2(0);
}
butArray = new Array();
butArray = ["gal1_btn", "gal2_btn", "gal3_btn", "gal4_btn", "gal5_btn", "gal6_btn", "gal7_btn", "gal8_btn", "gal9_btn"];
function mainButtons() {
for (var i = 0; i<butArray.length; i++) {
this[butArray[i]].id = i;
this[butArray[i]].onRelease = function() {
galleryChoice(this.id);
disButtons(this.id);
};
}
}
function disButtons2(d) {
for (var i = 0; i<tArray.length; i++) {
if (i != d) {
this.scroll.th_nav["thmb"+i].enabled = 1;
this.scroll.th_nav["thmb"+i].box._alpha = 100;
} else {
this.scroll.th_nav["thmb"+i].enabled = 0;
this.scroll.th_nav["thmb"+i].box._alpha = 10;
}
}
}
function disButtons(d) {
for (var i = 0; i<butArray.length; i++) {
if (i != d) {
this[butArray[i]].enabled = 1;
this[butArray[i]].gotoAndStop(1);
} else {
this[butArray[i]].enabled = 0;
this[butArray[i]].gotoAndStop(2);
}
}
}
prevb.onRelease = function() {
if (cur == pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur+1]);
}
}
nextb.onRelease = function() {
if (cur == pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur+1]);
}
}
disButtons(0);
galleryChoice(0);

[ElNacho]

monsters! sorry had to do that...

[flashwillkill]

Hi Kirupians,
I am using the v3_with_thumbs and have
another problem with clearInterval and my changes made to the gallery.
I am trying to load different slideshow projects into the xml gallery!!!

If you take a look at the slide.fla file (well, I put sooo many clearIntervals into it ... ), but still nothing.
In the gallery 1, press the 2nd + 3rd button a couple of times, You might see what I mean. The interval
accumilates and ignores the clear Interval.

I changed this (added clearInterval(slideInterval);):

function activateButtons() {
mainButtons();
for (var i = 0; i<pArray.length; i++) {
var but = th_nav["thmb"+i];
but.id = i;
but.onRelease = function() {
clearInterval(slideInterval);
container.loadPic(pArray[this.id], iArray[this.id]);
disButtons2(this.id);
};
}
container.loadPic(pArray[0], iArray[0]);
disButtons2(0);
}

Please, does somebody know whats wrong with it? How can I kill the interval a load different
slideshows??
Why are simple things always sooo much work?
Help (or just a tiny hint) is greatfully appreciated.

[flashwillkill]

woops, where did the files go? ;)

[minsk]

container.loadPic(pArray[cur+1]);
change to cur++


so the coad would look like this

container.loadPic(pArray[cur++]);


worked fine for me

[remixed22c]

(My first post! I'm pretty new to actionscript, but I like it so far!)

I have a question about the use of setinterval() in the resizeBorder_multi.fla.

Inside the function galleryChoice(a), the XML onLoad event is defined by a function whose last task is to load the first picture into the container:

//loading first picture
id = setInterval(containerMC, "loadPic", 100, 0);

Is it necessary to have setinterval() call loadPic() ? Can you just call containerMC.loadPic(0); ?

I notice that the first thing that loadPic() does is call clearInterval(id), so I'm guessing that there's some reason for calling loadPic every 1/10th of a second, maybe something to do with the time it takes to load XML data or something?

Thanks for the help in advance.

[jasmine]

this worked perfectly!!!! thank you so much for helping with the next_button problem!

take care,
jasmine



container.loadPic(pArray[cur+1]);
change to cur++


so the coad would look like this

container.loadPic(pArray[cur++]);


worked fine for me

[DDD]

Hello all

Is anyone interested in helping out a poor AS challenged soul? I want to mix JerryJ's version with the Lacotweens, next/previous buttons and thumbs on the bottom (that follow the resize) with Stalkers version with with the ability to have more than one Gallery with one XML and scrolling thumbnails. If need be I am willing to pay a small amount. you can see them here:
http://www.kirupa.com/forum/showthread.php?t=87388

Please help if ya can.

*edit*

I would like to add the dynamic gallery buttons too, if possible. I also have this offered in the Job Forum. I know cross posting is bad but I am desparate....wont happen again :hugegrin:

[lunatic]

What the heck is the JerryJ and Lacotween version? I'm sure Scotty can help you if you can wait 'til he gets back from vacation. He can do anything with these galleries. :pleased:

[jerryj]

hi lunatic,
see the thread DDD mentions to see all the versions, mine too; the source file for my modification is here:
http://www.jeffwinder.nl/resize/resize.zip

Jerryj.

[lunatic]

Thanks - didn't see your name on the newest entry! :hr:

[tgfx]

Hello all

Is anyone interested in helping out a poor AS challenged soul? I want to mix JerryJ's version with the Lacotweens, next/previous buttons and thumbs on the bottom (that follow the resize) with Stalkers version with with the ability to have more than one Gallery with one XML and scrolling thumbnails. If need be I am willing to pay a small amount. you can see them here:
http://www.kirupa.com/forum/showthread.php?t=87388

Please help if ya can.

*edit*

I would like to add the dynamic gallery buttons too, if possible. I also have this offered in the Job Forum. I know cross posting is bad but I am desparate....wont happen again :hugegrin:

I cannot help here, but I agree that this would be QUITE NICE.

[vnuk]

Hi there!

Im using scottys image resize gallery (with multiple galleries) and i want to add thumbnails like on this site: http://braingiants.com/noriomatsumoto/gallery.html

so that the thumbnails line up in one horizontal row...

thanks

[photone]

FIRST OF ALL, I really have to say the same as before, all the gods be with these great men who help us rookies so much with flash!!!

My 2 questions concerning Scotty's gallery:

1. how could I roll thumbnails in a "group", with up + down buttons like on http://www.danielfloss.com/ ?

2. I'd like to remove the resize, only simple fade. I know this I should know but I couldnt manage yet, shame, but I really cant use AS, I'm a novice but eager to learn.

THANK YOU so much in advance!

[scotty]

@vnuk,
http://www.kirupa.com/forum/showthread.php?t=87388
and look for V3 with infinite menu, it will need some modification, but it will give you a start.
@photone, for the groups
http://www.kirupa.com/forum/showthread.php?t=93543, especially post #8

scotty(-:

[photone]

@photone, for the groups
http://www.kirupa.com/forum/showthread.php?t=93543, especially post #8

scotty(-:

Thank you for the link but honestly I couldnt figure it out... this .fla contains a "portfolio.xml" address which I changed to "gallery.xml" and of course it's not working. I'd like to use it with Your gallery, Scotty.

I have to admit I cant really use AS, I'm just making a photogallery for myself, of course I'm learning at the same time, but this is too hard for me...

Thank you Scotty for your understanding and help,
Yours thankfully,
Mark

[marws]

Hello everybody,

please take a look at this code




#include "lmc_tween.as"
pre._visible = false;
fundo._visible = false;
spacing = 20;
tweentype_resize = "easeInSine";
tweentype_fadeOut = "easeInSine";
tweentype_fadeIn = "easeInSine";
speed_resize = 0.4;
speed_fadeOut = 0.4;
speed_fadeIn = 0.4;
containerMC._alpha = 0;
holder.setMask(menu_mask);
MovieClip.prototype.loadPic = function(pic) {
container._alpha = 0;
this.loadMovie(pic);
trace("no load pic "+image);
onEnterFrame = function () {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
bar._x = border._x-containerMC._width/2;
bar._y = border._y-containerMC._width/2;
bar._visible = 1;
per = Math.round((l/t)*100);
// if (t == l && containerMC._width>0 && containerMC._height>0) {
// if (t != 0 && Math.round(l/t) == 1 && containerMC._width != 0) {
// if ( containerMC._width>0 && containerMC._height>0) {
// if (t != 0 && Math.round(l/t) == 1){
// if (l == t && t != 0 && container._width>0) {
// if (t != 0 && Math.round(l/t) == 1 && containerMC._height != 0 && containerMC._width != 0) {
if (t == l && t != 0 && containerMC._width != 0 && containerMC._height != 0) {
trace("tamanho");
// if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1){
var w = containerMC._width, h = containerMC._height;
resizeMe(w, h);
bar._visible = 0;
picinfo.info.text = tArray[pic];
delete this.onEnterFrame;
} else {
trace("pre");
bar._width = per;
picinfo.info.text = per+" % loaded";
}
};
};
/////////////////
function resizeMe(w, h) {
border.tween(["_width", "_height"], [w+spacing, h+spacing], speed_resize, tweentype_resize);
containerMC.alphaTo(100, speed_fadeIn, tweentype_fadeIn, speed_resize);
picinfo.alphaTo(100, speed_fadeIn, tweentype_fadeIn, speed_resize);
containerMC._x = border._x-containerMC._width/2;
containerMC._y = border._y-containerMC._height/2;
informa.tween(["_x", "_y"], [border._x-containerMC._width/2, containerMC._y+containerMC._height+20], speed_resize, tweentype_resize);
holder.tween(["_x", "_y"], [border._x-containerMC._width/2-180, containerMC._y-25], speed_resize, tweentype_resize);
menu_mask.tween(["_x", "_y", "_height"], [border._x-containerMC._width/2-180, containerMC._y-25, h+spacing], speed_resize, tweentype_resize);
info._x = border._x;
info._y = border._y;
mask._width = w+spacing+2;
mask._height = h+spacing+2;
mask._x = border._x+1;
info.fundo_txt._width = w+spacing+2;
info.fundo_txt._height = h+spacing-3;
}
function loadXML(loaded) {
trace("hellowwww");
if (loaded) {
xmlNode = this.firstChild;
image = [];
description = [];
image1 = [];
image = xmlNode.childNodes[0].childNodes[0].firstChild.nodeValue;
description = xmlNode.childNodes[0].childNodes[1].firstChild.nodeValue;
image1 = xmlNode.childNodes[0].childNodes[2].firstChild.nodeValue;
pic = image;
um = image1;
descp = description;
info.desc.text = descp;
} else {
content = "what??!!";
}
}
xPos = 10;
yPos = 20;
labels = ["home", "about", "works", "feed"];
car = ["images.xml", "images2.xml", "workse.xml", "feede.xml"];
for (i=0; i<4; i++) {
holder.duplicateMovieClip("menu"+i, i, {_x:xPos, _y:yPos});
holder.menu._visible = false;
yPos += eval("menu"+i)._height+10;
eval("menu"+i).menu.texto = labels[i];
eval("menu"+i).i = i;
eval("menu"+i).onRollOver = function() {
this.colorTo(0x7FE5B2, 1, "easeOutStrong");
};
eval("menu"+i).onRollOut = function() {
this.colorTo(0x00CC66, 1, "easeOutStrong");
};
eval("menu"+i).onRelease = function() {
this.colorTo(0x000000, 1, "easeOutStrong");
this.enabled = false;
current.colorTo(0x00CC66, 1, "easeOutStrong");
current.enabled = true;
_global.current = this;
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load(car[this.i]);
//trace(car[this.i]);
fundo._visible = true;
containerMC._alpha = 0;
};
}
//////////////////////////
info.setMask(mask);
informa.abo.onRollOver = function() {
mask.tween("_y", border._y-5, 1, "easeOutSine");
};
informa.abo.onRollOut = function() {
mask.tween("_y", 400, 1, "easeOutSine");
};
informa.um.onRelease = function() {
containerMC.loadMovie(um);
};




I am using arrays to load diferents xml files into the same swf, I can´t use one big xml, better to break it up
in smaller files, everything works, only the border does not resize like it is supposed to.

It resizes correctly the first time a xml loads, and the second image in the xml file is the same size of the first, so that´s cool, but when I request a second xml it loads the image but the border stays the same

Seems to me flash is only executing the preloader the first time, but I have no idia how to fix it.

any ideas??

thanks

[photone]

Hi everybody!
Maybe some of you had the same bug...

If I load my photogallery.swf into my MAIN .swf, none of the pictures load, the photogallery.swf is 'dead'.

Any suggestions?

Big thanks,
Mark

[sipher]

i think it will be better if u post your fla ...




Hello everybody,

please take a look at this code




#include "lmc_tween.as"
pre._visible = false;
fundo._visible = false;
spacing = 20;
tweentype_resize = "easeInSine";
tweentype_fadeOut = "easeInSine";
tweentype_fadeIn = "easeInSine";
speed_resize = 0.4;
speed_fadeOut = 0.4;
speed_fadeIn = 0.4;
containerMC._alpha = 0;
holder.setMask(menu_mask);
MovieClip.prototype.loadPic = function(pic) {
container._alpha = 0;
this.loadMovie(pic);
trace("no load pic "+image);
onEnterFrame = function () {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
bar._x = border._x-containerMC._width/2;
bar._y = border._y-containerMC._width/2;
bar._visible = 1;
per = Math.round((l/t)*100);
// if (t == l && containerMC._width>0 && containerMC._height>0) {
// if (t != 0 && Math.round(l/t) == 1 && containerMC._width != 0) {
// if ( containerMC._width>0 && containerMC._height>0) {
// if (t != 0 && Math.round(l/t) == 1){
// if (l == t && t != 0 && container._width>0) {
// if (t != 0 && Math.round(l/t) == 1 && containerMC._height != 0 && containerMC._width != 0) {
if (t == l && t != 0 && containerMC._width != 0 && containerMC._height != 0) {
trace("tamanho");
// if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1){
var w = containerMC._width, h = containerMC._height;
resizeMe(w, h);
bar._visible = 0;
picinfo.info.text = tArray[pic];
delete this.onEnterFrame;
} else {
trace("pre");
bar._width = per;
picinfo.info.text = per+" % loaded";
}
};
};
/////////////////
function resizeMe(w, h) {
border.tween(["_width", "_height"], [w+spacing, h+spacing], speed_resize, tweentype_resize);
containerMC.alphaTo(100, speed_fadeIn, tweentype_fadeIn, speed_resize);
picinfo.alphaTo(100, speed_fadeIn, tweentype_fadeIn, speed_resize);
containerMC._x = border._x-containerMC._width/2;
containerMC._y = border._y-containerMC._height/2;
informa.tween(["_x", "_y"], [border._x-containerMC._width/2, containerMC._y+containerMC._height+20], speed_resize, tweentype_resize);
holder.tween(["_x", "_y"], [border._x-containerMC._width/2-180, containerMC._y-25], speed_resize, tweentype_resize);
menu_mask.tween(["_x", "_y", "_height"], [border._x-containerMC._width/2-180, containerMC._y-25, h+spacing], speed_resize, tweentype_resize);
info._x = border._x;
info._y = border._y;
mask._width = w+spacing+2;
mask._height = h+spacing+2;
mask._x = border._x+1;
info.fundo_txt._width = w+spacing+2;
info.fundo_txt._height = h+spacing-3;
}
function loadXML(loaded) {
trace("hellowwww");
if (loaded) {
xmlNode = this.firstChild;
image = [];
description = [];
image1 = [];
image = xmlNode.childNodes[0].childNodes[0].firstChild.nodeValue;
description = xmlNode.childNodes[0].childNodes[1].firstChild.nodeValue;
image1 = xmlNode.childNodes[0].childNodes[2].firstChild.nodeValue;
pic = image;
um = image1;
descp = description;
info.desc.text = descp;
} else {
content = "what??!!";
}
}
xPos = 10;
yPos = 20;
labels = ["home", "about", "works", "feed"];
car = ["images.xml", "images2.xml", "workse.xml", "feede.xml"];
for (i=0; i<4; i++) {
holder.duplicateMovieClip("menu"+i, i, {_x:xPos, _y:yPos});
holder.menu._visible = false;
yPos += eval("menu"+i)._height+10;
eval("menu"+i).menu.texto = labels[i];
eval("menu"+i).i = i;
eval("menu"+i).onRollOver = function() {
this.colorTo(0x7FE5B2, 1, "easeOutStrong");
};
eval("menu"+i).onRollOut = function() {
this.colorTo(0x00CC66, 1, "easeOutStrong");
};
eval("menu"+i).onRelease = function() {
this.colorTo(0x000000, 1, "easeOutStrong");
this.enabled = false;
current.colorTo(0x00CC66, 1, "easeOutStrong");
current.enabled = true;
_global.current = this;
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load(car[this.i]);
//trace(car[this.i]);
fundo._visible = true;
containerMC._alpha = 0;
};
}
//////////////////////////
info.setMask(mask);
informa.abo.onRollOver = function() {
mask.tween("_y", border._y-5, 1, "easeOutSine");
};
informa.abo.onRollOut = function() {
mask.tween("_y", 400, 1, "easeOutSine");
};
informa.um.onRelease = function() {
containerMC.loadMovie(um);
};




I am using arrays to load diferents xml files into the same swf, I can´t use one big xml, better to break it up
in smaller files, everything works, only the border does not resize like it is supposed to.

It resizes correctly the first time a xml loads, and the second image in the xml file is the same size of the first, so that´s cool, but when I request a second xml it loads the image but the border stays the same

Seems to me flash is only executing the preloader the first time, but I have no idia how to fix it.

any ideas??

thanks

[freddie]

hey guys, i ve tried to make next and previous buttons for the multiple gallery version. but it doesnt seem to want to work.

i would like to have next and prev buttons that load the next/prev gallery. anyone can help me out here PLEASE.......:worried:

[freddie]

i would have to add another array for that wouldnt i?


i dont get it....


anyone please some help on this.....

[timmeh88]

I am so excited at where this thread is taking us!
DYNAMICALLY LOADED THUMBS! Oh Huney! Bring It On!
Im going to wait till you guys get that all figured out before I start trying it myself.

I added the code to load the first picture automatically and am anxious to dive into the scrolling thumbnail gallery - thanks everyone for making my actionscript dream a reality!!!

heres where ive used the galleries so far:

http://www.technicolortiara.com/mutemath/

http://www.technicolortiara.com/lipstickface/photos/easterbonnet/index.htm

http://www.technicolortiara.com/lipstickface/photos/jacksonville/sherry_haydell.htm

SHOW ME HOW YOURE USING THE CODE!! :b:

Hey :) I am new here and I was trying to use that photogallery thing u used in your sites, however, even though I add the new picture, make it a button, and add the actionscript, it does not work properly...Can you explain to me how i can get it to work? :) Thanks a lot! :)

[jdesign]

Hi , I am new here.. i've been reading this thread for 4 hours now :)
i've tried it and it works. I'm wondering if it's possible to load a simple swf movie using the resizing slideshow. I've changed the xml to load a swf file. But it's buggy it loads only 1 , or 2 and then all the other slides menu doesn't load.
Is there a way , loading a swf into this kind of slideshow?
This is sort of what i'm thinking http://www.evb.com/archive/

[jdesign]

Movies as in swf's? Then you have to change nothing, except for the code on your buttons:)
To be sure flash "reads" the proper width/height of your swf, put a (transparent) background mc in it with width/height of your fla.

scotty(-:

Hi Scotty, i've found this post a while back, may i know what extra code to add on the buttons for loading swf movie for this resizing slideshow?

i've tried changing the xml so it loads several swf's it somehow works but after a while it doesn't ( i've mixed swf with jpg to test it.. the jpg files loads fine when i goes back and forth, but when loading swf. it only loads 1 or two than it's just doesn't work anylonger)
is this a Level problem? How do i fix this? Thank you very much :)

EDited:

I see , it seems that it only accepts flash player 6 mov and bellow.
Is there a way to Load a flash 7 swf. ?? because one of my MC have to be in flash 7 . It would be really great if you guys can help me with it . :)

[netrix]

hi lunatic,
see the thread DDD mentions to see all the versions, mine too; the source file for my modification is here:
http://www.jeffwinder.nl/resize/resize.zip

Jerryj.

Hello everyone...
Can anyone help me out??

Error opening include file lmc_tween.as: File not found.

where can i get the lmc_tween file to be able to run Jerryj's version??

[jerryj]

http://laco.wz.cz/tween/?page=download

Good luck,

Jerryj.

[netrix]

http://laco.wz.cz/tween/?page=download

Good luck,

Jerryj.

thanks man... i downloaded them a few hours ago but the speeds are super slow and once i download them the zip is corrupted! could u please send me the one u used or any other?

[jerryj]

Here's a zip file with the extension.

Let me know if it works,

Jerryj.

[nickf828]

Hi all, I'm having some problems getting images loaded into a gallery using XML to be resized and centered on the stage. I've spent hours/days going through the forums and playing around with the code, but I just cant get it right. I would worship anyone who can help me.

What I want to do it set a max height and width for pics, then resize it. So if the max width is 300, it will resize it down so the width is 300 and then display it centered horizonally. Since I want to be able to set a max height, I just want it to be in a static y position (a little down from the top).

I really really appreciate your help, so if anyone can take a look at my flash and help I would be forever grateful. I'm new to flash/actionscripting so forgive me. THanks so much! Best, Nick

Fla File: http://www.benmillermusic.net/images/album1/photogallery.rar

[rollwithit80]

great gallery, works a treat. However, i am having troubles making it so when you click the containerMC it hides the main Image. Can anyone help.


t1.onRelease = function() {
currentPic ='products/pro/mainImage.jpg';
cMC.loadPic(currentPic);

};
t2.onRelease = function() {
currentPic ='products/pro/mainImage2.jpg';
cMC.loadPic(currentPic);

};
t3.onRelease = function() {
cMC.loadPic('products/pro/mainImage3.jpg');
};
t4.onRelease = function() {
cMC.loadPic('products/pro/mainImage4.jpg');
};

MovieClip.prototype.loadPic = function(pic) {

this.loadMovie(pic);

//added code
this._parent.onRelease = function(){
this.unloadMovie(pic);
}
this._parent.onEnterFrame = function() {
var t = cMC.getBytesTotal(), l = containerMC.getBytesLoaded();
bar._visible = 1;
per = Math.round((l/t)*100);
if (t != 0 && Math.round(l/t) == 1 && containerMC._width != 0) {
var w = cMC._width+spacing, h = containerMC._height+spacing;
//border.resizeMe(w, h);
bar._visible = 0;
loadText.text = "";
delete this._parent.onEnterFrame;
} else {
bar._width = per;
// gives the bar a max width 100
loadText.text = per+" % loaded";
}
};
};
stop();


thaks

[archie]

I have a question for who ever might know (I believe Scotty - did you put together version 3 with thumbnails).

The question is a bit inconsequential to how things work, but I just have to know, what did the variable "tnNr" stand for when you typed it out?

Thanks.

[jerryj]

thumbnailNumber?

[scotty]

:lol: good catch :)

scotty(-:

[archie]

Oh, thanks guys.

Now for a tougher question. I am trying to load .png files from the XML document. I need them for the thumbnail images, which are rounded/anti-aliased on one side (hence the PNG format).

Is this possible to do? When I try it, the thumbnails don't load. I just simply changed the file name in the XML document. Am I just forgetting something? It should work.

Any thoughts?

[scotty]

If you're using versions below 8 it's not possible...

scotty(-:

[archie]

Sweet! I just changed the Publish settings and it works. Thanks again.

[scotty]

:thumb:

[archie]

I have yet another question. I have been working with V3_thnmbs_slideshow and am trying to get text to display on top of the image buttons that are generated. In looking below you will see that I have built a string and assigned it to "th_nav.imageLabel.text". As you can tell, the dynamic text box is called imageLabel and is placed within the thumb_nav symbol. You will also see that I have traced the value out.

But what happens is the dynamic text box is only viewable in the first button (which is the visible one on stage in the working view) and it says image 5. I am assuming the values are all getting assigned to the text box but just flip through to quickly to see. How do I get the dynamic text box to shoup for each of the buttons drawn, not just the first?


function makeButtons() {
tnNr = 0;
clearInterval(delay);
for (var i = 0; i<tArray.length; i++) {
var thb = th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i);
thb.id = i;
th_nav.imageLabel.text = "image " + (thb.id + 1);
thb._y = Math.floor(-i)*26;
trace (th_nav.imageLabel.text);
}
loadButtons();
}

[scotty]

Have you tried

th_nav.imageLabel.text = "image " + (i + 1);
?

scotty(-:

[archie]

Oh, yeah... that'll work too. But at this point, I'm still trying to figure out in what function (or at what point in a function) I should be placing... something to get this "imageLabel" value to get drawn to the screen along with the actual thumbnail image.

In other words, I have an incrementing value (image 1 and image 2 etc.) but how do I get these to display with/ontop the buttons as they are displayed?

I added this line of code "th_nav.imageLabel._y = Math.floor(-i)*26;" as seen below.

Hear is what I just tried.

function makeButtons() {
tnNr = 0;
clearInterval(delay);
for (var i = 0; i<tArray.length; i++) {
var thb = th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i);
thb.id = i;
th_nav.imageLabel.text = "image " + (i + 1);
// thb._x = i%3*50;
// thb._x = i;
// thb._y = Math.floor(i/3)*50;
thb._y = Math.floor(-i)*26;
th_nav.imageLabel._y = Math.floor(-i)*26;
trace (th_nav.imageLabel.text);
}
loadButtons();
}
The result is one label (and only one) that gets moved to each new thumbnail button as they get drawn to the screen. I am getting closer but I need that label to stay on each button. Am I trying this in the wrong function?

[scotty]

Put the label inside the thumb and position it

function makeButtons() {
tnNr = 0;
clearInterval(delay);
for (var i = 0; i<tArray.length; i++) {
var thb = th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i);
thb.id = i;
thb.imageLabel.text = "image "+(i+1);
thb._y = -(i*26);
}
loadButtons();
}

scotty(-:

[archie]

I'm just getting back to this.

Thanks again Scotty.

[michey]

Hi

Thanks to scotty and all others involved in this thread for the wonderful resizing Gallery.
I'm playing around with, adding and trying different transitions.
You can see a zooming version of the Gallery on the second link below in my signature, --my.new.one--.
What I'm wondering is, if there is possible to have sliding transition in the gallery,with pictures sliding from one side to the other, like in the first link of my signature, --works.in.clay--.
Any idea as starting point or link to tuts or examples will be highly appreciated.

[sepu]

Hey guys .... Great Thread ! Thanks a lot for all the help !.
I've got a quick question ... is it possible to use text as links instead of the thumbnails in one of these galleries like for example :
Go to the Projects section of each. (by the way both sites are cool too)

http://www.easybit.it/flash2005/main.php?language=eng
http://www.workrocks.com/?lang=en

and also how could you add more pics let's say you've got one of your works and then you want to show 3, 4 etc pics of the same work ? (you can see this in the examples above as well) Im sure this is more advanced anyway any help would be appreciated.

thanks.

[slopsbop]

hi everyone can someone tell me how to preload the thumbnails in "v3 with scroller" from the best of kirupa sticky. i would like it so that as each thumbnail is loaded it can be clicked.heres a link to my files in another thread.

http://www.kirupa.com/forum/showthread.php?t=220728

if this information is elsewhere please lemme know. ive tried reading this thread but to no avail. woe is me!!!

[ronski]

Hello all.
I'm trying to understand the code form V3.
So far i'm at the point where the thumbs are placed in the thumbborders.
The piece of code I don't get is:

var tbox = th_nav["thmb"+tnNr].box;
What is the .box ?? I don't see it anywhere in the rest of the code.
Could someone explain this bit please?
Thanks

[scotty]

box is an empty mc inside thmb where the image is loaded. This way you can directly assign onrelease (etc) actions to thmb.

scotty(-:

[ronski]

Thanks a lot, a couldn't figure it out becaus I didn't found the box movieclip anywhere.
Ronski

[scotty]

welcome=)

[rollala]

This is Jerryj's version. What I want to do is have a solid _y position. I can make the pic be on a solid _y position, but am having trouble making the border do the same. Please let me know how to do this, thanks!


//You'll need to download Laco's Movieclip tweening prototypes at http://laco.wz.cz/tween/?page=download
//Include laco's tweening prototypes:
#include "lmc_tween.as"
//tweentype_border: (see again laco's site for other tweentypes)
tweentype_resize = "easeOutBounce";
//tweentype for pic fade out:
tweentype_fadeOut = "easeInSine";
//tweentype used for pic fade in:
tweentype_fadeIn = "easeInSine";
//You can change the speed of the resizing border and the picfades(1 = one second)
speed_resize = 0.4;
speed_fadeOut = 0.4;
speed_fadeIn = 0.4;
//creating the border:
this.createEmptyMovieClip('border', 3);
with (_root.border) {
lineStyle(0.1, 0xCCCCCC);
_x = 295;
_y = 250;
beginFill();
moveTo(-100, -100);
lineTo(100, -100);
lineTo(100, 100);
lineTo(-100, 100);
lineTo(-100, -100);
endFill();
}
containerMC._alpha = 0;
picinfo._alpha = 0;
containerMC.swapDepths(2);
var pArray = new Array();
var tArray = new Array();
MovieClip.prototype.loadPic = function(pic) {
cur = pic;
this.loadMovie(pArray[pic]);
this._parent.onEnterFrame = function() {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
bar._visible = 1;
per = Math.round((l/t)*100);
if (t == l && containerMC._width>0 && containerMC._height>0) {
var w = containerMC._width, h = containerMC._height;
resizeMe(w, h);
bar._visible = 0;
picinfo.info.text = tArray[pic];
delete this.onEnterFrame;
} else {
bar._width = per;
picinfo.info.text = per+" % loaded";
}
};
};
function resizeMe(w, h) {
//border tween:
border.tween(["_width", "_height"], [w, h], speed_resize, tweentype_resize);
//pic and picinfo fade in:
containerMC.alphaTo(100, speed_fadeIn, tweentype_fadeIn, speed_resize);
picinfo.alphaTo(100, speed_fadeIn, tweentype_fadeIn, speed_resize);
//pic position:
containerMC._x = border._x-containerMC._width/2;
containerMC._y = border._y-containerMC._height/2;
// make navigation, previousbutton,nextbuttonmove and picinfo tween along with border:
nav.tween(["_x", "_y"], [border._x-containerMC._width/2, containerMC._y-10], speed_resize, tweentype_resize);
prevb.tween(["_x", "_y"], [border._x-containerMC._width/2, containerMC._y+containerMC._height+18], speed_resize, tweentype_resize);
nextb.tween(["_x", "_y"], [border._x+containerMC._width/2, containerMC._y+containerMC._height+18], speed_resize, tweentype_resize);
picinfo.tween(["_x", "_y"], [border._x-containerMC._width/100, containerMC._y-20], speed_resize, tweentype_resize);
}
//loading pics and text:
var gallery_xml = new XML();
gallery_xml.ignoreWhite = true;
gallery_xml.onLoad = function(success) {
if (success) {
var gallery = this.firstChild;
gallery_txt.text = gallery.attributes.info;
for (var i = 0; i<gallery.childNodes.length; i++) {
tArray.push(gallery.childNodes[i].attributes.title);
pArray.push(gallery.childNodes[i].attributes.source);
}
containerMC.loadPic(0);
} else {
title_txt.text = "Error!";
}
};
gallery_xml.load("gallery.xml");
//fade out pic and picinfo:
function fadeOut(pic) {
containerMC.alphaTo(0, speed_fadeOut, tweentype_fadeOut, 0, {scope:containerMC, func:containerMC.loadPic, args:[pic]});
picinfo.alphaTo(0, speed_fadeOut, tweentype_fadeOut);
}
//previous and next buttons:
prevb.onRelease = function() {
cur>0 ? cur-- : cur=pArray.length-1;
fadeOut(cur);
};
nextb.onRelease = function() {
cur<pArray.length-1 ? cur++ : cur=0;
fadeOut(cur);
};

[rollala]

I know to change this for the picture to stay solid on _y:


containerMC._x = border._x-containerMC._width/2;
containerMC._y = border._y-containerMC._height/2;

But how would I get the border to do the same?
(see post above for full code)
:|

[scotty]

Change the registration point for the border (it's now in the center) to where you want to have your fixed _y position.

scotty(-:

[jerryj]

Your code to keep the container_y the same looks the same as it already was. How did you change it?

Anyway, to make the border solid on the _y position, you must fool around with the positions in the AS drawn border, for instance:


this.createEmptyMovieClip('border', 3);
with (_root.border) {
lineStyle(0.1, 0xCCCCCC);
_x = 295;
_y = 300;
beginFill();
moveTo(-100, 0);
lineTo(100, 0);
lineTo(100, 100);
lineTo(-100, 100);
lineTo(-100, 0);
endFill();
}

Good luck,

Jerryj.

[rollala]

Your code to keep the container_y the same looks the same as it already was. How did you change it?

J, I just posted the original code in case what I was doing was wrong.

Thanks so much for the reply, I'm going to try this out right now!

Cheers,
Rolla

[rollala]

It works great!

this.createEmptyMovieClip('border', 3);
with (_root.border) {
lineStyle(0.1, 0xCCCCCC);
_x = 295;
_y = 55;
beginFill();
moveTo(-100, 0);
lineTo(100, 0);
lineTo(100, 100);
lineTo(-100, 100);
lineTo(-100, 0);
endFill();
}

and then for the pic position I used:

containerMC._x = border._x-containerMC._width/2;
containerMC._y = 55


Thanks so much guys, you rock!

[geary126]

Hi. I'm new, also an AS neophyte, however that's spelled.

I was playing around with JerryJ's code. [find in SCOTTY IMAGE RESIZE GALLERY, HERE: http://www.kirupa.com/forum/showthread.php?t=87388 ]

In the comments, he mentions Laco's Movieclip tweening prototypes. I just downloaded the AS file, and put it in the same folder. I don't have Flash Professional, so that seems like the only option.

Three questions:

I replaced his images with my images. Published to the folder. Nothing's working. Suggestion?

2) Is there a way to move the nav away from the resize [have it stationary /unscript it]?

3) what is max image size? Guessing that might be a factor.

4. If image is too small, how can I make it bigger PLUS make the site bigger.


Thanks, Tom

[flashwillkill]

Hello Kirupians,
I am working on a version where the thumbs are randomly placed (scattered).
Got that done. In addition I successfully made them dragable with a tiny problem.
I would like the thumbs to:


but.onRollOver = but.onDragOver=function () {
but.getNextHighestDepth();
};

Now correct me if I am wrong?
Through research I found out the depth thing is only possible with attached mc's?
But is there a way to already get the duplicate thb onThe Next HighestDepth()??
Maybe here?


function makeButtons() {
tnNr = 0;
clearInterval(delay);
for (var i = 0; i<tArray.length; i++) {
var thb = thumbs.th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i, {_x:random(500), _y:random(400)});
thb.id = i;
//thb._x = i*24;
}
loadButtons();
}

The 1000+i looks suspicious, yet I have not been able to conquer "the depths" of this.
;) Maybe anyone got an idea ... or if it is even possible???
Thanks in advance. Cheers.

[Jookbox]

this is SO cool. i'm so glad i found this on this forum. i has having a hell of a time learning to do this. i'll definitely swing by these forums more often :)

[LJK]

Hi -
Working on a project for a friend to showcase their photos.
Used vers. 3 to make sep. galleries - like People & it's loaded
into the main .swf which has the navigation for each & a btn.
for unloading them.

Figured out on my own that jerky resizing in the gallery.swf
was due to using AS2/Player 7, so changed it & works a treat.
Also changed the main.swf to be AS1/Player 6 w/ same frame
rate as the loaded .swf's.

It works great *except* the images appear faster - then jerk
or snap into place after the border is resized, which is pretty
ugly-looking.

What am I missing? Haven't posted the .fla since there were
no real changes made to vers. 3 - just some repositioning of
elements on the stage...

Thanks in advance; this thread rocks ;-).
LJK

[scotty]

The snapping into place is covered somewhere in this thread...
Can you post the code of the loadPic and resizeMe functions?

scotty(-:

[LJK]

Hi Scotty -
Well, I *thought* I'd read all the threads... ;-)

Here's what is used to bring-in the .swf & the relevant
code from that...

Also wondered - where is the loadPhoto(); function?
Scoured the script & can't seem to find it, anywhere.

Thanks much,
El



people_btn.onRelease = function() {
_root.holder_mc.loadMovie("peopleShow.swf");
};
--------------from peopleShow.swf-----------------------
MovieClip.prototype.loadPic = function(pic) {
containerMC._alpha = 0;
cur = pic;
this.loadMovie(pArray[pic]);
this._parent.onEnterFrame = function() {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
if (t != 0 && Math.round(l/t) == 1 && containerMC._width>0) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
border.resizeMe(w, h, pic);
delete this._parent.onEnterFrame;
}
};
};
MovieClip.prototype.resizeMe = function(w, h, pic) {
var speed = 4;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
nav._x = Math.round(this._x-this._width/2);
nav._y = Math.round(this._y+this._height/2+spacing/2);
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
containerMC._x = this._x-this._width/2+spacing/2;
containerMC._y = this._y-this._height/2+spacing/2;
containerMC._alpha = 100;
delete this.onEnterFrame;
}
};
};
----------------incl. this because of 2nd ?---------------------
var gallery_xml = new XML();
gallery_xml.ignoreWhite = true;
gallery_xml.onLoad = function(success) {
if (success) {
var gallery = this.firstChild;
// pathToPics = gallery.attributes.path;
for (var i = 0; i<gallery.childNodes.length; i++) {
tArray.push(gallery.childNodes[i].attributes.title);
pArray.push(gallery.childNodes[i].attributes.source);
}
loadPhoto();
} else {
title_txt.text = "Error!";
}
};

[kos010]

hello Kirupians...
working with this xml gallery has made me very happy. I've got a final question and than I'm even happier. it's probally somewhere over here in this topic but couldnt find it sooo..
I've got 5/6 horizontal buttons, which are grey. On rolling over, they become pink. Now I want to make the selected current button pink as well, so that you can see which button refers to the button. Shouldnt be that hard ? i thought myself of using a script I found somewhere in the fridge, but somehow this doesnt work in the XML gallery. Do you boys and girls got any suggestions?

thanks (file is flash 8)
edit: duh no RARfiles only zip

[paulgabel]

I hope this makes sense because I really need help,

I'm trying, without success, to combine the "V3 with thumbs" gallery file, which has multiple galleries to the file (scotty#2.zip) that scotty built on this thread:

http://www.kirupa.com/forum/showthread.php?t=132588&page=17

In the same vain as http://www.twinphotographie.com Im trying to get the thumbnails and the menu to load and adjust their position according to the imagesize.

By combining the two, I got somewhere. But the "screen" doesn't appear and I believe the Arrays are a mess. Could someone give me some assistance?

Attached is the zipfile.

Paul

[InfestedDemon]

okay im just gonna pretend i understand every single bit of this :P Yes, we neeed a tutorial says the noobs (not me) i just like being a post-whore :p

[jerryj]

I was playing around with JerryJ's code. [find in SCOTTY IMAGE RESIZE GALLERY, HERE: http://www.kirupa.com/forum/showthread.php?t=87388 ]

In the comments, he mentions Laco's Movieclip tweening prototypes. I just downloaded the AS file, and put it in the same folder. I don't have Flash Professional, so that seems like the only option.

Three questions:

I replaced his images with my images. Published to the folder. Nothing's working. Suggestion?

2) Is there a way to move the nav away from the resize [have it stationary /unscript it]?



3) what is max image size? Guessing that might be a factor.

4. If image is too small, how can I make it bigger PLUS make the site bigger.

Hi Geary,
1. Did you also include the laco as file in your movie? using:

#include "lmc_tween.as" Do you get an error when you publish?

2.
The code says:

// make navigation, previousbutton, nextbutton move and picinfo tween along with border:
nav.tween(["_x", "_y"], [border._x-containerMC._width/2, containerMC._y+containerMC._height+10], speed_resize, tweentype_resize);
prevb.tween(["_x", "_y"], [border._x-containerMC._width/2, containerMC._y-20], speed_resize, tweentype_resize);
nextb.tween(["_x", "_y"], [border._x+containerMC._width/2, containerMC._y-20], speed_resize, tweentype_resize);
picinfo.tween(["_x", "_y"], [border._x-containerMC._width/100, containerMC._y-20], speed_resize, tweentype_resize);
So just remove those lines if you want those four elements stay put.

3. No max image size.

4. Make your pics bigger before you put them in your folder.

Good luck,
Jerryj.

[paulgabel]

I'm pulling my hair out here, Does anyway know the way to successfully assign the menu and (xml produced) bottons to inside the border? I'm working with the scotty#2.fla, the V3_with_thumbs.fla and the imageresizer.fla, in hopes to achieve that effect, but am seeing poor results. If someone's is interested in exploring this wth me...that would be great.:)

Yes I'm hooked on the twinphotographie design.

[tjsmokey]

Me too I am really hooked to this forum.
File:
http://www.tunjistudio.com/thumbnail_finalxxxx.rar

[WyteDragN]

Attention all, especially Scotty (dude, your like a hero on this forum.)

I am trying to make a combination of a few galleries that I have seen on this forum. I have been reading it for the better half of this week, from beginning to end. I am a novice/advanced graphic designer, but a las, I am a newbie when it comes to as.

What I want to do is this:
I am making a gallery for my site and I love the stuff I'm finding on here.
I am using V3_with_scrolling_thumbs as the base. I want to add the prev and next buttons to it, a long with the start/stop slide show buttons, and lastly, it would be nice to be able to add info about each piece of my work to the xml document so that it appears in a little box under the thumbs.

I have searched through here and found a gallery that does each of these things the ways I would like it, except the info box. The problem I'm having is adding them together. I got the code for the prev/next buttons added but for some reasone, the prev button goes to the next image, lol. So anyways, i'll skip to the point.

This is the main code i'm using:


var tnNr;
spacing = 10;
container._alpha = 0;
var curLength;
MovieClip.prototype.loadPic = function(pic, id) {
info.text = "";
this._alpha = 0;
this.loadMovie(pic);
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
var w = container._width+spacing, h = container._height+spacing;
border.resizeMe(w, h, id);
delete this.onEnterFrame;
}
};
};
MovieClip.prototype.resizeMe = function(w, h, id) {
var speed = 3;
container._alpha = 0;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
container._x = this._x-this._width/2+spacing/2;
container._y = this._y-this._height/2+spacing/2;
info._y = Math.round(this._y+this._height/2+spacing/2);
container._alpha += 5;
if (container._alpha>90) {
info.text = id;
container._alpha = 100;
delete this.onEnterFrame;
}
}
};
};
function galleryChoice(q) {
pArray = new Array();
tArray = new Array();
iArray = new Array();
my_xml = new XML();
for (var j = 0; j<curLength; j++) {
this.scroll.th_nav["thmb"+j].removeMovieClip();
}
my_xml.ignoreWhite = true;
my_xml.onLoad = function(loaded) {
if (loaded) {
gallery = this.firstChild.childNodes[q];
curLength = gallery.childNodes.length;
gallery_txt.text = gallery.attributes.info;
for (var i = 0; i<gallery.childNodes.length; i++) {
pArray.push(gallery.childNodes[i].attributes.source);
tArray.push(gallery.childNodes[i].attributes.thumb);
iArray.push(gallery.childNodes[i].attributes.title);
}
}
delay = setInterval(makeButtons, 50);
};
my_xml.load("gallery.xml");
}
function makeButtons() {
tnNr = 0;
clearInterval(delay);
for (var i = 0; i<tArray.length; i++) {
var thb = scroll.th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i);
thb.id = i;
thb._x = i%3*50;
thb._y = Math.floor(i/3)*50;
}
loadButtons();
}
function loadButtons() {
var tbox = scroll.th_nav["thmb"+tnNr].box;
tbox.loadMovie(tArray[tnNr]);
temp = this.createEmptyMovieClip("tmp"+tnNr, 999);
temp.onEnterFrame = function() {
bt = tbox.getBytesTotal();
bl = tbox.getBytesLoaded();
if (bt == bl && bt>4) {
nextButton();
delete this.onEnterFrame;
}
};
}
function nextButton() {
if (tnNr<tArray.length-1) {
tnNr++;
loadButtons();
} else {
activateButtons();
}
}
function activateButtons() {
mainButtons();
for (var i = 0; i<pArray.length; i++) {
var but = scroll.th_nav["thmb"+i];
but.id = i;
but.onRelease = function() {
container.loadPic(pArray[this.id], iArray[this.id]);
disButtons2(this.id);
};
}
container.loadPic(pArray[0], iArray[0]);
disButtons2(0);
}
butArray = new Array();
butArray = ["gal1_btn", "gal2_btn", "gal3_btn", "gal4_btn"];
function mainButtons() {
for (var i = 0; i<butArray.length; i++) {
this[butArray[i]].id = i;
this[butArray[i]].onRelease = function() {
galleryChoice(this.id);
disButtons(this.id);
};
}
}
function disButtons2(d) {
for (var i = 0; i<tArray.length; i++) {
if (i != d) {
this.scroll.th_nav["thmb"+i].enabled = 1;
this.scroll.th_nav["thmb"+i].box._alpha = 100;
} else {
this.scroll.th_nav["thmb"+i].enabled = 0;
this.scroll.th_nav["thmb"+i].box._alpha = 50;
}
}
}
function disButtons(d) {
for (var i = 0; i<butArray.length; i++) {
if (i != d) {
this[butArray[i]].enabled = 1;
this[butArray[i]].gotoAndStop(1);
} else {
this[butArray[i]].enabled = 0;
this[butArray[i]].gotoAndStop(2);
}
}
}
prevb.onRelease = function() {
if (cur == pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur++]);
}
}
nextb.onRelease = function() {
if (cur == pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur++]);
}
}
disButtons(0);
galleryChoice(0);

And this is the slide show code:


var tnNr;
spacing = 10;
container._alpha = 0;
var curLength;
//new variables
var cur, slideInterval;
//variable to check if the slideshow is on or of
var slide = 0;
MovieClip.prototype.loadPic = function(nr) {
//clear the interval
clearInterval(slideInterval);
info.text = "";
this._alpha = 0;
this.loadMovie(pArray[nr]);
cur = nr;
bar._visible = 1;
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
var per = Math.round((l/t)*100);
bar._xscale = per;
info.text = per+" % loaded";
if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
bar._visible = 0;
var w = container._width+spacing, h = container._height+spacing;
border.resizeMe(w, h, nr);
delete this.onEnterFrame;
}
};
};
MovieClip.prototype.resizeMe = function(w, h, nr) {
var speed = 3;
container._alpha = 0;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
info._y = Math.round(this._y+this._height/2+spacing/2);
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
container._x = this._x-this._width/2+spacing/2;
container._y = this._y-this._height/2+spacing/2;
info._y = Math.round(this._y+this._height/2+spacing/2);
container._alpha += 5;
if (container._alpha>90) {
info.text = tArray[nr];
container._alpha = 100;
if (slide) {
slideInterval = setInterval(slideshow, 4000);
}
delete this.onEnterFrame;
}
}
};
};
function galleryChoice(q) {
pArray = new Array();
tArray = new Array();
iArray = new Array();
my_xml = new XML();
for (var j = 0; j<curLength; j++) {
this.th_nav["thmb"+j].removeMovieClip();
}
my_xml.ignoreWhite = true;
my_xml.onLoad = function(loaded) {
if (loaded) {
gallery = this.firstChild.childNodes[q];
curLength = gallery.childNodes.length;
for (var i = 0; i<gallery.childNodes.length; i++) {
pArray.push(gallery.childNodes[i].attributes.source);
tArray.push(gallery.childNodes[i].attributes.thumb);
iArray.push(gallery.childNodes[i].attributes.title);
}
}
delay = setInterval(makeButtons, 50);
};
my_xml.load("gallery.xml");
}
function makeButtons() {
tnNr = 0;
clearInterval(delay);
for (var i = 0; i<tArray.length; i++) {
var thb = th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i);
thb.id = i;
thb._x = i%3*50;
thb._y = Math.floor(i/3)*50;
}
loadButtons();
}
function loadButtons() {
var tbox = th_nav["thmb"+tnNr].box;
tbox.loadMovie(tArray[tnNr]);
temp = this.createEmptyMovieClip("tmp"+tnNr, 999);
temp.onEnterFrame = function() {
bt = tbox.getBytesTotal();
bl = tbox.getBytesLoaded();
if (bt == bl && bt>4) {
nextButton();
delete this.onEnterFrame;
}
};
}
function nextButton() {
if (tnNr<tArray.length-1) {
tnNr++;
loadButtons();
} else {
activateButtons();
}
}
function activateButtons() {
mainButtons();
for (var i = 0; i<pArray.length; i++) {
var but = th_nav["thmb"+i];
but.id = i;
but.onRelease = function() {
container.loadPic(this.id);
disButtons2(this.id);
};
}
container.loadPic(0);
disButtons2(0);
}
butArray = new Array();
butArray = ["gal1_btn", "gal2_btn", "gal3_btn", "gal4_btn"];
function mainButtons() {
for (var i = 0; i<butArray.length; i++) {
this[butArray[i]].id = i;
this[butArray[i]].onRelease = function() {
galleryChoice(this.id);
disButtons(this.id);
};
}
}
function disButtons2(d) {
for (var i = 0; i<tArray.length; i++) {
if (i != d) {
this.th_nav["thmb"+i].enabled = 1;
this.th_nav["thmb"+i].box._alpha = 100;
} else {
this.th_nav["thmb"+i].enabled = 0;
this.th_nav["thmb"+i].box._alpha = 50;
}
}
}
function disButtons(d) {
for (var i = 0; i<butArray.length; i++) {
if (i != d) {
this[butArray[i]].enabled = 1;
this[butArray[i]].gotoAndStop(1);
} else {
this[butArray[i]].enabled = 0;
this[butArray[i]].gotoAndStop(2);
}
}
}
function slideshow() {
if (cur == pArray.length-1) {
container.loadPic(0);
disButtons2(0);
} else {
container.loadPic(cur+1);
disButtons2(cur);
}
}
stop_slide._visible = 0;
play_slide.onRelease = function() {
this._visible = 0;
stop_slide._visible = 1;
slide = 1;
slideInterval = setInterval(slideshow, 4000);
};
stop_slide.onRelease = function() {
this._visible = 0;
play_slide._visible = 1;
slide = 0;
clearInterval(slideInterval);
};
disButtons(0);
galleryChoice(0);

Like I said I don't have the code to add a box for Info but here is the xml code I have so far:


<?xml version="1.0" encoding="UTF-8"?>
<menu>
<gallery name="Holiday">
<image source="pics/pic1.jpg" thumb="pics/th1.jpg" title="Earth"/>
<image source="pics/pic2.jpg" thumb="pics/th2.jpg" title="Party"/>
<image source="pics/pic3.jpg" thumb="pics/th3.jpg" title="Bench"/>
<image source="pics/pic4.jpg" thumb="pics/th4.jpg" title="Lights"/>
<image source="pics/pic5.jpg" thumb="pics/th5.jpg" title="Agreement"/>
<image source="pics/pic6.jpg" thumb="pics/th6.jpg" title="Landscape"/>
<image source="pics/pic7.jpg" thumb="pics/th7.jpg" title="Face"/>
<image source="pics/pic8.jpg" thumb="pics/th8.jpg" title="Sunset"/>
<image source="pics/pic9.jpg" thumb="pics/th9.jpg" title="My Girlfriend"/>
<image source="pics/pic1.jpg" thumb="pics/th1.jpg" title="Earth"/>
<image source="pics/pic2.jpg" thumb="pics/th2.jpg" title="Party"/>
<image source="pics/pic3.jpg" thumb="pics/th3.jpg" title="Bench"/>
<image source="pics/pic4.jpg" thumb="pics/th4.jpg" title="Lights"/>
<image source="pics/pic5.jpg" thumb="pics/th5.jpg" title="Agreement"/>
<image source="pics/pic6.jpg" thumb="pics/th6.jpg" title="Landscape"/>
<image source="pics/pic7.jpg" thumb="pics/th7.jpg" title="Face"/>
<image source="pics/pic8.jpg" thumb="pics/th8.jpg" title="Sunset"/>
<image source="pics/pic9.jpg" thumb="pics/th9.jpg" title="My Girlfriend"/>
<image source="pics/pic1.jpg" thumb="pics/th1.jpg" title="Earth"/>
<image source="pics/pic2.jpg" thumb="pics/th2.jpg" title="Party"/>
<image source="pics/pic3.jpg" thumb="pics/th3.jpg" title="Bench"/>
<image source="pics/pic4.jpg" thumb="pics/th4.jpg" title="Lights"/>
<image source="pics/pic5.jpg" thumb="pics/th5.jpg" title="Agreement"/>
<image source="pics/pic6.jpg" thumb="pics/th6.jpg" title="Landscape"/>
<image source="pics/pic7.jpg" thumb="pics/th7.jpg" title="Face"/>
<image source="pics/pic8.jpg" thumb="pics/th8.jpg" title="Sunset"/>
<image source="pics/pic9.jpg" thumb="pics/th9.jpg" title="My Girlfriend"/>
</gallery>
<gallery name="Birthday">
<image source="pics/pic5.jpg" thumb="pics/th5.jpg" title="Agreement"/>
<image source="pics/pic6.jpg" thumb="pics/th6.jpg" title="Landscape"/>
<image source="pics/pic7.jpg" thumb="pics/th7.jpg" title="Face"/>
<image source="pics/pic8.jpg" thumb="pics/th8.jpg" title="Sunset"/>
<image source="pics/pic9.jpg" thumb="pics/th9.jpg" title="My Girlfriend"/>
</gallery>
<gallery name="Christmas">
<image source="pics/pic4.jpg" thumb="pics/th4.jpg" title="Lights"/>
<image source="pics/pic5.jpg" thumb="pics/th5.jpg" title="Agreement"/>
<image source="pics/pic6.jpg" thumb="pics/th6.jpg" title="Landscape"/>
</gallery>
<gallery name="New Year">
<image source="pics/pic6.jpg" thumb="pics/th6.jpg" title="Landscape"/>
<image source="pics/pic7.jpg" thumb="pics/th7.jpg" title="Face"/>
<image source="pics/pic8.jpg" thumb="pics/th8.jpg" title="Sunset"/>
<image source="pics/pic1.jpg" thumb="pics/th1.jpg" title="Earth"/>
<image source="pics/pic2.jpg" thumb="pics/th2.jpg" title="Party"/>
<image source="pics/pic3.jpg" thumb="pics/th3.jpg" title="Bench"/>
</gallery>
</gallery>
Sorry to post so much code. I Think this would be a clever mix, and if someone comes up with a solution (I have faith) anyone should feel free to use it. I would be happy to do a favor for a favor trade, investing some of my time in some type of graphics of some sort in exchange for the time your taking to help. Thanks in advance.
:toad:

ps. If need be, i'll post the .fla, but I didn't think it was necessary since they are all over the place in this thread. Thanks again.

[asif_rn]

Hi,

I'm new to this forum and find it quite useful. I'm also surprised to see how long this thread is going on.

I really want to thank everyone here who contributed to the 'resize slideshow' and my apologies to going back to the very first pages of this thread.

I'm able to create the galley as discussed here which shows picture but the ghosting is the problem. I tried to understand but couldn't grasp where some of the fellows were referring to in their replies.

Please check the attached file (from here (http://www.asifrnaqvi.com/stuff/gallery.zip)) and you'll see the same old problem. I want to get rid of that 10% alpha image that appears at the same time when the mc resized! Is there any remedy to this? Following is the code I'm using:


spacing = 10;
containerMC._alpha = 0;


MovieClip.prototype.loadPic = function(pic) {
containerMC._alpha = 0;
this.loadMovie(pic);
this._parent.onEnterFrame = function() {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
bar._visible = 1;
per = Math.round((l/t)*100);
if (t != 0 && Math.round(l/t) == 1 && containerMC._width != 0) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
pictureLoader.resizeMe(w, h);
bar._visible = 0;
loadText.text = "";
delete this._parent.onEnterFrame;
} else {
bar._width = per*2.5;//gives the bar a max width 100
loadText.text = per+" %";
}
};
};

MovieClip.prototype.resizeMe = function(w, h) {
var speed = 3;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
if (Math.abs(this._width-w)<1) {
this._width = w;
this._height = h;
_root.containerMC._x = this._x-this._width/2+spacing/2;
_root.containerMC._y = this._y-this._height/2+spacing/2;
_root.containerMC._alpha += 10;
if (_root.containerMC._alpha>90) {
_root.containerMC._alpha = 100;
delete this.onEnterFrame;
}
}
};
};
I’m able to adopt the functionality in my layout but this alpha thingy keeps me away from using it.

I’d really appreciate if someone here could tell me what I’m missing here. Thanks a lot.

[turok]

hey, check this resizing gallery ;)
http://romiglia.com/photolog/

[jschwartz]

Is it possible to change the X, Y co-ordinates so that the picture container could be placed anywhere on the screen?

[onee12]

I was searching high and low for this script for ages! Thanks!
Just one question tho:
I'm using the V3 files and only thing I'm changing is the jpegs....and of course, it doesn't work...the image doesn't appear at all....argh...:crying: File size seems to be the only difference. Does anyone know why?

[ponyack]

Hello everybody,

I have been reading alot of the posts here and I amazed at the size of this thread. Its wicked.

Forgive me if this suggestion has been made but would it be possible to compile all the new ideas here and create a new tutorial?

If this had been done could someone point me towards the tutorial.

Thanks,

Ponyack

[msblack7of940]

hi yall,
does anyone know how to make a larger hovering thumbnail when you put your mouse over a smaller static thumbnail for the resize gallery?

please go here to see this feature:

http://www.zachgold.com/

click on movement or any of the categories and put your mouse over any of the thumbnails. a larger view of the same pic hovers over it.

thanks!
7:)

[alejoca]

HI everyone!
First of all, THANK YOU for share such knowledge. :love:

I manage to do several modifications to v3, but found a little problem . i can´t get / retrive the title atribute in my info field all other things are working perfect just can´t get the title
allways get undefined.
//my container
mc_main.containerMC
//the nav
mc_main.nav

//and so on
mc_main.nav.th_nav.thmb

//the info
mc_main.picinfo.info.text
if i do... mc_main.picinfo.info.text = iArray ......i do become all the titles in the info.text
if i do
trace(iArray[this.id])
trace(pic)
trace(iArray)

allways the trace is undefined

the xml on load function is untouched
////somecode///
pArray.push(gallery.childNodes[i].attributes.source);
tArray.push(gallery.childNodes[i].attributes.thumb);
iArray.push(gallery.childNodes[i].attributes.title);
//somecode//

but.onRelease = function() {
mc_main.containerMC.loadPic(pArray[this.id], iArray[this.id]);
disButtons2(this.id);
};
the pics/thumbs are loaded correctly, buttons are made, buttons load the correct pic...
xml .....( <image source="pics/pic1.jpg" thumb="pics/th1.jpg" title="Earth"/> )

any ideas?? :puzzled:
als i say all [I]except that is working fine..

thnks in advance

[alejoca]

fixed!:hugegrin:
too much modifications.....!! messed up some code.... :asleep:

thanks anyway

[ikitub]

how can i add a preloader on sample v3 with thumb... im having a hard time adding a preloader for the thumbnail or for the image itself.. sorry im just a newbie... if someone can also show me the v3 with thumbs that already have a preloader it will be so much appreciated.. how can i also add previous and next buttons... thanks...

[igby]

Hey all,

I'm trying to randomize the arrays of the photo and the titles, but I can't seem to get them to randomize together. I've got the photos randomized, but I can't get the titles to follow it.

Here's what I have with the random photos:

//my randomize function
Array.prototype.rn= function()
{
ret= new Array();
var copy= this.concat();
while(copy.length > 0)
{
rnd=int(Math.random()*copy.length)
ret.push(copy[rnd])
copy.splice(rnd,1);
}
return ret
}
//barely modified from one of the versions of this lovely resizing gallery forum
gallery_xml.onLoad = function(success) {
if (success) {
var gallery = this.firstChild;
//pathToPics = gallery.attributes.path;
for (var i = 0; i<gallery.childNodes.length; i++) {
tArray.push(gallery.childNodes[i].attributes.gender);
pArray.push(gallery.childNodes[i].attributes.source);
}
//randomizes photo array
b=pArray.rn();
//load first picture in the array
containerMC.loadPic(0);
} else {
title_txt.text = "Error!";
}
};

Any thoughts?

Thanks
Igby

[jennhaw]

Hi,

I don't know if this thread is still active, but I thought I'd try. I've been working on some galleries using the multiple galleries with thumbs version (I am using MX).

Since I have several galleries, I decided it best to use external .swf's. I've got everything working locally with my own modifications. But when I load the external .swf's from within my main .fla and live on the site, the border stays the same width as the previous picture when loading a narrower picture. I must say that I also have the same height on each picture and registered the border/movieclip on the top/left corner so that all that changes is the width going to the right (don't know if that makes sense).

My site is here and the galleries are under galleries, no less: http://www.snappychic.com/photography.htm

And, just in case you need it, my code for the gallery is:

var tnNr;
spacing = 20;
container._alpha = 0;
var curLength;
MovieClip.prototype.loadPic = function(pic, id) {
this._alpha = 0;
this.loadMovie(pic);
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
var w = container._width+spacing, h = container._height+spacing;
_root.border2.resizeMe(w, h, id);
delete this.onEnterFrame;
}
};
};
MovieClip.prototype.resizeMe = function(w, h, id) {
var speed = 3;
container._alpha = 0;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
container._x = this._x-this._width/1000+spacing/2;
container._y = this._y-this._height/1000+spacing/2;
info._y = Math.round(this._y+this._height/1000+spacing/2);
container._alpha += 5;
if (container._alpha>90) {
container._alpha = 100;
delete this.onEnterFrame;
}
}
};
};
function galleryChoice(q) {
pArray = new Array();
tArray = new Array();
iArray = new Array();
my_xml = new XML();
for (var j = 0; j<curLength; j++) {
this.th_nav["thmb"+j].removeMovieClip();
}
my_xml.ignoreWhite = true;
my_xml.onLoad = function(loaded) {
if (loaded) {
gallery = this.firstChild.childNodes[q];
curLength = gallery.childNodes.length;
for (var i = 0; i<gallery.childNodes.length; i++) {
pArray.push(gallery.childNodes[i].attributes.source);
tArray.push(gallery.childNodes[i].attributes.thumb);
iArray.push(gallery.childNodes[i].attributes.title);
}
}
delay = setInterval(makeButtons, 50);
};
my_xml.load("gallery_disc.xml");
}
function makeButtons() {
tnNr = 0;
clearInterval(delay);
for (var i = 0; i<tArray.length; i++) {
var thb = th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i);
thb.id = i;
thb._x = i%3*50;
thb._y = Math.floor(i/3)*50;
}
loadButtons();
}
function loadButtons() {
var tbox = th_nav["thmb"+tnNr].box;
tbox.loadMovie(tArray[tnNr]);
temp = this.createEmptyMovieClip("tmp"+tnNr, 999);
temp.onEnterFrame = function() {
bt = tbox.getBytesTotal();
bl = tbox.getBytesLoaded();
if (bt == bl && bt>4) {
nextButton();
delete this.onEnterFrame;
}
};
}
function nextButton() {
if (tnNr<tArray.length-1) {
tnNr++;
loadButtons();
} else {
activateButtons();
}
}
function activateButtons() {
mainButtons();
for (var i = 0; i<pArray.length; i++) {
var but = th_nav["thmb"+i];
but.id = i;
but.onRelease = function() {
container.loadPic(pArray[this.id], iArray[this.id]);
disButtons2(this.id);
};
}
container.loadPic(pArray[0], iArray[0]);
disButtons2(0);
}
butArray = new Array();
butArray = ["gal1_btn", "gal2_btn", "gal3_btn", "gal4_btn"];
function mainButtons() {
for (var i = 0; i<butArray.length; i++) {
this[butArray[i]].id = i;
this[butArray[i]].onRelease = function() {
galleryChoice(this.id);
disButtons(this.id);
};
}
}
function disButtons2(d) {
for (var i = 0; i<tArray.length; i++) {
if (i != d) {
this.th_nav["thmb"+i].enabled = 1;
this.th_nav["thmb"+i].box._alpha = 100;
} else {
this.th_nav["thmb"+i].enabled = 0;
this.th_nav["thmb"+i].box._alpha = 50;
}
}
}
function disButtons(d) {
for (var i = 0; i<butArray.length; i++) {
if (i != d) {
this[butArray[i]].enabled = 1;
this[butArray[i]].gotoAndStop(1);
} else {
this[butArray[i]].enabled = 0;
this[butArray[i]].gotoAndStop(2);
}
}
}
disButtons(0);
galleryChoice(0);


If anyone can tell me what I may be doing wrong, please let me know. I would be so grateful for any help!!:)

Jen

[cryptoboy]

I love this script and would love to add an "Autoplay" button. Any ideas?

[kobalt7]

hi

looking for some help with cleaning up so AS and fixing a few bugs. Heres the AS, the files is below for download
http://www.kobalt7.com/2006/tst/tuto.zip


spacing = 20;
picture._alpha = 0;
MovieClip.prototype.loadPic = function(pic) {
this.loadMovie(pic);
preloader._visible = true;
preloader._alpha = 100;
onEnterFrame = function () {
filesize = picture.getBytesTotal();
loaded = picture.getBytesLoaded();
if (loaded != filesize) {
preloader.preload_bar._xscale = 100*loaded/filesize;
preloader._alpha = 100;
} else if (loaded == filesize && filesize != 0) {
preloader._alpha = preloader._alpha-5;
if (preloader._alpha<=0 && picture._alpha>=100) {
_parent.image_mcl.removeListener(mclListener);
ino.dino.auton.play();
delete onEnterFrame;
delete this.onEnterFrame;
delete border.onEnterFrame;
if (link[p] != undefined) {
picture.onRollOver = function() {
captionFN(true, link[p], this);
border.gotoAndStop(2);
};
picture.onRollOut = function() {
captionFN(false);
border.gotoAndStop(3);
};
picture.onRelease = function() {
getURL(link[p], "_blank");
delete onEnterFrame;
};
}
}
ino.nrr.onRollOver = function() {
ino.dino.io.gotoAndStop(2);
};
ino.nrr.onRollOut = function() {
ino.dino.io.gotoAndStop(3);
};
ino.nrr.onRelease = function() {
if (ino.dino.htmltxt != null or undefined) {
ino.dino.play();
}
};
var t = picture.getBytesTotal(), l = picture.getBytesLoaded();
if (t != 0 && Math.round(l/t) == 1) {
var w = picture._width+spacing, h = picture._height+spacing;
border.resizeMe(w, h);
}
}
};
};
MovieClip.prototype.resizeMe = function(w, h) {
var speed = 9;
this.onEnterFrame = function() {
yy = picture._height;
var w = picture._width+spacing, h = picture._height+spacing;
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
if (Math.abs(this._width-w)<1) {
this._width = w;
this._height = h;
picture._x = this._x-this._width/2+spacing/2;
picture._y = this._y+8;
if (this._width>18) {
picture._alpha = picture._alpha+10;
}
if (this._width<88) {
}
if (picture._alpha == 100) {
delete onEnterFrame();
}
}
};
};
function loadXML(loaded) {
if (loaded) {
xmlNode = this.firstChild;
image = [];
description = [];
thumbnails = [];
link = [];
info = [];
total = xmlNode.childNodes.length;
for (i=0; i<total; i++) {
image[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
description[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
thumbnails[i] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
link[i] = xmlNode.childNodes[i].childNodes[3].firstChild.nodeValue;
info[i] = xmlNode.childNodes[i].childNodes[4].firstChild.nodeValue;
thumbnails_fn(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 nextImage() {
if (p<(total-1)) {
p++;
if (loaded == filesize) {
picture.loadPic(image[p]);
ino.desc_txt.text = description[p];
ino.dino.htmltxt.text = info[p];
picture_num();
}
}
}
function prevImage() {
if (p>0) {
p--;
picture.loadPic(image[p]);
ino.desc_txt.text = description[p];
ino.dino.htmltxt.text = info[p];
picture_num();
}
}
function firstImage() {
if (loaded == filesize) {
picture.loadPic(image[0]);
ino.desc_txt.text = description[0];
cap.desc.text = " "+link[0];
ino.dino.htmltxt.text = info[0];
picture_num();
}
}
function picture_num() {
current_pos = p+1;
ino.pos_txt.text = current_pos+" / "+total;
}
function thumbNailScroller() {
this.createEmptyMovieClip("tscroller", 1000);
scroll_speed = 10;
tscroller.onEnterFrame = function() {
if ((_ymouse>=thumbnail_mc._y) && (_ymouse<=thumbnail_mc._y+thumbnail_mc._height)) {
if ((_xmouse>=(hit_right._x-40)) && (thumbnail_mc.hitTest(hit_right))) {
thumbnail_mc._x -= scroll_speed;
_x;
} else if ((_xmouse<=(hit_left._x+40)) && (thumbnail_mc.hitTest(hit_left))) {
thumbnail_mc._x += scroll_speed;
}
} else {
delete tscroller.onEnterFrame;
}
};
}
k = 0;
function thumbnails_fn(k) {
thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
tlistener = new Object();
tListener.onLoadStart = function(target_mc) {
target_mc._alpha = 0;
};
tListener.onLoadStart = function(target_mc) {
target_mc._alpha = 0;
};
tListener.onLoadProgress = function(target_mc) {
target_mc._alpha += 10;
//preloader.preload_bar._xscale = bytesLoaded/bytesTotal;
};
tListener.onLoadComplete = function(target_mc) {
target_mc._alpha = 100;
};
tlistener.onLoadProgress = function(target_mc, bytesLoaded:Number, bytesTotal:Number):Void {
};
tlistener.onLoadInit = function(target_mc) {
target_mc._x = (target_mc._width+5)*k;
target_mc.pictureValue = k;
pop = eval("thumbnail_mc.tram"+k);
target_mc.onRelease = function() {
p = this.pictureValue-1;
po = eval("thumbnail_mc.tt"+k);
po._x = this._x;
po.gotoAndStop(2);
picture._alpha = 0;
nextImage();
};
target_mc.onRollOver = function() {
thumbnail_mc.test.gotoAndStop(2);
thumbnail_mc.test._x = this._x;
thumbNailScroller();
};
target_mc.onRollOut = function() {
thumbnail_mc.test.gotoAndStop(3);
};
thumbnail_mc.attachMovie("thumb", "test", thumbnail_mc.getNextHighestDepth());
thumbnail_mc.attachMovie("thumb2", "tt"+k, thumbnail_mc.getNextHighestDepth());
thumbnail_mc.attachMovie("thumb3", "tram", thumbnail_mc.getNextHighestDepth());
};
image_mcl = new MovieClipLoader();
image_mcl.addListener(tlistener);
image_mcl.loadClip(thumbnails[k], "thumbnail_mc.t"+k);
}
captionFN = function (showCaption, captionText, bName) {
if (showCaption && loaded == filesize) {
cap.gotoAndPlay(1);
cap.crap.setMask(cap.msk);
cap.msk.gotoAndPlay(1);
createEmptyMovieClip("hoverCaption", this.getNextHighestDepth());
cap.desc.text = " "+captionText;
cap.crap._width = 6*cap.desc.text.length;
cap._alpha = 100;
if ((bName._width+bName._x+cap._width)>border.width) {
xo = -2-cap._width;
yo = -17;
} else {
xo = 2;
yo = -17;
}
hoverCaption.onEnterFrame = function() {
cap._x = _xmouse+xo;
cap._y = _ymouse+yo;
cap._visible = true;
};
} else {
cap.gotoAndPlay(14);
delete hoverCaption.onEnterFrame;
}
};
stop();

[scotty]

@jennhaw: you have a reference to _root in the code

_root.border2.resizeMe(w, h, id);
change it to

border2.resizeMe(w, h, id);
and it will work (LOL, I hope)

scotty(-:

[bacalao]

Hi all,
This has been a great thread to learn from. I've been looking at this thread and the other thread that involves thumbs. I understand them both separately but I'm having a bit of trouble trying to intergrate the 2. Can someone please help me understand how to go about this?

Thanks,
Bacalao :chinaman:

[bacalao]

here's the file 38531

[jennhaw]

@jennhaw: you have a reference to _root in the code
ActionScript Code:

_root.border2.resizeMe(w, h, id);




change it to
ActionScript Code:

border2.resizeMe(w, h, id);




and it will work (LOL, I hope)

scotty(-:

Hey Scotty,

I found the solution to my problem. Don't laugh because it's so stupid of me to not notice. I forgot to reduce the width of the white background that sits on my main stage. I noticed it on accident the other day. It's working great now (I suppose it was always working--LOL). Thanks for your help though.

Jen

[s9v24]

I cannot seem to solve this, ive tried all sorts of combinations:

1) The Next/Prev buttons do not seem to work on my own compilation, the v3 thumbs multiple gallery, here is the code (excuse the messy experimentation):

ActionScript Code:

stop();
//var root = this;
var tnNr;
spacing = 10;
container._alpha = 0;
var curLength;
MovieClip.prototype.loadPic = function(pic, id) {
info.text = "";
//galtitle.text = "";
cur = pic;
// desc.text = "";
this._alpha = 0;
this.loadMovie(pic);
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
bar._visible = 1;
per = Math.round((l/t)*100);
if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
var w = container._width+spacing, h = container._height+spacing;
border.resizeMe(w, h, id, pic);
bar._visible = 0;
delete this.onEnterFrame;
} else {
bar._width = per;
//gives the bar a max width 100
//nav2.info.text = per+" %";
}
};
};
MovieClip.prototype.resizeMe = function(w, h, id) {
var speed = 7;
// SPEED OF BOX
container._alpha = 0;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
// hidden nav2
nav2._x = Math.round(this._x-this._width/2);
nav2._y = Math.round(this._y+this._height/2+spacing/2);
//FOR THUMBNAILS
th_nav._x = nav2._x-65;
//FOR XML BUTTONS
nav_gal._x = nav2._x+this._width+5;
nav_gal._y = th_nav._y=this._y-this._height/2;
// NEXT PREV BUTTONS
prevb._x = _root.border._x;
nextb._x = _root.border._x;
nextb._y = th_nav._y+5;
prevb._y = th_nav._y+5;
//nextb._y = prevb._y=_th_nav._y+5;
nextb._height = prevb._height=_root.border._height-10;
nextb._width = prevb._width=_root.border._width/2-5;
// TITLE
galtitle._y = th_nav._y-25;
galtitle._x = nav2._x;
//------------------------------------------------//
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
container._x = this._x-this._width/2+spacing/2;
container._y = this._y-this._height/2+spacing/2;
//info._y = Math.round(this._y+this._height/2+spacing/2);
container._alpha += 3;
if (container._alpha>90) {
nav2.info.text = id;
container._alpha = 100;
delete this.onEnterFrame;
}
}
};
};
var galLength;
my_xml = new XML();
my_obj = new Object();
my_xml.ignoreWhite = true;
my_xml.onLoad = function(loaded) {
if (loaded) {
var galleries = this.firstChild.childNodes;
galLength = galleries.length;
for (var i = 0; i<galLength; i++) {
my_obj = new Object();
my_obj[i].nodes = galleries[i].childNodes;
var gal_btn = nav_gal.attachMovie("gal_btn", "gal_btn"+i, i);
gal_btn._y = i*15;
gal_btn.label.text = galleries[i].attributes.name;
gal_btn.label.autoSize = true;
gal_btn.bg._width = gal_btn.label._width;
gal_btn.id = i;
[I]//galtitle.text = galleries[i].attributes.name
galtitle.autoSize = true;
gal_btn.onRelease = function() {
galleryChoice(this.id);
disButtons(this.id);
//galtitle.text = this.id.attributes.name
};
}
}
galleryChoice(0);
disButtons(0);
};
my_xml.load("gallery.xml");
function galleryChoice(q) {
tArray = [];
pArray = [];
iArray = [];
for (var j = 0; j<curLength; j++) {
this.th_nav["thmb"+j].removeMovieClip();
}
gallery = my_obj[q].nodes;
curLength = gallery.length;
for (var i = 0; i<gallery.length; i++) {
pArray.push(gallery.attributes.source);
tArray.push(gallery[i].attributes.thumb);
iArray.push(gallery[i].attributes.title);
}
delay = setInterval(makeButtons, 50);
}
function makeButtons() {
tnNr = 0;
clearInterval(delay);
for (var i = 0; i<tArray.length; i++) {
var thb = th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i);
thb.id = i;
[I]// thb.imagelabel.text = "image "+(i+1); // IF YOU WANT THUMB WITH LABELS
thb._x = i%2*33;
thb._y = Math.floor(i/2)*33;
}
loadButtons();
}
function loadButtons() {
var tbox = th_nav["thmb"+tnNr].box;
tbox.loadMovie(tArray[tnNr]);
temp = this.createEmptyMovieClip("tmp"+tnNr, 999);
temp.onEnterFrame = function() {
bt = tbox.getBytesTotal();
bl = tbox.getBytesLoaded();
th_nav.thmb.bar._visible = 1;
per = Math.round((l/t)*100);
if (bt == bl && bt>4) {
th_nav.thmb.bar._visible = 0;
nextButton();
delete this.onEnterFrame;
}
};
}
function nextButton() {
if (tnNr<tArray.length-1) {
tnNr++;
loadButtons();
} else {
activateButtons();
}
}
function activateButtons() {
mainButtons();
for (var i = 0; i<pArray.length; i++) {
var but = th_nav["thmb"+i];
but.id = i;
//added rollOver feature for thumbs
but.onRollOver = function() {
startDrag(desc, true);
_root.desc.gotoAndStop(1);
desc.title = iArray[this.id];
};
//added onRelease feature for thumbs
but.onRelease = function() {
container.loadPic(pArray[this.id], iArray[this.id]);
disButtons2(this.id);
_root.desc.stopDrag();
_root.desc.gotoAndStop(2);
desc.title = "";
//added
cur = this.id;
};
//added rollOut feature for thumbs
but.onRollOut = function() {
_root.desc.stopDrag();
_root.desc.gotoAndStop(2);
desc.title = "";
};
}
container.loadPic(pArray[0], iArray[0]);
disButtons2(0);
}
function disButtons2(d) {
for (var i = 0; i<tArray.length; i++) {
if (i != d) {
this.th_nav["thmb"+i].enabled = 1;
this.th_nav["thmb"+i].box._alpha = 100;
} else {
this.th_nav["thmb"+i].enabled = 0;
this.th_nav["thmb"+i].box._alpha = 50;
}
}
}
function disButtons(d) {
for (var i = 0; i<galLength; i++) {
var but = nav_gal["gal_btn"+i];
if (i != d) {
but.enabled = 1;
but.gotoAndStop(1);
} else {
but.enabled = 0;
but.gotoAndStop(2);
}
}
}
////////////////////////////////////////////////////////
// the part i added starts here
speed = 10;
dir = -1;
MovieClip.prototype.fadeMe = function() {
this.onRollOver = function() {
this.onEnterFrame = function() {
dir = 1;
this._alpha += speed*dir;
if (this._alpha>30) {
this._alpha = 30;
}
if (this._alpha<1) {
this._alpha = 0;
}
};
};
this.onRollOut = function() {
this.onEnterFrame = function() {
dir = -1;
this._alpha += speed*dir;
if (this._alpha>30) {
this._alpha = 30;
}
if (this._alpha<1) {
this._alpha = 0;
}
};
};
};
nextb.fadeMe();
prevb.fadeMe();
////////////////////////////////////////////////////////
/*prevb.onRelease = function() {
if (cur == 0) {
container.loadPic(pArray.length-1);
} else {
container.loadPic(pArray[--i], iArray[--i]);
}
};
nextb.onRelease = function() {
if (cur == pArray.length-1) {
container.loadPic(0);
} else {
container.loadPic(pArray[i++], iArray[i++]);
}
};*/
////////////////////////////////////////////////////////
prevb.onRelease = function() {
if (cur == pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur--]);
}
}
nextb.onRelease = function() {
if (cur == pArray.length-1) {
container.loadPic(pArray[0]);
} else {
container.loadPic(pArray[cur++]);
}
}
///////////////////






2) How do I get the multiple gallery names to display in a dynamic text field. So when each gallery is clicked the name appears alongside the border...anybody know?

Thanks

[bacalao]

See if this works for you.


prevb.onRelease = function() {
if (cur == 0) {
containerMC.loadPic(pArray.length-1);
} else {
containerMC.loadPic(cur-1);
}
};
nextb.onRelease = function() {
if (cur == pArray.length-1) {
containerMC.loadPic(0);
} else {
containerMC.loadPic(cur+1);
}
};

[kobalt7]

i built this gallery with the rezise and i can load the swfs but they resize out of control:




spacing = 20;
picture._alpha = 0;
preloader._alpha = 0;
MovieClip.prototype.loadPic = function(pic) {

this.loadMovie(pic);
preloader.what.text = "No:"+p;
preloader._alpha = 100;
picture._alpha = 0;
onEnterFrame = function () {
filesize = picture.getBytesTotal();
loaded = picture.getBytesLoaded();
if (loaded != filesize) {
preloader.preload_bar._xscale = 100*loaded/filesize;
preloader._alpha = preloader._alpha+10;
} else if (loaded == filesize && filesize != 0) {
var t = picture.getBytesTotal(), l = picture.getBytesLoaded();
if (t != 0 && Math.round(l/t) == 1) {
var w = picture._width+spacing, h = picture._height+spacing;
border.resizeMe(w, h);
if (link[p] != undefined) {
picture.onRollOver = function() {
captionFN(true, link[p], this);
border.gotoAndStop(2);
};
picture.onRollOut = function() {
captionFN(false);
border.gotoAndStop(3);
};
picture.onRelease = function() {
getURL(link[p], "_blank");
delete onEnterFrame;
};
}
preloader._alpha = preloader._alpha-10;
if (border._width eq picture._width+spacing) {
picture._alpha = picture._alpha+10;
if (preloader._alpha<=0 && picture._alpha>=100 && border._width eq picture._width+spacing) {
image_mcl.removeListener(mclListener);
ino.dino.auton.play();
delete onEnterFrame;
delete this.onEnterFrame;
delete border.onEnterFrame;
}
}
ino.nrr.onRollOver = function() {
ino.dino.io.gotoAndStop(2);
};
ino.nrr.onRollOut = function() {
ino.dino.io.gotoAndStop(3);
};
ino.nrr.onRelease = function() {
if (ino.dino.htmltxt != null or undefined) {
ino.dino.play();
}
};
}
}
};
};
MovieClip.prototype.resizeMe = function(w, h) {
var speed = 5;
this.onEnterFrame = function() {
yy = picture._height;
var w = picture._width+spacing, h = picture._height+spacing;
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
if (Math.abs(this._width-w)<1) {
this._width = w;
this._height = h;
picture._x = this._x-this._width/2+spacing/2;
picture._y = this._y+8;
}
};
};
function loadXML(loaded) {
if (loaded) {
xmlNode = this.firstChild;
image = [];
description = [];
thumbnails = [];
link = [];
info = [];
total = xmlNode.childNodes.length;
for (i=0; i<total; i++) {
image[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
description[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
thumbnails[i] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
link[i] = xmlNode.childNodes[i].childNodes[3].firstChild.nodeValue;
info[i] = xmlNode.childNodes[i].childNodes[4].firstChild.nodeValue;
thumbnails_fn(i);
}
firstImage();
} else {
content = "file not loaded!";
//gotoAndPlay(24);
}
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
preloader.what.text = "XML";
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 nextImage() {
preloader._visible = true;
if (picture._alpha>=100) {
onEnterFrame = function () {
picture._alpha = picture._alpha-10;
preloader._alpha = preloader._alpha+10;
if (picture._alpha<=0 && preloader._alpha>=100) {
//var dingo = true;
if (p<(total-1)) {
p++;
if (loaded == filesize) {
picture.loadPic(image[p]);
ino.desc_txt.text = description[p];
ino.dino.htmltxt.text = info[p];
picture_num();
}
}
}
};
}
}
function prevImage() {
if (p>0) {
p--;
picture.loadPic(image[p]);
ino.desc_txt.text = description[p];
ino.dino.htmltxt.text = info[p];
picture_num();
}
}
function firstImage() {
if (loaded == filesize) {
picture.loadPic(image[0]);
ino.desc_txt.text = description[0];
cap.desc.text = " "+link[0];
ino.dino.htmltxt.text = info[0];
picture_num();
}
}
function picture_num() {
current_pos = p+1;
ino.pos_txt.text = current_pos+" / "+total;
}
function thumbNailScroller() {
this.createEmptyMovieClip("tscroller", 1000);
scroll_speed = 10;
tscroller.onEnterFrame = function() {
if ((_ymouse>=thumbnail_mc._y) && (_ymouse<=thumbnail_mc._y+thumbnail_mc._height)) {
if ((_xmouse>=(hit_right._x-40)) && (thumbnail_mc.hitTest(hit_right))) {
thumbnail_mc._x -= scroll_speed;
//hit_right.gotoAndStop(2);
_x;
} else if ((_xmouse<=(hit_left._x+40)) && (thumbnail_mc.hitTest(hit_left))) {
thumbnail_mc._x += scroll_speed;
}
} else {
delete tscroller.onEnterFrame;
}
};
}
k = 0;
function thumbnails_fn(k) {
thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
//target_mc.gx._x = (target_mc._width+5)*k;
tlistener = new Object();
tListener.onLoadStart = function(target_mc) {
target_mc._alpha = 0;
};
tListener.onLoadStart = function(target_mc) {
target_mc._alpha = 0;
};
tListener.onLoadProgress = function(target_mc) {
target_mc._alpha += 10;
preloader.preload_bar._xscale = bytesLoaded/bytesTotal;
};
tListener.onLoadComplete = function(target_mc) {
target_mc._alpha = 100;
};
tlistener.onLoadProgress = function(target_mc, bytesLoaded:Number, bytesTotal:Number):Void {
//trace(target_mc+".onLoadProgress with "+bytesLoaded+" bytes of "+bytesTotal +);
//preloader._visible=true
preloader.what.text = k+"thumbs";
kl = k+1;
if (kl eq total) {
preloader.what.text = "Done!";
}
};
tlistener.onLoadInit = function(target_mc) {
target_mc._x = (target_mc._width+5)*k;
target_mc.pictureValue = k;
pop = eval("thumbnail_mc.tram"+k);
target_mc.onRelease = function() {
p = this.pictureValue-1;
po = eval("thumbnail_mc.tt"+k);
po._x = this._x;
po.gotoAndStop(2);
trace(po);
//fadde();
//picture._alpha = 0;
nextImage();
preloader.what.text = "No:"+k;
};
target_mc.onRollOver = function() {
thumbnail_mc.test.gotoAndStop(2);
thumbnail_mc.test._x = this._x;
thumbNailScroller();
};
target_mc.onRollOut = function() {
thumbnail_mc.test.gotoAndStop(3);
};
thumbnail_mc.attachMovie("thumb", "test", thumbnail_mc.getNextHighestDepth());
thumbnail_mc.attachMovie("thumb2", "tt"+k, thumbnail_mc.getNextHighestDepth());
thumbnail_mc.attachMovie("thumb3", "tram", thumbnail_mc.getNextHighestDepth());
};
image_mcl = new MovieClipLoader();
image_mcl.addListener(tlistener);
image_mcl.loadClip(thumbnails[k], "thumbnail_mc.t"+k);
}
captionFN = function (showCaption, captionText, bName) {
if (showCaption && loaded == filesize) {
cap.gotoAndPlay(1);
cap.crap.setMask(cap.msk);
cap.msk.gotoAndPlay(1);
createEmptyMovieClip("hoverCaption", this.getNextHighestDepth());
cap.desc.text = " "+captionText;
cap.crap._width = 6*cap.desc.text.length;
cap._alpha = 100;
if ((bName._width+bName._x+cap._width)>border.width) {
xo = -2-cap._width;
yo = -17;
} else {
xo = 2;
yo = -17;
}
hoverCaption.onEnterFrame = function() {
cap._x = _xmouse+xo;
cap._y = _ymouse+yo;
cap._visible = true;
};
} else {
cap.gotoAndPlay(14);
delete hoverCaption.onEnterFrame;
}
};
stop();

[s9v24]

See if this works for you.


prevb.onRelease = function() {
if (cur == 0) {
containerMC.loadPic(pArray.length-1);
} else {
containerMC.loadPic(cur-1);
}
};
nextb.onRelease = function() {
if (cur == pArray.length-1) {
containerMC.loadPic(0);
} else {
containerMC.loadPic(cur+1);
}
};

Thanks but it didn't work for me, I must be doing something wrong. Any more ideas?

[bacalao]

I was messing around with V3 w/thumbs and whenever I try and try to change the size of the thumbs I get a stretched images that blows well past the border. Is there a way to use a rectangular image instead of a square one?

Thanks,
Bacalao

[bacalao]

Nevermind. THUMBS_NAV had scaling.

Thanks