Howd he do this? Resizing slideshow

[saleek]

This thread has done great justice.

Using Scotty's code, has anyone managed to implement a fadeOut() routine?

I am actually using the brightOffset, and would like to use it as a fadeOut() routine.

If anyone knows, shout!

regards,

KS

[Neil]

Hi saleek. You mean you want to fade in and fade out the pictures? I have done it sucessfully. If you want the .fla , then let me know. I will upload it here.

[d3020]

Does anyone have a fla. that shows how to do the thumbnails and there scrolling like this - http://www.carldekeyzer.com/

[saleek]

Hi saleek. You mean you want to fade in and fade out the pictures? I have done it sucessfully. If you want the .fla , then let me know. I will upload it here.
Hi Neil,

Yes, please post your fla so I can have a look!

thanks,

Saleek

[asthyanax]

Hi,


I have a question about this resizing slideshow. I'd like to resize a pic before it appears. I calculate a ratio for the picture and i would like to resize it with this ratio and then resize the border and the pic. But i don't know how to do that. Any ideas ?
thank's.

Chris

[Neil]

Hi Neil,

Yes, please post your fla so I can have a look!

thanks,

Saleek

Sorry, saleek, pretty busy lately, Yeah, now .... download the .fla from the below link ! , and enjoy !!!
:kommie:

Link : http://www.arrfans.com/nicegallery.zip

But, i got problems too ! , umm... how do you load picture, when you open the gallery :huh: , like as soon as you open, you see a dumb format of the first frame, where your empty movie clip and all the crap is . But, how do you load the first picture from the Picture Array, on the first frame ? :h: I have tried putting all sorts of code from buttons and stuff on the first frame, but doenst work...

Help someone. But, everything is included in above .fla,

1. Alpha Transitions
2. Captions Aligned to the picture
3. Preloader and Menu buttons aligned to the picture, etc...etc...

You may want to make thumbnails, if you want to you make it look cool :cap:

Enjoy it !!! Again the link to download.

http://www.arrfans.com/nicegallery.zip

It includes both Mx and Mx2004 .flas and jpg and xml. Thanks all !!!

[scotty]

changePhoto(0)
btw Everything is in the v3.zip (post#170;) )

scotty(-:

[Neil]

Nah, not everything is in V3, i downloaded v3 and modified a lot , there were couple of problems like , alpha and stuff. I made the alpha decrease and increase when a transition occur. Also, made some minor changes :)

[bhag]

Is your site down? I get 404.

[Neil]

Nope, its working here.... http://www.Arrfans.com is my website,

And this is the download link : http://www.Arrfans.com/nicegallery.zip

Not working? it works here :)

[attitude]

DDD, I think this one has most of the fixings and "add-on's"
V3.zip (http://home.wanadoo.nl/gertvinke/kirupa/V3.zip)
If you miss something let me know;)

scotty(-:

Scotty,

the next/prev buttons don't work properly. I know there's a problem in the code for the next/prev buttons but cant seem to fix it.

What do i need to change in the code to make the buttons work properly?

[sky_vault]

Scotty or other helpful friend,
This gallery is awesome but I would like to know how would one go
about making a different transition effect instead of the fade ... I
want to do a sliding mask from left to right that exposes the next
image over the top of the current one ... So I imagine this would
be done using swap depths and a dynamic mask but how would you
go about doing it with the gallery in this thread ?
here is a link to the effect i am looking for RedSquarePhoto (http://www.redsquarephoto.com/)
just go to portfolio and select an image set ...
Thanks in advance
Sky

[Neil]

Yeah, that would be awesome, but i sort of like the alpha effect. But, you are right, that would be a good challenge for us...let me see, if i can do something.

[sky_vault]

Thanks Neil!
I know a hand full of times on this thread I have seen others
wanting to do this same effect...and it has just gotten put
on the back burner due to the perfecting of what we have
now with the fade effect ... So I think it would be great to
just build on this and just modify the transition since what
has been done so far is AWESOME!!!
I have a file with a dynamic mask for images it just does not
make use of dynamic buttons and all the cool stuff in this
gallery ... it is based off the fading grid tut i do believe ...
let me know if this file might be of any help. And of course
I do believe that the said file was tweeked by none other
than our "SCOTTY" the great!

[Neil]

Feeling sleepy here man.... :ko: :hangover:

might try something tommorow...oh wait, oh man, got a calculus test :A+: on friday...dang man, i gotta study this week. :ogre:

allright, lets hope for some scotty help :crazy:

[sky_vault]

No Prob Neil ...
Do what you can when you can ...
and for now I will just keep fumbling around and try to
do what I can and maybe with a miracle I will actually
make some headway ...
Thanks ...
[sending psychic help signal :SCOTTY ! HELP ! SCOTTY ! HELP ! ]

[authentik]

http://flash.designbyfront.com/flash.htm
Any ideeas?

[siliconbauhaus]

as to how this is done?

looks to me like a easing scale on the backgound for each part, it only changes for each section so it's fairly simple.

there are some tutes here that do the same thing

[Neil]

Check this out, this is my little original attempt. I used bunch of variables which are defined at different times. Like, onRollOver, onPress, onRelease. Notice, that they are in order of time. So, before the external movie or attached movie loads, it assisgns different variables, when a person moves, rollsover, press, and releases the button. And, combining all that with the tutorial on kirupa (also using attachmovie method), i came up with this thing :) , i am stilll working on it.

*sorry, the link removed*


Feedbacks appreciated :)

[asthyanax]

Very nice !! Maybe you could find how to do what i want to do. I want to make a resizing gallery like this one in this huge thread but i would like to resize the border in a certain size, attach a preloader bar in it and then i resize the border. But i didn't find how to do that.

[sky_vault]

Nice work Neil!!!
wanna pull back the curtain and show us how your magic works?:sure:

[attitude]

Hi i have downloaded the v3 file and added my own photos. It works fine when i click on the thumbnails but the back and previous buttons don't work properly. The foward button is only able to go until the 2nd photo in the array. And the back button doesnt seem to be working at all.

Have attached my .fla file. Can someone help me out and tell me how i can rectify the problem?

I'm also interested in adding a horizontal scroll bar for the thumbnails so as to save space. Where can i place the scroll bar AS? I'm quite new to flash and AS so i'm having a little problems here and there....sorry

[sky_vault]

how would you set up so that the dynamic thumbnails
display in rows and columns?

here is the code i have from a version of this gallery:


for (var b=0; b<gallery.childNodes.length; b++) {
item = _root.nav.attachMovie("itemClip", "itemClip" + b, b);
item._x = 10+24*b;
item._y = 20.0;
item.mytitle=gallery.childNodes[b].attributes.title;
item.imagepath=b;
item.onRelease= function(){
_root.containerMC.loadPic(this.imagepath);
}


Secondly
How would you set these dynamic thumbs to actually load
thumb images instead of just being boxes with rollover
animations?

[RinaAzlin]

Sorry for contributing to this thread and making it a never ending thread....but I would like to ask you guys, could we make the thumbnails and the prev/next button fix in one place? How ? Again I'm very sorry if it already mentioned (could not seem to find them..)

[Neil]

Download the latest file here :
*LINK UPDATED*
http://www.Arrfans.com/otherfiles/Nicegallery.zip



------edit------
Thumbnails will be included shortly, i am working on it :)
------edit------

Features:

Loads the first picture as soon as it plays
Alpha Transitions
Prev and Next buttons
Advanced Vertical Preloader with Shape Tweening.
Preloader with Percent Indicator.


Remove this code from the first frame of the .fla to make the prev & next buttons fixed at one place:


prevb._x = Math.round((this._x-this._width/2)+38);
nextb._x = Math.round((nav._x+this._width/2)-35);
nextb._y =Math.round(prevb._y=Math.round(this._y+this._heig ht/2)+5);

[Neil]

Nice work Neil!!!
wanna pull back the curtain and show us how your magic works?:sure:

Hehe : nothing special here...I just used the Transitions tut from kirupa.com ;)

Make it tween and animate a little bit :P

I am gonna make the whole thing move randomly with easing equations. Still working on it :D

[snaphappy]

Fanfare please...

Finally got my travel photography site finished, thanks largely to this and other excellent threads on the Kirupa forum and a lot of help from Scotty. You can see it at www.developingdreams.com (http://www.developingdreams.com)

Its taken a lot of work but I have also learnt a whole lot about flash (and xml) into the bargain through this and related threads. This is my first attempt at a fully fledged Flash site, and my knowledge of actionscript when I started the project was virtually zero.

I've set up a critique thread for the site in case anyone has any comments, which is at http://www.kirupaforum.com/forums/showthread.php?t=77226

Be interested to hear what people think,

cheers:beer:

[bjorno]

I have some problems to get the dynamic thumbnails to work. When I navigate with the thumbnails the border does not resize. Any ideas?

[Stephen]

Hello,

I have been trying to load the gallery swf into another swf file using

loadMovie("resizeBorder_V3.swf", clpBody)

This is just a basic movie with a clip called clpBody. (My navigation calls movies into the main clpBody, Ive included a striped down verision with just the movie clip in)

When I do this none of the next and previous buttons work or the individual 1-5.

Help :?)

[Stephen]

I think that the problem is with

if (containerMC._alpha<1) {
containerMC.loadPic(cur+1);
delete this.onEnterFrame;
} else {
containerMC._alpha -= 10;
}

As if I comment out as follows

//if (containerMC._alpha<1) {
containerMC.loadPic(cur+1);
delete this.onEnterFrame;
//} else {
//containerMC._alpha -= 10;
//}

it works, but looks untidy as the image can be partially seen as it loads.

A trace of containerMC._alpha shows that it stays at 100 all the time.

Any help would be greatly appreciated

[milkman]

Good day people

I'm glad to be on the best Flash/web dev forum on the www.
I need some help with the resizeBorder.fla from the zip I downloaded from this thread. The problem is that I get an "unexpected file format" error message when I'm trying to open it in Flash MX 2004.

Any clues?

Thx, no longer a problem. I got that figured out

[tiger20]

..

[vman]

how would you set up so that the dynamic thumbnails
display in rows and columns?

here is the code i have from a version of this gallery:


for (var b=0; b<gallery.childNodes.length; b++) {
item = _root.nav.attachMovie("itemClip", "itemClip" + b, b);
item._x = 10+24*b;
item._y = 20.0;
item.mytitle=gallery.childNodes[b].attributes.title;
item.imagepath=b;
item.onRelease= function(){
_root.containerMC.loadPic(this.imagepath);
}


Secondly
How would you set these dynamic thumbs to actually load
thumb images instead of just being boxes with rollover
animations?

Sky_vault,
On page 27 of this thread I posted some code that does exactly what you are asking (i believe). It creates rows and columns in what ever quantities you specify and loads dynamic thumbs via attachmovie. Here's the portion that does that:

changeGallery = function (argThumbs, argPics) {
trace("Function changeGallery : argThumbs = "+argThumbs+" argPics = "+argPics);
count_lv = new LoadVars();
count_lv.thumbs = argThumbs;
count_lv.pics = argPics;
count_lv.onLoad = function(ok) {
if (ok) {
_root.galleriesUp = 0;
_root.picNum = 1;
i = 0;
numColumns = 2;
cnt = 1;
startX = 0;
startY = 0;
textButton_MC.ypos = border._y-textButton_MC._height;
trace(unescape(this));
_root.attachMovie("thumbhold", "thumbMC", 0);
thumbMC._visible = false;
thumbMC._y = border._y;
for (i=1; i<=parseInt(_root.count_lv.nof); i++) {
thumbMC.thumbScroller.thumbHolder.attachMovie("box", "box"+i, i, {_x:startX, _y:startY});
thumbMC.thumbScroller.thumbHolder["box"+i].thumbNumber.text = i;
thumbMC.thumbScroller.thumbHolder["box"+i].container.loadMovie("Arra/"+argThumbs+"/"+[i]+".jpg");
thumbMC.thumbScroller.thumbHolder["box"+i].targNum = i;
thumbMC.thumbScroller.thumbHolder["box"+i].onRelease = function() {
textButton_MC.ypos = border._y-textButton_MC._height;
containerMC.loadPic("Arra/"+argPics+"/pic"+this.targNum+".jpg");
_root.galleriesUp = 0;
_root.picNum = this.targNum;
};
thumbMC.thumbScroller.thumbHolder["box"+i].onRollOver = function() {
this.gotoAndPlay("play");
};
startX = (cnt%numColumns == 0) ? 0 : startX+thumbMC.thumbScroller.thumbHolder["box"+i]._width+5;
startY = (cnt%numColumns == 0) ? startY+thumbMC.thumbScroller.thumbHolder["box"+i]._height+5 : startY;
cnt++;
thumbsWidth = thumbMC.thumbScroller._width+10;
}
}
};
count_lv.sendAndLoad("thumbcounter.php", count_lv, "POST");
containerMC.loadPic("Arra/"+argPics+"/pic1.jpg");
};
This actually loads the thumbs into another scrollable mc and has a couple of other functions, but you should be able to figure it out.

These are the parts you're concerned with:


cnt = 1;
startX = 0;
startY = 0;
for (i=1; i<=parseInt(_root.count_lv.nof); i++) {
thumbMC.thumbScroller.thumbHolder.attachMovie("box", "box"+i, i, {_x:startX, _y:startY});
startX = (cnt%numColumns == 0) ? 0 : startX+thumbMC.thumbScroller.thumbHolder["box"+i]._width+5;
startY = (cnt%numColumns == 0) ? startY+thumbMC.thumbScroller.thumbHolder["box"+i]._height+5 : startY;
cnt++;
}
count_lv.sendAndLoad("thumbcounter.php", count_lv, "POST");

[sticmann]

I have a client who is a photographer and the site I'm making has many galleries. I want the update process to be very simple, so I make this php run through whichever directory I want and find all the files, instead of having to rename all his files 1.jpg, 2.jpg...


$user = $_POST['user'];
$dir = "/home/nickbod/public_html/content/".$user."/thumbs";
$handle = opendir($dir);
while (false !== ($file = readdir($handle))) {
if ($file != "." && $file != "..") {
$filenames .= $file.":";
}
}
closedir($handle);
echo "&filenames=".$filenames;

It sends the string back to flash which splits it into an array. Then, instead of:

thumbMC.thumbScroller.thumbHolder["box"+i].container.loadMovie("Arra/"+argThumbs+"/"+[i]+".jpg");

I have:

filename = thumb_array[i];
thumbMC.thumbScroller.thumbHolder["box"+i].container.loadMovie("content/"+user+"/thumbs/"+filename);

The problem is that it loads every thumbnail file before it will display any of them (and some galleries have 200+ pics). I want it to start displaying the thumbs as the come in.

Any ideas?
-Joshua

[vman]

Sticmann,
Sorry I don't have an answer to your question (yet). But I have a question for you. Once the thumbs are loaded and you click on them, what files do they open and where are they located? Do the thumbs correspond to files in another folder or are you loading the full-size pictures as thumbs and scaling them down?

I've been thinking of a way to make this easier for these guys and it seem like you have the way right here. My php is still very lacking.

[sticmann]

vman,
The setup is the same with pics and thumbs folders, but every thumb has a corresponding pic with the same file name. It makes updating the site soooo easy.
-Joshua

[vman]

I agree. So your "thumbs" folder is inside the folder that contains the corresponding pics? Doesn't the "thumbs" folder get counted as part of the array? (I'm reading the php manual as we speak).

