slide show code

[adrowl]

I am trying to use this code from actionscript.toolbox. It works great if your photos are all the same size. My pictures vary greatly and the swap depths doesn't work or the fade in and out. I'll make the pictures smaller but can a continous slide show with about 80 photos be shown without having the user press a button for each photo?

TIA,

Annette#initclip 1
/**
* @class Slideshow
* @author Helen Triolo
* @date 31/07/2003
* @version 1.01 : chg'd activateNext to activateInSeq,
* commented all,
* make onSlideLoaded broadcast work for all, including last
*
* Slideshow constructor, also make it a broadcaster and starts loading
* Properties:
* slides_arr Array holding urls of jpg/swfs to be loaded
* slideDepth Integer specifying depth to start loading slides to (incremented on each slide display)
* fps Integer specifying movie framerate so setInterval can emulate
* nFrames Integer specifying frames to hold slide visible
* alphaIncr Number specifying alpha change per frame
* repeat Boolean indicating whether slideshow should loop
*/
Slideshow = function() {
// trace('slideshow created');
ASBroadcaster.initialize(this);
this.loadInSeq(0);
}

Slideshow.prototype = new MovieClip ();

/**
* @method loadInSeq
* @param i Integer Slide number to be loaded next
*
* Creates movieclip slide<i> in Slideshow, sets vis & alpha,
* starts loading content.. repeats for next i slide til all loaded
*/
Slideshow.prototype.loadInSeq = function(i) {
var slide = this.createEmptyMovieClip("slide" + i, this.slideDepth++);
// hide all slides loading on top of first one
if (i > 0) slide._alpha = 0;
slide.loadMovie(this.slides_arr[i]);
checkLoadedID = setInterval(function(i, mc) {
if (mc["slide" + i]._width > 0) {
mc["slide" + i]._visible = true;
mc.broadcastMessage("onSlideLoaded", i);
clearInterval(checkLoadedID);
// start next one loading (if not last)
if (i < mc.slides_arr.length-1) {
mc.loadInSeq(i + 1);
} else {
mc.broadcastMessage("onAllSlidesLoaded");
}
}
}, 1000/this.fps, i, this);

};

/**
* @method beginTransitions
* @param i Integer, Slide number to be affected
*
* Hold present slide for nFrames, then start rest transitioning
*/
Slideshow.prototype.beginTransitions = function() {
var holdTimeMs = 1000 * this.nFrames / this.fps;
holdID = setInterval(function(mc) { mc.activateInSeq(0); clearInterval(holdID); }, holdTimeMs, this);
};

/**
* @method activateInSeq
* @param i Integer Current slide number, 0 to start
*
* Put next slide (w/alpha=0) above current one (depthwise), fades it
* in, loops to next i and repeats til all done (or forever starting again
* at slide 0 if repeat is true)
*/
Slideshow.prototype.activateInSeq = function(i) {
// trace('in activateInSeq, i='+i);
if (++i < this.slides_arr.length) {
this["slide" + i]._alpha = 0;
this.onEnterFrame = function() {
if (this["slide" + i]._alpha >= 95) {
var counter = this.nFrames;
this.onEnterFrame = function() {
if (!counter--) {
delete this.onEnterFrame;
this.activateInSeq(i);
}
};
} else {
this["slide" + i]._alpha += this.alphaIncr;
}
};
} else {
if (this.repeat) this.activateInSeq(-1);
else this.broadcastMessage("onShowOver");
}
};

Object.registerClass("slideshow", Slideshow);
#endinitclip

[tg]

[useastags]


this will make your code easier to read... ie. more folks will take the time to look thru the code.

[yorkeylady]

You should load your movies outside the stage (put a large negative x value); This prevents slow connections from seeing it flash on the screen before the visible code has a chance to execute.

Then after it's loaded resize the pictures to the size you desire.
Usuall try to fit it into an mc that's already on the screen and adjusted by a component variable the user sets.

Actually I would use setInterval for loading. I wouldn't allow the user to set the frame rate for loading.

This is from the Gallery component. It's pretty basic. Adjust it as necessary.


p.image = function(trgt, file,imageSizeW,imageSizeH) {
this.statusText = "loading images: please wait...";

var controller = this;
var container = trgt.createEmptyMovieClip("container", 100);
var pic = container.createEmptyMovieClip("img", 102);
var crt = container.createEmptyMovieClip("control", 103);

// preloader stuff
var ldr = container.attachMovie("loader", "loader", 104);
ldr._xscale = ldr._yscale = imageSizeW / 4;
ldr._x = (imageSizeW - ldr._width)/2;
ldr._y = (imageSizeH - ldr._height)/2;
ldr.bar_mc._xscale = 1;

pic.loadMovie(file);
pic.cnt = 0;
crt.onEnterFrame = function() {
pic._visible = false;
var ready = int(pic.getBytesLoaded()*100/pic.getBytesTotal());

if(ready > 0 && ready < 100)
ldr.bar_mc._xscale = ready;

if (ready == 100 && pic.getBytesLoaded() > 4) {
pic.cnt++;
if(pic.cnt>1){
delete crt.onEnterFrame;
removeMovieClip(ldr);
pic._visible = true;

// find pic width & height
var ratio;
var pw = pic._width;
var ph = pic._height;

// find if pic is portrait or landscape
if (pw >= ph){
ratio = imageSizeW / pw;
if (ph * ratio > imageSizeH)
ratio = imageSizeH / ph;
} else {
ratio = imageSizeH / ph;
if (pw * ratio > imageSizeW)
ratio = imageSizeW / pw;
}

// resize the pic to fit in medStage
pic._width = pw * ratio - 2;
pic._height = ph* ratio - 2;

// place pic in the middle of medStage
pic._x = Math.round((imageSizeW - pic._width)/2);
pic._y = Math.round((imageSizeH - pic._height)/2);

//next image
controller.currentIndex++;
controller.statusText = "";
controller.currentImageNode = controller.currentImageNode.nextSibling;
controller.loadNext(controller.currentImageNode);
}
}
}
}

Set the _alpha value to 0 and place the image right after it's loaded.

Hope this helps a little. Good luck!

[squadjot]

anybody got source :P?