var SlideShow = {};
SlideShow.imageArray = [];
SlideShow.currentIndex = -1;
SlideShow.start = function(){
    var  bodyElement = $(document.body);
    
    var thisImage = new Asset.image('/images/slideshow/splash.jpg', {
        id:'ss0',
        styles:{
            opacity:0
        },
        onload: function(){ SlideShow.registerLoadedImage('ss0') }});
    bodyElement.adopt(thisImage);
    thisImage = new Asset.image('/images/slideshow/boat.jpg', {
        id:'ss1',
        styles:{
            opacity:0
        },
        onload: function(){ SlideShow.registerLoadedImage('ss1') }});
    bodyElement.adopt(thisImage);
    thisImage = new Asset.image('/images/slideshow/fun.jpg', {
        id:'ss2', 
        styles:{
            opacity:0
        },
        onload: function(){ SlideShow.registerLoadedImage('ss2') }});
    bodyElement.adopt(thisImage);
    thisImage = new Asset.image('/images/slideshow/originalpool.jpg', {
        id:'ss3', 
        styles:{
            opacity:0
        },
        onload: function(){ SlideShow.registerLoadedImage('ss3') }});
    bodyElement.adopt(thisImage);
    thisImage = new Asset.image('/images/slideshow/sky.jpg', {
        id:'ss4', 
        styles:{
            opacity:0
        },
        onload: function(){ SlideShow.registerLoadedImage('ss4') }});
    bodyElement.adopt(thisImage);
    thisImage = new Asset.image('/images/slideshow/slide.jpg', {
        id:'ss5',
        styles:{
            opacity:0
        },
        onload: function(){ SlideShow.registerLoadedImage('ss5') }});
    bodyElement.adopt(thisImage);
    thisImage = new Asset.image('/images/slideshow/smile.jpg', {
        id:'ss6',
        styles:{
            opacity:0
        },
        onload: function(){ SlideShow.registerLoadedImage('ss6') }});
    bodyElement.adopt(thisImage);
    thisImage = new Asset.image('/images/slideshow/splash.jpg', {
        id:'ss7',
         styles:{
            opacity:0
        },
       onload: function(){ SlideShow.registerLoadedImage('ss7') }});
    bodyElement.adopt(thisImage);
    thisImage = new Asset.image('/images/slideshow/sunny.jpg', {
        id:'ss8',
        styles:{
            opacity:0
        },
		onload: function(){ SlideShow.registerLoadedImage('ss8') }});
    bodyElement.adopt(thisImage);
    thisImage = new Asset.image('/images/slideshow/newpool.jpg', {
        id:'ss9',
        styles:{
            opacity:0
        },
        onload: function(){ SlideShow.registerLoadedImage('ss9') }});
    bodyElement.adopt(thisImage);
    
    window.setTimeout('SlideShow.switchImage()', 3000);
}
SlideShow.registerLoadedImage = function( imageId ){
    var newImage = $(imageId);
    newImage.setStyle('opacity',0);
    newImage.position({
        relativeTo: $('slideshow'),
        position: 'upperLeft'
    }); 
    SlideShow.imageArray.include( newImage );
}
SlideShow.switchImage = function(){
    var newIndex = SlideShow.currentIndex+1;
    if( newIndex>9 ){
        newIndex = 0;
    }
    if( SlideShow.imageArray[newIndex] ){
        var newImage = SlideShow.imageArray[newIndex];
        if( SlideShow.currentIndex == -1 ){
            var newImage = SlideShow.imageArray[newIndex];
            newImage.setStyles({'z-index':99});
            var fadeEffect = new Fx.Morph(newImage,{duration: 'long', transition: Fx.Transitions.Sine.easeOut});        
            fadeEffect.start({
                'opacity': [0,1]
            });
        } else {
            var oldImage = SlideShow.imageArray[SlideShow.currentIndex];
            oldImage.setStyle('z-index',100);
            newImage.setStyles({'z-index':99,opacity:1});
            var fadeEffect = new Fx.Morph(oldImage,{duration: 'long', transition: Fx.Transitions.Sine.easeOut});        
            fadeEffect.start({
                'opacity': [1, 0]
            });
        }
        SlideShow.currentIndex = newIndex;    
    }
    window.setTimeout('SlideShow.switchImage()', 3000);
}
window.addEvent('load',SlideShow.start);