It's not too bad for the guy right now. I've showed him how to create droplets in Adobe Image Ready to do a batch resize & optimize for the thumbs. Doing a batch rename is just as easy, but your way here does save a good deal of trouble.

[sticmann]

Oh, no. directory structure is like this:
user
|
- pics
|
-thumbs

They are separate folders under each individual user folders. The php goes through the thumbs folder and returns all the filenames. Since the filenames are the same in both folders, when the thumb is clicked that same filename can be used to pull up the fullsize pic. I know renaming isn't anything difficult, but if it is an avoidable step...

-Joshua

[vman]

Gotcha. I'm gonna give it a go. Thanks for the code. :thumb:

[vman]

Sticmann,
Would you mind posting the code that builds the array or the whole section for that matter? I've been trying to get this to work without any success. To build the array, I'm just using:

thumb_array = [this.filenames];
When I do trace(thumb_array); all of the filenames are there. If I do

trace(thumb_array.length);
I get 1. Not sure what's going on here. Thanks.

[vman]

Ok,
I got the array working but the path is currently hard coded. I'm trying to figure out a php script to count just directories without counting the files in each and I want to array them to get the $user variable. This array will create dynamic buttons to change the different galleries. So when you click on the buttons the $user variable will specify which folder to load the thumbs (and pics) from. Any suggestions for the directory counter?

In regards to your other question, are you saying that all of the thumbs load first and then they pop up all at once? Mine are coming in one at a time, fairly quickly too.

[vman]

Well,
I managed to do some php code that counts JUST the directories. The array for the buttons works fine and the text on the dynamically generated buttons displays correctly. However, now the array for the actual files doesn't happen. I believe the "folder" variable is being passed to the thumbcounter2.php file because the path is showing the correct string. This is the error I'm getting when I test. "01-Tester" is the dynamic portion of the path.

01-Tester
Error opening URL "file:///C|/apache/htdocs/Imageviewer/Gigs/01-Tester/pics/

"

So, if the path is right, how come the thumb_array doesn't work unless I hard code it? Any ideas? Any help would be greatly appreciated.


count_folders = new LoadVars();
count_folders.onLoad = function(success) {
if (success) {
numColumns = 15;
cnt = 1;
startX = 0;
startY = 0;
folder_array = this.foldernames.split(",");
folder = folder_array[0];
//This returns "Tester1 from count_folders"
trace(folder+" from count_folders");
for (i=0; i<folder_array.length-1; i++) {
_root.textButton_MC.attachMovie("textbutton", "textbutton"+i, i, {_x:startX, _y:startY});
buttonName = folder_array[i];
_root.textButton_MC["textbutton"+i].showText.text = buttonName;
_root.textButton_MC["textbutton"+i].folderName = buttonName;
_root.textButton_MC["textbutton"+i].onRelease = function() {
folder = this.folderName;
//This returns "Tester1 (2 or 3) from button click"
trace(folder+" from button click");
_root.removeMC();
_root.galleryTitle.gigText.text = this.showText.text;
textButton_MC.ypos = border._y-textButton_MC._height;
_root.changeGallery();
};
_root.textButton_MC["textbutton"+i].onRollOver = function() {
this.gotoAndPlay("play");
};
startY = (cnt%numColumns == 0) ? 0 : startY+_root.textButton_MC["textbutton"+i]._height;
startX = (cnt%numColumns == 0) ? startX+_root.textButton_MC["textbutton"+i]._width : startX;
cnt++;
}
}
_root.galleryTitle.gigText.text = _root.textButton_MC.textbutton0.showText.text;
};
count_folders.sendAndLoad("http://localhost/Imageviewer/foldercounter.php", count_folders, "POST");
this.onLoad = function() {
changeGallery();
};
changeGallery = function () {
count_lv = new LoadVars();
count_lv.onLoad = function(ok) {
if (ok) {
//This returns "hello"
trace("hello");
//This returns absolutely nothing
trace(this.filenames);
_root.galleriesUp = 0;
_root.picNum = 1;
i = 0;
numColumns = 2;
cnt = 1;
startX = 0;
startY = 0;
textButton_MC.ypos = border._y-textButton_MC._height;
_root.attachMovie("thumbhold", "thumbMC", 0);
_root.thumbMC._y = 10;
_root.thumbMC._x = 17;
thumb_array = this.filenames.split(",");
//This returns absolutely nothing
trace(thumb_array);
//this next lines is receiving the value of the "folder" variable, but not reading the file from the array.
//If that's the case, and the path is correct, why won't the php read the files and array them?
containerMC.loadPic("Gigs/"+folder+"/pics/"+thumb_array[0]);
for (i=0; i<thumb_array.length-1; i++) {
thumbMC.thumbScroller.thumbHolder.attachMovie("box", "box"+i, i, {_x:startY, _y:startX});
thumbMC.thumbScroller.thumbHolder["box"+i].thumbNumber.text = i+1;
filename = thumb_array[i];
thumbMC.thumbScroller.thumbHolder["box"+i].container.loadMovie("Gigs/"+folder+"/thumbs/"+filename);
thumbMC.thumbScroller.thumbHolder["box"+i].targPic = filename;
thumbMC.thumbScroller.thumbHolder["box"+i].onRelease = function() {
textButton_MC.ypos = border._y-textButton_MC._height;
containerMC.loadPic("Gigs/"+folder+"/pics/"+this.targPic);
_root.galleriesUp = 0;
_root.picNum = this.targNum;
};
thumbMC.thumbScroller.thumbHolder["box"+i].onRollOver = function() {
this.gotoAndPlay("play");
};
startX = (cnt%numColumns == 0) ? 0 : startX+thumbMC.thumbScroller.thumbHolder["box"+i]._height+5;
startY = (cnt%numColumns == 0) ? startY+thumbMC.thumbScroller.thumbHolder["box"+i]._width+5 : startY;
cnt++;
}
}
};
count_lv.sendAndLoad("http://localhost/Imageviewer/thumbcounter2.php", count_lv, "POST");
};

thumbcounter2.php:

<?php
$folder = $_POST['folder'];

$dir = "Gigs/".$folder."/thumbs";
$handle = opendir($dir);
while (false !== ($file = readdir($handle))) {
if ($file != "." && $file != "..") {
$filenames .= $file.",";
}
}
closedir($handle);
echo "&filenames=".$filenames;

?>


foldercounter.php:

<?php

$dir = "Gigs";
$handle = opendir($dir);
while (false !== ($file = readdir($handle))) {
if($file != "." && $file != ".." && !preg_match("\.",$file)) {
$foldernames .= $file.",";
}
}
closedir($handle);
echo "&foldernames=".$foldernames;

?>

[sticmann]

count_lv.folder is never defined. thumbcounter2.php doesn't know where to look. I made a couple tweaks, but I'm not in front of flash, so I can't test it:


count_folders = new LoadVars();
count_folders.onLoad = function(success) {
if (success) {
numColumns = 15;
cnt = 1;
startX = 0;
startY = 0;
folder_array = this.foldernames.split(",");
//folder = folder_array[0];<--- unneeded
//This returns "Tester1 from count_folders"
trace(folder+" from count_folders");
for (i=0; i<folder_array.length-1; i++) {
_root.textButton_MC.attachMovie("textbutton", "textbutton"+i, i, {_x:startX, _y:startY});
buttonName = folder_array[i];
_root.textButton_MC["textbutton"+i].showText.text = buttonName;
_root.textButton_MC["textbutton"+i].folderName = buttonName;
_root.textButton_MC["textbutton"+i].onRelease = function() {
_root.removeMC();
_root.galleryTitle.gigText.text = this.showText.text;
textButton_MC.ypos = border._y-textButton_MC._height;
_root.changeGallery(this.foldername);
};
_root.textButton_MC["textbutton"+i].onRollOver = function() {
this.gotoAndPlay("play");
};
startY = (cnt%numColumns == 0) ? 0 : startY+_root.textButton_MC["textbutton"+i]._height;
startX = (cnt%numColumns == 0) ? startX+_root.textButton_MC["textbutton"+i]._width : startX;
cnt++;
}
}
_root.galleryTitle.gigText.text = _root.textButton_MC.textbutton0.showText.text;
};
count_folders.sendAndLoad("http://localhost/Imageviewer/foldercounter.php", count_folders, "POST");
this.onLoad = function() {
changeGallery(folder_array[0]);// <--this makes the previous folder definition moot
};
changeGallery = function (folder) {
count_lv = new LoadVars();
count_lv.folder = folder; //<--added this
count_lv.onLoad = function(ok) {
if (ok) {
//This returns "hello"
trace("hello");
//This returns absolutely nothing
trace(this.filenames);
_root.galleriesUp = 0;
_root.picNum = 1;
i = 0;
numColumns = 2;
cnt = 1;
startX = 0;
startY = 0;
textButton_MC.ypos = border._y-textButton_MC._height;
_root.attachMovie("thumbhold", "thumbMC", 0);
_root.thumbMC._y = 10;
_root.thumbMC._x = 17;
thumb_array = this.filenames.split(",");
//This returns absolutely nothing
trace(thumb_array);
//this next lines is receiving the value of the "folder" variable, but not reading the file from the array.
//If that's the case, and the path is correct, why won't the php read the files and array them?
containerMC.loadPic("Gigs/"+folder+"/pics/"+thumb_array[0]);
for (i=0; i<thumb_array.length-1; i++) {
thumbMC.thumbScroller.thumbHolder.attachMovie("box", "box"+i, i, {_x:startY, _y:startX});
thumbMC.thumbScroller.thumbHolder["box"+i].thumbNumber.text = i+1;
filename = thumb_array[i];
thumbMC.thumbScroller.thumbHolder["box"+i].container.loadMovie("Gigs/"+folder+"/thumbs/"+filename);
thumbMC.thumbScroller.thumbHolder["box"+i].targPic = filename;
thumbMC.thumbScroller.thumbHolder["box"+i].onRelease = function() {
textButton_MC.ypos = border._y-textButton_MC._height;
containerMC.loadPic("Gigs/"+folder+"/pics/"+this.targPic);
_root.galleriesUp = 0;
_root.picNum = this.targNum;
};
thumbMC.thumbScroller.thumbHolder["box"+i].onRollOver = function() {
this.gotoAndPlay("play");
};
startX = (cnt%numColumns == 0) ? 0 : startX+thumbMC.thumbScroller.thumbHolder["box"+i]._height+5;
startY = (cnt%numColumns == 0) ? startY+thumbMC.thumbScroller.thumbHolder["box"+i]._width+5 : startY;
cnt++;
}
}
};
count_lv.sendAndLoad("http://localhost/Imageviewer/thumbcounter2.php", count_lv, "POST");
};




In regards to your other question, are you saying that all of the thumbs load first and then they pop up all at once? Mine are coming in one at a time, fairly quickly too.yes... they all load first. I don't know what would cause this. When it is hard coded (ex. thumbMC.thumbScroller.thumbHolder["box"+i].container.loadMovie("Gigs/"+folder+"/thumbs/"+i+".jpg");), they load individually, but when they are pulled from an array sent by php, they all load together. ???
-Joshua

[vman]

Dude...YOU ARE THE MAN!!!! :beer:
Here, all this time I thought that any variables in the php were just sent back. Had no idea you had to define them. I spent all day on this yesterday and have been at it since the time I got home from work. I'll post it up in a few so we can see how they load. I'll post the link for you. Hope we can straighten your deal out.

[vman]

Well, now it seems I need to work out another issue with the first file that loads for each gallery. It seems that if the last image from the previous gallery is very small, the first image of the next gallery doesn't size correctly. At least I got the hard part worked out thanks to you. The thumbs seem to load fine. See what you think.

