var MyArray = new Array();
MyArray[0] = new Array();
MyArray[0][0] = "1.jpg";
MyArray[0][1] = "404px";
MyArray[0][2] = "555px";
MyArray[1] = new Array();
MyArray[1][0] = "2.jpg";
MyArray[1][1] = "385px";
MyArray[1][2] = "555px";
MyArray[2] = new Array();
MyArray[2][0] = "3.jpg";
MyArray[2][1] = "370px";
MyArray[2][2] = "555px";
MyArray[3] = new Array();
MyArray[3][0] = "4.jpg";
MyArray[3][1] = "384px";
MyArray[3][2] = "555px";
MyArray[4] = new Array();
MyArray[4][0] = "5.jpg";
MyArray[4][1] = "367px";
MyArray[4][2] = "555px";
MyArray[5] = new Array();
MyArray[5][0] = "6.jpg";
MyArray[5][1] = "370px";
MyArray[5][2] = "555px";
MyArray[6] = new Array();
MyArray[6][0] = "7.jpg";
MyArray[6][1] = "370px";
MyArray[6][2] = "555px";
MyArray[7] = new Array();
MyArray[7][0] = "8.jpg";
MyArray[7][1] = "397px";
MyArray[7][2] = "555px";
MyArray[8] = new Array();
MyArray[8][0] = "9.jpg";
MyArray[8][1] = "360px";
MyArray[8][2] = "555px";
MyArray[9] = new Array();
MyArray[9][0] = "10.jpg";
MyArray[9][1] = "369px";
MyArray[9][2] = "555px";
MyArray[10] = new Array();
MyArray[10][0] = "11.jpg";
MyArray[10][1] = "369px";
MyArray[10][2] = "555px";
MyArray[11] = new Array();
MyArray[11][0] = "12.jpg";
MyArray[11][1] = "370px";
MyArray[11][2] = "555px";

var preload_array = new Array();
for (var i = 0;i<MyArray.length;i++) {
	preload_array[i] = new Image();
	preload_array[i].src = "images/portfolio/" + MyArray[i][0];
}



function nextImg() {
	
	var act_img = document.getElementById("act_img").value;
	act_img++;
	
	if (MyArray[act_img] == undefined) {
		act_img = 0;
	}
	
		 
	var max_hoehe = 555;
	var margin_top = parseInt((parseInt(max_hoehe) - parseInt(MyArray[act_img][2])) / 2);
	document.getElementById("img").style.marginTop = margin_top+"px";
	document.getElementById("img").style.width= MyArray[act_img][1];
	document.getElementById("img").style.height=MyArray[act_img][2];
	
	if (preload_array[act_img]) {
		document.getElementById("img").style.backgroundImage='url('+ preload_array[act_img].src +')';
	} else {
		 document.getElementById("img").style.backgroundImage='url(images/portfolio/' + MyArray[act_img][0] + ')';
	}
	document.getElementById("act_img").value = act_img;
	//opacity('img',0,100,300);
}

function prevImg() {
	
	var act_img = document.getElementById("act_img").value;
	act_img--;
	if (MyArray[act_img] == undefined) {
		act_img = MyArray.length-1;
	}

	var max_hoehe = 555;
	var margin_top = parseInt((parseInt(max_hoehe) - parseInt(MyArray[act_img][2])) / 2);
	document.getElementById("img").style.marginTop = margin_top+"px";
	document.getElementById("img").style.width= MyArray[act_img][1];
	document.getElementById("img").style.height=MyArray[act_img][2];

        if (preload_array[act_img]) {
                document.getElementById("img").style.backgroundImage='url('+ preload_array[act_img].src +')';
        } else {
                 document.getElementById("img").style.backgroundImage='url(images/portfolio/' + MyArray[act_img][0] + ')';
        }

	document.getElementById("act_img").value = act_img;
}
function preload_img() {
	var preload_array = new Array();
	for (var i = 1;i<MyArray.length;i++) {
		var new_img = "<img src='images/portfolio/"+ MyArray[i][0] +"'><br>";	
		document.getElementById("preload").innerHTML = document.getElementById("preload").innerHTML + new_img;
	}
}

function changePfeil(MyPfeil) {
		 if (MyPfeil == 1) {
			if (document.getElementById("p_l").className == "img_pfeil") {
			   document.getElementById("p_l").className = "img_pfeil_hover";
			} else {
			  document.getElementById("p_l").className = "img_pfeil";
			}
		 }
		 else if (MyPfeil == 2) {
			if (document.getElementById("p_r").className == "img_pfeil") {
			   document.getElementById("p_r").className = "img_pfeil_hover";
			} else {
			  document.getElementById("p_r").className = "img_pfeil";
			}
		 }
}



// ########################################################################################
function opacity(id, opacStart, opacEnd, millisec) {
	//speed for each frame
	var speed = Math.round(millisec / 100);
	var timer = 0;

	//determine the direction for the blending, if start and end are the same nothing happens
	if(opacStart > opacEnd) {
		for(i = opacStart; i >= opacEnd; i--) {
			setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
			timer++;
		}
	} else if(opacStart < opacEnd) {
		for(i = opacStart; i <= opacEnd; i++)
			{
			setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
			timer++;
		}
	}
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
	var object = document.getElementById(id).style; 
	object.opacity = (opacity / 100);
	object.MozOpacity = (opacity / 100);
	object.KhtmlOpacity = (opacity / 100);
	object.filter = "alpha(opacity=" + opacity + ")";
}