images = [ '/images/home/jumpoffboat.jpg', '/images/home/pathway.jpg', '/images/home/picnic.jpg']
function log(msg){
	$('log').innerHTML += msg+'<br />';
}
function home_init(event) {
	images.push($('big-picture').getAttribute('src'))
	$('main').insert({top: '<img src="' + images.last() + '" id="big-picture-swap">'})
	setTimeout(load_new, 5000)

}
function load_new() {
	next = images.reverse().pop()
	images.reverse()
	x = new Image()
	x.onload = function() {
		bp = $('big-picture')
		bps = $('big-picture-swap')
		last = bp.getAttribute('src')
		images.push(last)
		bps.setOpacity(0)
		bps.setAttribute('src', this.src)
		new Effect.Morph(bps, {style:'opacity:1', afterFinish:function(effect){
			$('big-picture').setAttribute('src', $('big-picture-swap').getAttribute('src')) 
		}})
		setTimeout(load_new, 7000)
	}
	x.src = next
//	log(x.src)
}
document.observe('dom:loaded', home_init)