/// <reference name="MicrosoftAjax.js"/>

Type.registerNamespace("Cted");

Cted.CustomEffect = function(element) {
    Cted.CustomEffect.initializeBase(this, [element]);
}

Cted.CustomEffect.prototype = {
    initialize: function() {
        Cted.CustomEffect.callBaseMethod(this, 'initialize');
        
		this._initialEffectAnimationValues = "";
		this._initialEffectStyleValues = new Object();
		this._initialContentActionValue = new Object();
		this._initialEffectClassValues = new Object();
		
		this._animatedEffectAnimationValues = "";
		this._animatedEffectStyleValues = new Object();
		this._animatedContentActionValue = new Object();
		this._animatedEffectClassValues = new Object();
		
        this._setupValues();
        
        this._expandingEffect = null;
        this._closingEffect = null;
        this._expanding = false;
        this._expanded = false;
        
        // Add custom initialization here

		if (!this.get_EventControlID())
		{
			this._eventControlID = this.get_element().id;
		}
		
		if (this.get_IsMorphEffect())
		{
			this._startMorphAnimationDelegate = Function.createDelegate(this, this._startMorphAnimationHandler);
			this._endMorphAnimationDelegate = Function.createDelegate(this, this._endMorphAnimationHandler);
	        
			$addHandler(this.get_EventControl(), this.get_StartAnimation(), this._startMorphAnimationDelegate);
			$addHandler(this.get_EventControl(), this.get_EndAnimation(), this._endMorphAnimationDelegate);
        }
        
        if (this.get_IsToggleEffect())
        {
			this._toggleAnimationDelegate = Function.createDelegate(this, this._toggleAnimationHandler);
			
			$addHandler(this.get_EventControl(), this.get_StartAnimation(), this._toggleAnimationDelegate);
			
			if (window[this.get_ToggleGroup()] == null)
			{
				window[this.get_ToggleGroup()] = new Array();
			}
			
			Array.add(window[this.get_ToggleGroup()], this.get_element().id);
			
			if (!this.get_Toggled())
			{
				this._addInitialCssClasses();
				this._toggle();
			}
			else
			{
				this._addAnimatedCssClasses();
			}
        }
    },
    dispose: function() {        
        //Add custom dispose actions here
		
		if (this._startMorphAnimationDelegate)
			$removeHandler(this.get_EventControl(), this.get_StartAnimation(), this._startMorphAnimationDelegate);
		if(this._endMorphAnimationDelegate)
			$removeHandler(this.get_EventControl(), this.get_EndAnimation(), this._endMorphAnimationDelegate);
			
		if(this._toggleAnimationDelegate)
			$removeHandler(this.get_EventControl(), this.get_EndAnimation(), this._toggleAnimationDelegate);
        
        Cted.CustomEffect.callBaseMethod(this, 'dispose');
    },
    _setupValues : function() {
		var serializer = Sys.Serialization.JavaScriptSerializer;
		
        for (var i = 0; i < this.get_Actions().length; i++)
        {
			switch (this.get_Actions()[i].EffectType)
			{
				default:
					break;
				case 0:
					this._initialEffectAnimationValues = this._initialEffectAnimationValues + this.get_Actions()[i].Key + ": " + this.get_Actions()[i].InitialState + ";";
					this._animatedEffectAnimationValues = this._animatedEffectAnimationValues + this.get_Actions()[i].Key + ": " + this.get_Actions()[i].AnimatedState + ";";
					break;
				case 1:
					this._initialEffectStyleValues[this.get_Actions()[i].Key] = this.get_Actions()[i].InitialState;
					this._animatedEffectStyleValues[this.get_Actions()[i].Key] = this.get_Actions()[i].AnimatedState;
					break;
				case 2:
					for (var k in this.get_Actions()[i].InitialContent)
						this._initialContentActionValue[this.get_Actions()[i].ControlID] = this.get_Actions()[i].InitialContent[k];
					for (var k in this.get_Actions()[i].AnimatedContent)
						this._animatedContentActionValue[this.get_Actions()[i].ControlID] = this.get_Actions()[i].AnimatedContent[k];
					break;
				case 3:
					if (!this.get_Actions()[i].ControlID)
						this.get_Actions()[i].ControlID = this.get_element().id;
						
					this._initialEffectClassValues[this.get_Actions()[i].ControlID] = this.get_Actions()[i].InitialState;
					this._animatedEffectClassValues[this.get_Actions()[i].ControlID] = this.get_Actions()[i].AnimatedState;
					break;
			}
        }
    },
    
    _startMorphAnimationHandler : function() {
    if ((this.get_StartAnimation() == this.get_EndAnimation()) && this._expanded)
			return;
		$(this.get_element().id).morph(this._animatedEffectAnimationValues, {
			beforeStart: Function.createDelegate(this, this._beforeStartMorphAnimationHandler), 
			afterFinish: Function.createDelegate(this, this._afterStartMorphAnimationHandler)
		});
    },
    _beforeStartMorphAnimationHandler : function(effect) {
		if (this._closingEffect)
			this._closingEffect.cancel(); 
		this._expandingEffect = effect; 
		this._expanding = true;
		
		for (var controlID in this._initialEffectClassValues)
		{
			Sys.UI.DomElement.addCssClass($get(controlID),this._initialEffectClassValues[controlID]);
		}
		
		for (var controlID in this._animatedEffectClassValues)
		{
			Sys.UI.DomElement.removeCssClass($get(controlID),this._animatedEffectClassValues[controlID]);
		}
		
		effect.element.setStyle(this._animatedEffectStyleValues); 
    },
    _afterStartMorphAnimationHandler : function(effect) {
  for (var controlID in this._animatedContentActionValue)
		{
			$get(controlID).innerHTML = this._animatedContentActionValue[controlID];
		}
		this._expanding = false;
		this._expanded = true; 
    },
    
    _endMorphAnimationHandler : function() {
    if ((this.get_StartAnimation() == this.get_EndAnimation()) && !this._expanded)
			return;
		$(this.get_element().id).morph(this._initialEffectAnimationValues, {
			beforeStart: Function.createDelegate(this, this._beforeEndMorphAnimationHandler), 
			afterFinish: Function.createDelegate(this, this._afterEndMorphAnimationHandler)
		});
    },
    _beforeEndMorphAnimationHandler : function(effect) {
		this._expanding == false;
		if (this._expandingEffect)
			this._expandingEffect.cancel();
		this._closingEffect = effect;
    },
    _afterEndMorphAnimationHandler : function(effect) {
		this._expanded = false;
		
		for (var controlID in this._initialEffectClassValues)
		{
			Sys.UI.DomElement.removeCssClass($get(controlID),this._initialEffectClassValues[controlID]);
		}
		
		for (var controlID in this._animatedEffectClassValues)
		{
			Sys.UI.DomElement.addCssClass($get(controlID),this._animatedEffectClassValues[controlID]);
		}
		
		 for (var controlID in this._initialContentActionValue)
		{
			$get(controlID).innerHTML = this._initialContentActionValue[controlID];
		}
		
		effect.element.setStyle(this._initialEffectStyleValues);
    },
    
    _toggleAnimationHandler : function() {
		
		if (this.get_Toggled())
		{
			if (!this.get_ToggleGroup())
			{
				this._addInitialCssClasses();
				
				for (var controlID in this._initialContentActionValue)
				{
					$get(controlID).innerHTML = this._initialContentActionValue[controlID];
				}
				
				this.set_Toggled(false);
				
				this._toggle();
			}
		}
		else
		{
			this._addAnimatedCssClasses();
			
			
			
			for (var controlID in this._animatedContentActionValue)
			{
				$get(controlID).innerHTML = this._animatedContentActionValue[controlID];
			}
			
			if (this.get_ToggleGroup())
			{
				this._resetToggleGroupItems();
			}
			this.set_Toggled(true);
			
			this._toggle();
			

		}
    },
    _toggle : function() {
		Effect.toggle(this.get_element().id,this.get_ToggleEffect().toLowerCase(), {  
			duration:   0.55, 
			fps:        200, 
			from:       0.0,
			to:         1.0,
			queue:      'end'
		  } );
    },
    _resetToggleGroupItems : function() {
		for (var i = 0; i < window[this.get_ToggleGroup()].length; i++)
		{
			if (window[this.get_ToggleGroup()][i] != this.get_element().id)
			{
				var component = $find(window[this.get_ToggleGroup()][i]);
				
				if (component)
				{
					if (component.get_Toggled())
					{
						component.set_Toggled(false);
						component._toggle();
					
					}
					
					component._addInitialCssClasses();
				}
				
				var component = null;
			}
		}
    },
    _addInitialCssClasses : function() {
		for (var controlID in this._initialEffectClassValues)
		{
			Sys.UI.DomElement.addCssClass($get(controlID),this._initialEffectClassValues[controlID]);
		}
		
		for (var controlID in this._animatedEffectClassValues)
		{
			Sys.UI.DomElement.removeCssClass($get(controlID),this._animatedEffectClassValues[controlID]);
		}
    },
    _addAnimatedCssClasses : function() {
		for (var controlID in this._initialEffectClassValues)
		{
			Sys.UI.DomElement.removeCssClass($get(controlID),this._initialEffectClassValues[controlID]);
		}
		
		for (var controlID in this._animatedEffectClassValues)
		{
			Sys.UI.DomElement.addCssClass($get(controlID),this._animatedEffectClassValues[controlID]);
		}
    },
    
    get_StartAnimation : function() {
        return this._startAnimationEvent;
    },
    set_StartAnimation : function(value) {
        if ( this._startAnimationEvent != value.toLowerCase() )
	    {
		    this._startAnimationEvent = value.toLowerCase();
		    this.raisePropertyChanged( "StartAnimation" );
	    }
    },
    
    get_EndAnimation : function() {
        return this._endAnimationEvent;
    },
    set_EndAnimation : function(value) {
        if ( this._endAnimationEvent != value.toLowerCase() )
	    {
		    this._endAnimationEvent = value.toLowerCase();
		    this.raisePropertyChanged( "EndAnimation" );
	    }
    },
    
    get_Effect : function() {
        return this._effect.toLowerCase();
    },
    set_Effect : function(value) {
        if ( this._effect != value )
	    {
		    this._effect = value;
		    this.raisePropertyChanged( "Effect" );
	    }
    },
    get_ToggleEffect : function() {
        return this._toggleEffect.toLowerCase();
    },
    set_ToggleEffect : function(value) {
        if ( this._toggleEffect != value )
	    {
		    this._toggleEffect = value;
		    this.raisePropertyChanged( "ToggleEffect" );
	    }
    },
    get_Toggled : function() {
        return this._toggled;
    },
    set_Toggled : function(value) {
        if ( this._toggled != value )
	    {
		    this._toggled = value;
		    this.raisePropertyChanged( "Toggled" );
	    }
    },
    get_ToggleGroup : function() {
        return this._toggleGroup;
    },
    set_ToggleGroup : function(value) {
        if ( this._toggleGroup != value )
	    {
		    this._toggleGroup = value;
		    this.raisePropertyChanged( "ToggleGroup" );
	    }
    },
    
    get_EventControl : function() {
        return $get(this.get_EventControlID());
    },
    get_EventControlID : function() {
        return this._eventControlID;
    },
    set_EventControlID : function(value) {
        if (this._eventControlID != value) {
            this._eventControlID = value;
            this.raisePropertyChanged('ControlID');
        }
    },
    
    get_IsMorphEffect : function() {
		return this._isMorphEffect;
    },
    set_IsMorphEffect : function(value) {
        if (this._isMorphEffect != value) {
            this._isMorphEffect = value;
            this.raisePropertyChanged('IsMorphEffect');
        }
    },
    get_IsToggleEffect : function() {
		return this._isToggleEffect;
    },
    set_IsToggleEffect : function(value) {
        if (this._isToggleEffect != value) {
            this._isToggleEffect = value;
            this.raisePropertyChanged('IsToggleEffect');
        }
    },
    
    get_Actions : function() {
        return this._actions;
    },
    set_Actions : function(value) {
		var serializer = Sys.Serialization.JavaScriptSerializer;
		
		var actionsArray = serializer.deserialize(value);
		
        if ( this._actions != actionsArray )
	    {
		    this._actions = actionsArray;
		    this.raisePropertyChanged( "Actions" );
	    }
    }
}
Cted.CustomEffect.registerClass('Cted.CustomEffect', Sys.UI.Control);

if(typeof(Sys)!=='undefined')Sys.Application.notifyScriptLoaded();