Image Gallery (http://thezplane.com/Imageviewer/)

[sticmann]

Good, vman.

I got the thumb thing. I had a bunch of unneeded code left over from tweaks I had made. Now they load one at a time. I even put a fade in on them :)

http://nickbodkinsphotography.com

I need to put a preloader on the main file and tweak a few other things, but it is near completion. (I didn't want to put music on it, but he insisted).

-Joshua

[sky_vault]

hey vman
thanks for the redirect to your previous post
great work ... thanks for the help !!!

I have run into one problem so far
I am only getting 9 thumbs for each gallery no matter
the actual count of thumbs and pics
any ideas?

[sipher]

u all guys are doing a great job with the AS whoa... very impresive work vman and sticmann

[vman]

Sticmann,
Nice job on the site. Nice clean look.


I have run into one problem so far
I am only getting 9 thumbs for each gallery no matter
the actual count of thumbs and pics
any ideas?
Sky_vault. Your welcome. Anyway you can post something? I know this sounds silly, but it almost sounds like they may be loading and you just not seeing them because of a mask or going off the page or something. Did you do a trace to see if they are all loading?


u all guys are doing a great job with the AS whoa... very impresive work vman and sticmann
Thanks sipher, but this whole thing has been a work in progress for a while and thanks to evrybody that contributed to this thread. It has been a good learning experience. I only get to do this stuff in my free time as my regular job has nothing to do with web design. Hmmm...I think that may qualify me as being a geek. :h:

[sky_vault]

vman nothing to post as I am using your source files unmodified ... the only thing I
have done so far is set up the directory and some temp thumbs and pics for testing
and I dont see a mask being set inside the thumbholder that would be causing the
problem ... I ll just keep on digging ... works great except just stops creating thumbs
at #9 ...

this is what i am getting in the output window


nof=9 &onLoad=[type Function]&pics=pics1&thumbs=thumbs1
this.thumbs = thumbs1
Function changeGallery : argThumbs = thumbs1 argPics = pics1
nof=9 &onLoad=[type Function]&pics=pics1&thumbs=thumbs1


could it be a problem with file names on my pics and thumbs?
if so i cant figure it out ...
my files are 9.jpg 10.jpg 11.jpg
pic9.jpg pic10.jpg and so on ...
any ideas?

[vman]

for that script I was naming the thumbs 1.jpg, 2.jpg, 3.jpg....and the pics were pic1.jpg, pic2.jpg, pic3.jpg....

Now, you have to name the thumb folders thumbs1, thumbs2, thumbs3.... and the pic folders pics1, pics2, pics3.... and put the files in their appropriate folders.

That's why I'm glad Sticmann came up with this other way where you don't have to worry about file names or folder names. It really simplifies things from the client side. ;)

[g_wulfwud]

ei guys..
this thread is kinda long, so i wasnt able to look through each if there's an answer to my prob...

i followed the V1 file, and edited some..but after i uploaded the files,the pics doesnt seem to show up..

heres the link.. http://www.geocities.com/g_wulfwud/ look at the portfolio link

[sky_vault]

vman thanks again for the help
Ive double triple checked all my files and folders and my directory and
files are all set up correctly ... so could this problem be with the code
calling the array inside the flash file?
I think it has to be a code problem because everything works great ...
just every gallery only loads 9 thumbs ...
any idea what section of code could cause this ?
thanks again

[vman]

post the version you have along with the php. Let's take a look and make sure everything jives.

[g_wulfwud]

ei guys..
this thread is kinda long, so i wasnt able to look through each if there's an answer to my prob...

i followed the V1 file, and edited some..but after i uploaded the files,the pics doesnt seem to show up..

heres the link.. http://www.geocities.com/g_wulfwud/ look at the portfolio link

*bump* *bump*

somebody please help.. :jail:

[vman]

g_wulfud,
Well, I took a look and yup, you're right. They don't load. Without seeing what you changed or being able to see your file structure, that's about all I can do for ya right now.

You got anything else to help us help you? :?)

btw-it's 5:50 am and I'm leaving for out of town till tomorrow night. So if I don't answer, that's why?

[g_wulfwud]

ei ei ei.. here's my fla.. care to check.. :)

http://www.kirupaforum.com/forums/showthread.php?p=694680&posted=1#post694680

uploaded it on another thread though.. :jail:

[vman]

Did Scotty resolve your problem? I've still got one that I gotta get taken care of by tomorrow. Let me know if you still want me to take a look.

[Neil]

The file structure on my server is as follows: The .swf and all of the php files are in the root directory. Inside that, I have a directory called "Arra". Inside that, I have directories "thumbs1", "thumbs2", "thumbs3", etc. and "pics1", "pics2", "pics3", etc. For it to work the naming convention has to stay like this. Also, the actual .jpgs in the pics folders have to be named pic1.jpg, pic2.jpg, pic3.jpg, etc. and the thumbnails in the thumbs folders are named 1.jpg, 2.jpg, 3.jpg, etc.

HI Vman ! I must say, good job !!! :thumb:

Can you please make a sample zip file with all the stuff ? I'd appreciate it :D

I am decent @ flash , but I dont know **** about php n stuff...please explain me why do we need a php counter to count images and their thumbnails :), thanks !!!!!!! =)

[sky_vault]

hey vman here is zip of the files that i have and unmodified
check to see if you get the same prob. where the thumbs stop at #9
in each gallery ... thanks

note: no hurry vman i will be away all friday and most of sat.

[sticmann]

please explain me why do we need a php counter to count images and their thumbnails, thanks !!!!!!!Flash cannot search through directories to find files by itself, so this is where the php comes in. In the "Arra" setup that you quoted, the php goes through the thumbs directory and just counts the files. Then it returns that count to flash which loads a pic (numbered 1 - nof) for each. If the filenames are not in sequential order, flash doesn't know and will try to load them sequentially anyway.
In the dynamic setup, the php finds and sends back the *filenames* which are then loaded by flash. In this setup, the thumbs and corresponding pics are named the same (instead of 1.jpg and pic1.jpg...) so when a thumb is clicked, the same filename can be used to pull the fullsized pic out of the pic directory.
Hope this helps,
-Joshua

[vman]

Well put!

[Neil]

Flash cannot search through directories to find files by itself, so this is where the php comes in. In the "Arra" setup that you quoted, the php goes through the thumbs directory and just counts the files. Then it returns that count to flash which loads a pic (numbered 1 - nof) for each. If the filenames are not in sequential order, flash doesn't know and will try to load them sequentially anyway.
In the dynamic setup, the php finds and sends back the *filenames* which are then loaded by flash. In this setup, the thumbs and corresponding pics are named the same (instead of 1.jpg and pic1.jpg...) so when a thumb is clicked, the same filename can be used to pull the fullsized pic out of the pic directory.
Hope this helps,
-Joshua

Man, i really really really appreciate your help and the time you spent ! Thanks for explaination :D , I am gonna go over all the stuff on this gallery, bcoz its been a long time since I tweaked the gallery ;).

Also, thanks to vman for his work ! =)

[egoldy]

vman 's stuff is so good.

Can anybody make a sample zip file with all the stuff .because I am new to php. :(

[cruzn28]

:( HELP ME PLEASE I"M TERRIBLY DESPERATE...
I believe that I have been trying to figure this out for 5 days now. My pictures WON"T LOAD at all along with the thumbnails.

I have no clue what is wrong. I followed the example that vman gave and I put a folder name Arra containg the folders of thumbs and pics and they are LABELLED CORRECTLY "pic1.jpg..." for the pics and "1.jpg..." for the thumbnails. The .php files as well as the .swf are loacted in the root directory. Although everything looks correct, none of the pictures are loading at all.

PLEASE PLEASE HELP ME I"M TERRIBLY DESPERATE.

and the .jpgs are non-progressive

[cruzn28]

Whoops I made them all progressive, and they still don't work

[cruzn28]

Wait wait nevermind they are all non-progressive and they don't work

[dyren]

well i havent read the last 20 pages of this thread but the first 18 were great!!!

i made a few modifications to the thing... here's my version.
edit: thought i might just say what i added.

instead of the small 'next' and prev' buttons... i made the right half of the whole loaded image into a 'next' button and the left half a 'prev' button.

this is nice because then you dont have to move your mouse to click the 'next' button.

also, the half image next and prev buttons are invisible until they are rolled over and when that happens they fade in to a low transparency.

the effect is really nice.

http://jellomirage.tripod.com/kirupa.html

too big to upload on here... and i dont have any good hosting right now.


just click the link then right click and save as on the zip file.



cheers :D

[sky_vault]

thanks dyren !

[cruzn28]

merci dyren

[posh]

just for the record, has anyone seen this?
i dont know if its been mentioned (searching the thread says no anyways)
check this out then, same thing but *slightly* modified.

http://www.notacube.com/notacube.php

ohyes!

aight. now ill go :book: for a while, and see if i too can submit something nice to you peeps to analyze and umm. re-do. :P

- posh

[egoldy]

well i havent read the last 20 pages of this thread but the first 18 were great!!!

i made a few modifications to the thing... here's my version.
edit: thought i might just say what i added.

instead of the small 'next' and prev' buttons... i made the right half of the whole loaded image into a 'next' button and the left half a 'prev' button.

this is nice because then you dont have to move your mouse to click the 'next' button.

also, the half image next and prev buttons are invisible until they are rolled over and when that happens they fade in to a low transparency.

the effect is really nice.

http://jellomirage.tripod.com/kirupa.html

too big to upload on here... and i dont have any good hosting right now.


just click the link then right click and save as on the zip file.



cheers :D


hi.dyren

I cannot download it.

[dyren]

well that's tripod for ya...

here's a more reliable link.


http://aznsmurf.ne1.net/temp.zip



cheers, if you have any questions hit me up!

also.. im a bit of a noob.. so if my code isnt optimized im sry :(

but if a pro would like to clean it up and bit and show us the clean code that'd be cool!

i originally had it as a function on each instance but then realized i could use a prototype instead. having a prototype WORK for me was like magical so im kinda proud of my little contribution to this beautiful thread.

later!

[dyren]

i actually have a question to pose to you actionscript all-stars.

what kind of sin (or other) equation would i need to use to create a pulsing alpha fade on rollOver.

i hope thats clear. i just want a button to pulse lightly when i roll over it.

sounds simple... i dont know where to get started though :\


thanks.

[RadioactveChimp]

alright i just spent an hour of my life reading this whole thread and it was awesome! Nice job on everyone's part! I know this is really dumb...but I would like someone to help me simplify all of it. I really loved version one because there was none of that xml stuff. All i want is version one, but with the navigation that follows! I realize that this is probably very easy to to, but I just don't know how myself!

Thanks a bundle in advance,
Dean

[scotty]

What navigation?;)

scotty(-:

[RadioactveChimp]

the one that follows the container...in version 2 and 3


-Dean (=

[RadioactveChimp]

can anyone help me out?

[scotty]

LOL, I can't find v1 anymore, this thread is getting too long:lol:

Can you post a link or post# for me?

scotty(-:

[Knar]

Hello Scotty, you have done wounders in this thread i was woundering


Can i load swf files in to any of these versions a swf file that has a movieclip in it and resizes to the movieclip. It does not nesasely need to be a movie playing but mabe a movie clip symbol that contanes a picture that has the alpha state in it that keeps on changing when a mouse event happens. Just a woundering?

[vanbasten]

Hi there
Can you help me to create a photo scroller like this ?
http://www.flashcomponents.com/details.php?table=ff&id=209&link=
Thanx
Daniel

[Cello]

vanbasten - it's called an infinite menu... and there's a tutorial right here on kirupa.com :thumb:

Here's the link - http://www.kirupa.com/developer/mx/infinite.htm

:)

[vanbasten]

Thanks CELLO

Im new about Flash and so I create this infinite portfolio(you see in attachment) from another file from kirupa, but it's totally wrong ,where am I wrong? With 20 pic it's ok but I like it works also with 4 pics!
Thanks for the help

[Cello]

No probs vanbasten ;)

Sorry, but I can't open your file - must be MS2004 you're using? I;m on old MX.

If you save it for MX I'll try and have a look at it for you - remember to tell me EXACTLY what you want it to do... :)

ps Welcome to kirupa.com :)

[vanbasten]

I hope you can see now :-) I put all the files.

I wanna create an infinite menu loadin image from a xml files, not directly in the stage.
With portfolio tutorial I understood how make it, but know I d like learning how create infinite both with 4 pictures both with 20 pictures... If you want you can use my file for the correction .
Thank 4 all

[Cello]

Hi Vanbasten - bad news I'm afraid :(

I've had a look at your work and as far as I can work out, the infinite menu needs to be a fixed length, with the mouse position relating to that length. With the xml being used to load x number of thumbs, the menu_mc can't make sense of it.

Perhaps someone with more AS skills could help you.

[scotty]

Hey Cello, good to see you:lol:

van basten, it can be done, but:
As you know the infinite menu works with a mask and the idea is not to make all pics visible. If you want the layout like the fla you've posted, you should at least have 7 pictures to have it work properly...

btw why is this in the resize thread?

scotty(-:

[Cello]

Hi scotty - I see you're still in love... :love: hope you both have a great 2005 :)

Good point about resize thread - didn't occur to me. :ponder: this thread's big enough without dealing with ALL gallery questions! :lol:

[scotty]

I think we've to wait till vanbasten comes back, maybe he/she wants to merge the infinite menu with the resize gallery;)
Have a great "flashing" 2005 too=)

scotty(-:

[GW02]

At the rate this is going, by the end of next year we'll have an infinite scrolling resizing special-effects-ing database-driven php-run morphing thumbnail-generating photo gallery thing.

Oh wait, that's almost where we are right now anyways. :P

[cruzn28]

Can someone help me? Mr. Vman has exited the kirupa forums and has left for Arizona :( and cannot help me. With his absence I have no one to turn to for my problem. I downloaded his altered version of the resizing slideshow, and now have 2 problems that have arised once I fixed my php problem.
1. none of the images show up
2. either the 1st or last thumb doesn't show up

I read through the first 10 pages of the this thread and my eyes started to burn, so I was hoping someone would be able to answer my question. I know it isn't a progressive jpg problem because I have resaved it already. If someone can help I would gladly accept there assistance.

http://www.kirupa.com/forum/showthread.php?t=79236&page=1&pp=15 (http://www.kirupa.com/forum/showthread.php?t=79236&page=1&pp=15)
Here is the link to the thread that is mostly composed of my posts. On page 3 of the thread you will find vman's gracious present (the resizing slideshow.)

If you can answer my question I would THANK YOU A LOT because I have to go to school tommorrow and I need it for tommorrow. THANKS A LOT

[vman]

Ok, my limo's going to be here in 15 minutes. One of the reasons the last thumb isn't showing up is that you may hane a thumbs.db in your folder and it may be hidden. I had this problem but it's trivial. Just turn off the cahing of your thumbs from now on (google it) and delete the thumbs.db files from your folders. The other stuff I don't have a clue. Gotta go. See you in a week.

[cruzn28]

VMAN TO THE RESCUE, I will check it out. Thanks for the last minute replies.

[richy1311]

Hello guys.

I found this thread a couple of days back and have been enjoying myself hacking it all apart. Many thanks to Scotty and Cello et al - you're a great help.

This is what I've come up with so far : http://www.blackpixel.co.uk/flash/gallery.html

My question / problem is this: Earlier in the thread someone asked how to link to swf's within the resizing image area. The answer was to simply change the XML to link to a .swf instead of a .jpg, ensuring that the swf had a transparent background so that the actionscipt could determine it's dimensions.

I've done this and it works fine until i try to return to a .jpg image - within MX clicking on a button brings up the image and resizes the frame but from that point the nav is disabled and no further images are accessible, within a browser the nav is simply disabled.

Does this sound like I have made a simple error somewhere, or could someone maybe take a look at my .fla?

Thanks again to everyone for all the efforts that have gone into this over the months.

Cheers!

Richy

[sipher]

post yer fla ... so we can take a look at it


good work on yer site...very clean

[scotty]

Welcome to kirupaforums=)

I've never tried that:lol: but as far as I know it should be possible (let someone correct me if I'm wrong).
The link you've posted contains a swf?
Best if you post your .fla;)

