var maxHeight, maxWidth, currentWidth, currentHeight, resizeSpeed_w, resizeSpeed_h, intSize, zoom_level;
var wDone,hDone,fit = new Boolean();

var display_min = 1104;

function start_resize(w,h)
{
	zoom_level = 100;
	wDone = false;
	hDone = false;
	fit = false;
	resizeSpeed = 25;
	intSize = 10;
	resizeSpeed_w = resizeSpeed;
	resizeSpeed_h = resizeSpeed;
	// set resize factor according to pic-proportions

	if(h>w)
	{	factor = w/h;
		resizeSpeed_w = Math.round(resizeSpeed_w * factor);
	}
	if(w>h)
	{	factor = h/w;
		resizeSpeed_h = Math.round(resizeSpeed_h * factor);
	}

	currentWidth = 0;
	currentHeight = 0;
	w_reset = w;
	h_reset= h;
	maxWidth = w;
	maxHeight = h;
	if(maxWidth!=864)
	{	// all pics that are not w=864 are resized to w=864

		proportion = maxHeight/maxWidth;
		maxWidth=864;
		maxHeight = Math.round(maxWidth * proportion);
	}
	resize_image();
}

function resize_image()
{	/**
		*	resize picture-frame on load (to maxSize)
	*/

	currentWidth+=resizeSpeed_w;
	currentHeight+=resizeSpeed_h;
	divNode = document.getElementById("content_pic");

	if(currentWidth<maxWidth)
		currentWidth = currentWidth;
	else
	{
		currentWidth = maxWidth;
		wDone = true;
	}

	if(currentHeight<maxHeight)
		currentHeight = currentHeight;
	else
	{	currentHeight = maxHeight;
		hDone = true;
	}

	try
	{	// MSIE / other
		divNode.style.setAttribute("width",currentWidth,false);
		divNode.style.setAttribute("height",currentHeight,false);
	}
	catch(e)
	{	// Firefox
		val = "width:"+currentWidth+"px;height:"+currentHeight+"px;";
		divNode.setAttribute("style",val,false);
	}

	// set new timeout if resize isn't done
	if(!wDone || !hDone)
		setTimeout("resize_image()",intSize);
	else
		update_zoom_level();
}

function pic_zoom(direction)
{	/**
		*	zoom in and out of picture
	*/
	
	if(maxWidth)
	{
		zoom_factor = 0.08;
		divNode = document.getElementById("content_pic");
		dragNode = document.getElementById("drag_layer");
		picNode = divNode.getElementsByTagName("img")[0];
		try
		
		{
			// get values for zoom level = 100
			w_100 = Number(divNode.style.getAttribute("width").split("px")[0]);
			h_100 = Number(divNode.style.getAttribute("height").split("px")[0]);
			// get values for current zoom level
			w_current = Number(picNode.style.getAttribute("width").split("px")[0]);
			h_current = Number(picNode.style.getAttribute("height").split("px")[0]);
		}
		catch(e)
		{	// Firefox
			// get values for zoom level = 100
			if(divNode.attributes[1].name=="STYLE" || divNode.attributes[1].name=="style")
				styleNode = 1;
			else
				styleNode = 0;
			w_100 = Number(divNode.attributes[styleNode].value.split("px")[0].split(":")[1]);
			h_100 = Number(divNode.attributes[styleNode].value.split("px")[1].split(":")[1]);
			
			// get values for current zoom level
			if(picNode.attributes[2].name=="STYLE" || picNode.attributes[2].name=="style")
				styleNode = 2;
			else
				styleNode = 1;
			w_current = Number(picNode.attributes[styleNode].value.split("px")[0].split(":")[1]);
			h_current = Number(picNode.attributes[styleNode].value.split("px")[1].split(":")[1]);
		}

		switch(direction)
		{
			case "in" :
			try
			{	picNode.style.setAttribute("width",w_current + Math.round(w_100*zoom_factor),false);
				picNode.style.setAttribute("height",h_current + Math.round(h_100*zoom_factor),false);
			}
			catch(e)
			{	val = "width:"+(w_current + Math.round(w_100*zoom_factor))+"px;height:"+(h_current + Math.round(h_100*zoom_factor))+"px;";
				picNode.setAttribute("style",val,false);
			}
			break;

			case "out" :
			if( (w_current - Math.round(w_100*zoom_factor)) > 0 && (h_current - Math.round(h_100*zoom_factor)) > 0)
			{
				try
				{	picNode.style.setAttribute("width",w_current - Math.round(w_100*zoom_factor),false);
					picNode.style.setAttribute("height",h_current - Math.round(h_100*zoom_factor),false);
				}
				catch(e)
				{	val = "width:"+(w_current - Math.round(w_100*zoom_factor))+"px;height:"+(h_current - Math.round(h_100*zoom_factor))+"px;";
					picNode.setAttribute("style",val,false);
				}
			}
			break;

			case "fit" :
			try
			{
				dragNode.style.top = 0;
				dragNode.style.left = 0;
				picNode.style.setAttribute("width",maxWidth,false);
				picNode.style.setAttribute("height",maxHeight,false);
			}
			catch(e)
			{	dragNode.setAttribute("style","top:0px;left0px;",false);
				val = "width:"+maxWidth+"px;height:"+maxHeight+"px;";
				picNode.setAttribute("style",val,false);
			}
			break;

			case "reset" :
			try
			{
				dragNode.style.top = 0;
				dragNode.style.left = 0;
				picNode.style.setAttribute("width",w_reset,false);
				picNode.style.setAttribute("height",h_reset,false);
			}
			catch(e)
			{	dragNode.setAttribute("style","top:0px;left0px;",false);
				val = "width:"+w_reset+"px;height:"+h_reset+"px;";
				picNode.setAttribute("style",val,false);
			}
			break;

			default : break;
		}
		update_zoom_level();
	}
}

