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

// Register the namespace for the control.
Type.registerNamespace('Ajax');

//
// Define the behavior properties.
//
Ajax.HelpBehavior = function(element) {
    Ajax.HelpBehavior.initializeBase(this, [element]);

    this._helpTitle = null;                      // Custom text for help tooltip.
    this._helpText = null;                      // Custom text for help tooltip.
    this._helpIconUrl = null;                   // Custom image for help icon.
    this._html_HelpIcon = null;                 // Help Icon div html element.
    this._html_HelpPopup = null;                // Help div html element.
    this.img = null;                            // Html element for Help Icon Custom image.
    this._dynamic = null;                       // Show/Hide dynamically with mouseover/mouseout?
}

//
// Create the prototype for the behavior.
//
Ajax.HelpBehavior.prototype = {


    initialize: function() {
        Ajax.HelpBehavior.callBaseMethod(this, 'initialize');

        this._isDynamic = true;

        if (this._dynamic == "False")
            this._isDynamic = false;

        this._onMouseOverHandler = Function.createDelegate(this, this._onMouseOver);
        this._onMouseOutHandler = Function.createDelegate(this, this._onMouseOut);
        this._html_HelpIconOnMouseOverHandler = Function.createDelegate(this, this._html_HelpIconOnMouseOver);
        this._html_HelpIconOnMouseOutHandler = Function.createDelegate(this, this._html_HelpIconOnMouseOut);

        /*
        $addHandlers(this.get_element(),
                     { 'mouseover': this._onMouseOver,
                       'mouseout': this._onMouseOut
                     },
                     this);
        */
        this._initializeHelpBox();
    },

    dispose: function() {
        $clearHandlers(this.get_element());

        Ajax.HelpBehavior.callBaseMethod(this, 'dispose');
    },

    _initializeHelpBox: function() {
        var Element = this.get_element();
        var z = Element.parentNode;
        var _clearFloat = document.createElement("div");
        _clearFloat.style.clear = "both";

        // Create Wrapper div for all elements and move target element in it
        var divOuter = document.createElement("div");
        divOuter.className = "HelpBehavior";
        divOuter.style.display = "inline";
        //divOuter.style.border="solid 1px #000"
        Element.style.styleFloat = "left";
        z.insertBefore(divOuter, Element.nextSibling);
        divOuter.appendChild(Element);
        $addHandlers(divOuter,
                     { 'mouseover': this._onMouseOver,
                       'mouseout': this._onMouseOut
                     },
                     this);

        // Create div element for help box
        if (this._helpText != null) {
            /* Help Icon Image */
            if (this._helpIconUrl != null) {
                img = document.createElement("img");
                img.setAttribute('src', this._imageUrl);
                divOuter.appendChild(img);

                $addHandlers(img,
                {
                    'mouseover': this._html_HelpIconOnMouseOver,
                    'mouseout': this._html_HelpIconOnMouseOut
                },
                this);
            }
            else {
                /* Help Icon div */
                this._html_HelpIcon = document.createElement("div");
                this._html_HelpIcon.innerHTML = "?";
                this._html_HelpIcon.className = "HelpIcon";
                this._html_HelpIcon.style.display = "inline-block";
                if (this._isDynamic)
                    this._html_HelpIcon.style.visibility = "hidden";
                divOuter.appendChild(this._html_HelpIcon);

                $addHandlers(this._html_HelpIcon,
                {
                    'mouseover': this._html_HelpIconOnMouseOver,
                    'mouseout': this._html_HelpIconOnMouseOut
                },
                this);
            }

            /* Help Popup */
            this._html_HelpPopup = document.createElement("div");
            if (this._helpTitle != null)
                this._html_HelpPopup.innerHTML = "<div class='Title'>" + this._helpTitle + "</div>";
            this._html_HelpPopup.innerHTML += this._helpText;
            this._html_HelpPopup.style.display = "none";
            this._html_HelpPopup.className = "HelpPopup";
            divOuter.appendChild(this._html_HelpPopup);

            $addHandlers(this._html_HelpPopup,
                {
                    'mouseover': this._html_HelpIconOnMouseOver,
                    'mouseout': this._html_HelpIconOnMouseOut
                },
                this);
        }
        divOuter.appendChild(_clearFloat);
    },

    //
    // Event delegates
    //
    _onMouseOver: function(e) {
        if (this.get_element() && !this.get_element().disabled) {
            if (this._isDynamic)
                this._html_HelpIcon.style.visibility = "visible";
        }
    },

    _onMouseOut: function(e) {
        if (this.get_element() && !this.get_element().disabled) {
            if (this._isDynamic)
                this._html_HelpIcon.style.visibility = "hidden";
        }
    },

    _html_HelpIconOnMouseOver: function(e) {
        if (this.get_element() && !this.get_element().disabled) {
            this._html_HelpIcon.className = "HelpIcon MouseOver";
            this._html_HelpPopup.style.display = "inline-block";
            var bounds = Sys.UI.DomElement.getBounds(this._html_HelpIcon);
            Sys.UI.DomElement.setLocation(this._html_HelpPopup, bounds.x + bounds.width, bounds.y);
        }
    },

    _html_HelpIconOnMouseOut: function(e) {
        if (this.get_element() && !this.get_element().disabled) {
            this._html_HelpIcon.className = "HelpIcon";
            this._html_HelpPopup.style.display = "none";
        }
    },

    //
    // Behavior properties
    //
    /* Help Popup Title */
    get_helpTitle: function() {
        return this._helpTitle;
    },

    set_helpTitle: function(value) {
        if (this._helpTitle !== value) {
            this._helpTitle = value;
            this.raisePropertyChanged('helpTitle');
        }
    },

    /* Help Popup Text */
    get_helpText: function() {
        return this._helpText;
    },

    set_helpText: function(value) {
        if (this._helpText !== value) {
            this._helpText = value;
            this.raisePropertyChanged('helpText');
        }
    },

    /* Help Icon Image Url */
    get_helpIconUrl: function() {
        return this._helpIconUrl;
    },

    set_helpIconUrl: function(value) {
        if (this._helpIconUrl !== value) {
            this._helpIconUrl = value;
            this.raisePropertyChanged('helpIconUrl');
        }
    },

    /* Show Dynamically? */
    get_dynamic: function() {
        return this._dynamic;
    },

    set_dynamic: function(value) {
        if (this._dynamic !== value) {
            this._dynamic = value;
            this.raisePropertyChanged('dynamic');
        }
    }
}

// Optional descriptor for JSON serialization.
Ajax.HelpBehavior.descriptor = {
    properties: [{ name: 'helpText', type: String },
                    { name: 'helpIconUrl', type: String },
                    { name: 'dynamic', type: String}]
}

// Register the class as a type that inherits from Sys.UI.Control.
Ajax.HelpBehavior.registerClass('Ajax.HelpBehavior', Sys.UI.Behavior);

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