

(function($){
	var opts;

  //-----------------------------------------------
	$.fn.makescrollable = function(options)
    {
  		// build main options
  		opts = $.extend({}, $.fn.makescrollable.defaults, options);

  		// initalize
  		$.fn.makescrollable.initialize();
  		
  		return this.each(function()
        {
        $(this).data('opts', opts);
                
             
        $.fn.makescrollable.makeoutertags(this);     
        $.fn.makescrollable.show_scrollboxbuttons(this, 0);
        $.fn.makescrollable.initialize_events(this);
        
        $(this).find('.scrollbox').scrollTo(0);
		
		var afterinit=$(this).data('opts').afterinit;
		

		if(afterinit) afterinit();
    	});
  	};
	//-----------------------------------------------
	$.fn.makescrollable.initialize = function()
    {
  	$.scrollTo.defaults.axis = 'xy';
  	};
  //-----------------------------------------------
	$.fn.makescrollable.makeoutertags = function(mainobj)
    {
  	var makeoutertags=$(mainobj).data('opts').makeoutertags;
  	if(!makeoutertags) return;
  	
  	var buffhtml=$(mainobj).html();
  	
  	var scrollbox_name=$(mainobj).data('opts').scrollbox_name;
  	var scrollbutton1_name=$(mainobj).data('opts').scrollbutton1_name;
  	var scrollbutton2_name=$(mainobj).data('opts').scrollbutton2_name;
  	var txt_name=$(mainobj).data('opts').txt_name;
	
	/*$(mainobj).find('.'+scrollbutton1_name).css('display', 'none');
	$(mainobj).find('.'+scrollbutton2_name).css('display', 'none');*/

  	  	
  	if( $(mainobj).find('.'+txt_name).length==0 )
  	  {
      buffhtml='<div class="'+txt_name+'">'+buffhtml+'</div>';
      }
      	  	      
    if( $(mainobj).find('.'+scrollbutton1_name).length==0 )
      {
      buffhtml=buffhtml+'<a href="#" class="'+scrollbutton1_name+'">&nbsp;</a>';
      }
      
    if( $(mainobj).find('.'+scrollbutton2_name).length==0 )
      {
      buffhtml=buffhtml+'<a href="#" class="'+scrollbutton2_name+'">&nbsp;</a>';
      }
      
    if( $(mainobj).find('.'+scrollbox_name).length==0 )
      {
       buffhtml='<div class="'+scrollbox_name+'">'+buffhtml+'</div>';
      }
  	
  	$(mainobj).html(buffhtml);
  	
  	};
  //-----------------------------------------------	
  $.fn.makescrollable.initialize_events = function(mainobj)
    {
    //***
    var scrollbox_name=$(mainobj).data('opts').scrollbox_name;
  	var scrollbutton1_name=$(mainobj).data('opts').scrollbutton1_name;
  	var scrollbutton2_name=$(mainobj).data('opts').scrollbutton2_name;
    var beforescroll=$(mainobj).data('opts').beforescroll;
    var afterscroll=$(mainobj).data('opts').afterscroll;
    
  	$(mainobj).find('.'+scrollbutton1_name).bind("mouseenter", 
    function(event) 
  		{
      event.preventDefault();
      
      if(beforescroll) beforescroll();
      
      var scrollbox=$(mainobj).find('.'+scrollbox_name);    
      var duration=$.fn.makescrollable.getscrollduration(mainobj, 'back');
      
              
  		$(mainobj).find('.'+scrollbox_name).stop().scrollTo(  0 , duration, {easing:'linear'});   
  		});
  		
  	//***	
  	$(mainobj).find('.'+scrollbutton2_name).bind("mouseenter", 
    function(event) 
  		{
  		event.preventDefault();  		
      
      if(beforescroll) beforescroll();  		
  		  		    
      var scrollbox=$(mainobj).find('.'+scrollbox_name);          
      var duration=$.fn.makescrollable.getscrollduration(mainobj, 'fwd');      
      var angle=$(mainobj).data('opts').angle;        
      
      
      if(angle=='vertical')
        {
        var sh=$(scrollbox)[0].scrollHeight;
        var oh=$(scrollbox).outerHeight();
		      
  		$(mainobj).find('.'+scrollbox_name).stop().scrollTo(  (sh-oh)+'px' , duration, {easing:'linear', axis : 'y'});
        }
      else
        {
        var sw=$(scrollbox)[0].scrollWidth;
        var ow=$(scrollbox).outerWidth();

      
  		$(mainobj).find('.'+scrollbox_name).stop().scrollTo(  (sw-ow)+'px' , duration, {easing:'linear', axis : 'x'});
        }
  		});
  		
  	//***
  	$(mainobj).find('.'+scrollbutton1_name+', .'+scrollbutton2_name).bind("mouseleave", 
    function(event) 
  		{
      event.preventDefault();
  		$(mainobj).find('.'+scrollbox_name).stop();   
		
		if(afterscroll) afterscroll();
  		});	
  		
  	//***	
  	$(mainobj).find('.'+scrollbox_name).bind("scroll", 
    function(event) 
  		{
  		var buttonduration=$(mainobj).data('opts').buttonduration;
  		
  		$.fn.makescrollable.show_scrollboxbuttons( mainobj, buttonduration );								   
  		});	
		
	$(mainobj).find('.'+scrollbutton1_name).bind("click", 
    function(event) 
  		{
  		event.preventDefault();  
		
		var angle=$(mainobj).data('opts').angle;                    
		var axis= angle=='vertical' ? 'y' : 'x';			
		var scrollbox_name=$(mainobj).data('opts').scrollbox_name;	
			
		$(mainobj).find('.'+scrollbox_name).stop().scrollTo(  '-=150px' , 300, {easing:'linear', axis : axis}); 
		});	
		
	$(mainobj).find('.'+scrollbutton2_name).bind("click", 
    function(event) 
  		{
  		event.preventDefault();  
		
		var angle=$(mainobj).data('opts').angle;                    
		var axis= angle=='vertical' ? 'y' : 'x';		
		var scrollbox_name=$(mainobj).data('opts').scrollbox_name;
				
		$(mainobj).find('.'+scrollbox_name).stop().scrollTo(  '+=150px' , 300, {easing:'linear', axis : axis}); 
		});		
  		
  	};
	//-----------------------------------------------
	$.fn.makescrollable.getscrollduration = function(mainobj, direction)
    {
    var scrollbox_name=$(mainobj).data('opts').scrollbox_name;
  	
    var scrollbox=$(mainobj).find('.'+scrollbox_name);
  	var angle=$(mainobj).data('opts').angle;
  	var baseduration=$(mainobj).data('opts').baseduration;
  	var speed= ($(mainobj).data('opts').speed) / 1000;
  	    
     if(angle=='vertical')
      {
      var st=$(scrollbox).scrollTop();
      var sh=$(scrollbox)[0].scrollHeight;
      var oh=$(scrollbox).outerHeight();  	  

      if(direction=='back') return (st / speed );
      if(direction=='fwd')  return ( ((sh-oh) - st ) / speed );
      }
    else
      {
      var sl=$(scrollbox).scrollLeft();
      var sw=$(scrollbox)[0].scrollWidth;
      var ow=$(scrollbox).outerWidth();
            
      if(direction=='back') return ( sl / speed );
      if(direction=='fwd')  return ( ( (sw-ow)-sl) / speed );
      }
      
      
  	};
	//-----------------------------------------------
	$.fn.makescrollable.show_scrollboxbuttons = function(mainobj, duration)
    {
    var scrollbox_name=$(mainobj).data('opts').scrollbox_name;
  	var scrollbutton1_name=$(mainobj).data('opts').scrollbutton1_name;
  	var scrollbutton2_name=$(mainobj).data('opts').scrollbutton2_name;
    
    if(duration==null) duration=$(mainobj).data('opts').buttonduration;
    
    var scrollbox=$(mainobj).find('.'+scrollbox_name);
    var angle=$(mainobj).data('opts').angle;
      
    if( $(scrollbox).length==0 ) return; 
    
    if(angle=='vertical')
      {                 
      var st=$(scrollbox).scrollTop();
      var sh=$(scrollbox)[0].scrollHeight;	  
      var oh=$(scrollbox).outerHeight();     	  
	  
	  /*debug(scrollbox)
	  debug(sh)  ;
	  debug(st)  ;
	  debug(oh)  ;*/
	                                  
      if(st==0) $(mainobj).find('.'+scrollbutton1_name).animate({ opacity: 'hide' }, duration);
      else $(mainobj).find('.'+scrollbutton1_name).animate({ opacity: 'show' }, duration);
      
      
      if(sh-st==oh) $(mainobj).find('.'+scrollbutton2_name).animate({ opacity: 'hide' }, duration);
      else $(mainobj).find('.'+scrollbutton2_name).animate({ opacity: 'show' }, duration);
      }
    else
      {
      var sl=$(scrollbox).scrollLeft();
      var sw=$(scrollbox)[0].scrollWidth;
      var ow=$(scrollbox).outerWidth();    	  	  	  	  
      
      if(sl==0) $(mainobj).find('.'+scrollbutton1_name).animate({ opacity: 'hide' }, duration);
      else $(mainobj).find('.'+scrollbutton1_name).animate({ opacity: 'show' }, duration);
      	        
      if(sw-sl==ow) $(mainobj).find('.'+scrollbutton2_name).animate({ opacity: 'hide' }, duration);
      else $(mainobj).find('.'+scrollbutton2_name).animate({ opacity: 'show' }, duration);
      }
    
  	//alert( $(scrollbox).html() );
  	};
	
	
	//-----------------------------------------------
  	$.fn.makescrollable.defaults = 
      {
      speed           : 200, //pixel / sec
      baseduration    : 4000,
      buttonduration  : 300,
      angle           : 'vertical',
      makeoutertags   : false,
      scrollbox_name  : 'scrollbox',
      scrollbutton1_name  : 'scrollbutton1',
      scrollbutton2_name  : 'scrollbutton2',
      txt_name        : 'txt',
      beforescroll        : false,
	  afterscroll        : false,
	  afterinit        : false
      };
	
	
})(jQuery);