var images = new Array(
["../bilder/k712a0201.jpg", "Das erste Bild", "Das erste Bild"],
["../bilder/k712a1302.jpg", "Unheimliche Stimmung", "Unheimliche Stimmung"],
["../bilder/k712a1801.jpg", "Neue Zuggattung", "Neue Zuggattung"],
["../bilder/k712a2001.jpg", "Eingleisiger Verkehr", "Eingleisiger Verkehr"],
["../bilder/k0mbz017.jpg", "Grauweiß dominiert", "Grauweiß dominiert"]
 );

var speed = 16;
var interval = 8000;
var index = oldIndex = 0;

function start() {
	createBackgroundContainer(document.getElementById('image'));
	setTimeout('startFading()', 2000);
}

function createBackgroundContainer(element) {
	var image = document.createElement('img');
	image.setAttribute('id', 'image');
	image.setAttribute('src', element.src);
	image.setAttribute('alt', element.alt);
	image.style.width = element.width + 'px';
	image.style.height = element.height + 'px';
	image.style.margin = '0';
	
	var backgroundContainer = document.createElement('span');
	backgroundContainer.setAttribute('id', 'backgroundContainer');
	backgroundContainer.style.display = 'block';
	backgroundContainer.style.margin = '0em auto 0 auto';
	backgroundContainer.style.padding = '0';
	backgroundContainer.style.width = element.width + 'px';
	backgroundContainer.style.height = element.height + 'px';
	backgroundContainer.appendChild(image);
	
	var parent = element.parentNode;
	parent.replaceChild(backgroundContainer, element);
}

function startFading() {
	var image = document.getElementById('image');
	index = Math.round(Math.random() * (images.length - 1));
	while (oldIndex == index) {
		index = Math.round(Math.random() * (images.length - 1));
	}
	oldIndex = index;

	var backgroundContainer = document.getElementById('backgroundContainer');
	backgroundContainer.style.backgroundImage = "url('" + document.getElementById('image').src + "')";
	
	image.style.opacity = 0;
	image.setAttribute('src', images[index][0]);
	image.setAttribute('alt', images[index][1]);
	image.setAttribute('title', images[index][2]);
	
	for (var i = 0; i < 100; i++) {
		setTimeout('fadeIn(' + i + ')', speed*i);
	}
	setTimeout("startFading()", interval);
}

function fadeIn(i) {
	document.getElementById('image').style.opacity = i/100;
}

