﻿Type.registerNamespace("Legacy");

// Component Declaration
//#region
Legacy.SearchObituaries = function(element)
{
    Legacy.SearchObituaries.initializeBase(this, [element]);

    // Constants
    //#region
    this._tabs =
    [
        { index: new Number(0), name: "ByPerson" },
        { index: new Number(1), name: "ByNewspaper" }
    ];
    //#endregion

    // Fields
    //#region
    this._firstName = null;
    this._lastName = null;
    this._countries = null;
    this._dateRange = null;
    this._states = null;
    this._newspapers = null;
    this._keyword = null;
    this._search = null;
    this._byPersonCollapsedTabImage = null;
    this._byPersonExpandedTabImage = null;
    this._byNewspaperCollapsedTabImage = null;
    this._byNewspaperExpandedTabImage = null;
    this._expandedState = null;
    this._selectedTabState = null;
    this._drillDownList = null;
    //#endregion
}
//#endregion

// Component Prototype
//#region
Legacy.SearchObituaries.prototype =
{
    // Constructors
    //#region
    initialize: function()
    {
        Legacy.SearchObituaries.callBaseMethod(this, "initialize");
        var selectByPersonTabDelegate = Function.createDelegate(this, this._selectByPersonTab);
        var selectNewspaperTabDelegate = Function.createDelegate(this, this._selectByNewspaperTab);
        var expandDelegate = Function.createDelegate(this, this.expand);
        var collapseDelegate = Function.createDelegate(this, this.collapse);
        var search_mouseDownDelegate = Function.createDelegate(this, this._search_mousedown);
        var search_mouseUpDelegate = Function.createDelegate(this, this._search_mouseup);

        // Add image map event handlers
        $addHandler(this._getHotSpots(this.get_byPersonCollapsedTabImage())[0], "click", selectNewspaperTabDelegate);
        $addHandler(this._getHotSpots(this.get_byPersonCollapsedTabImage())[1], "click", expandDelegate);
        $addHandler(this._getHotSpots(this.get_byPersonExpandedTabImage())[0], "click", selectNewspaperTabDelegate);
        $addHandler(this._getHotSpots(this.get_byPersonExpandedTabImage())[1], "click", collapseDelegate);
        $addHandler(this._getHotSpots(this.get_byNewspaperCollapsedTabImage())[0], "click", selectByPersonTabDelegate);
        $addHandler(this._getHotSpots(this.get_byNewspaperCollapsedTabImage())[1], "click", expandDelegate);
        $addHandler(this._getHotSpots(this.get_byNewspaperExpandedTabImage())[0], "click", selectByPersonTabDelegate);
        $addHandler(this._getHotSpots(this.get_byNewspaperExpandedTabImage())[1], "click", collapseDelegate);
        $addHandlers(this.get_search(), { "mousedown": search_mouseDownDelegate, "mouseup": search_mouseUpDelegate, "mouseout": search_mouseUpDelegate }, this);
        $addHandlers(this.get_countries().get_element(), { "change": Function.createDelegate(this, this._countryChangeHandler) }, this);
        $addHandlers(this.get_states().get_element(), { "change": Function.createDelegate(this, this._stateChangeHandler) }, this);

        this.add_propertyChanged(this._propertyChangedHandler);
        this._initUI();
    },
    dispose: function()
    {
        $clearHandlers(this.get_search());
        $clearHandlers(this.get_countries().get_element());
        $clearHandlers(this.get_states().get_element());
        Legacy.SearchObituaries.callBaseMethod(this, "dispose");
    },
    //#endregion

    // Control Properties
    //#region
    get_firstName: function()
    {
        return this._firstName;
    },
    set_firstName: function(value)
    {
        this._firstName = value;
    },
    get_lastName: function()
    {
        return this._lastName;
    },
    set_lastName: function(value)
    {
        this._lastName = value;
    },
    get_countries: function()
    {
        return this._countries;
    },
    set_countries: function(value)
    {
        this._countries = value;
    },
    get_dateRange: function()
    {
        return this._dateRange;
    },
    set_dateRange: function(value)
    {
        this._dateRange = value;
    },
    get_states: function()
    {
        return this._states;
    },
    set_states: function(value)
    {
        this._states = value;
    },
    get_newspapers: function()
    {
        return this._newspapers;
    },
    set_newspapers: function(value)
    {
        this._newspapers = value;
    },
    get_keyword: function()
    {
        return this._keyword;
    },
    set_keyword: function(value)
    {
        this._keyword = value;
    },
    get_search: function()
    {
        return this._search;
    },
    set_search: function(value)
    {
        this._search = value;
    },
    get_byPersonCollapsedTabImage: function()
    {
        return this._byPersonCollapsedTabImage;
    },
    set_byPersonCollapsedTabImage: function(value)
    {
        this._byPersonCollapsedTabImage = value;
    },
    get_byPersonExpandedTabImage: function()
    {
        return this._byPersonExpandedTabImage;
    },
    set_byPersonExpandedTabImage: function(value)
    {
        this._byPersonExpandedTabImage = value;
    },
    get_byNewspaperCollapsedTabImage: function()
    {
        return this._byNewspaperCollapsedTabImage;
    },
    set_byNewspaperCollapsedTabImage: function(value)
    {
        this._byNewspaperCollapsedTabImage = value;
    },
    get_byNewspaperExpandedTabImage: function()
    {
        return this._byNewspaperExpandedTabImage;
    },
    set_byNewspaperExpandedTabImage: function(value)
    {
        this._byNewspaperExpandedTabImage = value;
    },
    get_expandedState: function()
    {
        return this._expandedState;
    },
    set_expandedState: function(value)
    {
        this._expandedState = value;
    },
    get_selectedTabState: function()
    {
        return this._selectedTabState;
    },
    set_selectedTabState: function(value)
    {
        this._selectedTabState = value;
    },
    get_drillDownList: function()
    {
        return this._drillDownList;
    },
    set_drillDownList: function(value)
    {
        this._drillDownList = Sys.Serialization.JavaScriptSerializer.deserialize(value)
    },
    //#endregion

    // Properties
    //#region
    /// <summary>Gets a value indicating whether the control is currently expanded.</summary>
    get_expanded: function()
    {
        return this.get_expandedState().value === true.toString();
    },
    /// <summary>Sets the expanded state of the currently selected tab.</summary>
    set_expanded: function(value)
    {
        var e = Function._validateParams(arguments, [{ name: "value", type: Boolean, mayBeNull: false, optional: false}]);
        if (e) throw e;

        if (value.valueOf() != this.get_expanded().valueOf())
        {
            this.get_expandedState().value = value ? "true" : "false";
            this.raisePropertyChanged("expanded");
        }
    },
    /// <summary>Gets the currently selected tab.</summary>
    get_selectedTab: function()
    {
        try
        {
            return this._tabs[new Number(this.get_selectedTabState().value)];
        }
        catch (e)
        {
            Error.invalidOperation("The currently selected tab can not be determined. " + e);
        }
    },
    /// <summary>Sets the currently selected tab by index.</summary>
    set_selectedTab: function(index)
    {
        var e = Function._validateParams(arguments, [{ name: "index", type: Number, integer: true, mayBeNull: false, optional: false}]);
        if (e) throw e;

        if ((index.valueOf() < 0) || (index.valueOf() > this._tabs.length))
        {
            throw Error.argumentOutOfRange("index", index.valueOf());
        }

        if (index.valueOf() !== this.get_selectedTab().index.valueOf())
        {
            this.get_selectedTabState().value = index.toString();
            this.raisePropertyChanged("selectedTab");
        }
    },
    //#endregion

    // Methods
    //#region
    /// <summary>Expands the currently selected tab.</summary>
    expand: function()
    {
        this.set_expanded(true);
    },
    /// <summary>Collapses the currently selected tab.</summary>
    collapse: function()
    {
        this.set_expanded(false);
    },
    /// <summary>Resets the control to its initial state.</summary>
    reset: function()
    {
        this.get_firstName().reset();
        this.get_lastName().reset();
        this.get_countries().reset();
        this.get_states().reset();
        this.get_newspapers().reset();
        this.get_keyword().reset();
        this.collapse();

        switch (this.get_selectedTab().name)
        {
            case "ByPerson":
                this.get_dateRange().set_selectedIndex(1);      // Past 3 days
                break;

            case "ByNewspaper":
                this.get_dateRange().set_selectedIndex(0);      // Past 24 hours
                break;
        }
    },
    validate: function()
    {
        var lastName = this.get_lastName().get_element();
        var newspapers = this.get_newspapers().get_element();

        switch (this.get_selectedTab().name)
        {
            case "ByPerson":
                if (lastName.value.trim().length < 2 || lastName.value == "Last Name")
                {
                    alert("Please enter at least two characters of the last name and resubmit your search.");
                    return false;
                }
                break;

            case "ByNewspaper":
                if (newspapers.selectedIndex == -1 || newspapers.selectedIndex == 0)
                {
                    alert("Please select a newspaper and resubmit your search.");
                    return false;
                }
                else
                {
                    if (lastName.value.length > 0 && lastName.value != "Last Name")
                    {
                        if (lastName.value.trim().length < 2 || lastName.value == "Last Name")
                        {
                            alert("Please enter at least two characters of the last name and resubmit your search.");
                            return false;
                        }
                    }
                }
                break;
        }

        return true;
    },
    //#endregion

    // Event Handlers
    //#region
    _selectByPersonTab: function(event)
    {
        this.set_selectedTab(0);
    },
    _selectByNewspaperTab: function(event)
    {
        this.set_selectedTab(1);
    },
    _search_mousedown: function(event)
    {
        Sys.UI.DomElement.addCssClass(this.get_search(), "searchmousedown");
    },
    _search_mouseup: function(event)
    {
        Sys.UI.DomElement.removeCssClass(this.get_search(), "searchmousedown");
    },
    _propertyChangedHandler: function(sender, eventArgs)
    {
        switch (eventArgs._propertyName)
        {
            case "expanded":
                sender._updateExpandedUI();
                break;

            case "selectedTab":
                sender._updateSelectedTabUI();
                sender._updateTabStops();
                sender.reset();
                break;
        }
    },
    _countryChangeHandler: function(event)
    {
        var countries = this.get_drillDownList().Countries;
        var currentCountryIndex = this.get_countries().get_element().selectedIndex;
        var country = countries[currentCountryIndex];
        var states = country.States;
        this.get_states().bind(states);
        if (country.ID == 0)
        {
            this.get_states().disable();
        }

        if ((this.get_selectedTab().name == "ByPerson") && (country.ID != 0) && !this.get_expanded())
        {
            this.expand();    // Automatically expand the search box to display the state drop down if "United States" or "Canada" was selected.
            this.get_states().get_element().focus();
        }
    },
    _stateChangeHandler: function(event)
    {
        var countries = this.get_drillDownList().Countries;
        var currentCountryIndex = this.get_countries().get_element().selectedIndex;
        var country = countries[currentCountryIndex];
        var states = country.States;
        var currentStateIndex = this.get_states().get_element().selectedIndex;
        var newspapers = (states != null) ? states[currentStateIndex].Newspapers : null;
        this.get_newspapers().bind(newspapers);
    },
    //#endregion

    // Private Helper Methods
    //#region
    _getHotSpots: function(image)
    {
        var imageMap = $get(image.useMap.substr(1));
        return ((imageMap !== undefined) && (imageMap !== null)) ? imageMap.areas : null;
    },
    _initUI: function()
    {
        this.get_countries().bind(this.get_drillDownList().Countries);
        this._updateExpandedUI();
        this._updateSelectedTabUI();
        this._updateTabStops();
    },
    _updateExpandedUI: function()
    {
        var element = this.get_element();
        var expanded = this.get_expanded();

        Sys.UI.DomElement.addCssClass(element, expanded ? "expanded" : "collapsed");
        Sys.UI.DomElement.removeCssClass(element, expanded ? "collapsed" : "expanded");

        if (!expanded)
        {
            switch (this.get_selectedTab().name)
            {
                case "ByPerson":
                    this.get_keyword().reset();
                    this.get_states().reset();
                    this.get_newspapers().reset();
                    break;

                case "ByNewspaper":
                    this.get_firstName().reset();
                    this.get_lastName().reset();
                    this.get_keyword().reset();
                    break;
            }
        }

        this._updateCss();
    },
    _updateSelectedTabUI: function()
    {
        var element = this.get_element();
        var selectedTabName = this.get_selectedTab().name;

        Sys.UI.DomElement.addCssClass(element, (selectedTabName == "ByPerson") ? "byPerson" : "byNewspaper");
        Sys.UI.DomElement.removeCssClass(element, (selectedTabName == "ByPerson") ? "byNewspaper" : "byPerson");
        this._updateCss();
    },
    _updateCss: function()
    {
        var element = this.get_element();
        var selectedTabName = this.get_selectedTab().name;
        var expanded = this.get_expanded();

        switch (selectedTabName)
        {
            case "ByPerson":
                Sys.UI.DomElement.removeCssClass(element, "byNewspaperCollapsed");
                Sys.UI.DomElement.removeCssClass(element, "byNewspaperExpanded");
                Sys.UI.DomElement.addCssClass(element, expanded ? "byPersonExpanded" : "byPersonCollapsed");
                Sys.UI.DomElement.removeCssClass(element, expanded ? "byPersonCollapsed" : "byPersonExpanded");
                break;

            case "ByNewspaper":
                Sys.UI.DomElement.removeCssClass(element, "byPersonCollapsed");
                Sys.UI.DomElement.removeCssClass(element, "byPersonExpanded");
                Sys.UI.DomElement.addCssClass(element, expanded ? "byNewspaperExpanded" : "byNewspaperCollapsed");
                Sys.UI.DomElement.removeCssClass(element, expanded ? "byNewspaperCollapsed" : "byNewspaperExpanded");
                break;
        }
    },
    _updateTabStops: function()
    {
        switch (this.get_selectedTab().name)
        {
            case "ByPerson":
                this.get_firstName().get_element().tabIndex = 1;
                this.get_lastName().get_element().tabIndex = 2;
                this.get_countries().get_element().tabIndex = 3;
                this.get_dateRange().get_element().tabIndex = 4;
                this.get_states().get_element().tabIndex = 5;
                this.get_newspapers().get_element().tabIndex = 6;
                this.get_keyword().get_element().tabIndex = 7;
                this.get_search().tabIndex = 8;
                break;

            case "ByNewspaper":
                this.get_countries().get_element().tabIndex = 1;
                this.get_states().get_element().tabIndex = 2;
                this.get_newspapers().get_element().tabIndex = 3;
                this.get_dateRange().get_element().tabIndex = 4;
                this.get_firstName().get_element().tabIndex = 5;
                this.get_lastName().get_element().tabIndex = 6;
                this.get_keyword().get_element().tabIndex = 7;
                this.get_search().tabIndex = 8;
                break;
        }
    }
    //#endregion
}
//#endregion

// Component Descriptor
//#region
Legacy.SearchObituaries.descriptor =
{
    properties:
    [
        { name: "firstName", type: Object },
        { name: "lastName", type: Object },
        { name: "countries", type: Object },
        { name: "dateRange", type: Object },
        { name: "states", type: Object },
        { name: "newspapers", type: Object },
        { name: "keyword", type: Object },
        { name: "search", type: Object },
        { name: "byPersonCollapsedTabImage", type: Object },
        { name: "byPersonExpandedTabImage", type: Object },
        { name: "byNewspaperCollapsedTabImage", type: Object },
        { name: "byNewspaperExpandedTabImage", type: Object },
        { name: "expandedState", type: Boolean },
        { name: "selectedTabState", type: Object },
        { name: "drillDownList", type: String }
    ]
}
//#endregion

Legacy.SearchObituaries.registerClass("Legacy.SearchObituaries", Sys.UI.Control);

if (typeof (Sys) !== "undefined")
{
    Sys.Application.notifyScriptLoaded();
}