function get_pic_info(type)
{
	picParent = document.getElementById("content_pic");
	picSelf = picParent.getElementsByTagName("img")[0];
	if(type=="pic_w")
	{
		try
		{	data = Number(picSelf.style.getAttribute("width").split("px")[0]);	}
		catch(e)
		{
			if(picSelf.attributes[2].name=="STYLE" || picSelf.attributes[2].name=="style")
				styleNode = 2;
			else
				styleNode = 1;
			data = Number(picSelf.attributes[styleNode].value.split("px")[0].split(":")[1]);
		}
	}
	if(type=="pic_h")
	{
		try
		{	data = Number(picSelf.style.getAttribute("height").split("px")[0]);	}
		catch(e)
		{
			if(picSelf.attributes[2].name=="STYLE" || picSelf.attributes[2].name=="style")
				styleNode = 2;
			else
				styleNode = 1;
			data = Number(picSelf.attributes[styleNode].value.split("px")[1].split(":")[1]);
		}
	}
	return data;

}

function update_zoom_level()
{
	zoom_value = get_pic_info("pic_w");
	zoom_level = Math.round((zoom_value/w_reset)*100);
	document.getElementById("z_level_display").innerHTML = "zoom @ "+zoom_level+" %";
}

//**************************************
// DRAG OBJECTS
var current_x, current_y;
var dragID = "drag_layer";
var obj;
// check if document.all
var N = (document.all) ? 0 : 1;

function initMouseEvents()
{
	// attach mouse-event-functions
	if(N)
	{
		document.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP | Event.MOUSEMOVE );
	}
	document.onmousedown = MD;
	document.onmouseup = MU;
	document.onmousemove = MM;
	document.onscroll = SCR;

	// needed for MSIE
	document.onmousewheel = SCR;
	document.body.onscroll = SCR;
}


// EVENT-FUNCTIONS

// mouseDOWN
function MD(local_event)
{

	if(N)
	{
		if(document.getElementsByName(local_event.target.name)[0])
		{
			if(document.getElementsByName(local_event.target.name)[0].parentNode.id == dragID )
			{
				obj = document.getElementById( dragID );
				start_x = local_event.pageX;
				start_y = local_event.pageY;
				if(window.getComputedStyle)
				{
					current_x = Number(window.getComputedStyle(obj,null).getPropertyValue("left").split("px")[0]);
					current_y = Number(window.getComputedStyle(obj,null).getPropertyValue("top").split("px")[0]);
				}
				else
				{	// BACKUP (older browsers - without document.all)
					current_x = Number(obj.attributes[0].value.split("px")[0].split(":")[1]);
					current_y = Number(obj.attributes[0].value.split("px")[1].split(":")[1]);
				}
			}
		}
		return false;
	}

	else
	{
		if(event.srcElement.parentElement.id== dragID )
		{

			obj = event.srcElement.parentElement.style;
			
			// grab-offset
			start_x = event.offsetX;
			start_y = event.offsetY;
			
			// drag-object current offset
			if(event.srcElement.parentElement.currentStyle)
			{
				current_x = event.srcElement.parentElement.currentStyle.left;
				current_y = event.srcElement.parentElement.currentStyle.top;
			}
			else
			{	// BACKUP (older browsers - with document.all)
				current_x = Number(event.srcElement.parentElement.attributes[1].value.split("px")[0].split(":")[1]);
				current_y = Number(event.srcElement.parentElement.attributes[1].value.split("px")[1].split(":")[1]);
			}
		}
	}
}

