/*
	Magic Scrollbar (Standard Vertical Version), adapted for Netzministerium by Rene Sander (rene@netzministerium.de)
	- spans converted to divs (no problems yet)
	- no up/down buttons (setting their sizes to 0x0 works, but complete removal will be cleaner)
	
	Made by geeeet@ghtml.com
	Keep these two lines and you're free to use this code
*/

function MagicVertical(myName, dragH, dragW, scrollH, speed) {

	this.myName = myName;
	
	this.dragH = dragH;
	this.dragW = dragW;
	this.scrollH = scrollH;
	this.speed = speed;
	
	// Browser detection
	this.dom = document.getElementById ? true:false;
	this.nn4 = document.layers ? true:false;
	this.ie4 = document.all ? true:false;
	
	this.mouseY; // Mouse Y position onclick
	this.mouseX; // Mouse X position onclick
	
	this.clickDrag = false; // If click on scrollbar
	this.clickAbove = false; // If click above scrollbar
	this.clickBelow = false; // If click below scrollbar
	
	this.timer = setTimeout("",500); // Repeat variable
	this.dragL; // Scrollbar X
	this.dragT; // Scrollbar Y
	this.rulerL; // Ruler X
	this.rulerT; // Ruler Y
	this.contentT; // Content layer Y;
	this.contentH; // Content height
	this.contentClipH; // Content clip height
	this.scrollLength; // Number of pixels scrollbar should move
	this.startY; // Keeps track of offset between mouse and span
	
	this.up = MagicVerticalUp;
	this.getT = MagicVerticalGetT;
	this.getMouse = MagicVerticalGetMouse;
	this.moveTo = MagicVerticalMoveTo;
	this.scrollUp = MagicVerticalScrollUp;
	this.scrollDown = MagicVerticalScrollDown;
	
	// Event handler methods
	this.down = MagicVerticalDown;
	this.move = MagicVerticalMove;

	
	if(this.ie4){
		// Scrollbar X and Y variables
		this.dragL = document.all.drag.style.pixelLeft;
		this.dragT = document.all.drag.style.pixelTop;		
		// Ruler Y variable
		this.rulerT = document.all.ruler.style.pixelTop;		
		// height of content layer and clip layer
		this.contentH = document.all.content.offsetHeight;
		this.contentClipH = document.all.contentClip.offsetHeight;
	}
	else if(this.nn4){
		// Scrollbar X and Y variables
		this.dragL = document.drag.left;
		this.dragT = document.drag.top;		
		// Ruler Y variable
		this.rulerT = document.ruler.top;
		// height of content layer and clip layer
		this.contentH = document.contentClip.document.content.clip.bottom;
		this.contentClipH = document.contentClip.clip.bottom;
	}
	else if(this.dom){
		// Scrollbar X and Y variables
		this.dragL = parseInt(document.getElementById("drag").style.left);
		this.dragT = parseInt(document.getElementById("drag").style.top);
		// Ruler Y variable
		this.rulerT = parseInt(document.getElementById("ruler").style.top);
		// height of content layer and clip layer
		this.contentH = document.getElementById("content").offsetHeight;
		this.contentClipH = document.getElementById("contentClip").offsetHeight;
		document.getElementById("content").style.top = 0 + "px";
	}
	// Number of pixels scrollbar should move
	this.scrollLength = ((this.scrollH-this.dragH)/(this.contentH-this.contentClipH));
	
	return this;
}

function MagicVerticalUp(){
	clearTimeout(this.timer);
	// Resetting variables
	this.clickDrag = false;
	this.clickAbove = false;
	this.clickBelow = false;
	return true;
}

// Reads content layer top
function MagicVerticalGetT(){
	if(this.ie4)
		this.contentT = document.all.content.style.pixelTop;
	else if(this.nn4)
		this.contentT = document.contentClip.document.content.top;
	else if(this.dom)
		this.contentT = parseInt(document.getElementById("content").style.top);
}

// Reads mouse X and Y coordinates
function MagicVerticalGetMouse(e){
	if(this.ie4){
		this.mouseY = event.clientY;
		this.mouseX = event.clientX;
	}
	else if(this.nn4 || this.dom){
		this.mouseY = e.pageY;
		this.mouseX = e.pageX;
	}
}

