/*edit to change default values*/
dms_scroll.prototype.upButton="img/btn-up_inv.gif"; 
dms_scroll.prototype.downButton="img/btn-dn_inv.gif";
dms_scroll.prototype.buttonWidth=11; //breite der scrollschaltflaechen
dms_scroll.prototype.buttonHeight=11; //hoehe der scrollschaltflaechen
dms_scroll.prototype.trackerBorder=0; //rahmendicke des trackers
dms_scroll.prototype.speed=10; //einfache scrollgeschwindigkeit (pixel pro millisekunde)

dms_scroll.prototype.autoHideScrollbar=true; //scrollbar entfernen wenn nicht benoetigt

dms_scroll.prototype.ieMargin=0; //body margin (für die groessenermittlung im IE) 

/*
** dms_scroll_script
** Version 0.9.4
**
** Verbreitung des Scripts erwünscht
** 
** Homepage: http://www.electronic-culture.de
** E-Mail: dms@electronic-culture.de
**
** ChangeLog:
**   v0.9.1 (15.02.2008)
**   - first beta
**
**   v0.9.2 (20.02.2009)
**   - Drag-Verhalten modifiziert
**	
**	 v0.9.3 (01.05.2010)
**	 - add function to scale scrollbox with screen
**
**   V0.9.4 (20.10.2010)
**   - add automatic resize when all images where loaded
**
*/

/*
** Known Bugs:
**  - uebergrosse Seite scrollt im Safari unter OSX minimal mit
*/

/*
** ToDo:
**  - Destruktor schaffen ???
*/


/* Do not edit below */

dms_scroll.instances=Array();

dms_scroll.prototype.mouseY=-1; 
dms_scroll.prototype.trackY=0;
dms_scroll.prototype.timer;
dms_scroll.prototype.contentWidth;
dms_scroll.prototype.contentHeight;
dms_scroll.prototype.name;
dms_scroll.prototype.trackHeight;

dms_scroll.prototype.width;
dms_scroll.prototype.heigth;

dms_scroll.prototype.real_width;
dms_scroll.prototype.real_heigth;

dms_scroll.prototype.scroll_area;
dms_scroll.prototype.content;
dms_scroll.prototype.container;
dms_scroll.prototype.cropbox;
dms_scroll.prototype.scrollbar_c;
dms_scroll.prototype.scrollbar_up;
dms_scroll.prototype.scrollbar_down;
dms_scroll.prototype.scrollbar_track;

dms_scroll.prototype.imgLoaded;

function dms_scroll(containerId, name, width, height){/*Kontruktor (Breite inkl. Tracker)*/
	this.scroll_area=document.getElementById(containerId);
	this.width=width; this.height=height;
	this.name=name;
	this.content=document.createElement('div');
	this.container = document.createElement('div');
	this.cropbox=document.createElement('div');
	this.scrollbar_c=document.createElement('div');
	this.scrollbar_up=document.createElement('div');
	this.scrollbar_down=document.createElement('div');
	this.scrollbar_track=document.createElement('div');
}

dms_scroll.prototype.getScreenWidth=function(){
  if (window.innerWidth) return window.innerWidth;
  if (document.body.clientWidth) return document.body.clientWidth+this.ieMargin;
  if (document.documentElement.clientWidth) return document.documentElement.clientWidth+this.ieMargin;
  return 790; //fallback if size detection fails
}

dms_scroll.prototype.getScreenHeight=function(){
  if (window.innerHeight) return window.innerHeight;
  if (document.body.clientHeight) return document.body.clientHeight+this.ieMargin;
  if (document.documentElement.clientHeight) return document.documentElement.clientHeight+this.ieMargin;
  return 500; //fallback if size detection fails
}

dms_scroll.prototype.setButtons=function(upButton, downButton, buttonWidth, buttonHeight){this.upButton=upButton; this.downButton=downButton; this.buttonWidth=buttonWidth; this.buttonHeight=buttonHeight;}
dms_scroll.prototype.setTrackerBorder=function(border){this.trackerBorder=border;}
dms_scroll.prototype.setSpeed=function(speed){this.speed=speed;}
dms_scroll.prototype.setAutohideScrollbar=function(autohide){this.autoHideScrollbar=autohide;}

dms_scroll.prototype.setScroll=function(){
	var contentHeight=this.content.offsetHeight; //hoehe des contents
	var minOffset=0-contentHeight+this.container.offsetHeight; //"maximale" scrollposition

	var trackAreaHeight=this.container.offsetHeight-2*this.buttonHeight; //hoehe der des trackerbereichs
	var trackerHeight=this.scrollbar_track.offsetHeight; //höhe des trackers

	var minTracker=this.buttonHeight;
	var deltaTracker=trackAreaHeight-trackerHeight;//-minTracker;
	if (deltaTracker==0) return;
	var trackerPos=this.scrollbar_track.offsetTop-minTracker;

	var newTop=(minOffset)*(trackerPos/deltaTracker);
	this.content.style.top=newTop+"px";
}

