// on remplace la photo de taille normale par une bcp trop grande (donc si pas de javascript on a droit à la photo normale) 
// et on les décale pour donner l'illusion d'une grande photo
function swapImages() {
	var toScroll = $$('img.photo');
	toScroll.each(function(img) {
		img.setAttribute('src', './img/home-big.jpg');
	});
	$('photo1').setStyle('marginLeft', 0);
	$('photo2').setStyle('marginLeft', -310);
	$('photo3').setStyle('marginLeft', -620);
}

// effet photo qui bouge à travers le cadre
function moveImages() {
	var toScroll = $$('img.photo');
	toScroll.each(function(img) {
		var fade = new Fx.Styles(img, {duration: 4000});
		fade.start({
			'marginLeft': img.getStyle('marginLeft').toInt()-400,
			'marginTop': -400
		}).chain(function() {
			fade.start({
				'marginLeft': img.getStyle('marginLeft').toInt()+400
			});
		}).chain(function() {
			fade.start({
				'marginLeft': img.getStyle('marginLeft').toInt()-400,
				'marginTop': 0
			});
		}).chain(function() {
			fade.start({
				'marginTop': -400
			});
		}).chain(function() {
			fade.start({
				'marginLeft': img.getStyle('marginLeft').toInt()+400
			});
		}).chain(function() {
			fade.start({
				'marginTop': -250
			});
		});
	});
}

window.addEvent('domready', swapImages); // dès que le DOM est prêt on essaye tout de suite de remplacer la petite image par la grande
window.addEvent('load', function() { // lorsque la grande est chargée, on lance l'animation
	var startMoving = function() {
		var periodical;
		moveImages();
		// periodical = moveImages.periodical(25000);
	}
	setTimeout(startMoving, 1000); // mais pour être sûr on attend encore 1s avant de la lancer
});