how to loop and autoplay gallery with actionscript 3

Question

I am trying to make a simple accordion gallery with flash AS3.

So far I managed to make the gallery photos move from one direction to the other on mouse over. I also want the gallery to play by itself in an endless loop while not in mouse over position but I just can't crack the logic and how to do it. you help would be much appreciated!

this is the AS3 code I have so far:

image1.addEventListener(MouseEvent.MOUSE_OVER, moove1);
function moove1(event:MouseEvent):void
{
Mouse.cursor="hand";
new Tween(image2,"x",Regular.easeInOut,image2.x,750,1,true);
new Tween(image3,"x",Regular.easeInOut,image3.x,795,1,true);
new Tween(image4,"x",Regular.easeInOut,image4.x,840,1,true);
new Tween(image5,"x",Regular.easeInOut,image5.x,885,1,true);
}

image2.addEventListener(MouseEvent.MOUSE_OVER, moove2);
function moove2(event:MouseEvent):void
{
Mouse.cursor="hand";
new Tween(image2,"x",Regular.easeInOut,image2.x,45,1,true)
new Tween(image3,"x",Regular.easeInOut,image3.x,795,1,true)
new Tween(image4,"x",Regular.easeInOut,image4.x,840,1,true)
new Tween(image5,"x",Regular.easeInOut,image5.x,885,1,true)
}

image3.addEventListener(MouseEvent.MOUSE_OVER, moove3);
function moove3(event:MouseEvent):void
{
Mouse.cursor="hand";
new Tween(image2,"x",Regular.easeInOut,image2.x,45,1,true)
new Tween(image3,"x",Regular.easeInOut,image3.x,90,1,true)
new Tween(image4,"x",Regular.easeInOut,image4.x,840,1,true)
new Tween(image5,"x",Regular.easeInOut,image5.x,885,1,true)
}

image4.addEventListener(MouseEvent.MOUSE_OVER, moove4);
function moove4(event:MouseEvent):void
{
Mouse.cursor="hand";
new Tween(image2,"x",Regular.easeInOut,image2.x,45,1,true)
new Tween(image3,"x",Regular.easeInOut,image3.x,90,1,true)
new Tween(image4,"x",Regular.easeInOut,image4.x,135,1,true)
new Tween(image5,"x",Regular.easeInOut,image5.x,885,1,true)
}

image5.addEventListener(MouseEvent.MOUSE_OVER, moove5);
function moove5(event:MouseEvent):void
{
Mouse.cursor="hand";
new Tween(image2,"x",Regular.easeInOut,image2.x,45,1,true)
new Tween(image3,"x",Regular.easeInOut,image3.x,90,1,true)
new Tween(image4,"x",Regular.easeInOut,image4.x,135,1,true)
new Tween(image5,"x",Regular.easeInOut,image5.x,180,1,true)
}

How do I make the gallery auto play in loop?

Answer 1

// Create an array to store a reference to the image, and their change of positions.
var images:Array = [
    [image1, 750, 795, 840, 885],
    [image2, 45, 795, 840, 885],
    [image3, 45, 90, 840, 885],
    [image4, 45, 90, 135, 885],
    [image5, 45, 90, 135, 180]
];

// Register all the image with the listener
for each (var item:Array in images) {
    item[0].addEventListener(MouseEvent.MOUSE_OVER, imageEvent);
}

function imageEvent(e:MouseEvent):void {
    Mouse.cursor = "hand";
    for each (var item:Array in images) {
        if (e.currentTarget == item[0]) {
            cycle(item);
            break;
        }
    }
}

function timedUpdate(e:Event):void {
    current++; // Update the index;
    cycle(images[current%(images.length-1)]); // cycle inside the limits of the array
}

function cycle(item:Object):void {
    new Tween(image2, "x", Regular.easeInOut, image2.x, item[1], 1, true);
    new Tween(image3, "x", Regular.easeInOut, image3.x, item[2], 1, true);
    new Tween(image4, "x", Regular.easeInOut, image4.x, item[3], 1, true);
    new Tween(image5, "x", Regular.easeInOut, image5.x, item[4], 1, true);
}

var current:int = 0;
var cycleTimer:Timer = new Timer(1100, 0);
cycleTimer.addEventListener(TimerEvent.TIMER, timedUpdate);
cycleTimer.start();

Answer 2

Use a Timer.

var timer:Timer = new Timer( 5000, 0 ); // runs every 5 seconds, or 5000ms
timer.addEventListener( TimerEvent.TIMER, this.timerHandler );
timer.start();

function timerHandler( e:TimerEvent ):void {
    // run slideshow code here
}