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

Type.registerNamespace("MedeaShopSite");

MedeaShopSite.BlockExpanderControl = function(element) {
    MedeaShopSite.BlockExpanderControl.initializeBase(this, [element]);
}

MedeaShopSite.BlockExpanderControl.prototype = {

    onExpanderClick$handler: null,
    onAnimationEnd$handler: null,

    _frameElement: null,
    _cltExpanded: null,
    _ctlTrigger: null,
    _bExpanding: false,
    _animation: null,

    initialize: function() {
        MedeaShopSite.BlockExpanderControl.callBaseMethod(this, 'initialize');

        var element = this.get_element();

        if(this.get_Expanded()) {
            element.style.height = "auto";
            element.style.visibility = "visible";
            element.style.display = "block";
        } else {
            element.style.height = "0px";
            element.style.visibility = "hidden";
            element.style.display = "none";
        }


        Sys.UI.DomElement.addCssClass($get(this._ctlTrigger), this.get_Expanded() ? "expander_on" : "expander_off");

        this.onExpanderClick$handler = Function.createDelegate(this, this.onExpanderClick);
        this.onAnimationEnd$handler = Function.createDelegate(this, this.onAnimationEnd);

        $addHandler($get(this._ctlTrigger), "click", this.onExpanderClick$handler);
    },

    get_Expanded: function() {
        return $get(this._cltExpanded).value === "1";
    },

    set_Expanded: function(val) {
        $get(this._cltExpanded).value = val ? "1" : "0";
    },

    onExpanderClick: function(e) {

        e.preventDefault();
        e.stopPropagation();

        var elTriger = $get(this._ctlTrigger);

        var bCurrentState = this.get_Expanded();
        Sys.UI.DomElement.removeCssClass(elTriger, bCurrentState ? "expander_on" : "expander_off");


        this.set_Expanded(bCurrentState = !bCurrentState);
        Sys.UI.DomElement.addCssClass(elTriger, bCurrentState ? "expander_on" : "expander_off");
        this._bExpanding = bCurrentState;

        if(this._animation) {
            this._animation.dispose();
            this._animation = null;
        }



        var element = this.get_element();
        var cnt = null;
        for(var i = 0; i < element.childNodes.length;  ++i) {
            if(typeof (element.childNodes[i].style) === "object") {
                cnt = element.childNodes[i];
                break;
            }
        }

        if(this._bExpanding) {
            element.style.height = "0px";
            element.style.visibility = "visible";
            element.style.display = "block";
            var cntSize = Sys.UI.DomElement.getBounds(cnt);
            this._animation = new AjaxControlToolkit.Animation.LengthAnimation(element, 0.4, 20, "style", "height", 0, cntSize.height, "px");
        } else {
            element.style.height = "auto";
            element.style.visibility = "visible";
            element.style.display = "block";
            var cntSize = Sys.UI.DomElement.getBounds(cnt);
            this._animation = new AjaxControlToolkit.Animation.LengthAnimation(element, 0.4, 20, "style", "height", cntSize.height, 0, "px");
        }


        this._animation.add_ended(this.onAnimationEnd$handler);
        this._animation.play();
    },

    onAnimationEnd: function(e) {
        this._animation.remove_ended(this.onAnimationEnd$handler);
        this._animation = null;

        var element = this.get_element();

        if(this._bExpanding) {
            element.style.height = "auto";
            element.style.display = "block";
        } else {
            element.style.height = "auto";
            element.style.display = "none";
        }

    },

    dispose: function() {

        //$removeHandler(this._ctlTrigger, "click", this.onExpanderClick$handler);

        MedeaShopSite.BlockExpanderControl.callBaseMethod(this, 'dispose');
    }
}
MedeaShopSite.BlockExpanderControl.registerClass('MedeaShopSite.BlockExpanderControl', Sys.UI.Control);

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