scotty(-:

*edit sipher beated me;)

[richy1311]

Hi - thanks in advance.

Having problems using Kirupa's manage attachments function so here's a link to a .zip file:

http://www.blackpixel.co.uk/flash/gallery.zip

EDIT - Sorry should have pointed out that the last button in the column now links to the box_test.swf.

Cheers,

Richy

[scotty]

I can't give you an explanation for the moment, but it has to do with the prototype.
Since, in this case, you don't really need one, change the loadPic prototype in a normal function:

function loadPic(pic) {
containerMC._alpha = 0;
cur = pic;
containerMC.loadMovie(pArray[pic]);
var temp = this.createEmptyMovieClip("tmp", 1000);
temp.onEnterFrame = function() {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
var kb = Math.round(containerMC.getBytesTotal()/1000);
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;
border.resizeMe(w, h, pic);
bar._visible = 0;
loadText.text = "";
totalText.text = "";
delete this.onEnterFrame;
} else {
bar._visible = 1;
bar._height = per*4;
loadText.text = per+"% of";
totalText.text = kb+"Kb";
}
};
}
And where you load the xml change

containerMC.loadPic(0);
in
loadPic(0);
For the buttons you can call the function like this, eg for button9

button9.onRelease = function(){
this.gotoAndPlay("click");
_root.loadPic(9);
}

scotty(-:

[richy1311]

Scotty - that's really great thanks a million. Would appreciate an explanation if you ever get the time ;)

One other thing that has occurred to me... What would be the best way to switch between different galleries? ie - load a new set of pics?

I'm thinking that i need to close this movie, return to a page of thumbnails which open individual galleries and create a load of seperate swfs.

Is there a *cooler* way? Anybody?

Scotty - thanks again.

Richy

[scotty]

Scotty - that's really great thanks a million. Would appreciate an explanation if you ever get the time ;) You're welcome, if I can find one, I'll let you know.
If you want to add more galleries have a look here
http://www.kirupa.com/forum/showthread.php?t=79359&page=2&pp=15
especially post #20
It's a different gallery, but you can adapt to yours, if you need help with it let me know;)

scotty(-:

[richy1311]

I'll check it out.

Richy

[Apegrope]

I was wondering if any one of you geniuses can help me out.

First of all here's the link to view:
LOOK (http://www.skillfront.com/forCLIENTS/TRACY_KAHN/help.html)

And here are the files (FLA, XML, and associated images)
Approx. 3.7 MB (http://www.skillfront.com/forCLIENTS/TRACY_KAHN/tk.zip)

If you notice on the link..whenever an image loads I get a "Nan" everytime in the preloader. I tried getting rid of it with by adding

if (per !=Nan){
_root.loadText.text = per+"%";
}

That didn't work.


Any help would be greatly appreciated.

Also i took out the resizing border by making it transparent. A better way would be welcome.

thanks guys!

[scotty]

It's NaN...

if (per !=NaN){
_root.loadText.text = per+"%";
}
Hope that will help:)

scotty(-:

[Apegrope]

Yeah that didn't work either.

By the way Scotty what do you do for a living? I'm sure your head has been blown up enough here but you truly are a genius. Thanks for all your contributions to this forum!


Here's the code to anyone whos interested in seeing the problem area:

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();
per = Math.round((l/t)*100);
if (t != 0 && Math.round(l/t) == 1 && containerMC._width>0) {
var w = containerMC._width, h = containerMC._height;
border.resizeMe(w, h, pic);
_root.loadText.text = " ";
delete this._parent.onEnterFrame;
} else {
if (per !=NaN){
_root.loadText.text = per+"%";
}

}

};
};

[wickedweb]

Hi guys,

Hopefully you will be able to help me out with a problem regarding the resizing and loading fo external SWF files. [I'm at work and spending the day trawling this thread, and it would take me all day to understand, probably wouldnt go down to well so I apologise if something similair has come up].

If you take a look at http://www.jakescreates.com you will see the site I am currently working on, it works to an extent but the client wants a preloader on each of the external SWF files that are loaded into the window. Firstly, Im not sure if a preloader inside the SWf that is being called up would be effective, ie. would it be included in the getbytes actionscript of the movie holder, thus serving no purpose. Would I need a preloader in the main movie which somehow gets the info of the external file when called upon and displays a preloader. Hope that makes sense.

I have placed preloaders into the external SWF files and for some reason, when they load up, they load in the bottom right of the screen, outside of the movie holder. I assumed this was to do with the centre-point/alignment of the items in the external SWF, played around a bit with limited success.

I'd really appreciate any help you guys could give because this site has really pushed on my actionscript usage and knowledge, plus, I think it looks pretty spiffy!

Anyways, below are the FLA files for the main movie and then one for one of the external SWFs that is called up. Incidentally, sorry if they're a mess!

http://www.jakescreates.com/test3b.fla - main file
http://www.jakescreates.com/print1.fla - external swf

The client would also like the first image to load up when each section is clicked [ie when you first click print, image 1 loads], I assume this is related to the same issue as again, when i do this it loads in a strange position. Is this linked to the file size? The small JPG that loads at the mo doesn't seem to cause the complications?


Any help would be much appreciated.

And keep me in a job.

Hopefully.

Cheers,
James

--
James Saunders
Wickedweb Limited
www.wickedweb.co.uk

[Neil]

Now, i noticed a NASTY LITTLE PROBLEM. :( , try loading the whole thing (gallery) into another swf by loadMovie method , it will be messed up :(. I have double checked all the paths and stuff and also tried with the lockroot property being true, but still no hope....

THe problem that i encountered was that the whole thing is working fine, but the border resizes first and then the picture fits in the border.... its really wierd. I also tried the gallery with alpha fadings , but alpha is not working at all !!! Please someone , try this experiment....

ps : SCOTTY (-: help !!!

[scotty]

Have a look in the changePic function, if this line is there

delete this._parent.onEnterFrame;
change that in

delete this.onEnterFrame;
That will probably solve it:)
sorry for this bug:lol:

scotty(-:

[milqtoast]

Hello guys.

I found this thread a week back and my learning curve just went through the roof...Thanx for a great site and thread


I've got a problem with the Bright offset script, the one that sipher posted in thread #376 (http://www.kirupa.com/forum/showpost.php?p=582578&postcount=376)....
where do I put the script, on an _mc or in the frame or holder...?

I'm a newbie and been trying for a while. I couldn't download the fla's either, (maybe i was too late, been a long thread)

Thanx for everything, anyway
keep up the "god" work
.milqtoast

[Neil]

Have a look in the changePic function, if this line is there

delete this._parent.onEnterFrame;
change that in

delete this.onEnterFrame;
That will probably solve it:)
sorry for this bug:lol:

scotty(-:

Thank god !, now I can incorporate the whole gallery in my site !! C:-)

Thanks SCOTTY : http://img122.exs.cx/img122/4610/adore8bk.gif

Appreciate your good work :thumb:

P.S. - :lol: Btw, that bug consumed my 4 hours :hair: Finally have to post it on here ;)

[scotty]

no problem=)

[danwangkw]

Hello there,

I've been following the border resize topic postings from page 1 and I must say it has been a great help. I've trying to adapt resizeborder_V2 by adding a drop shadow behind the photo (4 pixels offset). However, I just can't figure out why the photo loads itself over the shadow and then snaps back behind the white outline (shown in the url below)

http://www.sgdanielwang.com/test/resize_problem.htm

Can anyone spare time to have a look at the actionscript within the .FLA and advise me where I had gone wrong?

At the same time (apologies if I sound overly demanding) how can I make the caption text field position/snap itself around 20 pixels above/below any photo following a resize?

Any insight would be a greatly appreciated.

Dan

[Egg]

Scotty,

Please help with Wickedweb's problem on the previouse page as i am the client and we could really do with someones help.

Thanks so much...

[sipher]

post yer fla i will help u...






Hello guys.

I found this thread a week back and my learning curve just went through the roof...Thanx for a great site and thread


I've got a problem with the Bright offset script, the one that sipher posted in thread #376 (http://www.kirupa.com/forum/showpost.php?p=582578&postcount=376)....
where do I put the script, on an _mc or in the frame or holder...?

I'm a newbie and been trying for a while. I couldn't download the fla's either, (maybe i was too late, been a long thread)

Thanx for everything, anyway
keep up the "god" work
.milqtoast

[RadioactveChimp]

arg I can't find what i want in this huge arse thread now! I know this issues have been delt with, but i can't find them now. Hope someone remebers/can help me out :)

1) How do you use different transitions, instead of that fade?



-Thanks,
Dean

[sipher]

radio what exactly are u looking for?

[billyfleetwood]

I'm no expert (this is actually my first post to this forum), but I did manage to get a working transition based on info from this page...

http://www.actionscript.org/tutorials/advanced/Tween-Easing_Classes_Documented/index.shtml

see example here. http://www.bodegamart.com/example/gallery.html Pretty rough, but it works.wish I could say the same for my preloader...

here's the .fla created in mx2004
http://www.bodegamart.com/example/gallery.fla

I added this easing function to the main script


function tweenIn(easeType) {
var begin = picture._y-600;
var end = picture._y;
var time = 1;
var mc = picture;
ballTween = new mx.transitions.Tween(mc, "_y", easeType, begin, end, time,true);
}

and then called it in the resizeme prototype


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 && Math.abs(this._height-h)<1) {
picture._x = this._x-this._width/2+spacing/2;
picture._y = this._y-this._height/2+spacing/2;
tweenIn(mx.transitions.easing.Bounce.easeOut);
picture._alpha += 10;
if (picture._alpha>100) {
picture._alpha = 100;

delete this.onEnterFrame;
}
}
};
};

I'm sure there's a more elegant solution, and if any of you experts can see where this might cause problems let me know, hope this helps. This forum and especially this thread have been a big help to me.

I would really like to know how to get that brightnessoffset prototype working, I haven't been having any luck with it... :ne:

[Flash-Matic]

