window.addEvent('domready', function () {

    function getInternetExplorerVersion() {
        var rv = -1; // Return value assumes failure.
        if (navigator.appName == 'Microsoft Internet Explorer') {
            var ua = navigator.userAgent;
            var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
            if (re.exec(ua) != null)
                rv = parseFloat(RegExp.$1);
        }

        return rv;
    }

    function checkVersion() {
        var msg = "You're not using Windows Internet Explorer.";
        var ver = getInternetExplorerVersion();
        if (ver > -1) {
            if (ver >= 8.0)
                msg = "You're using a recent copy of Windows Internet Explorer."
            else
                msg = "You should upgrade your copy of Windows Internet Explorer.";
        }
        alert(msg);
    }

    var ShowArrow = $('ShowArrowSearch');

    ShowArrow.addEvents({
        click: function () {
            var ArrowSearch = $('ArrowSearch');

            var AppearArrow = new Fx.Morph(ArrowSearch, {
                duration: 500,
                link: 'chain',
                transition: 'linear'
            });
            AppearArrow.start({ opacity: [0, 0.9] });
            for (i = 0; i <= 3; i = i + 1) {
                AppearArrow.start({ top: [-25, 25] });
                AppearArrow.start({ top: [25, -25] });
            }
            AppearArrow.start({ opacity: [0.9, 0] });
        }
    });

    function appearSubMenu(Show, CategOrType) {
        var SubMenu = $('dynamicMenu' + CategOrType);

        var appearingSubMenu = new Fx.Morph(SubMenu, {
            duration: 300,
            link: 'chain',
            transition: 'quad:out'
        });
        var ButtonSubMenu = new Fx.Morph('Show' + CategOrType + 'SubMenu', {
            duration: 600,
            link: 'chain',
            transition: 'quad:out'
        });

        if (Show == true) {
            ButtonSubMenu.start({ backgroundColor: ['#FFFFFF', '#7A7A7A'] });
            SubMenu.setStyle('top', 80);
            //SubMenu.setStyle('display', block);
            appearingSubMenu.start({ opacity: [0, 0.9] });

        } else {
            if (SubMenu.getStyle('top') == "80px") {
                ButtonSubMenu.start({ backgroundColor: ['#7A7A7A', '#FFFFFF'] });
                appearingSubMenu.start({ opacity: [0.9, 0] });
                (function(){SubMenu.setStyle('top', -500)}).delay(700);
                //SubMenu.setStyle('display', none);
            }
        }
    }

    var ShowTypeSubMenu = $('ShowTypeSubMenu');

    ShowTypeSubMenu.addEvents({
        click: function () { appearSubMenu(false, 'Category'); appearSubMenu(true, 'Type'); }
    });
    var ShowCategorySubMenu = $('ShowCategorySubMenu');
    ShowCategorySubMenu.addEvents({
        click: function () { appearSubMenu(false, 'Type'); appearSubMenu(true, 'Category'); }
    });
    var SubMenuCategory = $('dynamicMenuCategory');
    SubMenuCategory.addEvents({
        mouseleave: function () { appearSubMenu(false, 'Category'); }
    });
    var SubMenuType = $('dynamicMenuType');
    SubMenuType.addEvents({
        mouseleave: function () { appearSubMenu(false, 'Type'); }
    });

    var DynamicLinks = $$('.dynamicMenuLink');

    DynamicLinks.addEvents({
        mouseover: function () { this.fireEvent('changePhoto'); },
        changePhoto: function () {
            var photo = $$('.dynamicMenuImage');
            photo[0].src = this.title;
            photo[1].src = this.title;
        }
    });


    var inputSearch = $('Chiste_Search');
    var divSearch = $('pnlSearching');

    var highlight = new Fx.Morph(divSearch, {
        duration: 1500,
        link: 'cancel',
        transition: 'quad:out'
    });
    var appearing = new Fx.Morph(divSearch, {
        duration: 300,
        link: 'cancel',
        transition: 'quad:out'
    });

    inputSearch.addEvents({
        focus: function () {
            if (inputSearch.value.contains('Buscar...')) inputSearch.set('value', '');
        },

        keyup: function () {
            if (inputSearch.value.toString().length >= 3) inputSearch.fireEvent('search', 500);
        },

        blur: function () {
            appearing.start({
                opacity: [1, 0]
            });
            if (inputSearch.value.toString().length == 0) inputSearch.set('value', 'Buscar...');
        },

        search: function () {
            if (divSearch.get('opacity') != 1) {
                highlight.start({ backgroundColor: ['#4D90FE', '#fff'] });
                appearing.start({ opacity: [0, 1] });
            }
            var pnlSearchString;
            pnlSearchString = '<div class="lblSearching">';
            pnlSearchString += '<span style="font-weight: bold;">Buscando... ' + inputSearch.value + '</span></div>';
            pnlSearchString += '</div>';
            pnlSearchString += '<div class="lblSubSearching">';
            pnlSearchString += '<span class="lblSubSearchingHeader"><img id="lblSearchingCat" class="lblSearching" alt="loading..." title="Loading Category" src="images/load.gif"/>Categor\xEDas:</span>';
            pnlSearchString += '<span id="SearchingCatResult" class="lblSubSearchingResult"></span></div>';
            pnlSearchString += '</div>';
            pnlSearchString += '<div class="lblSubSearching">';
            pnlSearchString += '<span class="lblSubSearchingHeader"><img id="lblSearchingJoke" class="lblSearching" alt="loading..." title="Loading Jokes" src="images/load.gif"/>Chistes:</span>';
            pnlSearchString += '<span id="SearchingJokeResult" class="lblSubSearchingResult"></span></div>';
            pnlSearchString += '</div>';
            pnlSearchString += '<div class="lblSubSearching">';
            pnlSearchString += '<span class="lblSubSearchingHeader"><img id="lblSearchingUser" class="lblSearching" alt="loading..." title="Loading Users" src="images/load.gif"/>Usuarios:</span>';
            pnlSearchString += '<span id="SearchingUserResult" class="lblSubSearchingResult"></span></div>';
            pnlSearchString += '</div>';
            divSearch.innerHTML = pnlSearchString;


            new Request.HTML({

                url: 'searchScript.aspx?type=category&key=' + inputSearch.value,

                onRequest: function () {
                    var catResult = $('SearchingCatResult');
                    catResult.innerHTML = 'Sin resultados todav\xEDa';
                },

                onComplete: function (response) {
                    $('lblSearchingCat').src = "images/tick.png";
                    $('SearchingCatResult').empty().adopt(response);
                }


            }).send();

            new Request.HTML({

                url: 'searchScript.aspx?type=joke&key=' + inputSearch.value,

                onRequest: function () {
                    var catResult = $('SearchingJokeResult');
                    catResult.innerHTML = 'Sin resultados todav\xEDa';
                },

                onComplete: function (response) {
                    $('lblSearchingJoke').src = "images/tick.png";
                    $('SearchingJokeResult').empty().adopt(response);
                }


            }).send();

            new Request.HTML({

                url: 'searchScript.aspx?type=user&key=' + inputSearch.value,

                onRequest: function () {
                    var catResult = $('SearchingUserResult');
                    catResult.innerHTML = 'Sin resultados todav\xEDa';
                },

                onComplete: function (response) {
                    $('lblSearchingUser').src = "images/tick.png";
                    $('SearchingUserResult').empty().adopt(response);
                }

            }).send();
        }
    });
});
