// JavaScript Document


sandecom.Scroll = Class.create();

sandecom.Scroll.prototype = {

	
	/*
	*  CONSTRUTOR DA CLASSE
	*/
	initialize: function(elem,containerHorizontal,buttonUp,buttonDown,options){
		
		
		// ATRIBUTOS

		this.container = $(containerHorizontal);
		this.area = $(elem);
		this.buttonUp = $(buttonUp);
		this.buttonDown = $(buttonDown);	
		this.maxStep = 0;
		this.stepAtual = 0;
	
		this.processos = new Array();

		this.setOptions(options);	
		
		this.createContent();
		this.config(elem);
		this.configBtn();
		
		
	},


	/*
	*  METODOS DE CONFIGURAÇÃO DO COMPONENTE
	*/
	setOptions: function(options) {
		
		this.options = {
						
						orientation      : "vertical",
						step             : 10,
						actionButton     : "onclick",
						velocity         : 1,
						areaFinalHeight  : 0
					
    					}

	    Object.extend(this.options, options);
	},
	
	
	createContent:function(){
		
		// verifica se container interno já existe; caso negativo cria-o
		if(this.container==null){
			this.container = document.createElement("div");
			this.container.innerHTML = this.area.innerHTML;
			
			this.area.innerHTML = "";
			this.area.appendChild(this.container);		
			
		}
		
		this.area.style.overflow = "hidden";
		this.ajustHeightFinal();
	
	},
	

	config: function(){
				
		if(this.options.orientation =="vertical"){
			
			this.defineMaxStep('height');

			this.buttonUp[this.options.actionButton]   = this.action.bind(this, this.options.actionButton, 'moveDown');	
			this.buttonUp.onmouseout                   = this.action.bind(this,'onmouseout',null);

			this.buttonDown[this.options.actionButton] = this.action.bind(this, this.options.actionButton,'moveUp');
			this.buttonDown.onmouseout                 = this.action.bind(this,'onmouseout',null);
			
		}else if(this.options.orientation =="horizontal"){

			this.defineMaxStep('width');
			this.buttonUp[this.options.actionButton]   = this.moveRight.bind(this);
			this.buttonDown[this.options.actionButton] = this.moveLeft.bind(this);
		
		}
		
	},
	
	action : function(action, func){
		//debugger;
		this.action = action;
		
		if(func!=null)
			this[func]();
		
	},
	
	
	configBtn:function(){
		
		this.buttonUp.style.cursor   = "pointer";
		this.buttonDown.style.cursor = "pointer";
		
	},
	
	ajustHeightFinal:function(){

		//altura dos elementos de área de conteudo
		var heightArea    = this.getStyleInNumber(this.area,'height');
		var heightContent = this.getStyleInNumber(this.container,'height');
		
		if(heightArea>heightContent){
			this.container.style.height = heightArea + "px";				
		}
		
		if(this.options.areaFinalHeight!=0){
			this.area.style.height = this.options.areaFinalHeight;				
		}

	},
	
	
	defineMaxStep:function(style){

		// tamanho da area;
		var areaTam      = this.getStyleInNumber(this.area, style);
		var containerTam = this.container.offsetHeight;
			
		this.maxStep = containerTam - areaTam + 20;
	},
	
	
	
	/*
	* METODOS PARA MOVIMENTOS VERICAIS
	* moveUp 
	* moveDown
	*/
	moveUp: function(){
		
		
		if(this.stepAtual > (this.maxStep*(-1)) ){	
			this.stepAtual = this.stepAtual - this.options.step				
			
			if(this.action=="onmouseover"){
				var i = setTimeout(this.moveUp.bind(this),(this.options.velocity*100));		
			}
		}
		
		this.container.style.marginTop = this.stepAtual +"px";

	},
	
	
	moveDown: function(){
		
		
		// get margin top of container
		var top = this.getStyleInNumber(this.container,'marginTop');
		
		// add -step to margin top	
		if(this.stepAtual < 0 ){	
			this.stepAtual = this.stepAtual + this.options.step				
			
			if(this.action=="onmouseover"){
				var i = setTimeout(this.moveDown.bind(this),(this.options.velocity*100));		
			}
			
		}

		this.container.style.marginTop = this.stepAtual +"px";
		

			
		
	},
	
	
	/*
	* METODOS PARA MOVIMENTOS HORIZONTAIS
	* moveLeft 
	* moveRight
	*/
	moveLeft: function(){

		//debugger;
		// get margin top of container
		var top = this.getStyleInNumber(this.container,'marginLeft');
		
		// add -step to margin top

		if(this.stepAtual > (this.maxStep*(-1)) ){	
			this.stepAtual = this.stepAtual - this.options.step;
			
		}else{
			//this.stepAtual = this.maxStep*(-1);
			
		}
		
		this.container.style.marginLeft = this.stepAtual +"px";

	},
	
	
	moveRight: function(){
		//debugger;
		// get margin top of container
		var top = this.getStyleInNumber(this.container,'marginLeft');
		
		// add -step to margin top	
		if(this.stepAtual < 0 ){	
			this.stepAtual = this.stepAtual + this.options.step				
		}else{
			//this.stepAtual = 0;
		}

		this.container.style.marginLeft = this.stepAtual +"px";
	},

	
	
	/*
	* MÉTODO RETORNA O VALOR NUMÉRICO DE UM ESTILO CSS QUE CONTEM PX COMO TERMINAL
	* se em um estilo, o valor é 300px.
	* o método deve retornar somente 300
	*
	* recebe como parametro um DOM e o style definido
	*/
	getStyleInNumber:function(elem,style){
		
		var	aux = this.getElementsComputedStyle(elem, style)
			aux = aux.split("p");	
			return parseFloat(aux[0]);
		
	},
	
	getElementsComputedStyle: function ( htmlElement, cssProperty, mozillaEquivalentCSS) {
		if ( arguments.length == 2 )
        	mozillaEquivalentCSS = cssProperty;

     	var el = $(htmlElement);
	
		if ( el.currentStyle )
        	return el.currentStyle[cssProperty];
	    else
    	    return document.defaultView.getComputedStyle(el, null).getPropertyValue(mozillaEquivalentCSS);
	},
	
	deleteTimeout : function(){
		debugger;
		this.buttonDown.onmouseout  = null;
		this.buttonUp.onmouseout    = null;
		
		for(var i=0 ; i< this.processos.length ;i++){
			if(this.processos[i]!=null)
				clearTimeout(this.processos[i]);	
				this.processos = new Array();
			
		}
			
	}

}