I made a resizing photo portfolio but it has a lil problem. it gets all big when it loads the image. If some1 can look at it and mabey fix it id be thankfull!
www.flash-matic.com/resizexml.html (http://www.flash-matic.com/resize.html)
www.flash-matic.com/resizexml.fla (http://www.flash-matic.com/resize.fla)
www.flash-matic.com/xml.xml (http://www.flash-matic.com/xml.xml)
www.flash-matic.com/images/image.png (http://www.flash-matic.com/images/image.png) /images/image2.jpg /images/image3.jpg
.jpg might have to be .JPG

Edit: I had old file links

[maciejwantusiak]

this stuff is great!
However... im trying to make a menu stick to one of the sides of the resizable frame and i have absolutely no idea how to do it. Can someone help me out?
Thanks

[wickedweb]

Howdy guys,

Im still trying to get a darn preloader to work without giving myself an aneuryism. Ive checked back through all the posts and, not being fluent in Flash havent really been able to solve the problem, Im using a different code so my brain hurts trying to convert it all in my head to what i'm seeing onscreen! Anyway, preloading an external SWF...from within the main mc.

I tried to fit in Scotty's [I think] preloader from about page 7 [thats a whole long way away] but couldn't get my head around the differing code, if someone could help it'd be massively appreciated!


This is the start of my code for the external swf holder.


onClipEvent (load) {
function LoadPic(url) {
this.createEmptyMovieClip("holder", 1);
this.createEmptyMovieClip("parasite", 2);
this.holder.loadMovie(url);
this.parasite.completed = false;
this.parasite.onEnterFrame = function() {
var l = this._parent.holder.getBytesLoaded();
var t = this._parent.holder.getBytesTotal();
if (l == t && t>28 && !this.completed) {
this.completed = true;
this._parent.holder._visible = false;
} else if (l == t && t>28 && this.completed) {
delete this.onEnterFrame;
this._parent.Tween(this._parent.holder._width, this._parent.holder._height);
}
};
}

Thanks in advance, I'll post the FLA up if necessary.

Cheers,
James

[maciejwantusiak]

Hi all!
I'm trying to apply the resizing border effect to dynamically loaded movies (not video) instead of images. The movies are going to be included within the file so there is no need to load them. There is a menu - when pressed the old movie should fade out and a new movie should be loaded into the containerMC (with all the fading out and resizing of border). I have some code but since i'm not really into action script, I cannot really work it out.


stop();
spacing = 20;
containerMC._alpha = 50;
MovieClip.prototype.loadMov = function(mov){
_root.containerMC._alpha = 0;
this.attachMovie(mov, "containerMC", 1);
_root.onEnterFrame = function(){
var w = containerMC._width + spacing, h = containerMC._height + spacing;
border.resizeMe(w, h);
delete _root.onEnterFrame;
}
};
MovieClip.prototype.changeMov = function(mov) {
this.containerMC.whiteOut();
_root.containerMC.unloadMovie();
_root.containerMC._alpha = 0;
this.attachMovie(mov, "containerMC", 1);
_root.onEnterFrame = function() {
var w = containerMC._width + spacing, h = containerMC._height + spacing;
border.resizeMe(w, h);
delete _root.onEnterFrame;
}
};
MovieClip.prototype.whiteOut = function() {
this.onEnterFrame = function(){
_root.container._alpha -=2;
if (_root.containerMC._alpha<10) {
_root.containerMC._alpha = 0;
delete this.onEnterFrame;
}
}
};
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 += 2;
if (_root.containerMC._alpha>90) {
_root.containerMC._alpha = 100;
delete this.onEnterFrame;
}
}
}
};
containerMC.loadMov("lastman");

Please help! Many thanks in advance!

[artwisted]

WOW! this is a grat thread.
Im downloading these files, time to disect and learn !
i got the actionscript bible :beer: .
Now i can get the meanings of certain things.

You guys who helped put these thigns together. Yall are awesome, motivates me to learn what you guys know.
THanks

[Neil]

WOW! this is a grat thread.
Im downloading these files, time to disect and learn !
i got the actionscript bible :beer: .
Now i can get the meanings of certain things.

You guys who helped put these thigns together. Yall are awesome, motivates me to learn what you guys know.
THanks

Cool :D , good luck man :} , I :love: AS :hugegrin:

Btw, one tip for you ;), write your own code and experiment :hr: , thats the best way to learn :) , i dont like reading books :pa:

[somdow]

Hi all!
I'm trying to apply the resizing border effect to dynamically loaded movies (not video) instead of images. The movies are going to be included within the file so there is no need to load them. There is a menu - when pressed the old movie should fade out and a new movie should be loaded into the containerMC (with all the fading out and resizing of border). I have some code but since i'm not really into action script, I cannot really work it out.


stop();
spacing = 20;
containerMC._alpha = 50;
MovieClip.prototype.loadMov = function(mov){
_root.containerMC._alpha = 0;
this.attachMovie(mov, "containerMC", 1);
_root.onEnterFrame = function(){
var w = containerMC._width + spacing, h = containerMC._height + spacing;
border.resizeMe(w, h);
delete _root.onEnterFrame;
}
};
MovieClip.prototype.changeMov = function(mov) {
this.containerMC.whiteOut();
_root.containerMC.unloadMovie();
_root.containerMC._alpha = 0;
this.attachMovie(mov, "containerMC", 1);
_root.onEnterFrame = function() {
var w = containerMC._width + spacing, h = containerMC._height + spacing;
border.resizeMe(w, h);
delete _root.onEnterFrame;
}
};
MovieClip.prototype.whiteOut = function() {
this.onEnterFrame = function(){
_root.container._alpha -=2;
if (_root.containerMC._alpha<10) {
_root.containerMC._alpha = 0;
delete this.onEnterFrame;
}
}
};
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 += 2;
if (_root.containerMC._alpha>90) {
_root.containerMC._alpha = 100;
delete this.onEnterFrame;
}
}
}
};
containerMC.loadMov("lastman");

Please help! Many thanks in advance!


did n e 1 figure this one out....i had asked this somewhere else but instead of pics i needed swfs. i got directed here and i must say after like page 20 something my brain started to hurt. i originally wanted to do this type of resizeable effect but with external movies(swfs)

n e 1 have n e idea as to how to do this???

[akadis]

Hi

Just been reading this thread regarding the resize window effect. Sorry, I know it is old news now, but I really need help. I have cobbled a few ideas together and almost got it to do what I need it to do. There is still one small elelment which I cannot get right. As it stands at the moment, the window expands and contracts from the centre. My images are all of the same width, so width is not imporatnt to me. However, I need the height to scale from the top down ie if a longer image is loaded, the window extends down from a fixed point.

I have attached my fla.

Can anyone help. Thanks a lot. :moustache

[scotty]

Have you tried changing the registrationpoint of the border mc to top centre and in the resize function set containerMC y to border y?

containerMC._x = this._x-this._width/2+spacing/2;
containerMC._y = this._y+spacing/2;

