function Hscroll(){
	this.content = '';
	this.container= '';
	
	this.dragContainer = '';
	this.dragId = '';
	
	this.contentOffset = 0 ;//pixeis to remove from container width (workarround to content margin right, etc)
	
	
	this.seconds = 150 ;
	this.pixeis = 15 ;
	
	this.timer = null ;
	
	
	if(!Hscroll.Instances) Hscroll.Instances = new Array();
	Hscroll.Instances[this.id] = this;
	
	
	this.init = function(){
		var content = document.getElementById(this.content);
		var container = document.getElementById(this.container);
		var containerWidth = parseInt( parseInt(container.style.width) );
		
		var drag_container = document.getElementById( this.dragContainer );  
		var mydrag = document.getElementById( this.dragId );
		var drag_containerWidth = drag_container.clientWidth;
			
		if (this.dragContainer && this.dragId){
			if(containerWidth > content.clientWidth ){
					mydrag.style.visibility = 'hidden' ;
			}
		}
	}
	
	
	this.goUp = function(){
		
		if(this.timer) {
			this.dontGo();
		}
		this.timer = setInterval( "Hscroll.Instances[" + this.id +"].move("+this.pixeis+")", this.seconds);
	}
	
	this.goDown = function(){
		if(this.timer) {
			this.dontGo();
		}
		this.timer = window.setInterval(" Hscroll.Instances[" +this.id+"].move(-1 *  " + this.pixeis + ")",  this.seconds);
	}
	
	this.move = function(by){
		
		var content = document.getElementById(this.content);
		var container = document.getElementById(this.container);
		var containerWidth = parseInt( parseInt(container.style.width) );
		
		if (containerWidth > content.clientWidth - this.contentOffset){
			//run buttons disable function
			return ; 
		}
	
		var newtop = parseInt(content.style.left) + by ;
	        
		if ((by > 0 )&&(newtop > 0)) {
			newtop = '0';
			this.dontGo(); 
			//disable UP button
		}
		
		if ((by < 0 ) && (newtop <= containerWidth - content.clientWidth + this.contentOffset )){
			newtop = containerWidth - content.clientWidth + this.contentOffset ;
			this.dontGo(); 
			//disable dOWN button
		}
		        
		content.style.left = newtop + 'px';
		
		if (this.dragContainer && this.dragId){
			var drag_container = document.getElementById( this.dragContainer );  
			var mydrag = document.getElementById( this.dragId );
			var drag_containerWidth = drag_container.clientWidth;
				        
			dragpos = -1 * (  (newtop * (drag_containerWidth - mydrag.clientWidth)) / (content.clientWidth - containerWidth - this.contentOffset)  )
				        
			mydrag.style.left = dragpos + 'px';
		}
	}
	
	this. dontGo = function(){
		window.clearInterval(this.timer)
		this.timer = null ;
	}
}



function Vscroll(){
	this.content = '';
	this.container= '';
	
	this.dragContainer = '';
	this.dragId = '';
	
	this.contentOffset = 0 ;//pixeis to remove from container width (workarround to content margin right, etc)
	
	
	this.seconds = 150 ;
	this.pixeis = 15 ;
	
	this.timer = null ;
	
	
	if(!Vscroll.Instances) Vscroll.Instances = new Array();
	Vscroll.Instances[this.id] = this;
	
	
	
	
	
	this.init = function(){
		var content = document.getElementById(this.content);
		var container = document.getElementById(this.container);
		var containerWidth = parseInt( parseInt(container.style.height) );
		
		var drag_container = document.getElementById( this.dragContainer );  
		var mydrag = document.getElementById( this.dragId );
		var drag_containerWidth = drag_container.clientHeight;

		if (this.dragContainer && this.dragId){
			if(containerWidth > content.clientHeight ){
					mydrag.style.visibility = 'hidden' ;
			}
		}
	}
	
	
	
	
	
	
	
	this.goUp = function(){
		
		if(this.timer) {
			this.dontGo();
		}
		this.timer = setInterval( "Vscroll.Instances[" + this.id +"].move("+this.pixeis+")", this.seconds);
	}
	
	this.goDown = function(){
		if(this.timer) {
			this.dontGo();
		}
		this.timer = window.setInterval(" Vscroll.Instances[" +this.id+"].move(-1 *  " + this.pixeis + ")",  this.seconds);
	}
	
	this.move = function(by){
		
		var content = document.getElementById(this.content);
		var container = document.getElementById(this.container);
		var containerWidth = parseInt( parseInt(container.style.height) );
		
		if (containerWidth > content.clientHeight - this.contentOffset){
			//run buttons disable function
			return ; 
		}
	
		var newtop = parseInt(content.style.top) + by ;
	        
		if ((by > 0 )&&(newtop > 0)) {
			newtop = '0';
			this.dontGo(); 
			//disable UP button
		}
		
		if ((by < 0 ) && (newtop <= containerWidth - content.clientHeight + this.contentOffset )){
			newtop = containerWidth - content.clientHeight + this.contentOffset ;
			this.dontGo(); 
			//disable dOWN button
		}
		        
		content.style.top = newtop + 'px';
		
		if (this.dragContainer && this.dragId){
			var drag_container = document.getElementById( this.dragContainer );  
			var mydrag = document.getElementById( this.dragId );
			var drag_containerWidth = drag_container.clientHeight;
						
			
			
			dragpos = -1 * (  (newtop * (drag_containerWidth - mydrag.clientHeight)) / (content.clientHeight - containerWidth - this.contentOffset)  )
				        
			mydrag.style.top = dragpos + 'px';
		}
	}
	
	this. dontGo = function(){
		window.clearInterval(this.timer)
		this.timer = null ;
	}
}