Sliding gallery - how to "loop around"?

programming flash
1

Hello,

I’m working on a sliding featured gallery like Kongregate.com or Hulu.com uses on their home pages. What I have so far is here:

http://www.pixelmech.com/rev/gallerytest.swf

Where I am running into trouble is in the loop around/wrap around areas. My next and previous buttons tween to the next/previous item just fine. However when I get to the last/first, it gets tricky.

What I have done when you get to feature #5 is check for the x position, and if I am going beyond 5, I reset it so that we pull in #1 instead. The problem is that this scrolls in #1 from the wrong direction. (Take a look at the SWF above to see what I mean).

If I shoot further back in negative X direction and scroll that way, I’ll end up with blank space at the start of the move. I could dupe #5 and put it there, but then I have two versions of feature #5 (and #1 for the wrap the other way) that have to be maintained. (Note these will be more than just a blank square obviously, they will each be movie clips that do things).

Possibly that is the correct way? Or am I going about this the wrong way. Would it make more sense to dynamically create, scroll and remove the clips on each button click? (I’m not sure how I would do that exactly)

Any suggestions would be much appreciated. I suppose I could also add the buttons via actionscript too, instead of placing them in a layer and them zipping them to the top, although I’m not sure it matters much.

Here is my code:


import fl.transitions.Tween;
import fl.transitions.easing.*;

stop();
stage.frameRate = 31;

var gallery:MovieClip = new Gallery();

gallery.x = 240;
gallery.y = 0;
addChild(gallery);

setChildIndex(btn_next,numChildren - 1);
setChildIndex(btn_previous,numChildren - 1);

btn_next.addEventListener(MouseEvent.CLICK, nextFeature);
btn_previous.addEventListener(MouseEvent.CLICK, prevFeature);

function nextFeature(event:MouseEvent) {
    var startValue:Number = gallery.x;
    var finishValue:Number = startValue - 520;
    var duration:Number = 1;
    
    if (finishValue < -1840) {
        trace('get 1st');
        startValue = -280;
        finishValue = 240;
    }
    
    var galleryXTween:Tween = new Tween(gallery, "x", Strong.easeOut, startValue, finishValue, duration, true);
    
}

function prevFeature(event:MouseEvent) {
    var startValue:Number = gallery.x;
    var finishValue:Number = startValue + 520;
    var duration:Number = 1;
    
    var galleryXTween:Tween = new Tween(gallery, "x", Strong.easeOut, startValue, finishValue, duration, true);
    
}