$jq(document).ready(function () {

    // create toolbar and items
    var tb = $jq('<div id="BannerAcctButtonContent"></div>');

    var table = $jq('<table class="AcctButtonTable" border-spacing="0px"><tbody></tbody></table>');

    var trow = $jq("<tr></tr>");

    // check if we're in god mode
    if (BannerAcctButton_GodMode) {
        trow.append("<td><img src='/Global/Images/godmode-icon.png' style='width: 20px; height: 20px; padding-top: 1px; padding-right: 5px;' alt='You are running in god mode.' /></td>");
    }

    // check if we're in dogfood mode
    if (SpoonApi.IsSupportedBrowser()) {
        trow.append("<td><img id='BannerAcctButton_DogfoodIcon' src='/Global/Images/dogfood-icon.png' style='width: 20px; height: 20px; display: none; padding-top: 1px; padding-right: 5px;' alt='You are running in dogfood mode.' /></td>");

        Util.appendHandler(window, "onload",
            function () {
                setTimeout(
                    function () {
                        var fSandmanDogfood = (SpoonApi.IsPluginInstalled() && typeof (SpoonApi.IsDogfoodMode) == "function" && SpoonApi.IsDogfoodMode());
                        var sVal = Util.getCookie('SpoonVersionOverride');
                        if (fSandmanDogfood || (sVal != 'undefined' && sVal != null && sVal.length > 0)) {
                            // we're in dogfood so show the icon
                            var img = $jq('#BannerAcctButton_DogfoodIcon');
                            img.css('display', 'inline');
                        }
                    }, 1000);

                // autologin timer

                var tries = 0;
                var tid = setInterval(
                    function () {
                        var Spoon_LoginChanged = Util.getCookie('Spoon_LoginChanged');
                        if (Spoon_LoginChanged != null && Spoon_LoginChanged == 'true') {
                            // if the plugin is installed, push a login
                            if (SpoonApi.IsPluginInstalled()) {
                                var fRet = SpoonApi.Login(BannerAcctButton_UserName);
                                if (fRet) {
                                    Util.setCookie('Spoon_LoginChanged', 'false');

                                    // clear the timer if the message got sent
                                    clearInterval(tid);
                                }
                                else {
                                    tries++;

                                    if (tries > 30) {
                                        // clear the timer if the message got sent
                                        clearInterval(tid);
                                    }
                                }
                            }
                        }
                        else {
                            // clear the timer if no login occured
                            clearInterval(tid);
                        }
                    }, 1000);
            });
    }
    table.append(trow);
    tb.append(table);

    // add toolbar account settings
    if (BannerAcctButton_FriendlyName.length > 0) {
        //
        // create menu and items
        //
        var menu = $jq('<div id="BannerAcctButtonMenu" class="jqMenuList"></div>');

        // add account seettings
        var menuItem = $jq("<div class='jqMenuListItem'>Account Settings</div>");
        bindEvents(menuItem, function () { $jq('#' + BannerAcctButton_AccountSettingsId).click(); }, "jqMenuListItemSelected", "jqMenuListItemSelected");
        menu.append(menuItem);
        var menuItem = $jq("<div class='jqMenuListItem'>Billing Information</div>");
        bindEvents(menuItem, function () { $jq('#' + BannerAcctButton_BillingInfoId).click(); }, "jqMenuListItemSelected", "jqMenuListItemSelected");
        menu.append(menuItem);
        var menuItem = $jq("<div class='jqMenuListItem'>Manage Spoon Products</div>");
        bindEvents(menuItem, function () { $jq('#' + BannerAcctButton_ManageSpoonProductsId).click(); }, "jqMenuListItemSelected", "jqMenuListItemSelected");
        menu.append(menuItem);

        // add vendor reports
        if (BannerAcctButton_VendorReportDataSource.length > 0) {
            menu.append("<span class='horz-sep'></span>");

            var innerMenu = $jq('<div id="InnerBannerAcctButtonMenu" class="jqMenuList"></div>');

            menuVendor = $jq('<div id="BannerAcctButtonMenuVendor" class="jqMenuListItem">Vendor Reports</div>');
            $jq(menuVendor).bind("mouseover", function () { $jq(this).addClass("jqMenuListItemSelected"); $jq('#InnerBannerAcctButtonMenu').css("display", "block"); });
            $jq(menuVendor).bind("mouseout", function () { $jq(this).removeClass("jqMenuListItemSelected"); });

            menu.append(menuVendor);

            for (var i = 0; i < BannerAcctButton_VendorReportDataSource.length; ++i) {
                var item = BannerAcctButton_VendorReportDataSource[i];
                innerMenu.append("<span class='jqMenuListItemText'>" + item.CompanyName + "</span>");
                var menuItem = $jq("<div class='jqMenuListItem'>Product Sales</a>");
                bindEvents(menuItem, function () { window.open(item.SalesReportUrl, "_blank") }, "jqMenuListItemSelected", "jqMenuListItemSelected");
                innerMenu.append(menuItem);
                var menuItem = $jq("<div class='jqMenuListItem'>Recent Users</a>");
                bindEvents(menuItem, function () { window.open(item.UserReportUrl, "_blank") }, "jqMenuListItemSelected", "jqMenuListItemSelected");
                innerMenu.append(menuItem);
            }
        }

        menu.append("<span class='horz-sep'></span>");

        menuItem = $jq("<div class='jqMenuListItem'>Help</div>");
        bindEvents(menuItem, function () { window.open("/Help", "_blank") }, "jqMenuListItemSelected", "jqMenuListItemSelected");
        menu.append(menuItem);

        menuItem = $jq("<div class='jqMenuListItem'>Logout</div>");
        bindEvents(menuItem, function () { SpoonApi.Logout(BannerAcctButton_UserName); var btn = document.getElementById(BannerAcctButton_LogoutId); btn.click(); }, "jqMenuListItemSelected", "jqMenuListItemSelected");
        menu.append(menuItem);

        var div = $jq("<div class='jqLoginHead AcctButtonLoggedIn'></div>");
        var innerbutton = $jq("<div class='x-btn-text'>Hi " + BannerAcctButton_FriendlyName + "</div>");
        Spoon_ShadowText(innerbutton, 1, 0, .2, '#000000', 'main-nav-shadow');

        bindEvents(innerbutton, null, "button-over", "button-over");
        div.append(innerbutton);
        bindEvents(div, null, "TabContainerMenuHover", "TabContainerMenuHover");
        var element = $jq("<td></td>");
        element.append(div);
        element.append(menu);
        trow.append(element);

        $jq("#" + BannerAcctButton_PlaceHolderId).append(tb);
        menu.css("left", $jq(div).position().left);
        menu.css("top", 41)

        if (BannerAcctButton_VendorReportDataSource.length > 0) {
            tb.append(innerMenu);
            if ($jq(div).offset().left + $jq(menu).width() + $jq(innerMenu).width() < $jq(window).width()) {
                innerMenu.css("left", $jq(div).position().left + $jq(menu).width());
            } else {
                innerMenu.css("left", $jq(div).position().left - $jq(innerMenu).width());
            }
            innerMenu.css("top", 41);
        }
    }
    else {
        var div = $jq("<div class='jqLoginHead AcctButtonLoggedOut'></div>");
        var innerbutton = $jq("<div class='x-btn-text login-text'>LOGIN</div>");
        Spoon_ShadowText(innerbutton, 1, 0, .2, '#000000', 'main-nav-shadow');
        var element = $jq("<td></td>");
        div.append(innerbutton);
        element.append(div);
        trow.append(element);
        $jq(innerbutton).bind("click", function () { ShowLoginModalDialog(); });
        $jq("#" + BannerAcctButton_PlaceHolderId).append(tb);
    };

    function bindEvents(element, clickFunction, overClass, outClass) {
        if (clickFunction != null) {
            $jq(element).bind("click", clickFunction);
        }
        if (overClass != null) {
            $jq(element).bind("mouseover", function () { $jq(this).addClass(overClass); });
        }
        if (outClass != null) {
            $jq(element).bind("mouseout", function () { $jq(this).removeClass(outClass); });
        }
    }
});