// Add hover and click behavior for parent cells of punch inputs (radio and checkboxes)
// On parent cell hover, highlight the parent cell by applying 'hovered-cell' class
// On parent cell click, click the child punch input and highlight the parent cell by applying 'selected-cell' class
$(function () {
    var $punchInputs = $('input[type="radio"], input[type="checkbox"]');
    var $punchInputParentCells = $punchInputs.closest('[class*="_ROW"]');

    // Display Mode 1 multi-column input elements do not have a unique parent. Wrap these input elements and their
    // sibling text/other specify cells in a unique parent element.
    var $ambiguousPunchInputParentCells = $punchInputParentCells.filter(function () {
        return $(this).attr('class').indexOf('BS_FLOW_ROW_') !== -1;
    });
    $ambiguousPunchInputParentCells.each(function () {
        var $childCells = $(this).children('td');
        var childGroups = [];
        $childCells.each(function () {
            // Each group of cells associated with an input element begins with a cell with class 'BS_GRID_NORMAL'
            if ($(this).attr('class') === 'BS_GRID_NORMAL') {
                childGroups.push($(this));
                // Override BS_GRID_NORMAL's CSS background color
                $(this).css({ 'backgroundColor': 'transparent' });
            } else {
                childGroups[childGroups.length - 1] = childGroups[childGroups.length - 1].add($(this));
            }
        });
        for (var i = 0; i < childGroups.length; ++i) {
            childGroups[i].wrapAll('<td class="unambiguous-parent-cell"><table style="border-spacing: 0"><tbody><tr></tr></tbody></table></td>');
        }
    });
    $punchInputParentCells = $punchInputParentCells.not($ambiguousPunchInputParentCells).add($('.unambiguous-parent-cell'));

    // When parent cell is hovered, highlight that cell with the 'hovered-cell' class
    $punchInputParentCells.hover(
        function (event) {
            $(event.currentTarget).addClass('hovered-cell');
        },
        function (event) {
            $(event.currentTarget).removeClass('hovered-cell');
        }
    );

    // When parent cell is clicked, click the child punch
    $punchInputParentCells.bind('click.gridMouseOver', function (event) {
        // Do not fulfill the event when the punch element itself is clicked, nor when an associated textbox (e.g., other specify) is clicked
        if ($(event.target).not($punchInputs).not('input[type="text"],textarea').length) {
            var $parentCell = $(event.currentTarget);
            var $childPunch = $parentCell.find($punchInputs);

            // Call the click event on the DOM element itself, to account for the conflicting native "onclick" event
            if ($childPunch.length === 1 && !$(event.target).parent('a').length) {
                $childPunch[0].click();
            }
        }
    });

    // Whenever any punch element is clicked, update the 'selected-cell' state of all parent cells 
    $punchInputs.bind('click.gridMouseOver', function (event) {
        updateParentSelections();
    });

    // Whenever any textbox is updated, update the 'selected-cell' state of all parent cells (accounts for other specify behavior)
    $('input[type="text"],textarea').keyup(function (event) {
        updateParentSelections();
    });

    // When page loads, update the 'selected-cell' state of all parent cells
    updateParentSelections();

    // Updates the 'selected-cell' state of all parent cells
    function updateParentSelections() {
        $punchInputParentCells.removeClass('selected-cell');
        $punchInputs.filter(':checked').closest($punchInputParentCells).addClass('selected-cell');
    }
});