//prepare some images
var speed = 10;

var i = 1;
var topPos = 84;
var amtPics = 7; // pictures to be displayed (amt - 2 = amt of pictures visible at once)
var picSize = 13; //percent
var space = ( 100 - (amtPics - 2) * picSize ) / (amtPics - 2); // in percent also

for ( i = 0; i < amtPics; i ++) {
	document.write("<a href='asdf' id='link"+i+"' target='_blank'><img src='blank.jpg' name='img"+i+"' id='img"+i+"' height='"+picSize+"%' style='position:absolute;left:0%;top:400;z-index:1;' onMouseOver='javascript:hover="+i+"' onMouseOut='javascript:hover=-1' border=0></a>");
}

//here are the images:
var imgs = new Array();

imgs[0] = './bilder/herbst/DSC_0002.jpg';
imgs[1] = './bilder/herbst/DSC_0003.jpg';
imgs[2] = './bilder/herbst/DSC_0004.jpg';
imgs[3] = './bilder/herbst/DSC_0005.jpg';
imgs[4] = './bilder/herbst/DSC_0014.jpg';
imgs[5] = './bilder/herbst/DSC_0016.jpg';
imgs[6] = './bilder/herbst/DSC_0018.jpg';
imgs[7] = './bilder/herbst/DSC_0033.jpg';
var amtPicListing = 8; // amt of pictures there are

var counter = 0; //pic counter
var pos = 0; // position of the pictures

var hover = -1; // stops sliding whem >= 0; tells the script which picture is being hovered
var lastHoveredPic; // necessary global for display();
var resizePicture = 0; //
var move = 1; // added to pos to move the pictures

setInterval("display()", 30);



function display() {
	var pixelToPercent = 100 / document.body.clientWidth;
	var imgSize;

	if (hover >= 0 ) lastHoveredPic = hover;

	for ( i = 0; i < amtPics; i ++ ) {
		if (pos == 0) {
			document.getElementById("img" + i).src = "thumbShade.php?bild=" + imgs[Math.round(((counter + i) / amtPicListing - Math.floor((counter + i) / amtPicListing))*amtPicListing)];
			document.getElementById("link" + i).href = imgs[Math.round(((counter + i) / amtPicListing - Math.floor((counter + i) / amtPicListing))*amtPicListing)];
		}

		imgSize = picSize / pixelToPercent;
		if (lastHoveredPic == i && move < 1) {
			imgSize += (1 - move ) * space / pixelToPercent;
			document.getElementById("img" + i).style.zIndex = 2;
		} else {
			document.getElementById("img" + i).style.zIndex = 1;
		}

		document.getElementById("img" + i).height = imgSize;
		document.getElementById("img" + i).style.top = topPos - document.getElementById("img" + i).height / 2;
		document.getElementById("img" + i).style.left = i * ( picSize + space ) / pixelToPercent - pos - document.getElementById("img" + i).width / 2;
	}

	pos += move * document.body.clientWidth / (10000 / speed);

	if (pos * pixelToPercent > picSize + space) {
		pos = 0;
		counter ++;
		if (counter == amtPicListing) counter = 0;
		if (move != 1) { hover --; lastHoveredPic --; }
	}

	if (hover >= 0) {
		move /= 1.2;
		if (move < .005) move = 0;
	} else {
		if (move < 1) {
			move += .05;
		} else {
			move = 1;
		}
		if (move < .05) move = 0.05;
	}
}