// mouseUP
function MU(local_event)
{
	obj = null;
}

// mouseMOVE
function MM(local_event)
{
	if(obj)
	{
		if(N)
		{
			val = "left:"+( current_x+(local_event.pageX-start_x) )+"px;top:"+(current_y +(local_event.pageY-start_y))+"px;";
			obj.setAttribute("style",val,false);
		}
		else
		{
			// if resolution changes - left position has to be adjusted
			// this is done by measuring the left-margin
			tmp_margin = 0;
			if(document.body.clientWidth > display_min)
				tmp_margin = Math.round( (document.body.clientWidth-display_min)/2)
				
			obj.left = (event.clientX-start_x)-tmp_margin;
			obj.top = (event.clientY-start_y)-78; // -78 = value from page top (px)
			return false;
		}
	}
}


// mouseover (uebersicht)

//function showPreview(pic_title,pic_url,w,h)
function showPreview(pNum,tOffset,thumbSize)
{	/**
		*	datasource (imgData): generated array on index.php
	*/
	// DISPLAY MAX-VALUES
	dispW = 356;
	dispH = 412;
	//IMG-MAX-VALUES
	wMax = thumbSize;
	hMax = wMax;
	pic_title=imgData[pNum][3];
	pic_url=baseDIR+"bilder_preview/"+imgData[pNum][0];
	w=imgData[pNum][1];
	h=imgData[pNum][2];
	
	displayNode = document.getElementById("preview_display");
	titleNode = document.getElementById("preview_title");
	titleNode.innerHTML = "<h2>&raquo;"+pic_title+"&laquo;</h2>";

	if(w>=h)
	{	rel = h/w;
		if(w==h)
		{	w=wMax; 
			h=hMax;
		}	
		else
		{	w = wMax;
			h = Math.round(rel*wMax);
		}
	}
	else
	{	rel = w/h;
		w = Math.round(rel*hMax);
		h = hMax;
	}
	displayHTML = "<div style=\"float:left;margin-top:"+Math.round((dispH-h)/2)+"px;margin-left:"+Math.round((dispW-w)/2)+"px;width:"+w+"px;\">";
	displayHTML += "<img src=\""+pic_url+"\" width=\""+w+"px\" height=\""+h+"px\" alt=\""+pic_title+"\" border=\"0\">";
	displayHTML +='</div>';
	displayNode.innerHTML = displayHTML;
}

// scrolling

var off_x = 78;

function SCR(local_event)
{
// 	shadowExist = (document.getElementById("zoom_shadow")) ? true : false;
// 	if(shadowExist)
// 		zoomShadowNode = document.getElementById("zoom_shadow");
	zoomPanelNode = document.getElementById("zoom_panel");
	if(local_event)
	{
		if(self.pageYOffset <1200)
		{
			zoomPanelNode.setAttribute("style","top:"+(off_x+self.pageYOffset)+"px;left:884px;","false");
		}
	}
	else
	{
		if(document.body.scrollTop <1200)
		{
			zoomPanelNode.style.setAttribute("top",(off_x+document.body.scrollTop)+"px","false");
			zoomPanelNode.style.setAttribute("left","884px","false");
		}
	}
}

//+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

function changeAttribute(eID,aList,vList)
{	/**
		*	change attributes from array (aList) @ element (eID) to values from (vList)
	*/
	aNode = document.getElementById(eID);
	
	try
	{	tmp = "";
		for(t=0;t<aList.length;t++)
		{	tmp += aList[t]+":"+vList[t]+"px;";
		}
		aNode.setAttribute("style",tmp,"false");
		try
		{	for(t=0;t<aList.length;t++)
				aNode.style.setAttribute(aList[t],vList[t]+"px","false");
		}
		catch(e){}
	}
	catch(e)
	{	dummy = 0;	}
	return true;
}