scotty(-:

[mansour]

hehe, thanx for you effort scotty, i truly appreciate it.
but i was actually referring to this one over here
http://www.kirupa.com/developer/mx2004/xml_flash_photogallery.htm

how can i apply that simple resize method to it?

[scotty]

???
LOL, where did you get that quote:h:

scotty(-:

[mansour]

oops that was a while back hehe :D

funny thing i quoted the wrong post.

this is right one

http://www.kirupa.com/web/xml/examples/portfolio.htm

scotty

i was referring to the xml photogallery tutorial that was done be sen.

[scotty]

In sen's portfolio change the onRelease like this;

currentThumb_mc.onRelease = function(){
image_mc.loadPic(this.image);
description_lv.load(this.description);
}
And using the loadPic and resize function, change loadPic like this

MovieClip.prototype.loadPic = function(pic) {
this._alpha = 0;
this.loadMovie(pic);
this._parent.onEnterFrame = function() {
//rest of the code...

scotty(-:

[scotty]

did n e 1 figure this one out....i had asked this somewhere else but instead of pics i needed swfs. i got directed here and i must say after like page 20 something my brain started to hurt. i originally wanted to do this type of resizeable effect but with external movies(swfs)

n e 1 have n e idea as to how to do this???
Just replace the jpg's by swf's;)
Give your swf a solid (transparent) background to be sure flash gets the right width and height.

scotty(-:

[mansour]

thanx alot scotty.

but i don't want to use icons at all, all i wanna do is have that resize function and the next/prev button to navigate.

but on sens cause i want the describtion and number of page.

oh no i wasn't referring to sen's portfolio.
i was referring to this http://www.kirupa.com/developer/mx2004/xml_flash_photogallery.htm

[scotty]

What's the code you have right now?
(or fla)

scotty(-:
*edit*
Add the loadPic and resize function (see above)
In the tutorial change in the firstPic, nextPic and previousPic functions this line


picture.loadMovie(image[0],1)
in

picture.loadPic(image[0])

[mansour]

well this is the file that i have right now.

the reason i wanna use this file is i already have everything set up, i also love the decsription/page number feature. ;)

[mansour]

scotty it's not working :(


function loadXML(loaded) {
if (loaded) {
xmlNode = this.firstChild;
image = [];
description = [];
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;
}
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;
this.onEnterFrame = function() {
filesize = picture.getBytesTotal();
loaded = picture.getBytesLoaded();
preloader._visible = true;
if (loaded != filesize) {
preloader.preload_bar._xscale = 100*loaded/filesize;
} else {
preloader._visible = false;
if (picture._alpha<100) {
picture._alpha += 10;
}
}
};
MovieClip.prototype.loadPic = function(pic) {
this._alpha = 0;
this.loadMovie(pic);
this._parent.onEnterFrame = function() {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
if (t != 0 && Math.round(l/t) == 1){
var w = containerMC._width + spacing, h = containerMC._height + spacing;
border.resizeMe(w, h);
delete _root.onEnterFrame;
}
}
};
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 = 100;
delete this.onEnterFrame;
}
}
};
function nextImage() {
if (p<(total-1)) {
p++;
if (loaded == filesize) {
picture._alpha = 0;
picture.loadPic(image[0]);
desc_txt.text = description[p];
picture_num();
}
}
}
function prevImage() {
if (p>0) {
p--;
picture._alpha = 0;
picture.loadPic(image[0]);
desc_txt.text = description[p];
picture_num();
}
}
function firstImage() {
if (loaded == filesize) {
picture._alpha = 0;
picture.loadPic(image[0]);
desc_txt.text = description[0];
picture_num();
}
}
function picture_num() {
current_pos = p+1;
pos_txt.text = current_pos+" / "+total;
}

[scotty]

LOL, I know, you need some more changes, but I've problems to get it working.
I'll let you know if I can come up with something:)

scotty(-:

[scotty]

I had some problems with the loadPic prototype so I've changed that in a "normal" function;)

scotty(-:

[mansour]

scotty i love you :)

your a genious man. thanx for you quick responses. :thumb:

[rynokins]

is it possible to have the border resize to a set size in between each image? so for example, it would change to 200x50 and then resize to the image size? thanks

[akadis]

Have you tried changing the registrationpoint of the border mc to top centre and in the resize function set containerMC y to border y?

containerMC._x = this._x-this._width/2+spacing/2;
containerMC._y = this._y+spacing/2;

scotty(-:

Hi Scotty. Thanks for the quick response.

I tried changing the registration point to top centre and putting in your code but the border behaves in the same way and the image loaded in appears half way down it.

Any ideas?

[sipher]

hey scotty just wondering ... what's the different between this xml? thingy
or anyone else who would like to give a idea how to put it in write the xml file for that matter

thanks

doc = new XML();
doc.load("imagelib.xml");
doc.ignoreWhite = true;
doc.onLoad = readLib;


xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("images.xml");

[rynokins]

:q:

ok, here's my revised question. I can't figure out how to do a couple of things.
- how do I make it so the navigation (which I've placed on the bottom, along the right edge right of the rect.) sticks to the side?
-how do I change the registration point for the image loading in, so it's aligning to the bottom right as well?

...and then for bonus karma points - if there's a way for me to set a distinct function that sizes the rectangle to small on click, then resizes to the new image size, I would deeply appreciate even the slightest hint.

thanks so much!

[Lewwy]

If you visit www.evolewtion.co.uk/photos.htm (http://www.evolewtion.co.uk/photos.htm) you will notice that the first picture you click on, goes wrong.. the box doesnt expand properly, and the image loads in the wrong place, although the problem fixes itself when you click on the same (or a different) image again. I would much rather prefere it if there was no problem at all. Can anyone help me?

[scotty]

@rynokins: let's say the instancename of your navigation is nav.
Then put in the onEnterFrame of the resize

nav._x = this._x+this._width/2+spacing;
nav._y = this._y+this._height/2-nav._heigth;

@Lewwy: can you post your code?

scotty(-:

[Lewwy]

spacing = 10;
containerMC._alpha = 0;

MovieClip.prototype.loadPic = function(pic){
_root.containerMC._alpha = 0;
this.loadMovie(pic);
_root.onEnterFrame = function(){
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
if (t != 0 && Math.round(l/t) == 1){
var w = containerMC._width + spacing, h = containerMC._height + spacing;
border.resizeMe(w, h);
delete _root.onEnterFrame;
}
}
};
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 = 100;
delete this.onEnterFrame;
}
}
};

If you could fix it I would be very thanksfull :)

[scotty]

I think this will work:)

MovieClip.prototype.loadPic = function(pic) {
this._alpha = 0;
this.loadMovie(pic);
this._parent.onEnterFrame = function() {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
if (Math.round(l/t) == 1 && containerMC._width>0 && containerMC._height) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
border.resizeMe(w, h);
delete this.onEnterFrame;
}
};
};

scotty(-:

[Lewwy]

hmm.. when I replace my code.. with your code.. Nothing happens, it renders the buttons useless.. absolutley nothing happens? I think I must be doing something wrong, but it did *something* before, am I supposed to be replacing the whole code with yours, or just a little bit?

[scotty]

Leave the code as it was, only replace the loadPic function:)

scotty(-:

[Lewwy]

Sorted.. Thank you..
May I ask what book(s)/webpages/tutorials you read to become so **** good scotty?

[rynokins]

scotty - thanks for your help - the client doesn't want the gallery to migrate around the screen, though :hangover: :m:

here's what I came up with before your reply, though - which I'm quite proud of.
check out the 'work' section (http://www.cloudbust.com/client/projectinc) - only one project is active for now

[scotty]

Looks good:)

scotty(-:

[digitalberet]

Yes,

I am need of some expert flash actionscriptor help. I am a designer trying to piece cello's resizeable gallery concept with another xml gallery tutorial I found on the net. I am trying to make it as dynamic as possible. Here is the script for what I have so far. I want to click on the dynamic thumbnails and have the movieclip resize accordingly. I think I should start here, "(loader.loadMovie(this.main);" but I am not sure. Thanks for all your help!

myPhoto = new XML();
myPhoto.ignoreWhite = true;
myPhoto.onLoad = function(success) {
//portfolioTag = this.firstChild;
numimages = this.firstChild.childNodes.length;
spacing = 70;
for (i=0; i<numimages; i++) {
picHolder = this.firstChild.childNodes[i];
thumbHolder = thumbnails.createEmptyMovieClip("thumbnail"+i, i);
thumbHolder._x = i*spacing;
thumbLoader = thumbholder.createEmptyMovieClip("thumbnail_image", 0);
thumbLoader.loadMovie(picHolder.attributes.thmb);
thumbHolder.title = picHolder.attributes.title;
thumbHolder.main = picHolder.attributes.main;
thumbHolder.onRelease = function() {
loader.loadMovie(this.main);
title_txt.text = this.title;
};
}
};
myPhoto.load("xmlphoto.xml");

[scotty]

Not sure about your set-up, but if you have the loadPic and resize prototype in your code and the main node refers to a jpg, this should work

thumbHolder.onRelease = function() {
loader.loadPic(this.main);
title_txt.text = this.title;
};

scotty(-:

[digitalberet]

Thanks Scotty!

You are a BIG help. You are an asset to this forum. If you have time to answer one more question. Evertythng works great the first time to click on one of the thumbnails. The animation plays out beautifully. When you click another thumbnail, however, the frame resizes, but no animation. Any ideas? I attached the test files for you to take a look at if you want. Thanks so much for your time and help!
:hugegrin:

[digitalberet]

Whoops!

I just realized I did not post the right file for the test gallery. Please, forgive my mistake. I was wondering if since the frame resized the first time without a problem, then maybe it worked because the movieclip was empty to begin with. Is there a way to clear the contents of a movieclip then call the loadPic variable again? Any help would be great. I attached the correct version of the sample files below. Thanks again for everyones help!

[scotty]

With the loadMovie command the old picture (and its properties) are replaced/deleted. That's why the preloader is in the code to be sure the picture is fully loaded and it's properties are defined:)

I've made some changes in your fla (they are commented in the as)

scotty(-:

[digitalberet]

Scotty,

You are brilliant! Thanks so much for all your help. I have been racking my brain trying to figure this out. I am very new to actionscript and have little idea of what I am doing. I'll be sure to post the link to the gallery when I am finished. Thanks again, and have a great day! :hugegrin:

[scotty]

You're welcome=)

[DDD]

Out of curiousity is there like a final or final(s) versions to this nice piece of work? I have one small request if it is not too much too add. For those of you who have received a finished version with your changes you requested. Could you post the finished .fla? It is very hard to go back over 40 something pages of posts to find the finished versions. I figure if everyone could post the .fla and the changes and features it has. It could make it easier for people who want to use this wonderful tool. And I will do my best to merge the posts into one post so it will be easy to find.

How does that sound guys?

Oh and thanks to all involved in this.

[RhythmMethod]

Hey DDD that sounds great to me. :)

I mentioned in the AS forum that I'm looking to use this in a situation where I need to load different galleries depending on button selected, and Next and Previous buttons, but no thumbnails. I didn't find that particular config here in the thread. Does anyone have that setup handy?

Mucho thanks,
John

[scotty]

Good idea, DDD:)

scotty(-:

[gorillamike]

Hey all....

I am trying to mod an incarnation of this gallery..the version used a text file array to load the images and has dynamically generated thumbs...i am trying to make this file use .xml instead of .txt .... having some trouble with the thumbnail creation aspect... i can load the images with the .xml but can't get the thumbs to create...

[RhythmMethod]

Hi Scotty,
Again, big thanks for all this. I'm back with another q, because I'm disfunctional regarding functions. :crazy:

I am using a dynamic menu system which you plug your data into an array for the button actions. So I've gotta type in the function name and then the value in order to choose which gallery I want to show. So I've tried things like
["galleryChooser","but0"]
and similar, but no success yet. Can you tell me what data I need to pass to galleryChooser, and if there is something I need to add to get the first pic in the gallery to load?


EDIT: My issue was elsewhere, and the above did work, Big thanks!
John

[scotty]

Glad you've found it out=)

scotty(-:

[RhythmMethod]

I grappled unsuccessfully over the weekend with one other feature for it. Instead of title text that changes with every image, I'd like to have one long descriptive paragraph that describes the gallery, and remains on stage during all images of that gallery. Any help gratefully appreciated! Here's the w.i.p. (http://www.thetalkbasses.com/tbv2f.html) so you can see where I'm headed. The text would go under the images.

Have a great day everybody!
Many thanks,
John

[crs]

hi

can u tell me how can I add to this gallery xmlphotogallery3.fla (http://www.kirupa.com/forum/attachment.php?attachmentid=9729) an prev and next buttons?

thanks

[RhythmMethod]

Hi CRS,

Check out the one in this thread, it has Next/Prev buttons. Props to Scotty.

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

[crs]

thanks
but I want to add a prev and next buttons to browse thru the gallery after selecting a thumb... :puzzle:

[DDD]

Rhythm and others.

I have created a sticky post at the top of this forum. Please post finished version there. Just makes it easier for folks to find versions.

[RhythmMethod]

Hi DDD, I'll do that as soon as I get the single gallery description worked out. I'm hoping Scotty or someone will have a pointer there for me.

CRS, Scotty posted one with the prev/next buttons in the sticky thread. G/L!

John

[scotty]

Give your firstChild an attribute

<?xml version="1.0" encoding="UTF-8"?>
<portfolio info ="Holiday pictures">
<image title="Leila" source="pic1.jpg"/>
<image title="Leila again" source="pic2.jpg"/>
//rest of the xml
Make a textfield with the instancename gallery_txt and in the load xml add
gallery_txt.text = gallery.attributes.info;
so your code looks like this

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++) {
//rest of the code

scotty(-:

[RhythmMethod]

Scotty, I can't thank you enough. It looks like I need to get my head around xml in a big way.

[scotty]

no problem

[gorillamike]

got a quic question for someone..i have combined a couple of these .flas to try and achieve what i need...i almost have it where i want it functionality wise but i'm stuck on one thing....

i have 1 xml file with multiple galleries and dynamic thumbs...the issue is when a new gallery is loaded the thumbs arent updating properly...i need some sort of function to clear the old set before the new ones go in i think..any help would be great.....

fla is here:

UPDATE: I actually finally figured it out...not too elegant bu i know what the issue was now so hopefully i can pretty it up ;)

[scotty]

Welcome to kirupaforums=)
Have a look here
http://www.kirupa.com/forum/showthread.php?t=87388

scotty(-:

[gorillamike]

thanks..i got the mutliple gallery version from that thread..my issue is that the dynamic thumbs arent quite loading properly (they kind of append to the current set instead of replacing them completely)...i have looked through everything and havent seen the same thing..(may have missed it though)..;)




Welcome to kirupaforums=)
Have a look here
http://www.kirupa.com/forum/showthread.php?t=87388

scotty(-:

[imported_Mrrufus]

Hi,

I hope I didn't miss the answer to this question somewhere...

What I'm trying to do is:
I need to load caption text for each image. As I want to use css formatting on this text, I thought I would use the tArray to store paths to the appropriate xml files containing the text (when viewing image 1 the text contents of 1.xml should display in a dynamic text field...)
Just like the pArray points to a source, the tArray should point to the xml file.
I just can't figure out how to have the text field display the content of this xml-text file...

my xml storing the info for the slideshow looks like this:


<eoSlideshow>
<gallery>
<image picSource="fscommand/data/external_data/media/images/set_1/1.jpg" captionSource="fscommand/data/external_data/media/images/set_1/captions/1.xml" hiresSource="fscommand/data/external_data/media/images/set_1/hires/1.jpg" hiresFilesize="x kb" zipSource="fscommand/data/external_data/media/images/set_1/hires/set_1.zip" zipFilesize="x mb"/>
...
</gallery>
..<eoSlideshow>



Any help is really appreciated...

Thanks,

Rufus

[imported_Mrrufus]

Hmmmm,
Maybe I should ask the question like this: What would be the best approach to loading Text with each image that can be formatted by using css?
Anybody?

Rufus

[dhina]

Thank you so much for sharing this photo gallery ...
I'm new to this forum and I have been playing with this XML photo gallery for past 2 weeks trying to understand and create my own gallery. Now I got stuck with a simple preloading text for thumbnails ...

Demo: http://www.dhinakar.com/album/index.html

Issue: Not all thumbnails are loaded.
My requirement: create a dynamic text "loading" above each thumbnail and rest to "" when they're loaded.
I would appreciate if anyone can help me to resolve this issue...

Here is the template.... see thumHolder.onEnterframe. That's were I'm stuck now.
The current is just a draft of my requirement.it doesn't work.

<as>
MovieClip.prototype.loadPic = function(pic){
...
...
};

MovieClip.prototype.resizeMe = function(w, h) {
..
..
};

myPhoto = new XML();
myPhoto.ignoreWhite = true;
myPhoto.onLoad = function(success) {
if (success) {
numimages = this.firstChild.childNodes.length;
spacing = 90;
_root.totalthumblength = numimages*spacing -550;

for (i=0; i<numimages; i++) {

picHolder = this.firstChild.childNodes[i];

if (picHolder.nodeName == "image") {
thumbHolder = thumbnails.createEmptyMovieClip("thumbnail"+i, i);
thumbHolder._x = i*spacing;
thumbLoader = thumbHolder.createEmptyMovieClip("thumbnail_image", 0);
thumbLoader.loadMovie(_root.folderpath + picHolder.attributes.thmb);
thumbHolder.title = picHolder.attributes.title;
thumbHolder.main = picHolder.attributes.img;
thumbHolder.imgcount = i;
tArray.push(thumbHolder.title);
pArray.push(thumbHolder.main);

thumbHolder.onRelease = function() {
containerMC.loadPic(this.imgcount);
};

thumbHolder.onRollOver = function() {
...
...
}

thumbHolder.onRollOut = thumbHolder.releaseOutside = function() {
...
...

}

thumbHolder.onEnterFrame = function(){

////////// thumbnail preloader /////////////////////////////////////////////////////////////////////////////////////

var thumbtext = this._parent.createTextField("label"+this.imgcount,5,this._x,this._y,200,50);
thumbtext.textColor = 0xFFFFFF;
var tt = thumbLoader.getBytesTotal(), tl = thumbLoader.getBytesLoaded();
if (tt != 0 && Math.round(tl/tt) == 1 && thumbLoader._width != 0){
thumbtext.text = "";
delete this.onEnterFrame;
}
else {
thumbtext.text = "loading..."
}
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////


}



}
}
} else {
title_txt.text = "XML Load Error";
}
};

myPhoto.load("xmlphoto.xml");
</as>

[dhina]

Thank you so much for sharing this photo gallery .

I'm new to this forum and I have been playing with this XML photo gallery for past 2 weeks trying to understand and create my own gallery. Now I got stuck with a simple preloading text for thumbnails ...

Issue: Not all thumbnails are shown.
My requirement: create a dynamic text "loading" above each thumbnail and reset to "" when they're loaded.
I would appreciate if anyone can help me to resolve this issue...

Here is the template.... see thumHolder.onEnterframe. That's were I'm stuck now.
Note: existing thumbholder.onenterframe code is just a draft of my requirement


MovieClip.prototype.loadPic = function(pic){
...
...
};

MovieClip.prototype.resizeMe = function(w, h) {
..
..
};

myPhoto = new XML();
myPhoto.ignoreWhite = true;
myPhoto.onLoad = function(success) {
if (success) {
numimages = this.firstChild.childNodes.length;
spacing = 90;
_root.totalthumblength = numimages*spacing -550;

for (i=0; i<numimages; i++) {

picHolder = this.firstChild.childNodes[i];

if (picHolder.nodeName == "image") {
thumbHolder = thumbnails.createEmptyMovieClip("thumbnail"+i, i);
thumbHolder._x = i*spacing;
thumbLoader = thumbHolder.createEmptyMovieClip("thumbnail_image", 0);
thumbLoader.loadMovie(_root.folderpath + picHolder.attributes.thmb);
thumbHolder.title = picHolder.attributes.title;
thumbHolder.main = picHolder.attributes.img;
thumbHolder.imgcount = i;
tArray.push(thumbHolder.title);
pArray.push(thumbHolder.main);

thumbHolder.onRelease = function() {
containerMC.loadPic(this.imgcount);
};

thumbHolder.onRollOver = function() {
...
...
}

thumbHolder.onRollOut = thumbHolder.releaseOutside = function() {
...
...

}

thumbHolder.onEnterFrame = function(){

////////// thumbnail preloader /////////////////////////////////////////////////////////////////////////////////////

var thumbtext = this._parent.createTextField("label"+this.imgcount,5,this._x,this._y,200,50);
thumbtext.textColor = 0xFFFFFF;
var tt = thumbLoader.getBytesTotal(), tl = thumbLoader.getBytesLoaded();
if (tt != 0 && Math.round(tl/tt) == 1 && thumbLoader._width != 0){
thumbtext.text = "";
delete this.onEnterFrame;
}
else {
thumbtext.text = "loading..."
}
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////


}



}
}
} else {
title_txt.text = "XML Load Error";
}
};

myPhoto.load("xmlphoto.xml");


@Scotty: I know this kind of issues will take just matter of minutes for you to resolve but for me its killing my days/weeks ... Can you please help.


Thanks in advance.

[rus]

Hi hallo every one.
I really like height resizing gallery, but is it possible to make gallery resize the window from the bottom instead of the top. if yes any body can explain how to do that.
thanks

[scotty]

dhina, give this a try, I didn't test it:)

myPhoto = new XML();
myPhoto.ignoreWhite = true;
myPhoto.onLoad = function(success) {
if (success) {
numimages = this.firstChild.childNodes.length;
spacing = 90;
_root.totalthumblength = numimages*spacing-550;
for (i=0; i<numimages; i++) {
picHolder = this.firstChild.childNodes[i];
if (picHolder.nodeName == "image") {
thumbHolder = thumbnails.createEmptyMovieClip("thumbnail"+i, i);
//create a textfield
thumbHolder.createTextField("thumbtext", 1, 0, -10, 25, 10);
thumbHolder.thumbtext.textColor = 0xFFFFFF;
thumbHolder._x = i*spacing;
thumbLoader = thumbHolder.createEmptyMovieClip("thumbnail_image", 0);
//changed the loadMovie here to loadThumb)
thumbLoader.loadThumb(_root.folderpath+picHolder.a ttributes.thmb);
thumbHolder.title = picHolder.attributes.title;
thumbHolder.main = picHolder.attributes.img;
thumbHolder.imgcount = i;
tArray.push(thumbHolder.title);
pArray.push(thumbHolder.main);
thumbHolder.onRelease = function() {
containerMC.loadPic(this.imgcount);
};
thumbHolder.onRollOver = function() {
};
thumbHolder.onRollOut = thumbHolder.releaseOutside=function () {
};
}
}
} else {
title_txt.text = "XML Load Error";
}
};
var dep = 9954;
MovieClip.prototype.loadThumb = function(clip) {
dep++;
var loader = this;
var holder =this._parent;
this.loadMovie(clip);
var temp = _root.createEmptyMovieClip("tmp"+dep, dep);
temp.onEnterFrame = function() {
var tt = loader.getBytesTotal(), tl = loader.getBytesLoaded();
if (tt>4 && tl != tt && loader._width != 0) {
holder.thumbtext.text = "";
delete this.onEnterFrame;
} else {
holder.thumbtext.text = "loading...";
}
};
};
myPhoto.load("xmlphoto.xml");

scotty(-:

[scotty]

rus, most important thing I've changed is the registration point of the border mc, it's now bottom centred.

scotty(-:

[rus]

Scotty thank you so much, really appreciated

[scotty]

You're welcome=)

[rus]

Scotty one more question, do you know if it's possible to make picture load with fade in, it looks really bad when picture just jump in to the frame, what I mean if the picture start showing from 0% Alpha to 100%. By any chance may be you know how to do that.
Thanks again.

[scotty]

MovieClip.prototype.resizeMe = function(w, h, pic) {
containerMC._alpha = 0;
var speed = 3;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
prevb._x = Math.round(this._x-this._width/2)-spacing;
nextb._x = Math.round(this._x+this._width/2)+spacing;
nextb._y = prevb._y=this._y-(this._height-spacing/2);
picinfo._y = nextb._y-5;
picinfo._x = border._x-picinfo._width/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-spacing/2);
containerMC._alpha += 10;
if (containerMC._alpha>100) {
containerMC._alpha = 100;
delete this.onEnterFrame;
}
}
};
};

scotty(-:

[rus]

Scotty, you are the best, thanks again :)

[dhina]

Scotty, Thanks for helping me . I tried your fix but in vain.
clear cache and try reloading the page. preload text is not getting displayed.

Thanks for looking into this issue

regards

[scotty]

@rus, no problem:thumb:

@dhina, I'll have a look later today/tomorrow;)

scotty(-:

[scotty]

For some reason the textfield doesn't show up, but I can trace() it...
So I did a little trick and it's working now

myPhoto.onLoad = function(success) {
if (success) {
delete pArray, tArray;
pArray = new Array();
tArray = new Array();
for (var i = 0; i<17; i++) {
thumbnails["thumbnail"+i].removeMovieClip();
}
_root.entercount = 0;
numimages = this.firstChild.childNodes.length;
spacing = 90;
_root.totalthumblength = numimages*spacing-550;
for (i=0; i<numimages; i++) {
picHolder = this.firstChild.childNodes[i];
if (picHolder.nodeName == "image") {
thumbHolder = thumbnails.createEmptyMovieClip("thumbnail"+i, i);
//create a textfield
_root.createTextField("thumbtext"+i, i, i*spacing+thumbnails._x, thumbnails._y, 50, 15);
_root["thumbtext"+i].selectable = false;
thumbHolder._x = i*spacing;
thumbLoader = thumbHolder.createEmptyMovieClip("thumbnail_image", 0);
thumbLoader.loadThumb(_root.folderpath+picHolder.a ttributes.thmb, i);
thumbHolder.title = picHolder.attributes.title;
thumbHolder.main = picHolder.attributes.img;
thumbHolder.imgcount = i;
tArray.push(thumbHolder.title);
pArray.push(thumbHolder.main);
thumbHolder.onRelease = function() {
containerMC.loadPic(this.imgcount);
};
thumbHolder.onRollOver = function() {
};
thumbHolder.onRollOut = thumbHolder.releaseOutside=function () {
};
}
}
} else {
title_txt.text = "XML Load Error";
}
};
var dep = 9954;
MovieClip.prototype.loadThumb = function(clip, nr) {
dep++;
var loader = this;
this.loadMovie(clip);
var temp = _root.createEmptyMovieClip("tmp"+dep, dep);
temp.onEnterFrame = function() {
var tt = loader.getBytesTotal(), tl = loader.getBytesLoaded();
_root["thumbtext"+nr].text = "loading...";
if (tt>4 && (tl == tt) && loader._width != 0) {
_root["thumbtext"+nr].text = "";
delete this.onEnterFrame;
}
};
};

scotty(-:

[dhina]

Wow! It worked. Thank you very much!

I also tried the preload prototype from http://www.kirupa.com/forum/showthread.php?t=6794 for thumbnails and faced the same textfield problem. I guess I can implement the same trick there also.

Thanks again

Regards

[rus]

Scotty, it's rus again. Listen by any chance may be you know how to make fade out too? Or it's not possible?
Thanks again

[scotty]

@dhina: you're welcome=)

@rus: change your loadPic function like this (you'll now have two functions)

MovieClip.prototype.loadPic = function(pic) {
this.onEnterFrame = function() {
this._alpha -= 10;
if (this._alpha<0) {
this._alpha = 0;
this.preload(pic);
delete this.onEnterFrame;
}
};
};
MovieClip.prototype.preload = function(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 != 0 && Math.round(l/t) == 1 && containerMC._width != 0) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
border.resizeMe(w, h);
bar._visible = 0;
delete this.onEnterFrame;
} else {
bar._width = per;
}
};
};

scotty(-:

[rus]

Scotty you my hero, thanks again man :)

[scotty]

welcome=)

[rus]

Hey Scotty it's me again. You probably tired of me, but i got another little problem:).
First we have reguler buttons that is in the same movie than "containerMC" and to call the pictur we use this
on (release) {
this.containerMC.loadPic(1);
}
Than we put button inside movie symbol and we use this code

on (release) {
this._parent.containerMC.loadPic(1);
}
But can we put button inside second symbol and call picture from there???
it shoud look like
on (release) {
this.(???)._parent.containerMC.loadPic(1);
}

Thx

[scotty]

I don't know why you should do that, but

on (release) {
this._parent._parent.containerMC.loadPic(1);
}
or if the movie is a standalone and containerMC is in the maintimeline

on (release) {
_root.containerMC.loadPic(1);
}

scotty(-:

[nessie]

Hey all you flash gurus i wonder if ther is some one how can help me I dowloaded this from Kirupa and i wonder if it´s posible to make a dowmloadicon that downloads the picture that is choosen and apers big on screen.

[visitor13]

It took me a loooong time to get to this point and of course I'm totally in awe: this is a fantastic thread! Thanks all of you for the input. Now the questions:
1) back on page 27 in post 401 vman (I think) posted the code for a dynamically loaded thumbnails based gallery. Apparently though I couldn't run it as the paths to the php files seemed to be incorrect (Error opening URL "http://localhost/thumbcounter.php" | Error opening URL "http://localhost/filecounter.php"). When I changed those to "thumbcounter.php" and "filecounter.php" the script started looping indefinitely and couldn't be executed.
2) has the caching of the images been addressed yet? What I would love to see is a slideshow that could be preloaded as a whole. So while the thumbnails are being loaded there is a bar growing and a text field showing the progress from 0-100% which would represent loading all the pics in a given gallery.

[kokoi]

I'm using the resizable slideshow on my site, I'm trying to give it a preloader using your script. But between 2 pics the slideshow is resized to 0*0. Is there a way to prevent this from happening, so that the slideshow remains the size of the previous pic. I'm using the current script
spacing = 2;
_root.photvlak.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;
_root.we=containerMC._width+spacing, _root.he=containerMC._height+spacing;
border.resizeMe(w, h);
bar._visible = 0;
loadText.text = "";
delete this._parent.onEnterFrame;
} else {
var w = 500, h = 500;
border.resizeMe(w, h);
bar._height = 1;
bar._width = per*4.86;
//gives the bar a max width 100
loadText.text = per+" % loaded";
}
};
};
MovieClip.prototype.resizeMe = function(w, h) {
var speed = 4;
this.onEnterFrame = function() {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
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;
_root.photvlak.containerMC._x = this._x-this._width/2+spacing/2;
_root.photvlak.containerMC._y = this._y-this._height/2+spacing/2;
_root.photvlak.containerMC._alpha += 5;
if (_root.photvlak.containerMC._alpha>90) {
_root.photvlak.containerMC._alpha = 100;
delete this.onEnterFrame;
}
}
};
};