dms_scroll.prototype.mouseMove=function(event){
	if (!event) event=window.event;
	if (this.mouseY!=-1){
		var delta=event.clientY-this.mouseY;

		var trackAreaHeight=this.container.offsetHeight-2*this.buttonHeight; //hoehe der des trackerbereichs
		var trackerHeight=this.scrollbar_track.offsetHeight; //höhe des trackers

		var newTop=trackY+delta;
		var minTop=this.buttonHeight;
		if (newTop<minTop) newTop=minTop;
		if (newTop>minTop+trackAreaHeight-trackerHeight) newTop=minTop+trackAreaHeight-trackerHeight;
		this.scrollbar_track.style.top=newTop+"px";
		this.setScroll();
		//event.stopPropagation();
		return false;
	}
}

dms_scroll.prototype.startDrag=function(event){
	if (!event) event=window.event;
	this.mouseY=event.clientY;
	trackY=this.scrollbar_track.offsetTop;
	//event.stopPropagation();
	return false;
}

dms_scroll.prototype.stopDrag=function(event){this.mouseY=-1; return false;}

dms_scroll.prototype.setTracker=function(){
	var height=this.container.offsetHeight; //hoehe des anzeigebereichs
	var scrollposition=this.content.offsetTop; //scrollposition des contents
	var minOffset=0-this.contentHeight+this.container.offsetHeight; //"maximale" scrollposition

	var trackAreaHeight=height-2*this.buttonHeight; //hoehe der des trackerbereichs
	var trackerHeight=this.scrollbar_track.offsetHeight; //höhe des trackers

	var trackTop=(trackAreaHeight-trackerHeight)*(scrollposition/minOffset); //relative position der oberkante des trackers
	this.scrollbar_track.style.top=(trackTop+this.buttonHeight)+"px";
}

dms_scroll.prototype.scrollY=function(direction){
	var newval=this.content.offsetTop+(direction*this.speed);
	var minval=0-this.content.offsetHeight+this.container.offsetHeight;
	if (newval<minval) newval=minval;
	if (newval>0) newval=0;
	this.content.style.top=newval+"px";
	this.setTracker();
}

dms_scroll.prototype.startScroll=function(direction){this.timer=setInterval(this.name+".scrollY("+direction+")",100);}
dms_scroll.prototype.stopScroll=function(){window.clearInterval(this.timer);}
dms_scroll.prototype.setDoubleSpeed=function(){this.speed*=2;}
dms_scroll.prototype.resetSpeed=function(){this.speed/=2;}

dms_scroll.stopAllDrag=function(event){
	for (i=0;i<dms_scroll.instances.length;i++){
		var instance=dms_scroll.instances[i];
		if (instance.mouseY!=-1) instance.stopDrag();
	}
	//event.stopPropagation();
	return false;
}

dms_scroll.mouseMoveAll=function(event){
	for (i=0;i<dms_scroll.instances.length;i++){
		var instance=dms_scroll.instances[i];
		if (instance.mouseY!=-1) instance.mouseMove(event);
	}
	//event.stopPropagation();
	return false;
}

dms_scroll.prototype.mousewheel=function(event){ // Mausrad-Handler
	if (!event) event=window.event;
	var delta=0;
	if (event.wheelDelta){delta=event.wheelDelta/120; if (window.opera) delta*=-1;}
	if (event.detail){delta=-event.detail/3;}
	this.scrollY(delta*2);
}

dms_scroll.prototype.doresize=function(event){ // Window-Resize-Function
	this.real_width=((this.width>0)?this.width:this.getScreenWidth()+this.width);
	this.real_height=((this.height>0)?this.height:this.getScreenHeight()+this.height);

	this.contentWidth=this.real_width-this.buttonWidth;
	
	this.scroll_area.style.width=(this.real_width)+"px";
	this.scroll_area.style.height=(this.real_height)+"px";

	this.content.style.width=(this.contentWidth)+"px";

	this.container.style.width=this.contentWidth+"px"; this.container.style.height=this.real_height+"px"

	this.cropbox.style.width=this.contentWidth+"px"; this.cropbox.style.height=this.real_height+"px";
	this.cropbox.style.clip="rect(0px, "+this.contentWidth+"px, "+this.real_height+"px, 0px)";

	//this.contentHeight=this.content.offsetHeight;

	this.scrollbar_c.style.height=this.real_height+"px"; this.scrollbar_c.style.width=(this.buttonWidth)+"px";
	
	this.trackHeight=this.real_height-2*this.buttonHeight;

	this.scrollbar_track.style.width=(this.buttonWidth-this.trackerBorder*2)+"px";
	
	if (this.contentHeight>this.real_height) this.scrollbar_track.style.height=(this.real_height/this.contentHeight*this.trackHeight-this.trackerBorder*2)+"px";
	else this.scrollbar_track.style.height=(this.trackHeight-this.trackerBorder*2)+"px";
		
	//this.scrollbar_track.onmousemove=function(event){if (document.addEventListener) event.preventDefault(); scroll.mouseMove(event); return false;};
	
	this.resize();
	

}

dms_scroll.windowresized=function(event){ // Window-Resize-Handler
	for (i=0;i<dms_scroll.instances.length;i++){
		var instance=dms_scroll.instances[i];
		//if (instance.mouseY!=-1) instance.mouseMove(event);
		if (instance.width<0 || instance.height<0) instance.doresize();
	}
	//event.stopPropagation();
	return false;
}


dms_scroll.prototype.init=function(){ //Scrollbox erzeugen
	var scroll=this;
	dms_scroll.instances.push(scroll);
	
	this.real_width=((this.width>0)?this.width:this.getScreenWidth()+this.width);
	this.real_height=((this.height>0)?this.height:this.getScreenHeight()+this.height);

	this.contentWidth=this.real_width-this.buttonWidth;
	
	this.scroll_area.className="scroll_area";
	this.scroll_area.style.width=(this.real_width)+"px";
	this.scroll_area.style.height=(this.real_height)+"px";

	this.content.className="scroll_content";
	this.content.style.width=(this.contentWidth)+"px";

	if (this.content.addEventListener) this.content.addEventListener('DOMMouseScroll',function(event){event.preventDefault(); scroll.mousewheel(event);},false);
	this.content.onmousewheel=function(event){scroll.mousewheel(event); return false;}

	this.container.style.width=this.contentWidth+"px"; this.container.style.height=this.real_height+"px"
	this.container.className="scroll_container"; this.container.id="scroll_container_"+this.name;

	this.cropbox.className="scroll_cropbox"; this.cropbox.id="scroll_cropbox_"+this.name;
	this.cropbox.style.width=this.contentWidth+"px"; this.cropbox.style.height=this.real_height+"px";
	this.cropbox.style.clip="rect(0px, "+this.contentWidth+"px, "+this.real_height+"px, 0px)";

	this.cropbox.appendChild(this.content);
	this.container.appendChild(this.cropbox);
	this.scroll_area.appendChild(this.container);
	
	this.contentHeight=this.content.offsetHeight;

	this.scrollbar_c.className="scrollbar_container"; this.scrollbar_c.id="scrollbar_container_"+this.name;
	this.scrollbar_c.style.height=this.real_height+"px"; this.scrollbar_c.style.width=(this.buttonWidth)+"px";
	
	if (this.scrollbar_c.addEventListener) this.scrollbar_c.addEventListener('DOMMouseScroll',function(event){event.preventDefault(); scroll.mousewheel(event);},false);
	this.scrollbar_c.onmousewheel=function(event){scroll.mousewheel(event); return false;}

	this.scrollbar_up.className="scrollbar_up"; this.scrollbar_up.id="scrollbar_up_"+this.name;
	this.scrollbar_up.style.height=this.buttonHeight+"px"; this.scrollbar_up.style.width=this.buttonWidth+"px";
	this.scrollbar_up.innerHTML="<IMG src=\""+this.upButton+"\" alt=\"\" onMouseOver=\""+this.name+".startScroll(1)\" onMouseOut=\""+this.name+".stopScroll()\" onMouseDown=\""+this.name+".setDoubleSpeed();\" onMouseUp=\""+this.name+".resetSpeed();\">"

	this.scrollbar_down.className="scrollbar_down"; this.scrollbar_down.id="scrollbar_down_"+this.name;
	this.scrollbar_down.style.height=this.buttonHeight+"px"; this.scrollbar_down.style.width=this.buttonWidth+"px";
	this.scrollbar_down.innerHTML="<IMG src=\""+this.downButton+"\" alt=\"\" onMouseOver=\""+this.name+".startScroll(-1)\" onMouseOut=\""+this.name+".stopScroll()\" onMouseDown=\""+this.name+".setDoubleSpeed();\" onMouseUp=\""+this.name+".resetSpeed();\">"

	this.trackHeight=this.real_height-2*this.buttonHeight;

	this.scrollbar_track.className="scrollbar_tracker"; this.scrollbar_track.id="scrollbar_tracker_"+this.name;
	this.scrollbar_track.style.width=(this.buttonWidth-this.trackerBorder*2)+"px";
	this.scrollbar_track.style.borderWidth=this.trackerBorder+"px";
	if (this.trackerBorder==0) this.scrollbar_track.style.borderStyle="none"; else this.scrollbar_track.style.borderStyle="solid";
	if (this.contentHeight>this.real_height) this.scrollbar_track.style.height=(this.real_height/this.contentHeight*this.trackHeight-this.trackerBorder*2)+"px";
	else this.scrollbar_track.style.height=(this.trackHeight-this.trackerBorder*2)+"px";
	this.scrollbar_track.style.top=this.buttonHeight+"px";
	
	//this.scrollbar_track.onmousemove=function(event){if (document.addEventListener) event.preventDefault(); scroll.mouseMove(event); return false;};
	document.onmousemove=dms_scroll.mouseMoveAll;
	this.scrollbar_track.onmousedown=function(event){if (document.addEventListener) event.preventDefault(); scroll.startDrag(event);return false;};
	this.scrollbar_track.onmouseup=function(event){if (document.addEventListener) event.preventDefault(); scroll.stopDrag(event);return false;};
	document.onmouseup=dms_scroll.stopAllDrag;

	if (this.scrollbar_track.addEventListener) this.scrollbar_track.addEventListener('DOMMouseScroll',function(event){event.preventDefault(); scroll.mousewheel(event);},false);
	this.scrollbar_track.onmousewheel=function(event){scroll.mousewheel(event); return false;}
	
	if ((this.width>0)||(this.height<0)) window.onresize=dms_scroll.windowresized;
	
	this.scrollbar_c.appendChild(this.scrollbar_up);
	this.scrollbar_c.appendChild(this.scrollbar_track);
	this.scrollbar_c.appendChild(this.scrollbar_down);

	this.scroll_area.appendChild(this.scrollbar_c);

	this.resize();
}

dms_scroll.prototype.checkImages=function(num,count){
	if ( (num>this.imgLoaded) && (count<10) )  window.setTimeout(this.name+".checkImages("+num+","+(count+1)+")",250);
	else {this.resize(); }
}

dms_scroll.prototype.waitForImages=function(){
	this.imgLoaded=0;
	var scroll=this;
	var images=this.content.getElementsByTagName("img");
	//alert(images.length+" Bilder");
	for (var i=0; i<images.length;i++){
		images[i].onload=function(){scroll.imgLoaded++; }
	}
	window.setTimeout(this.name+".checkImages("+images.length+",0)",250);
}

dms_scroll.prototype.resize=function(){
	this.contentHeight=this.content.offsetHeight;
	if (this.contentHeight>this.real_height)this.scrollbar_track.style.height=(this.real_height/this.contentHeight*this.trackHeight-this.trackerBorder*2)+"px";
	else this.scrollbar_track.style.height=(this.trackHeight-this.trackerBorder*2)+"px";

	if ((this.contentHeight>this.real_height) || (this.autoHideScrollbar==false)){ //scrollbar sichtbar
		this.scrollbar_c.style.display="block";
		this.contentWidth=this.real_width-this.buttonWidth;
	}
	else{ //scrollbar unsichtbar
		this.scrollbar_c.style.display="none";
		this.contentWidth=this.real_width
	}
	this.container.style.width=this.contentWidth+"px";
	this.cropbox.style.width=this.contentWidth+"px"; this.cropbox.style.clip="rect(0px, "+this.contentWidth+"px, "+this.real_height+"px, 0px)";
	this.content.style.width=this.contentWidth+"px";

	this.scrollbar_track.style.top=this.buttonHeight+"px";
	this.content.style.top="0px";
	
}

dms_scroll.prototype.setContentAjax=function(url){ //Neuen Inhalt per Ajax aus URL laden
	var scroll=this;
	new Ajax.Request(url, {
		method: 'get',
		onSuccess: function(transport) {scroll.content.innerHTML=transport.responseText; scroll.waitForImages();},
		onFailure: function(transport) {alert("loding scroll content failed: "+url);}
	});
}

dms_scroll.prototype.initAjax=function(url){ // Scrollbox mit Inhalt aus URL erstellen
	var scroll=this;
	new Ajax.Request(url, {
		method: 'get',
		/*
		onCreate: function(){ Element.show('cntd_loading')},
		onComplete: function(){Element.hide('cntd_loading')},
		*/
		onSuccess: function(transport) {scroll.content.innerHTML=transport.responseText; scroll.init(); scroll.waitForImages();},
		onFailure: function(transport) {alert("loding scroll content failed: "+url);}
	});
}

dms_scroll.prototype.setContentHtml=function(html){this.content.innerHTML=html; this.waitForImages();} //Neuen Inhalt auf html setzen
dms_scroll.prototype.initHtml=function(html){this.content.innerHTML=html; this.init(); this.waitForImages();} //Scrollbox mit hmtml als Inhalt erstellen