/*****
   Main menu navigation used in Bingo and Casino
   Requires libraries: jQuery
*****/

$(document).ready(function() {
    //If more than one item in the menu then display the menu otherwise will remain hidden
    var gameMenu = $('#jGameMenu');
    var gameMenuTables = gameMenu.find('#jGameMenuTables');
    if (gameMenuTables != null && gameMenuTables.find('td').size() > 1) {
        //Display menu
        gameMenuTables.find('#jGameTable').show();
        GenerateMenus(gameMenu, gameMenuTables, $('#jGameInput'), gameMenu.find('.jGameDataAll'), gameMenu.find('#jGameSelection'));
    }
});

//In postbacks need to read what was the value before the postback and restore the displayed category
function SetSelected(gameMenu, gameMenuTables, gameInput, gameDataAll, gameSelection) {
    var jTdSelectId1 = gameInput.find('.jTdSelectId1').val();
    var jTdSelectId2 = gameInput.find('.jTdSelectId2').val();

    //If first time to arrive to the page (no postback)
    if (jTdSelectId1 == '') {
        jTdSelectId1 = gameMenuTables.find('#jGameTable td.selected').attr('id');
        gameInput.find('.jTdSelectId1').val(jTdSelectId1);
        var subMenuSelect = gameMenuTables.find('div[id^=jGameTable_] td.selected');
        jTdSelectId2 = (subMenuSelect.size() > 0 ? subMenuSelect.attr('id') : '');
        gameInput.find('.jTdSelectId2').val(jTdSelectId2);
    }
    else {
        //Remove the pre-selected and set one in input as set
        gameMenuTables.find('td.selected').removeClass('selected');
        gameMenuTables.find('td#' + jTdSelectId1).addClass('selected');
        var subCategoryIdTd = jTdSelectId1;
        if (jTdSelectId2 != '') {
            gameMenuTables.find('td#' + jTdSelectId2).addClass('selected');
            subCategoryIdTd = jTdSelectId2;
        }

        //Move back games from the category to the all list games
        gameSelection.find('span').appendTo(gameDataAll);
        //Copy games in selected category to the visible area        
        var subCategoryId = subCategoryIdTd.substring(subCategoryIdTd.indexOf('_') + 1);
        var categoryGames = gameMenu.find('#jGames_' + subCategoryId + ' span');
        $(categoryGames).each(function() {
            gameDataAll.find('span[class=' + $(this).attr('class') + ']').appendTo(gameSelection);
        });
    }

    if (jTdSelectId2 != '') {
        gameMenuTables.find('#jGameTable_' + jTdSelectId1.substring(jTdSelectId1.indexOf('_') + 1)).show();
    }
}

//To save seek time pass all div sections needed at the begining
//???RxG: ToDo: Use ids, find all areas at the begining and reuse
//???RxG: Do not do changes in html if not needed - ex. remove class selected or append (do only one with everything)
//???RxG: Lazy load images
function GenerateMenus(gameMenu, gameMenuTables, gameInput, gameDataAll, gameSelection) {

    SetSelected(gameMenu, gameMenuTables, gameInput, gameDataAll, gameSelection);

    ////Apply to all cells in the menu tables
    gameMenuTables.find('td').each(function() {

        ////Initialize TDs - create the table menu buttons dynamically
        $(this).html('<a href="javascript:"><div class="jLeft"><div class="jRight"><span>' + this.innerHTML + '</span></div></div></a>');
        //Moves the 'selected' class from 'td' to the anchor element
        $(this).filter('.selected').removeClass('selected').find('a').addClass('selected');

        ////Initialize ANCHORs inside TDs - attach events to be fired when click on menu items
        $(this).find('a').click(function() {

            //Hide menu table and unselect the selected elements and select the new
            var tableId = $(this).parents('table:first').parent().attr('id');
            //If main menu hide submenus
            if (tableId.indexOf('_') < 0)
                gameMenuTables.find('div[id^=jGameTable_]').hide();

            gameMenuTables.find('#' + tableId + ' a.selected').removeClass('selected');
            $(this).addClass('selected');

            //Get the ID of the anchor clicked (it is in the parent element)
            var anchorId = $(this).parent().attr('id');
            var categoryId = anchorId.substring(anchorId.indexOf('_') + 1);

            //Store ID of the TD clicked depending if child/parent (for postback)
            if (categoryId.indexOf('_') < 0) {
                gameInput.find('.jTdSelectId1').val('jGameCategory_' + categoryId);
                gameInput.find('.jTdSelectId2').val('');
            }
            else {
                gameInput.find('.jTdSelectId2').val('jGameCategory_' + categoryId);
            }

            var submenu = gameMenuTables.find('#jGameTable_' + categoryId);
            if (submenu.size() > 0) {
                //If click on main menu initialize submenus and propagate selection down to submenus
                submenu.show();
                submenu.find('a:first').trigger('click');
            }
            else {
                //Move back games from the category to the all list of games
                gameSelection.find('span').appendTo(gameDataAll);
                //Copy games in selected category to the visible area
                var categoryGames = gameMenu.find('#jGames_' + categoryId + ' span');
                $(categoryGames).each(function() {
                    gameDataAll.find('span[class=' + $(this).attr('class') + ']').appendTo(gameSelection);
                });
            }
            //Webtrends tracking
            //dcsMultiTrack('DCS.dcsuri', 'gamemenu-SLOT.htm', 'WT.ti', 'jCategories', 'DCSext.Choice', categoryId);

            return false;
        });
    });
    ////Changes styles of table menu - first/last element in menu use different images
    gameMenuTables.find('td:first').find('div[class*=jLeft]').removeClass('jLeft').addClass('jLeftFirst');
    gameMenuTables.find('td:last').find('div[class*=jRight]').removeClass('jRight').addClass('jRightLast');
}

//After loading page this function starts loading background hover images
$(window).load(function() {
    var preload = new Array();
    for (i = 0; i <= 9; i++) {
        preload[i] = new Image();
    }
    var prefix = '/cmsdocs/furniture/slotsNav_';
    preload[0].src = prefix + 'over_leftEnd.gif';
    preload[1].src = prefix + 'over_left.gif';
    preload[2].src = prefix + 'over_right.gif';
    preload[3].src = prefix + 'over_rightEnd.gif';
    preload[4].src = prefix + 'over_middle.gif';
    preload[5].src = prefix + 'pressed_leftEnd.gif';
    preload[6].src = prefix + 'pressed_left.gif';
    preload[7].src = prefix + 'pressed_right.gif';
    preload[8].src = prefix + 'pressed_rightEnd.gif';
    preload[9].src = prefix + 'pressed_middle.gif';

    var img = document.createElement('img');
    $(img).bind('load', function() {
        if (preload[0]) {
            this.src = preload.shift();
        }
    }).trigger('load');
});