// Fading Image Sequence PHP JavaScript Generator
// For use with Mootools Javascript Library
// WrightWay Design - www.wrightwaydesign.com.au

periodicalCycle = new Class({

    initialize: function(dateString){ this.startTimer(); },
    updateCount: function(){ nextImage(); },
    stopTimer: function(){ $clear(this.periodicalTimer); },
    startTimer: function(){
        this.periodicalTimer = this.updateCount.periodical(8000, this);
    }

});

function nextImage() {

	var oldImage = currentImage;
    if (currentImage == 'imgOne') { 
    	currentImage='imgTwo'; 
    } else { 
    	currentImage='imgOne'; 
    }

    $(oldImage).setStyle('zIndex','1');
    $(currentImage).setStyle('zIndex','2');
	
	this.fadeEffect = new Fx.Style($(currentImage), 'opacity', { duration: 1500 } );
     this.fadeEffect.addEvent('onComplete', function() {

        if (headerCount == (headerPhotos.length - 1)) { 
            headerCount = 0; } else { headerCount++; }

        $(oldImage).setStyle('opacity','0');
        $(oldImage).setStyle('background-image', 'url('+headerPhotos[headerCount].src+')');
     
     });   
     this.fadeEffect.start(0,1);
		
}

function startSequence() { imgTimer = new periodicalCycle; }

var headerPhotos;
var headerCount = 0;
var imgTimer;
var currentImage = 'imgOne';

window.addEvent('domready', function() {

	var count = 0;
    $('imgTwo').setStyle('opacity',0);
    $('imgTwo').setStyle('display','block');
	headerPhotos = new Asset.images(['/images/headers/armidale-private-education.jpg','/images/headers/armidale-university-education.jpg','/images/headers/armidale-cafes.jpg','/images/headers/armidale-shopping.jpg','/images/headers/armidale-national-parks.jpg','/images/headers/armidale-waterfalls.jpg','/images/headers/armidale-family.jpg','/images/headers/armidale-artistic-creativity.jpg','/images/headers/armidale-wilderness.jpg','/images/headers/armidale-heritage.jpg','/images/headers/armidale-arts-and-culture.jpg','/images/headers/armidale-children.jpg'], {  
		onProgress: function() {
        	if (count == 0) {
            	$('imgOne').setStyle('background-image', 'url('+this.getProperty('src')+')');
            } else if (count == 1) {
            	$('imgTwo').setStyle('background-image', 'url('+this.getProperty('src')+')');
            }
            count++;
        },
		onComplete: function() { startSequence(); }
	});
    
});