/*
	PT.Instances.overflowScroller = new PT.Sites.General.overflowScroller('scroller', 50, 50);
	
	
	LET OP!
	JE MAG BINNEN HET ELEMENT WAAR $(id) NAAR WIJST GEEN MARGINS GEBRUIKEN. ALLEEN PADDINGS ZIJN TOEGESTAAN!!!
*/

PT.Sites.General.overflowScroller = function(id, w, h) {
	var self = this;
	if($(id)){
		var o = $(id);
		var list = o.getElementsByTagName("div")[0].getElementsByTagName("div");
		o.getElementsByTagName("div")[0].style.height = h + "px";
		o.getElementsByTagName("div")[0].style.width = w + "px";
		for (var i = 0; i < list.length; i++) {
			if (list[i].className.indexOf("scroller_container") > -1) {
				o = list[i];
			}
		}
		o.style.width = w + "px";
		//onmouseover="scroller.startScroll(0, 5);" onmouseout="scroller.stopScroll();"
		var imgs = $(id).getElementsByTagName('img');
	
		PT.Sites.General.RegisterEvent(imgs[0], "mouseover", function() { self.startScroll(0, 5); });
		PT.Sites.General.RegisterEvent(imgs[1], "mouseover", function() { self.startScroll(0, -5); });
		PT.Sites.General.RegisterEvent(imgs[0], "mousedown", function() { self.startScroll(0, 15); });
		PT.Sites.General.RegisterEvent(imgs[1], "mousedown", function() { self.startScroll(0, -15); });
	
		PT.Sites.General.RegisterEvent(imgs[0], "mouseout", function() { self.stopScroll(); });
		PT.Sites.General.RegisterEvent(imgs[1], "mouseout", function() { self.stopScroll(); });
		PT.Sites.General.RegisterEvent(imgs[0], "mouseup", function() { self.stopScroll(); });
		PT.Sites.General.RegisterEvent(imgs[1], "mouseup", function() { self.stopScroll(); });
	
		if (o.offsetHeight <= h) {
			imgs[0].style.display = 'none';
			imgs[1].style.display = 'none';
		}
		else {
			imgs[0].style.display = 'block';
			imgs[1].style.display = 'block';
		}
	}
	
	//Private methods
	this._setPos = function(x, y) {
		if (x < this.viewableWidth - this.totalWidth)
			x = this.viewableWidth - this.totalWidth;
		if (x > 0) x = 0;
		if (y < this.viewableHeight - this.totalHeight)
			y = this.viewableHeight - this.totalHeight;
		if (y > 0) y = 0;
		this._x = x;
		this._y = y;
		
		with (o.style) {
			marginLeft = this._x + "px";
			marginTop = this._y + "px";
		}
	};

	//Public Methods
	this.reset = function() {
		this.content = o;
		if(document.all){this.totalHeight = o.offsetHeight;}
		else{this.totalHeight = o.offsetHeight+16;}
		this.totalWidth = o.offsetWidth;
		this._x = 0;
		this._y = 0;
		with (o.style) {
			marginLeft = "0px";
			marginTop = "0px";
			left = "0px";
			top = "0px";
		}
	};
	this.scrollBy = function(x, y) {
		this._setPos(this._x + x, this._y + y);
	};
	this.scrollTo = function(x, y) {
		this._setPos(-x, -y);
	};
	this.stopScroll = function() {
		if (this.scrollTimer) window.clearInterval(this.scrollTimer);
	};
	this.startScroll = function(x, y) {
		this.stopScroll();
		this.scrollTimer = window.setInterval(
			function() { self.scrollBy(x, y); }, 40
		);
	};
	this.swapContent = function(c, w, h) {
		o = c;
		var list = o.getElementsByTagName("div")[0].getElementsByTagName("div");
		for (var i = 0; i < list.length; i++) {
			if (list[i].className.indexOf("scroller_container") > -1) {
				o = list[i];
			}
		}
		if (w) this.viewableWidth = w;
		if (h) this.viewableHeight = h;
		this.reset();
	};

	//variables
	if($(id)){
		this.viewableWidth = w;
		this.viewableHeight = h;
		this.scrollTimer = null;
		this.reset();
	}

};