Can someone help?

[scotty]

MovieClip.prototype.loadPic = function(pic) {
this._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;
_root.we=containerMC._width+spacing, _root.he=containerMC._height+spacing;
border.resizeMe(w, h);
bar._visible = 0;
loadText.text = "";
//changed 'this._parent' in 'this'
delete this.onEnterFrame;
} else {
bar._height = 1;
bar._width = per*4.86;
loadText.text = per+" % loaded";
}
};
};


scotty(-:

[kokoi]

Odd but my load bar isn't visible.

Oops placed it under a mask.

[scotty]

Hmm...weird, can you post your fla?

scotty(-:

[deathBydsgn]

Can someone possibly look at mine? I've got the sliding menu coming up in an external .swf and from there it loads the pics into the containerMC.

The first one 'cast and architectural' works about 50% of the time, having trouble resizing the box for each pic...

The second one 'random builders' resizes, but with no transition effect.

Look at what I have here...
http://www.borderless.us/clients/arnoldstone/layout2.swf

and you can download my files here...
http://www.borderless.us/clients/arnoldstone/arnoldstone.zip

[scooterdie]

Just wondering, have we implemented the preload effect to the "border-resize" effect? I would like to help out in somewhat finishinug this. BUT if it is already done, can someone post the .fla? (zip). By the way, Scott and Celo, congrats on the HUGE amounts of patience and sharing of your knowledge. :hugegrin:

[biermann75]

hi all,
this thread is really great.

i have a problem with fading the pictures. by loading, sometimes you see the picture at a false position. can someone help me?

you can see it here:
http://www.holgerpix.com/internet/neu

the script is:

spacing = 10;
containerMC._alpha = 0;
var pArray = new Array();
var tArray = new Array();
var cur = 0;
MovieClip.prototype.loadPic = function(pic) {
cur = pic;
containerMC._alpha = 0;
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 != 0 && Math.round(l/t) == 1 && containerMC._height != 0) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
border.resizeMe(w, h);
bar._visible = 0;
picinfo.info.text = tArray[pic];
delete this.onEnterFrame;
} else {
bar._width = per;
//gives the bar a max width 100
picinfo.info.text = per+" % loaded";
}
};
};
MovieClip.prototype.resizeMe = function(w, h, pic) {
var speed = 3;
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 you want the next and prev button on a solid place, skip next three lines
picinfo._y = nextb._y-410;

picinfo._x = border._x-picinfo._width/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 += 4;
if (containerMC._alpha>98) {
containerMC._alpha = 99;
delete this.onEnterFrame;
}
}
};
};



var gallery_xml = new XML();
gallery_xml.ignoreWhite = true;
gallery_xml.onLoad = function(success) {
if (success) {
var gallery = this.firstChild;
for (var i = 0; i<gallery.childNodes.length; i++) {
tArray.push(gallery.childNodes[i].attributes.title);
pArray.push(gallery.childNodes[i].attributes.source);
}
//loading first picture
containerMC.loadPic(0);
} else {
title_txt.text = "Error!";
}
};
gallery_xml.load("gallery_newyork.xml");
prevb.onRelease = function() {
cur--;
if (cur<0) {
containerMC.loadPic(pArray.length-1);
} else {
containerMC.loadPic(cur);
}
};
nextb.onRelease = function() {
cur++;
if (cur>pArray.length-1) {
containerMC.loadPic(0);
} else {
containerMC.loadPic(cur);
}
};

