﻿/// <reference name="MicrosoftAjax.js"/>


var ns = "local.gigya.controls";
if (!Type.isNamespace(ns)) {
    Type.registerNamespace(ns);
}

local.gigya.controls.SlideBox = function(element)
{
	///<summary>Initialize a new instance of the SlideBox class</summary>
    local.gigya.controls.SlideBox.initializeBase(this, [element]);
    Array.add(local.gigya.controls.SlideBox.Collection,this);
    
    ///defaults
    this._debug = false;
	this._actualWidth = '';
	this._items = new Array();
	this.set_sliderSpeed(3); 
	this.set_sliderInterval(30);
	this.set_sliderShowGap(0); 
	this._interval = null;
	this._duplicationPosition = false;
	
	
	
	
}
local.gigya.controls.SlideBox.prototype = 
{

	get_key: function()
	{
		return this._key;
	}
	
	,set_key: function(value)
	{
	    if(this._key == undefined)
	    {
		    this._key = value;
		    local.gigya.controls.SlideBox.Collection.push(this);
		}
	}


	,get_items: function()
	{
		return this._items;
	}
	
	,set_items: function(value)
	{
	    if(typeof(value) == "string")
	        value = eval(value);
	        
		this._items = value;
	}


	,get_sliderWidth: function()
	{
		return this._sliderWidth;
	}
	
	,set_sliderWidth: function(value)
	{
		this._sliderWidth = value;
	}
	
	
	,get_sliderHeight: function()
	{
		return this._sliderHeight;
	}
	
	,set_sliderHeight: function(value)
	{
		this._sliderHeight = value;
	}
	
	
	,get_sliderInterval: function()
	{
		return this._sliderInterval;
	}
	
	,set_sliderInterval: function(value)
	{
		this._sliderInterval = value;
	}	
	
	
    , get_theme: function() {
        ///<summary>get the SlideBox theme</summary>
        return this._theme;
    }

    , set_theme: function(value) {
        ///<summary>Set the SlideBox theme</summary>
        this._theme = value;
    }	
	
	 
	,get_sliderSpeed: function()
	{
		return this._speed;
	}
	
	,set_sliderSpeed: function(value)
	{
		this._speed = value;
	}	
	
	
	,get_sliderShowGap: function()
	{
		return this._sliderShowGap;
	}
	
	,set_sliderShowGap: function(value)
	{
		this._sliderShowGap = value;
	}	
	
	,get_debug: function()
	{
		return this._debug;
	}
	
	,set_debug: function(value)
	{
		this._debug = value;
	}	
	
	,get_chunk: function()
	{
		return this._chunk;
	}
	
	,set_chunk: function(value)
	{
		this._chunk = value;
	}	
	
	
	
	///Methdos
	,initialize : function() {
        local.gigya.controls.SlideBox.callBaseMethod(this, 'initialize');
        this.start();
        
    }
    
	,dispose : function() {
        local.gigya.controls.SlideBox.callBaseMethod(this, 'dispose');
    }
    
	,start: function()
	{
	    ///Debug for IE
	    if(Prototype.Browser.IE && this.get_debug())
	    {
            var textarea = new Element('<textarea id="TraceConsole" rows="10" cols="50"  title="TraceConsole"></textarea>');
            var ie_console = $("TraceConsole");
            if(ie_console==undefined)
            {
                document.body.appendChild(textarea);
            }
        }
	    
	    
	    
	    ///insert the slider
	    var elm = $(this._element);
	    var html = [
		    '<span id="'+this.get_key()+'_hidden" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+this.getHtml() +'</span>'
		    ,'<table border="0" cellspacing="0" cellpadding="0"  width="100%"><tr><td>'
		    ,'<div style="position:relative;width:'+this.get_sliderWidth()+';height:'+this.get_sliderHeight()+';overflow:hidden;">'
		    ,'<div style="position:absolute;width:9000px;height:'+this.get_sliderHeight()+';" >'
		    ,'<div id="'+this.get_key()+'_duplicate1" style="position:absolute;left:0px;top:0px"></div>'
		    ,'<div id="'+this.get_key()+'_duplicate2" style="position:absolute;left:-9000px;top:0px"></div>'
		    ,'</div>'
            ,'</div>'
		    ,'</td></tr></table>'
	    ];
        
        var elm = $(this._element);
        
	    this.debug('adding items..');
        elm.insert({ top: html.join('') });

        this._cross_slide = $(this.get_key()+ "_duplicate1");
        this._cross_slide2 = $(this.get_key()+ "_duplicate2");

        this._cross_slide.innerHTML = this._cross_slide2.innerHTML=this.getHtml();
        
        
        Event.observe(window, 'load',
            function()
            {
	            this._actualWidth = $(this.get_key()+"_hidden").getWidth() ;
                this.debug('actual width: ' + this._actualWidth);
        	    
                this.debug('setting duplication offsets...');
                this._cross_slide.setStyle({ left : 0+'px'  });
                this._cross_slide2.setStyle({ left : (-1)*(this._actualWidth + this.get_sliderShowGap())+'px' });
                this.debug('_cross_slide2 left: ' + (-1)*(this._actualWidth + this.get_sliderShowGap()));
                this.debug('settings duplication offsets done.');
                
                this.debug('items added');
            }.bind(this),200);
	}
	
	,stop: function()
	{
	    clearInterval(this._interval);
	}
	
	
    
	,move: function(isLeft)
	{ 
	    if(this._isMoving)
	        return;
	        
	    this._isMoving = true;
	    this.stop();
	    this._normalize();
    	var This = this;
    	var fn = this._slideLeft;

        if(!isLeft)
        {
            fn = this._slideRight;
        }
        

        this._positions = 
        {
            left:  parseInt(this._cross_slide.style.left) || 0
            ,
            right: parseInt(this._cross_slide2.style.left) || 0
        }
        
        var totalChunks = 0;
	    this._interval = setInterval(function()
	    {
				    
            ///Chunk behaviour.
            if(totalChunks == parseInt(This.get_chunk()) )
            {
                 clearInterval(This._interval);
                 This._isMoving = false;
                 This.debug('totalChunks : ' + totalChunks);
            }
            else if(parseInt(This.get_chunk()) < (totalChunks+This.get_sliderSpeed()))
            {
                var diff = parseInt(This.get_chunk()) - (totalChunks);
                
                This.debug('get_chunk : ' + This.get_chunk());
                This.debug('diff : ' + diff);
                This.debug('totalChunks : ' + totalChunks);
                totalChunks += fn.apply(This,[{speed: diff}]);
                
                clearInterval(This._interval);
                This._isMoving = false;
                This.debug('totalChunks : ' + totalChunks);
            }
            else if(parseInt(This.get_chunk()) <= totalChunks)
            {
                clearInterval(This._interval);
                This._isMoving = false;
                This.debug('totalChunks : ' + totalChunks);
            }
            else
            {
			    totalChunks += fn.apply(This,[]);
			}
			
				    
		},this.get_sliderInterval());
	}
	
	
	,slide: function(isLeft)
	{ 
	    this.stop();
	    this._normalize();
    	var This = this;
    	var fn = this._slideLeft;

        if(!isLeft)
        {
            fn = this._slideRight;
        }
        
        this._lastPosition = parseInt(this._cross_slide.style.left) || 0;
	    this._interval = setInterval(function(){
					    fn.apply(This,[]);
				    },this.get_sliderInterval());
			
	}
	
	

	,_slideLeft: function(options)
	{
           
        if(options==undefined)
            options = {};
	        
	        
	    if(options.speed == undefined)
	        options.speed = this.get_sliderSpeed();
	        
	        
		///change the first duplication
		var change = 0;
		var duplicate_a_new_left=0,duplicate_b_new_left=0;
		var duplicate_a_left = parseInt(this._cross_slide.style.left);
		var duplicate_b_left = parseInt(this._cross_slide2.style.left);
		
		var sliderWidth = ((this._actualWidth+this.get_sliderShowGap())*(-1));
		
		///if slide a left is bigger than the the length of one slide (+ gap) than scroll along slide b cause they both visible.
		if ((duplicate_a_left-options.speed) < sliderWidth && duplicate_b_left!=0)
		{
		    var diff = duplicate_b_left;
		    change = diff;
		    this.debug("sliderWidth : "+sliderWidth);
		    this.debug("next left : "+(duplicate_a_left - options.speed));
		    this.debug("fixed left : "+diff);
		    duplicate_a_new_left = parseInt(duplicate_a_left - diff );
		}
		///if slide a left is bigger than the the length of one slide (+ gap) than scroll along slide b cause they both visible.
		else 
		if (duplicate_a_left > sliderWidth )
		{
		    change = options.speed;
			duplicate_a_new_left = parseInt(duplicate_a_left - options.speed );
			
		}
		///else , swap slides. (when left equal to slider width)
		else
		{
		    change = options.speed;
			duplicate_a_new_left = (this._actualWidth + this.get_sliderShowGap());
			duplicate_a_new_left -=  options.speed;
		}
        
        
        sliderWidth = (this._actualWidth+this.get_sliderShowGap());
        
        ///change the second duplication
        if(duplicate_a_new_left>0)
        {
            duplicate_b_new_left = duplicate_a_new_left - (sliderWidth);
        }
        else
        {
            duplicate_b_new_left = duplicate_a_new_left + (sliderWidth);
        }
        
		
        ///set it.
		this._cross_slide.setStyle({"left" : duplicate_a_new_left+'px' });
        this._cross_slide2.setStyle({"left" : duplicate_b_new_left+'px' });	
        
        
        
        this.debug('');
		this.debug("Slide a : " + duplicate_a_new_left);
		this.debug("Slide b : " + duplicate_b_new_left);
		var total = (Math.sqrt(parseInt(duplicate_a_new_left)*parseInt(duplicate_a_new_left)) + Math.sqrt(parseInt(duplicate_b_new_left)*parseInt(duplicate_b_new_left)));
	    this.debug("total : " + total);
	    
	    
	    return change;
	}
	
	,_slideRight: function(options)
	{  
        if(options==undefined)
            options = {};
	        
	        
	    if(options.speed == undefined)
	        options.speed = this.get_sliderSpeed();
	        
		///change the first duplication
		var change = 0;
		var duplicate_a_new_left,duplicate_b_new_left;
		var duplicate_a_left = parseInt(this._cross_slide.style.left);
		var duplicate_b_left = parseInt(this._cross_slide2.style.left);
		
		
		
		var sliderWidth = ((this._actualWidth+this.get_sliderShowGap()));
		
		///if slide a left is bigger than the the length of one slide (+ gap) than scroll along slide b cause they both visible.
		if ((duplicate_a_left+options.speed) > sliderWidth && duplicate_b_left!=0 && duplicate_a_left!=0)
		{
		    var diff = Math.sqrt(duplicate_b_left*duplicate_b_left);
		    change = diff;
		    this.debug("sliderWidth : "+sliderWidth);
		    this.debug("next left : "+(duplicate_a_left + diff));
		    this.debug("fixed left : "+diff);
		    duplicate_a_new_left = parseInt(duplicate_a_left + diff );
		}
		///if slide a left is bigger than the the length of one slide (+ gap) than scroll along slide b cause they both visible.
		else if (duplicate_a_left < sliderWidth )
		{
		    change = options.speed;
			duplicate_a_new_left = parseInt(duplicate_a_left + options.speed );
			
		}
		///else , swap slides. (when left equal to slider width)
		else
		{
		    change = options.speed;
			duplicate_a_new_left = (this._actualWidth+this.get_sliderShowGap())*(-1);
			duplicate_a_new_left +=  options.speed;
		}
		

        sliderWidth = (this._actualWidth+this.get_sliderShowGap())*(-1);
        
        ///change the second duplication
        if(duplicate_a_new_left>0)
        {
            duplicate_b_new_left = duplicate_a_new_left + sliderWidth;
        }
        else
        {
            duplicate_b_new_left = duplicate_a_new_left - sliderWidth;
        }
        
        

        ///set it.
		this._cross_slide.setStyle({"left" : duplicate_a_new_left+'px' });
        this._cross_slide2.setStyle({"left" : duplicate_b_new_left+'px' });	
        
        
        
        this.debug('');
		this.debug("Slide a : " + duplicate_a_new_left);
		this.debug("Slide b : " + duplicate_b_new_left);
		var total = (Math.sqrt(parseInt(duplicate_a_new_left)*parseInt(duplicate_a_new_left)) + Math.sqrt(parseInt(duplicate_b_new_left)*parseInt(duplicate_b_new_left)));
	    this.debug("total : " + total);
		

        return change;
	}
	
	,_normalize: function()
	{
	    if(this._duplicationPosition)
	        return ;
       
       
	    this._actualWidth = $(this.get_key()+"_hidden").getWidth() ;
        this.debug('actual width: ' + this._actualWidth);
	    
        this.debug('setting duplication offsets...');
        this._cross_slide.setStyle({ left : 0+'px'  });
        this._cross_slide2.setStyle({ left : (-1)*(this._actualWidth + this.get_sliderShowGap())+'px' });
        this.debug('_cross_slide2 left: ' + (-1)*(this._actualWidth + this.get_sliderShowGap()));
        this.debug('settings duplication offsets done.');
        
        this._duplicationPosition = true;
	}
	
	,getHtml: function()
	{
		return this.get_items().join(' ');
	}
	
	,debug: function(str)
	{
	    
	    if(this.get_debug())
	    {
	        if(Prototype.Browser.Gecko)
	            console.debug(str);
	        else if(Prototype.Browser.IE)
	        {
	            var ie_console = $("TraceConsole");
                if(ie_console!=undefined)
                {
                   
                    Sys.Debug.trace(str);
                }
	        }
	    }
	}

}



///Static
local.gigya.controls.SlideBox.Collection = new Array();
local.gigya.controls.SlideBox.getByKey = function(key)
{
    var lb = null;
    Array.forEach(this.Collection,function(item)
    {
        if(item.get_key() == key)
            lb = item;
    },null);
    
    return lb;
}

local.gigya.controls.SlideBox.registerClass('local.gigya.controls.SlideBox', Sys.UI.Control);

if(typeof(Sys)!=='undefined')Sys.Application.notifyScriptLoaded();