﻿(function ($) {

Type.registerNamespace("Telerik.Web.UI");

// ---------- jSlideDirection Enum ----------
Telerik.Web.UI.jSlideDirection = function()
{
};

Telerik.Web.UI.jSlideDirection.prototype = 
{
	Up: 1,
	Down: 2,
	Left: 3,
	Right: 4
}

Telerik.Web.UI.jSlideDirection.registerEnum("Telerik.Web.UI.jSlideDirection");


// ---------- jSlide Class ----------
Telerik.Web.UI.jSlide = function(animatedElement, expandAnimation, collapseAnimation, enableOverlay)
{
	this._animatedElement = animatedElement;
	this._element = animatedElement.parentNode;
	this._expandAnimation = expandAnimation;
	this._collapseAnimation = collapseAnimation;
	this._direction = Telerik.Web.UI.jSlideDirection.Down;
	this._expanding = null;
	
	if (enableOverlay == null)
	{
		this._enableOverlay = true;
	}
	else
	{
		this._enableOverlay = enableOverlay;
	}
	
	this._events = null;
	this._overlay = null;

	this._animationEndedDelegate = null;
}

Telerik.Web.UI.jSlide.prototype = 
{
	initialize: function()
	{
		if (Telerik.Web.UI.Overlay.IsSupported() && this._enableOverlay) 
		{
			var animatedElement = this.get_animatedElement();
			this._overlay = new Telerik.Web.UI.Overlay(animatedElement);
			this._overlay.initialize();
		}

		this._animationEndedDelegate = Function.createDelegate(this, this._animationEnded);
	},
	
	dispose: function()
	{
		this._animatedElement = null;
		this._events = null;

		if (this._overlay) 
		{
			this._overlay.dispose();
			this._overlay = null;
		}

		this._animationEndedDelegate = null;
	},
	
	
	// Properties
	get_element : function ()
	{
		return this._element;
	},
	
	get_animatedElement: function()
	{
		return this._animatedElement;
	},
	
	set_animatedElement: function(value)
	{
		this._animatedElement = value;
		
		if (this._overlay)
		{
			this._overlay.set_targetElement(this._animatedElement);
		}
	},
	
	get_direction: function()
	{
		return this._direction;
	},
	
	set_direction: function(value)
	{
		this._direction = value;
	},
	
	get_events: function ()
	{
		if (!this._events)
		{
			this._events = new Sys.EventHandlerList();
		}
		
		return this._events;
	},
	
	// Public methods
	updateSize: function()
	{
		var animatedElement = this.get_animatedElement();
		var element = this.get_element();
		
		var top = 0;
		if (animatedElement.style.top) 
		{
			top = Math.max(parseInt(animatedElement.style.top), 0);
		}
		
		var left = 0;
		if (animatedElement.style.left) 
		{
			left = Math.max(parseInt(animatedElement.style.left), 0);
		}
		
		var height = animatedElement.offsetHeight + top;
		if (element.style.height != height + "px") 
		{
			element.style.height = Math.max(height, 0) + "px";
		}
		
		var width = animatedElement.offsetWidth + left;
		if (element.style.width != width + "px") 
		{
			element.style.width = Math.max(width, 0) + "px";
		}
		
		if (this._overlay)
		{
			this._updateOverlay();
		}
	},
	
	show: function()
	{
		this._showElement();
	},
	
	expand: function()
	{		
		this._expanding = true;
		
		this.get_animatedElement().style.visibility = "hidden";

		this._resetState(true);

		var startPosition = null;
		var finalPosition = null;
		
		switch (this.get_direction())
		{
			case Telerik.Web.UI.jSlideDirection.Up:
			case Telerik.Web.UI.jSlideDirection.Left:
				startPosition = parseInt(this._getSize());
				finalPosition = 0;
				break;
				
			case Telerik.Web.UI.jSlideDirection.Down:
			case Telerik.Web.UI.jSlideDirection.Right:
				startPosition = parseInt(this._getPosition());
				finalPosition = 0;
				break;
		}
		
		this._expandAnimationStarted();
		
		if ((startPosition == finalPosition) ||
			(this._expandAnimation.get_type() == Telerik.Web.UI.AnimationType.None))
		{
			this._setPosition(finalPosition);
			this._animationEnded();
			this.get_animatedElement().style.visibility = "visible";
		}
		else 
		{           
            this._playAnimation(this._expandAnimation, finalPosition);
        }
	},
	
	collapse : function()
	{
	    this._resetState();
	    
		this._expanding = false;
		
		var startPosition = null;
		var finalPosition = null;
		
		var size = parseInt(this._getSize());
		var position = parseInt(this._getPosition());

		switch (this.get_direction())
		{							
			case Telerik.Web.UI.jSlideDirection.Up:
			case Telerik.Web.UI.jSlideDirection.Left:
				startPosition = 0;
				finalPosition = size;
			break;

			case Telerik.Web.UI.jSlideDirection.Down:
			case Telerik.Web.UI.jSlideDirection.Right:
				startPosition = 0;
				finalPosition = position - size;
				break;
		}
		
		this._collapseAnimationStarted();
		
		if ((startPosition == finalPosition) ||
			(this._collapseAnimation.get_type() == Telerik.Web.UI.AnimationType.None))
		{
			this._setPosition(finalPosition);
			this._animationEnded();
		}
		else 
		{    		
		    this._playAnimation(this._collapseAnimation, finalPosition);
		}
	},	
	
	// Events
	add_collapseAnimationStarted : function(handler)
	{
		this.get_events().addHandler('collapseAnimationStarted', handler);
	},
	
	remove_collapseAnimationStarted : function(handler)
	{
		this.get_events().removeHandler('collapseAnimationStarted', handler);        
	},
	
	add_collapseAnimationEnded : function(handler)
	{
		this.get_events().addHandler('collapseAnimationEnded', handler);
	},
	
	remove_collapseAnimationEnded : function(handler)
	{
		this.get_events().removeHandler('collapseAnimationEnded', handler);        
	},
	
	add_expandAnimationStarted : function(handler)
	{
		this.get_events().addHandler('expandAnimationStarted', handler);
	},
	
	remove_expandAnimationStarted : function(handler)
	{
		this.get_events().removeHandler('expandAnimationStarted', handler);        
	},
	
	add_expandAnimationEnded : function(handler)
	{
		this.get_events().addHandler('expandAnimationEnded', handler);
	},
	
	remove_expandAnimationEnded : function(handler)
	{
		this.get_events().removeHandler('expandAnimationEnded', handler);        
	},	
	
	// Private methods
	_playAnimation: function(animationSettings, finalPosition)
	{
	    this.get_animatedElement().style.visibility = "visible";
	    
	    var query = this._getAnimationQuery();
	    
	    var animatedProperty = this._getAnimatedStyleProperty();
		
	    var params = {}; 
	    params[animatedProperty] = finalPosition;
		
	    var duration = animationSettings.get_duration();

		query.animate(params, 
	        duration, 
	        Telerik.Web.UI.AnimationType.toEasing(animationSettings.get_type()), 
	        this._animationEndedDelegate
	    );
	},
	
	_expandAnimationStarted: function()
	{
		this._raiseEvent('expandAnimationStarted', Sys.EventArgs.Empty);
	},
	
	_collapseAnimationStarted: function()
	{
		this._raiseEvent('collapseAnimationStarted', Sys.EventArgs.Empty);
	},
	
	_animationEnded: function ()
	{
	    if (this._expanding)
	    {
	        this.get_element().style.overflow = "visible";
		    this._raiseEvent('expandAnimationEnded', Sys.EventArgs.Empty);
	    }
	    else
	    {
		    this.get_element().style.display = "none";
		    this._raiseEvent('collapseAnimationEnded', Sys.EventArgs.Empty);
	    }
	
	    if (this._overlay)
	    {
		    this._updateOverlay();
	    }
	},
	
	_updateOverlay : function ()
	{
		this._overlay.updatePosition();
	},
	
	_showElement: function()
	{
		var animatedElement = this.get_animatedElement();
		var element = this.get_element();
		
		if (!element) 
			return;
		
		if (!element.style) 
			return;
		
		// Table elements do not work well with "block" display.
		element.style.display = (element.tagName.toUpperCase() != "TABLE") ? "block" : "";
		animatedElement.style.display = (animatedElement.tagName.toUpperCase() != "TABLE") ? "block" : "";
		
		element.style.overflow = "hidden";
	},
	
	_resetState : function(resetPosition)
	{
	    this._stopAnimation();
		this._showElement();
		
		var animatedElement = this.get_animatedElement();
		
		if (resetPosition) 
		{
			var animatedElement = this.get_animatedElement();
			
			switch (this.get_direction())
			{
				case Telerik.Web.UI.jSlideDirection.Up:
					animatedElement.style.top = animatedElement.offsetHeight + "px";;
					break;
					
				case Telerik.Web.UI.jSlideDirection.Down:
					animatedElement.style.top = -animatedElement.offsetHeight + "px";
					break;
					
				case Telerik.Web.UI.jSlideDirection.Left:
					animatedElement.style.left = animatedElement.offsetWidth + "px";
					break;
					
				case Telerik.Web.UI.jSlideDirection.Right:
					animatedElement.style.left = -animatedElement.offsetWidth + "px";
					break;
					
				default:
					Error.argumentOutOfRange("direction", this.get_direction(), "Slide direction is invalid. Use one of the values in the Telerik.Web.UI.SlideDirection enumeration.");
					break;
			}
		}
	},
	
	_stopAnimation: function()
	{
	    //Stop the current Animation and force the animated elements to their final positions.
        this._getAnimationQuery().stop(false, true);
	},
	
	_getAnimationQuery: function()
	{    
        var animatedElements = [ this.get_animatedElement() ];
        
        if (this._enableOverlay && this._overlay)
        {        
		    animatedElements[animatedElements.length] = this._overlay.get_element();
		}
		
		return $(animatedElements);
	},
	
	_getSize : function ()
	{
		var animatedElement = this.get_animatedElement();
		
		switch (this.get_direction())
		{
			case Telerik.Web.UI.jSlideDirection.Up:
			case Telerik.Web.UI.jSlideDirection.Down:
				return animatedElement.offsetHeight;
				break;

			case Telerik.Web.UI.jSlideDirection.Left:
			case Telerik.Web.UI.jSlideDirection.Right:
				return animatedElement.offsetWidth;
				break;
				
			default:
				return 0;
		}
	},
	
	_setPosition : function (value)
	{
		var animatedElement = this.get_animatedElement();
		var animatedProperty = this._getAnimatedStyleProperty();
		animatedElement.style[animatedProperty] = value;		
	},
	
	_getPosition: function()
	{
		var animatedElement = this.get_animatedElement();
		var animatedProperty = this._getAnimatedStyleProperty();

		return animatedElement.style[animatedProperty];
	},
	
	_getAnimatedStyleProperty: function()
	{
		switch (this.get_direction())
		{
			case Telerik.Web.UI.jSlideDirection.Up:
			case Telerik.Web.UI.jSlideDirection.Down:
				return "top";
				
			case Telerik.Web.UI.jSlideDirection.Left:
			case Telerik.Web.UI.jSlideDirection.Right:
				return "left";
		}
	},
	
	_raiseEvent : function (eventName, eventArgs)
	{
		var handler = this.get_events().getHandler(eventName);

		if (handler)
		{
			if (!eventArgs)
			{
				eventArgs = Sys.EventArgs.Empty;
			}

			handler(this, eventArgs);
		}
	}
}

Telerik.Web.UI.jSlide.registerClass('Telerik.Web.UI.jSlide', null, Sys.IDisposable);

})($telerik.$);
if(typeof(Sys)!=='undefined')Sys.Application.notifyScriptLoaded();