$(document).ready(function(){
    $("a[class='btnslide']").click(

    function()
    {

        var scrollElement = 'html, body';
        $('html, body').each(function () 
        {
            var initScrollTop = $(this).attr('scrollTop');
            $(this).attr('scrollTop', initScrollTop + 1);
            if ($(this).attr('scrollTop') == initScrollTop + 1) 
            {
                scrollElement = this.nodeName.toLowerCase();
                $(this).attr('scrollTop', initScrollTop);
                return false;
            }    
        });


        $this = this;
        $(".top3").each(function()
        {
            if(this.title == "top"+$this.title)
            {
                if($(this).css("display") != "none")
                {
                    $(this).slideUp();
                }
                else
                {
                    $(this).slideDown();
                }
            }
            else
            {
                if($(this).css("display") == "none")
                {
                    $(this).slideDown();
                }
            }
        });
           
        $(".extraTopics").each(function()
        {
            if(this.title == $this.title)
            {
                if($(this).css("display") == "none")
                {
                    $(this).slideDown("slow");
                }
                else
                {
                   $(this).slideUp();
                }
            }
            else
            {
                if($(this).css("display") != "none")
                {
                   $(this).slideUp();
                }
           }
        });

        $(".btnslide").each(function()
        {
            if(this.title == $this.title)
            {
                if($(this).html() == "More topics")
                {
                    $(this).html("Fewer topics");

                }
                else
                {
                    $(this).html("More topics");

                    // scroll back to the correct place
                    // get the title
                    var id = $(this).attr('title');

                    // get the top offset
                    var targetOffset = $('#cat'+id).offset().top;

                    // scroll to the right place
                    $(scrollElement).animate({scrollTop: targetOffset});
                }
            }
            else
            {
                if($(this).html() == "Fewer topics")
                {
                   $(this).html("More topics");
                }
           }
        });
        
        // ensure the clikc doesn't go anywhere
        return false;
    })
    
});