Thank you very much!

[deathBydsgn]

Hmm...

This thread is awesome. Scotty and Cello deserve so much credit for their genius.

2 Q's-

+ I have containerMC set to load an image on entering the frame, but the border does not resize around it immediately...It does it when you click the thumb, but not on the first load.

+Also, the border does not resize every time...it only does it once in a while. Any suggestions?


spacing = 10;
containerMC._alpha = 0;
MovieClip.prototype.loadPic = function(pic) {
_root.containerMC._alpha = 0;
this.loadMovie(pic);
_root.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);
delete _root.onEnterFrame;
}
};
};
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 += 5;
if (_root.containerMC._alpha>90) {
_root.containerMC._alpha = 100;
delete this.onEnterFrame;
}
}
};
};
containerMC.loadPic("random_builders/images/cast1.jpg");

[dyren]

hi all,
this thread is really great.

i have a problem with fading the pictures. by loading, sometimes you see the picture at a false position. can someone help me?

you can see it here:
http://www.holgerpix.com/internet/neu

the script is:
-------

Thank you very much!

small glitch in your site. when loading images, your load bar says "NaN loaded" before it goes through 0 to 100.

small fix i believe... some if statment like:


if(picinfo.info.text == "NaN") {
picinfo.info.text = "0";
}


correct me if im wrong.

[scotty]

@ scooterdie: check this
http://www.kirupa.com/forum/showthread.php?t=87388 the V3.zip has a preloader
@deathBydsgn:
Try this

MovieClip.prototype.loadPic = function(pic) {
this._alpha = 0;
this.loadMovie(pic);
_root.onEnterFrame = function() {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
if (t != 0 && Math.round(l/t) == 1 && containerMC._width>0&& containerMC._height>0) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
border.resizeMe(w, h);
delete this.onEnterFrame;
}
};
};

scotty(-:

[biermann75]

hi, i have tryed was dyren says.
by clicking to the next picture and wait still it is loaded every thing is fine.

but, by clicking fast through the pictures, it gives always problems.

isn´t is possible to correct this bug?
see entry#694

i would be very happy if anyone can help me.

[True Blue 32]

I have taken the resizing slideshow and wanted to try and add a few images to suss out exactly how this was working. I have created the BMP's used and created the buttons. I have also added the action script to the buttons.

I am by no meanes an expert at reading action script, but i guess it implies that the JPG pictures are stored within the containerMC.

However, when i go into the container MC, there is only one Keyframe, i cannot see any JPG's stored in there either, so where exactly is flash getting these images from? I also would have expected to see some JPG images in the library but i can't!

I have attached my zipped .fla code, would somebody please have a look into this for me and point me in the right direction, as i'm totally confused here!!!

Many Thanks.

[imbuez]

Hi dude

You need to put the images in the same directory as your .swf file. The empty mc is need to loaded the images into.

Your not attaching your images from the library, your loading them from your folder.

I would suggest starting at the beginning of this thread and clawing through it all, so as to understand what your doing a little bit more.

[True Blue 32]

Hi dude

You need to put the images in the same directory as your .swf file. The empty mc is need to loaded the images into.

Your not attaching your images from the library, your loading them from your folder.

I would suggest starting at the beginning of this thread and clawing through it all, so as to understand what your doing a little bit more.

Cheers for the info but what :!: all 47 pages.... I was hoping i could avoid doing that as there are lots of people talking about slightly different requirements, and i can see myself going off at completely the wrong tangent.

Oh well i'll give it a go.

[RadioactveChimp]

Hey does anyone know how to do transitions in between the photos, besides fade?

I searched this thread and nothing was ever really answered :thumb:


Thanks to who can help!

[bart-c]

First of all I want to say i really apreciate all the nice work done here.. Great job!

Everything works just perfect for me, but I still have one question:

Is it possible to make the pictures you load via the xml gallery work as a button? So that if you click on the picture it opens an external link, with the image in full size, so that it can be saved..?!

bart-c

[scotty]

At the end of the resize prototype change it like this, it will open a html file
pic0.html, pic1.html, ....etc

//resize prototype
//a lot of code
//...
//....
if (containerMC._alpha>90) {
containerMC._alpha = 99;
containerMC.useHandCursor = 1;
containerMC.onRelease = function() {
getUrl("pic"+cur+".html", "_blank");
};
delete this.onEnterFrame;
}


scotty(-:

[bart-c]

seriously, you are the best :D
thnx a lot!

[scotty]

no problem:thumb:

[bart-c]

I tried it, but it opens the link, but instead of pic1.html it says picundefined.html.. Any idea what I am doing wrong?

bart-c

[scotty]

Nothing:)
You probably have no variable 'cur'. Can you post your loadPic()+resizeMe() code?

scotty(-:

[bart-c]

This is the whole code..


spacing = 5;
containerMC._alpha = 0;
var pArray = new Array();
var tArray = new Array();
MovieClip.prototype.loadPic = function(pic) {
containerMC._alpha = 0;
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 != 0 && Math.round(l/t) == 1 && containerMC._width != 0) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
border.resizeMe(w, h);
bar._visible = 0;
picinfo.info.text = tArray[pic];
delete this.onEnterFrame;
} else {
bar._width = per;
//gives the bar a max width 100
picinfo.info.text = per+" % loaded";
}
};
};
MovieClip.prototype.resizeMe = function(w, h, pic) {
var speed = 3;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;

//if you want the next and prev button on a solid place, skip next three lines
prevb._x = nav._x-5;
nextb._x = nav._x+this._width+5;
nextb._y = prevb._y=this._y-this._height/2;
picinfo._y = nextb._y-5;

picinfo._x = border._x-picinfo._width/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 += 10;
if (containerMC._alpha>90) {
containerMC._alpha = 99;
containerMC.useHandCursor = 1;
containerMC.onRelease = function() {
getUrl("pic"+cur+".html", "_blank");
};
delete this.onEnterFrame;
}

}
};
};
var gallery_xml = new XML();
gallery_xml.ignoreWhite = true;
gallery_xml.onLoad = function(success) {
if (success) {
var gallery = this.firstChild;
for (var i = 0; i<gallery.childNodes.length; i++) {
tArray.push(gallery.childNodes[i].attributes.title);
pArray.push(gallery.childNodes[i].attributes.source);
}
//loading first picture
containerMC.loadPic(0);
} else {
title_txt.text = "Error!";
}
};
gallery_xml.load("gallery.xml");

[scotty]

getUrl("pic"+pic+".html", "_blank");
should work:)

scotty(-:

[bart-c]

it still tries to open picundefined.html


bart-c

[scotty]

Oops my bad...
In the loadPic prototype look for this line

border.resizeMe(w, h);
and change it in

border.resizeMe(w, h, pic);
now pic is defined in the resizeMe function as well and it will work (at least I hope :lol: )

scotty(-:

[bart-c]

thnx a lot! it works fine now :D

[scotty]

You're welcome=)

[jewelz24]

is there a version of V3 that implements the xml document for loading thumbs and pics as found here: http://www.kirupa.com/web/xml/examples/portfolio.htm

[byron 2]

is there a version of V3 that implements the xml document for loading thumbs and pics as found here: http://www.kirupa.com/web/xml/examples/portfolio.htm

This is one of the best theads ever!!

Could we have the very latest .zip file please scotty!!!:pleased:

just so we can see the progress - not too great at following the code!!

[scotty]

Have a look here (http://gertdesign.info/kirupa/gallery.html)
If this is what you want I'll post the files:)

scotty(-:

[byron 2]

Have a look here (http://gertdesign.info/kirupa/gallery.html)
If this is what you want I'll post the files:)

scotty(-:

Hi scotty ---

thats great - I`d love to pick at those files!!!!!

your a top chap!

[jewelz24]

i'd like to see the files for that as well scotty.

thanks.

[scotty]

You can find the fla (both mx and mx2004) here
http://www.kirupa.com/forum/showthread.php?t=87388 post #2
Look for the V3_with_thumbs.zip:)

scotty(-:

[byron 2]

You can find the fla (both mx and mx2004) here
http://www.kirupa.com/forum/showthread.php?t=87388 post #2
Look for the V3_with_thumbs.zip:)

scotty(-:

exellent!!

how do I put a loader bar in this??

[scotty]

MovieClip.prototype.loadPic = function(pic) {
this._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);
bar._width = per;//gives the bar a max width 100
loadText.text = per+" % loaded";
if (t ==l && containerMC._width != 0&&containerMC._height!=0) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
border.resizeMe(w, h);
bar._visible = 0;
loadText.text = "";
delete this.onEnterFrame;
}
};
};
;)
*took an error out
scotty(-:

[jewelz24]

great! thank you very much scotty

[SmellyCat]

Mate you are the absolute genious! Thank you soo much buddy! :D:D

[scotty]

you're both welcome=)

[mirshand]

can anyone explainme what am i doing wrong?
http://www.transformandote.com/clinica/swf.htm

[mirshand]

This is the code, works fine offline, but once i uploaded, the images move to the botom left. why???
http://www.transformandote.com/clinica/swf.html

[HTML]
spacing = 10;
containerMC._alpha = 0;
MovieClip.prototype.loadPic = function(pic) {
_root.containerMC._alpha = 0;
this.loadMovie(pic);
_root.onEnterFrame = function() {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
if (t != 0 && Math.round(l/t) == 1) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
border.resizeMe(w, h, pic);
delete _root.onEnterFrame;
}
};
};
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 += 5;
if (_root.containerMC._alpha>90) {
_root.containerMC._alpha = 100;
delete this.onEnterFrame;
}
}
};
};

[scotty]

The Math.round(l/t)==1 is wrong. As soon l/t>.5 it will return 1 while the picture isn't fully loaded and its properties are still undefined. This gives you the little 'border' with the size of var spacing. Here's the working code, I've added a few things:)

spacing = 10;
containerMC._alpha = 0;
MovieClip.prototype.loadPic = function(pic) {
this._alpha = 0;
this.loadMovie(pic);
_root.onEnterFrame = function() {
var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
//added chacking for height and width
if (t != 0 && t == l && containerMC._width>0 && containerMC._height>0) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
border.resizeMe(w, h, pic);
delete this.onEnterFrame;
}
};
};
MovieClip.prototype.resizeMe = function(w, h) {
var speed = 3;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
//added checking for height
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<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 += 5;
if (_root.containerMC._alpha>90) {
_root.containerMC._alpha = 100;
delete this.onEnterFrame;
}
}
};
};

scotty(-:

[jewelz24]

Scotty,

I have a question. I want to use a larger size thumbnail, but when i increase the size of the thumb container, it doubles the size of my thumbnail image. do i need to mess with the math in the AS?

[scotty]

If you increase the size of the container (scale it) all contents will scale with it.
So in theory you shouldn't have to change anything except having larger sized thumbnails...But, in the code the thumbs are placed next to each other with a certain width, so a good chance they'll overlapping each other.
Look in the code for the makeButtons function and change the 50 to your needs (to have the same whitespace use thumb width +10) or do it as follows, now it's dynamic and you'll never have to change it again;)

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;
//changed the 50 in the next two lines
thb._x = i%3*(thb._width+10);
thb._y = Math.floor(i/3)*(thb._height+10);
}
loadButtons();
}

scotty(-:

[mirshand]

Thanks Scotty for fix my problem. :thumb:

[scotty]

you're welcome, mirshand :thumb:

[mirshand]

Is it posble to load this slideshow in a scene as a loadMovie? because I tried but the button doesn't call the image.. :q:

[scotty]

In the loadPic function change

_root.onEnterFrame = function() {
to

this._parent.onEnterFrame = function() {
and in the resizeMe function skip all _root's before containerMC

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 && 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 += 5;
if (containerMC._alpha>90) {
containerMC._alpha = 100;
delete this.onEnterFrame;
}
}
};
};


scotty(-:

[3jorn]

This is probably the best thing that's ever been on the net :D
But I have one question about those preloaders.
I know there is a loading bar inside the fla in V3, but I have never got it to work.
And if I put in the as that Scotty wrote a few replies up, then the whole gallery stops working. I haven't changed anything else in the code.

MovieClip.prototype.loadPic = function(pic) {
this._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);
bar._width = per;//gives the bar a max width 100
loadText.text = per+" % loaded";
if (t != 0 && Math.round(l/t) == 1 && containerMC._width != 0&&containerMC._height!=0) {
var w = containerMC._width+spacing, h = containerMC._height+spacing;
border.resizeMe(w, h);
bar._visible = 0;
loadText.text = "";
delete this.onEnterFrame;
}
};
};

[scotty]

I don't know where it slipped in but the Math.round(l/t) == 1 in**

if (t != 0 && Math.round(l/t) == 1 && containerMC._width != 0&&containerMC._height!=0) {
isn't correct. It will return 1 as soon as l/t>.5
So it should read

if (t== l && containerMC._width != 0&&containerMC._height!=0) {
See if that helps you:)

scotty(-:

**edit: I made an error due to copy/paste in the code in post #722

[jewelz24]

thank you scotty. i have another question.. how would i add a next and previous button for the thumbnail container? i have only one gallery and about 30 photos.. i want it to line up as 3 across and 3 down and then with a next and previous to show the next set of thumbnails... very similiar to what niki's gallery looks like.

[scotty]

Check this thread
http://www.kirupa.com/forum/showthread.php?t=93543

scotty(-: