var nScroll={

	init:function(domEl, width, height, options){
	 this.options=Object.extend({
  		scrollSpeed:10,
  		scrollBgColor:'',                             
  		scrollBgImg:'dragBG.gif',              
  		spaceBetweenScrollAndContent:10,  		//Abstand zwischen ScrollBaleken und zu scrollender Content
  		scrollContentPaddingTop:0,
  		scrollContentPaddingBottom:1,
  		scrollUpBgColor:'',                            //Hintergrundfarbe für den Pfeil nach oben
  		scrollUpImg:'scrollUpBg.gif',              //Bild für den Pfeil nach oben
  		scrollDownBgColor:'',                          //Hintergrundfarbe für den Pfeil nach unten
  		scrollDownImg:'scrollDownBg.gif',          //Bild für den Pfeil nach unten
  		dragBgColor:'',                                       //Hintergrundfarbe für den Scrollbalken
  		dragTopImg:'dragTopBg.gif',                //Bild für oberes Ende des Scrollbalkens
  		dragCenterImg:'dragCenterBg.gif',          //Bild für mitte des Scrollbalkens
  		dragBottomImg:'dragBottomBg.gif',          //Bild für unteres Ende des Scrollbalkens
  		dragCtrlWidth:14,		//Breite des Scrollbalkens
		moreContentArrow:true
  	},options);
  	
  	this.basePath=nUtils.getScriptPath('nScroll.js');
		var contentHeight=parseInt(height);
		var contentWidth=parseInt(width);
		var newContent={};
		var scrollContent=$(domEl);
		var dragCtrlWidth=this.options.dragCtrlWidth;

		newContent.scrollContent=scrollContent;

		newContent.height=contentHeight;
		newContent.scrollHeight=contentHeight-this.options.scrollContentPaddingTop-this.options.scrollContentPaddingBottom;
		scrollContent.style.width=(contentWidth-dragCtrlWidth-nScroll.options.spaceBetweenScrollAndContent)+"px";
		scrollContent.style.overflow='visible';
		//scrollContent.style.height='auto';
		scrollContent.style.margin='0px';

		var div= new Element('div');
		div.setStyle({
		  width:contentWidth+"px",
		  height:contentHeight+"px",
		  overflow:'hidden'
    });
		
		//ID mappen ?
		
		if($(scrollContent).getStyle('position')=='absolute'){
			div.style.position='absolute';
		}else div.style.position='relative';

		if($(scrollContent).getStyle('left')) {
			div.style.left=$(scrollContent).getStyle('left');
			scrollContent.style.left='0px';
		}
		if($(scrollContent).getStyle('top')) {
			div.style.top=$(scrollContent).getStyle('top');
			scrollContent.style.top='0px';
		}
		if(scrollContent.id){
		  var tmp=scrollContent.id;
      scrollContent.id='';
      div.id=tmp;
    
    }
		newContent.mainDiv=div;
		var maskDiv= new Element('div');
		$(maskDiv).setStyle({
			position:"absolute",
			left:"0px",
			top:this.options.scrollContentPaddingTop+"px",
			width:(contentWidth-dragCtrlWidth-this.options.spaceBetweenScrollAndContent)+"px",
			height:(contentHeight-this.options.scrollContentPaddingTop-this.options.scrollContentPaddingBottom)+"px",
			overflow:"hidden"
		});
		var dragCtrl=new Element('div');
		$(dragCtrl).setStyle({
			width:dragCtrlWidth+"px",
			height:contentHeight+"px",
			position:'absolute',
			left:(contentWidth-dragCtrlWidth)+"px",
			top:"0px",
			backgroundColor:this.options.scrollBgColor,
			backgroundImage:'url('+this.basePath+'/img/'+this.options.scrollBgImg+')'
		});
		newContent.dragCtrlDiv=dragCtrl;
		
		var scrollTopDiv=new Element('div');

		$(scrollTopDiv).setStyle({
			width:dragCtrlWidth+"px",
      height:dragCtrlWidth+"px",
			position:'absolute',
			top:'0px',
      left:'0px',
      backgroundColor:this.options.scrollUpBgColor,
      backgroundImage:'url('+this.basePath+'/img/'+this.options.scrollUpImg+')',
      backgroundRepeat:'no-repeat'
		});
		
		newContent.scrollTopDiv=scrollTopDiv;
    this.initScrollUpDown(scrollTopDiv, newContent, 'up');

		var dragDiv=new Element('div');
		with(dragDiv.style){
			width=dragCtrlWidth+"px";
			position='absolute';
			top=dragCtrlWidth+"px";
			left='0px';
            backgroundColor=nScroll.options.dragBgColor;
            backgroundRepeat='no-repeat';
		}
		newContent.dragDiv=dragDiv;

		var dragDivTop= new Element('div');
		$(dragDivTop).setStyle({
			width:dragCtrlWidth+"px",
			height:dragCtrlWidth+"px",
			position:'absolute',
			top:"0px",
			left:"0px",
			backgroundImage:'url('+this.basePath+'/img/'+this.options.dragTopImg+')',
      backgroundRepeat:'no-repeat'
		});
		dragDiv.appendChild(dragDivTop);
		
    var dragDivCenter=new Element('div');
    $(dragDivCenter).setStyle({
			width:dragCtrlWidth+"px",
			//height=(dragDivHeight-(2*dragCtrlWidth))+"px";
			position:'absolute',
			top:dragCtrlWidth+"px",
			left:"0px",
			backgroundImage:'url('+this.basePath+'/img/'+this.options.dragCenterImg+')',
			backgroundRepeat:'repeat-Y',
			overflow:"hidden"
		});
		dragDiv.appendChild(dragDivCenter);
		newContent.dragDivCenter=dragDivCenter;

    var dragDivBottom=new Element('div');
    $(dragDivBottom).setStyle({
				width:dragCtrlWidth+"px",
				height:dragCtrlWidth+"px",
				position:'absolute',
				left:"0px",
        backgroundImage:'url('+this.basePath+'/img/'+this.options.dragBottomImg+')',
        backgroundRepeat:'no-repeat'
		});
    dragDiv.appendChild(dragDivBottom);
		newContent.dragDivBottom=dragDivBottom;
	
		var scrollDownDiv=new Element('div');
		$(scrollDownDiv).setStyle({
			width:dragCtrlWidth+'px',
      height:dragCtrlWidth+"px",
			position:'absolute',
			top:(contentHeight-dragCtrlWidth)+"px",
			left:'0px',
      background:this.options.scrollDownBgColor+' url('+this.basePath+'/img/'+this.options.scrollDownImg+') no-repeat'
		});
    
    this.initScrollUpDown(scrollDownDiv, newContent, 'down');
		newContent.scrollDownDiv=scrollDownDiv;

		dragCtrl.appendChild(scrollTopDiv);
		dragCtrl.appendChild(dragDiv);
		dragCtrl.appendChild(scrollDownDiv);

		scrollContent.style.position='absolute';
		scrollContent.style.top='0px';
		scrollContent.style.left='0px';
    var moreContentArrowDiv=new Element('div');
    moreContentArrowDiv.className='nScroll_moreContentArrow';
		$(moreContentArrowDiv).setStyle({
			display:'none'
		});
		
		
		scrollContent.parentNode.replaceChild(div, scrollContent);
		div.appendChild(maskDiv);
		maskDiv.appendChild(scrollContent);
		div.appendChild(dragCtrl);
		this.enableDrag(dragDiv, newContent);
		div.appendChild(moreContentArrowDiv);
		newContent.moreContentArrow=moreContentArrowDiv;
		this.initScrollUpDown(moreContentArrowDiv, newContent, 'down');
		this.update(newContent);
		if (window.addEventListener) newContent.mainDiv.addEventListener('DOMMouseScroll', this.wheel.bindAsEventListener(newContent), false);
		newContent.mainDiv.onmousewheel = this.wheel.bindAsEventListener(newContent);
    return newContent;
	},
	wheel:function (event){
		if(!this.scrollVisible) return false; 
		
		var delta = 0;
		if (!event) event = window.event;
		if (event.wheelDelta) {
			delta = event.wheelDelta/120; 
			if (window.opera && window.navigator.userAgent.indexOf('Macintosh') < 0) delta = -delta;
		} else if (event.detail) {
			delta = -event.detail/3;
		}
		if (delta){
			if(delta < 0){
				nScroll.scrollDown(this, -20);
			}else{
				nScroll.scrollUp(this, 20);
			}
			if (event.preventDefault) event.preventDefault();
			event.returnValue = false;
		}
	},
	enableDrag:function(id, obj){
		var mx = 0, my = 0, el = $(id);
		if (el) {
			el.nDragEnabled = true;
			Event.observe(el, 'mousedown', dragStart);
		}
		function dragStart(e){
			if (el.nDragEnabled){
				el.clickOffset=Event.pointerY(e)-Position.cumulativeOffset(el)[1];
				var ev = e? e : window.event;// new xEvent(e);
				mx = Event.pointerX(ev);
				my = Event.pointerY(ev);
				Event.observe(document, 'mousemove', drag);
				Event.observe(document, 'mouseup', dragEnd);
			}
		}
		function drag(e){
			var ev, dx, dy;
			ev=e ? e : window.event;
			dx = Event.pointerX(ev)- mx;//ev.pageX - mx;
			dy = Event.pointerY(ev)- my;//ev.pageY - my;
			mx = Event.pointerX(ev);
			my = Event.pointerY(ev);
			nScroll.scroll(el, obj, dx, dy, ev);
		}
		function dragEnd(e){
			Event.stopObserving(document, 'mouseup', dragEnd, false);
			Event.stopObserving(document, 'mousemove', drag, false);
		}
	},
	scroll:function(ele, scrollObj, mouseDX, mouseDY, ev){
		var eleTop, eleLeft, eleHeight, scrollUpTop, scrollUpHeight,scrollUpLeft, scrollDownTop;
		eleTop=parseInt(ele.style.top);
		eleHeight=scrollObj.dragDivHeight;

		scrollUpTop=Position.cumulativeOffset(scrollObj.scrollTopDiv)[1];
		scrollUpHeight=parseInt(scrollObj.scrollTopDiv.style.height);
		scrollDownTotalTop=Position.cumulativeOffset(scrollObj.scrollDownDiv)[1];
		scrollDownTop=parseInt(scrollObj.scrollDownDiv.style.top);

		var startTop=(scrollUpTop+scrollUpHeight);
		var eleOffset=ele.clickOffset;
		var scrollTopHeight=parseInt(scrollObj.scrollTopDiv.style.height);
		var scrollTopTop=parseInt(scrollObj.scrollTopDiv.style.top);
		var v1=scrollObj.scrollContentHeight-scrollObj.scrollHeight;
		
		var stopTop=Event.pointerY(ev) < (startTop+eleOffset);
		var stopBottom=Event.pointerY(ev) > (scrollDownTotalTop-eleHeight+eleOffset);
		if(stopTop || stopBottom){
			if(stopTop ){
				ele.style.top=scrollTopHeight+"px";
				scrollObj.scrollContent.style.top="0px";
			}else if(stopBottom){
				ele.style.top=scrollDownTop-eleHeight+"px";
				scrollObj.scrollContent.style.top=-v1+"px";
			}
		}
		else{
			var dragHeight=(scrollDownTop-scrollUpHeight-eleHeight);
         	var step=-scrollObj.scrollFactor;
         	ele.style.top=parseInt(ele.style.top) + mouseDY+"px";
			scrollObj.scrollContent.style.top=(eleTop-scrollTopHeight)*step+"px";
		}
	},
	initScrollUpDown:function(el, scrollObj, dir){
		Event.observe(el, 'mousedown', function(){
			nScroll.beginScrollUpDown(scrollObj, dir);
		});
	},
	beginScrollUpDown:function(scrollObj, dir){
		if(dir=='down'){
			scrollObj.interval=setInterval(function(){nScroll.scrollDown(scrollObj, -(nScroll.options.scrollSpeed))}, 10);
			Event.observe(document, 'mouseup', function(){
				nScroll.stopScrollUpDown(scrollObj);
			});
		}else{
			scrollObj.interval=setInterval(function(){nScroll.scrollUp(scrollObj, nScroll.options.scrollSpeed)}, 10);
			Event.observe(document, 'mouseup', function(){
				nScroll.stopScrollUpDown(scrollObj);
			});
		}
	},
	scrollDown:function(scrollObj, step){
   		if(parseInt(scrollObj.scrollContent.style.top)+step <= (scrollObj.scrollHeight - scrollObj.scrollContent.offsetHeight)){
			scrollObj.scrollContent.style.top=(scrollObj.scrollHeight - scrollObj.scrollContent.offsetHeight)+"px";
			scrollObj.dragDiv.style.top=(scrollObj.height-nScroll.options.dragCtrlWidth - scrollObj.dragDivHeight)+'px';
			clearInterval(scrollObj.interval);
      }else{
         this.scrollTo(scrollObj, step);
      }
   },
   scrollUp:function(scrollObj, step){
		if((parseInt(scrollObj.scrollContent.style.top)+step) >= 0){
			scrollObj.scrollContent.style.top="0px";
			scrollObj.dragDiv.style.top=nScroll.options.dragCtrlWidth+'px';
			clearInterval(scrollObj.interval);
		}else{
			this.scrollTo(scrollObj, step);
		}
	},
   scrollTo:function(scrollObj, step){
		scrollObj.scrollContent.style.top=(parseInt(scrollObj.scrollContent.style.top)+step)+'px';
		scrollObj.dragDiv.style.top=parseInt(-parseInt(scrollObj.scrollContent.style.top)/scrollObj.scrollFactor+nScroll.options.dragCtrlWidth)+'px';
   },
   stopScrollUpDown:function(scrollObj){
		clearInterval(scrollObj.interval);
   },
   update:function(scrollObj, notReset){
		if(!notReset){
			scrollObj.scrollContent.style.top="0px";
			scrollObj.dragDiv.style.top=this.options.dragCtrlWidth+"px";
		}
		var scrollContentHeight=$(scrollObj.scrollContent).getHeight();//.offsetHeight;   
		if(scrollContentHeight <=0)scrollContentHeight=1;
		var scrollHeight=scrollObj.scrollHeight;
		var contentHeight=scrollObj.height;
		
		var dragCtrlWidth=this.options.dragCtrlWidth;
		var dragDivHeight=parseInt(scrollHeight/scrollContentHeight*(contentHeight-(2*dragCtrlWidth)));
		
		if(dragDivHeight < dragCtrlWidth * 2) dragDivHeight=dragCtrlWidth *2;
		scrollObj.dragDivHeight=dragDivHeight;
		scrollObj.dragDiv.style.height=dragDivHeight+"px";
		scrollObj.dragDivCenter.style.height=(dragDivHeight-(2*dragCtrlWidth))+"px";
		scrollObj.dragDivBottom.style.top=(dragDivHeight-dragCtrlWidth)+"px"; 
		scrollObj.scrollContentHeight=scrollContentHeight;
		scrollObj.scrollFactor=(scrollContentHeight-scrollHeight)/(contentHeight-(2*dragCtrlWidth)-dragDivHeight);
		
		if(scrollContentHeight <= scrollHeight){
			scrollObj.dragCtrlDiv.style.display='none'; 
			scrollObj.scrollVisible=false;			
	   }else{		  
	   		scrollObj.dragCtrlDiv.style.display='block';  
			   scrollObj.scrollVisible=true; 
			   if(this.options.moreContentArrow) scrollObj.moreContentArrow.style.display='block';
   		}
   }
}