var loadedImages = [];
	var timer = 0;
	var canvas;
	var crossfade;
	var transition_duration = 1500
	
	var path = 'images/headers/';
	var paths = [
		path + 'bridges.jpg',
		path + 'construction.jpg',
		path + 'geotechnical_and_environmental.jpg',
		path + 'highways_and_infrastructure.jpg',
		path + 'mechanical_and_electrical.jpg',
		path + 'oil_and_gas.jpg',
		path + 'ports_and_maritime.jpg',
		path + 'project_managers.jpg',
		path + 'quality_assurance_and_control.jpg',
		path + 'quantity_surveyors.jpg',
		path + 'rail.jpg',
		path + 'structural.jpg',
		path + 'surveying.jpg',
		path + 'traffic_and_transportation.jpg',
		path + 'water.jpg'		
	];

	window.addEvent('load', function(){
		canvas = $('crossfade_canvas');
		// Start preloading all images

		new Asset.images(paths,{
			
			onProgress: function(i) {
				if (!loadedImages.contains(this)) {	
					this.setStyles({
						'position': 'absolute',
						'z-index': 1000-i
					});
					// Insert the image in the loadedImages array ONLY if it's not already there
					loadedImages.include(this);
				}
			},
			
			onComplete: function(){
				canvas.innerHTML = "";
				crossfade = function() {
					// Reset all opacities to 100
					$$('#crossfade_canvas img').setStyles({'opacity':1});
					timer = 0;
					loadedImages.each(function(image, i) {
						image.inject(canvas);
						timer += transition_duration;
						fx = function() {
							if (i == loadedImages.length - 1) {
								loadedImages[0].effect('opacity',{duration:transition_duration}).start(0,1).chain(function(){
									crossfade();
								});
							} else {
								image.effect('opacity',{duration:transition_duration}).start(1,0);
							}
						}.delay(timer * 3);
					});
				}
				crossfade();
			}
			
		});

	});