// Moves the layer
function MagicVerticalMoveTo(){
	if(this.ie4){
		document.all.content.style.top = this.contentT;
		document.all.ruler.style.top = this.dragT;
		document.all.drag.style.top = this.dragT;
	}
	else if(this.nn4){
		document.contentClip.document.content.top = this.contentT;
		document.ruler.top = this.dragT;
		document.drag.top = this.dragT;
	}
	else if(this.dom){
		document.getElementById("content").style.top = this.contentT + "px";
		document.getElementById("drag").style.top = this.dragT + "px";
		document.getElementById("ruler").style.top = this.dragT + "px";
	}
}

// Scrolls up
function MagicVerticalScrollUp(){
	this.getT();
	
	if(this.clickAbove){
		if(this.dragT <= (this.mouseY-(this.dragH/2))) return this.up();
	}
	
	if(this.clickUp){
		if(this.contentT < 0) {		
			this.dragT = this.dragT - (this.speed*this.scrollLength);
			
			if(this.dragT < (this.rulerT)) this.dragT = this.rulerT;
				
			this.contentT = this.contentT + this.speed;
			if(this.contentT > 0) this.contentT = 0;
			
			this.moveTo();
			this.timer = setTimeout(this.myName + ".scrollUp()",25);
		}
	}
	return false;
}

// Scrolls down
function MagicVerticalScrollDown(){
	this.getT();
	
	if(this.clickBelow){
		if(this.dragT >= (this.mouseY-(this.dragH/2))) return this.up();
	}

	if(this.clickDown){
		if(this.contentT > -(this.contentH - this.contentClipH)) {
		
			this.dragT = this.dragT + (this.speed*this.scrollLength);
			if(this.dragT > (this.rulerT + this.scrollH - this.dragH)) this.dragT = (this.rulerT + this.scrollH - this.dragH);
			
			this.contentT = this.contentT - this.speed;
			if(this.contentT < -(this.contentH - this.contentClipH)) this.contentT = -(this.contentH - this.contentClipH);
			
			this.moveTo();
			this.timer = setTimeout(this.myName + ".scrollDown()",25);
		}
	}
	return false;
}

// Mousedown
function MagicVerticalDown(e){
	if((document.layers && e.which!=1) || (document.all && event.button!=1)) return true; // Enables the right mousebutton		
	
	this.getMouse(e);
	this.startY = (this.mouseY - this.dragT);
	
	// Else if click on scrollbar
	if(this.mouseX >= this.dragL && (this.mouseX <= (this.dragL + this.dragW)) && this.mouseY >= this.dragT && (this.mouseY <= (this.dragT + this.dragH))){
		this.clickDrag = true;
		return false;
	}
	else if(this.mouseX >= this.dragL && (this.mouseX <= (this.dragL + this.dragW)) && this.mouseY >= this.rulerT && (this.mouseY <= (this.rulerT + this.scrollH))){
		// If click above drag
		if(this.mouseY < this.dragT){
			this.clickAbove = true;
			this.clickUp = true;
			return this.scrollUp();
		}
		// Else click below drag
		else{
			this.clickBelow = true;
			this.clickDown = true;
			return this.scrollDown();
		}
	}
	// If no scrolling is to take place
	else{
		return true;
	}
}

// Drag function
function MagicVerticalMove(e) {
	if(this.clickDrag && this.contentH > this.contentClipH){
		this.getMouse(e);
		this.dragT = (this.mouseY - this.startY);
		
		if(this.dragT < (this.rulerT))
			this.dragT = this.rulerT;		
		if(this.dragT > (this.rulerT + this.scrollH - this.dragH))
			this.dragT = (this.rulerT + this.scrollH - this.dragH);
		
		this.contentT = ((this.dragT - this.rulerT)*(1/this.scrollLength));
		this.contentT = eval('-' + this.contentT);

		this.moveTo();
	}
	// So ie-pc doesn't select gifs
	if(this.ie4)
		return false;
}

// reloads page to position the layers again
function reloadPage(){
	location.reload();
}