Event.observe(window, 'load', function() {
    addListeners();
});

function addListeners() {
    var game_edit_array = $$('.game_edit');
    var game_del_array = $$('.game_delete');
    
    game_edit_array.each(function(item) {
        Event.observe(item, 'click', gameEdit);
    });
    
    game_del_array.each(function(item) {
        Event.observe(item, 'click', gameDelete);
    });
}



function gameEdit(e) {
    element = getElementFromEvent(e);
    game_id = getGameId(element);
    
    // Get the existing values from the page.
    old_name = $('game_name_' + game_id).innerHTML.replace(/\'/g, "'");
    old_region = $('game_region_' + game_id).innerHTML.replace(/\'/g, "'");
    old_manual = $('game_manual_' + game_id).innerHTML.replace(/\'/g, "'");
    old_box = $('game_box_' + game_id).innerHTML.replace(/\'/g, "'");
    old_notes = $('game_notes_' + game_id).innerHTML.replace(/\'/g, "'");
    
    // Keep a copy of the old values in hidden elements, so we can revert to them.
    backup = "<input name='old_game_name_" + game_id + "' id='old_game_name_" + game_id + "' type='hidden' value='" + old_name + "' />";
    backup = backup + "<input name='old_game_region_" + game_id + "' id='old_game_region_" + game_id + "' type='hidden' value='" + old_region + "' />";
    backup = backup + "<input name='old_game_manual_" + game_id + "' id='old_game_manual_" + game_id + "' type='hidden' value='" + old_manual + "' />";
    backup = backup + "<input name='old_game_box_" + game_id + "' id='old_game_box_" + game_id + "' type='hidden' value='" + old_box + "' />";
    backup = backup + "<input name='old_game_notes_" + game_id + "' id='old_game_notes_" + game_id + "' type='hidden' value='" + old_notes + "' />";
    
    // Create new entry widgets for changing the data.
    name = "<input name='input_game_name_" + game_id + "' id='input_game_name_" + game_id +"' size='32' type='text' value='" + old_name + "'/>";
    notes = "<input name='input_game_notes_" + game_id + "' id='input_game_notes_" + game_id +"' size='32' type='text' value='" + old_notes + "'/>";
    region = buildRegionDropDown(game_id, old_region);
    manual = buildManualAndBoxDropDown(game_id, old_manual, 'manual');
    box = buildManualAndBoxDropDown(game_id, old_box, 'box');
    
    // Swap the old text for the input boxes.
    $('game_name_' + game_id).innerHTML = name;
    $('game_region_' + game_id).innerHTML = region;
    $('game_manual_' + game_id).innerHTML = manual;
    $('game_box_' + game_id).innerHTML = box;
    $('game_notes_' + game_id).innerHTML = notes;

    // swap the edit button for a save button.
    accept_button = "<img src='images/accept.png' class='accept_game_edit' id='accept_game_" + game_id + "' title='Save' />";
    $('game_edit_span_' + game_id).innerHTML = accept_button;
    
    // Remove the delete button and put a 'cancel' button in its place.
    cancel_button = "<img src='images/cancel.png' class='cancel_game_edit' id='cancel_game_" + game_id + "' title='Cancel' />" + backup;
    $('game_delete_span_' + game_id).innerHTML = cancel_button;
    
    // Hook up the 'accept'/save and cancel buttons.
    accept = $('accept_game_' + game_id);
    cancel = $('cancel_game_' + game_id);
    Event.observe(accept, 'click', doAjaxGameEdit);
    Event.observe(cancel, 'click', cancelGameEdit);
}

function buildManualAndBoxDropDown(gameId, oldValue, type) {
    output = "<select name='input_game_" + type + "_" + gameId + "' id='input_game_" + type + "_" + gameId +"'><option value='1'";
    if(oldValue == 'Yes') { output = output + " selected"; }
    output = output + ">Yes</option><option value='0'";
    if(oldValue == 'No') { output = output + " selected"; }
    output = output + ">No</option><option value='2'";
    if(oldValue == 'N/A') { output = output + " selected"; }
    output = output + ">N/A</option></select>";
    
    return output;
}

function buildRegionDropDown(gameId, oldValue) {
    // These contain comma-separated lists of the names and associated abbreviations.
    region_list_names = $('region_list_names').value;
    region_list_codes = $('region_list_codes').value;
    
    // Split them up.
    region_names = region_list_names.split(',');
    region_codes = region_list_codes.split(',');
    region_count = region_names.length;
    
    // Build the select widget.
    output = "<select name='input_game_region_" + gameId + "' id='input_game_region_" + gameId +"'>";
    for(i = 0; i < region_count; i++) {
        output = output + "<option value='" + region_codes[i] + "'";
        if(oldValue == region_names[i]) { output = output + " selected"; }
        output = output + ">" + region_names[i] + "</option>";
    }
    output = output + "</select>";
    
    return output;
}



function cancelGameEdit(e) {
    element = getElementFromEvent(e);
    game_id = getGameId(element);
    
    restoreGameRow(game_id, true);
}



function restoreGameRow(game_id, useOld) {
    if(!useOld) {
        // Get the new values from the page.
        new_name = $('input_game_name_' + game_id).value;
        new_region = $('input_game_region_' + game_id).value;
        new_manual = $('input_game_manual_' + game_id).value;
        new_box = $('input_game_box_' + game_id).value;
        new_notes = $('input_game_notes_' + game_id).value;
    }
    else {
        // Get the old values from the page.
        new_name = $('old_game_name_' + game_id).value;
        new_region = $('old_game_region_' + game_id).value;
        new_manual = $('old_game_manual_' + game_id).value;
        new_box = $('old_game_box_' + game_id).value;
        new_notes = $('old_game_notes_' + game_id).value;
    }
    
    // Swap the widgets for simple text.
    $('game_name_' + game_id).innerHTML = new_name;
    $('game_notes_' + game_id).innerHTML = new_notes;
    if(!useOld) {
        setNewManualAndBox(game_id, new_manual, 'manual');
        setNewManualAndBox(game_id, new_box, 'box');
        setNewRegion(game_id, new_region);
    }
    else {
        $('game_region_' + game_id).innerHTML = new_region;
        $('game_manual_' + game_id).innerHTML = new_manual;
        $('game_box_' + game_id).innerHTML = new_box;
    }

    // Swap the save button for an edit button.
    edit_button = "<img class='game_edit' id='game_edit_" + game_id + "' src='images/pencil.png' title='Edit' />";
    $('game_edit_span_' + game_id).innerHTML = edit_button;

    // Swap the cancel button for a delete button.
    delete_button = "<img class='game_delete' id='game_delete_" + game_id + "' src='images/cross.png' title='Delete' />";
    $('game_delete_span_' + game_id).innerHTML = delete_button;
    
    // Hook up the edit button.
    edit = $('game_edit_' + game_id);
    del = $('game_delete_' + game_id);
    Event.observe(edit, 'click', gameEdit);
    Event.observe(del, 'click', gameDelete);
}

function setNewManualAndBox(gameId, value, type) {
    elephant = $('game_' + type + '_' + gameId);
    if(value == 1) {
        elephant.innerHTML = 'Yes';
        elephant.className = 'yes';
    }
    else if(value == 2) {
        elephant.innerHTML = 'N/A';
        elephant.className = 'na';
    }
    else {
        elephant.innerHTML = 'No';
        elephant.className = 'no';
    }
}

function setNewRegion(gameId, value) {
    // These contain comma-separated lists of the names and associated abbreviations.
    region_list_names = $('region_list_names').value;
    region_list_codes = $('region_list_codes').value;
    
    // Split them up.
    region_names = region_list_names.split(',');
    region_codes = region_list_codes.split(',');
    region_count = region_names.length;
    
    // Find the name from the code.
    output = 'Unknown';
    for(i = 0; i < region_count; i++) {
        if(value == region_codes[i]) {
            output = region_names[i];
        }
    }
    
    $('game_region_' + gameId).innerHTML = output;
}



function gameDelete(e) {
    element = getElementFromEvent(e);
    game_id = getGameId(element);
    
    doAjaxGameDelete(game_id, element);
}



function getElementFromEvent(e) {
    var tempElement;
    
    if(window.event && window.event.srcElement) {
        tempElement = window.event.srcElement;
    }
    if(e && e.target) {
        tempElement = e.target;
    }
    if(!tempElement) {
        return;
    }
    
    return tempElement;
}

function getGameId(element) {
    tmp_string = element.id; 
    
    tmp_last = tmp_string.lastIndexOf('_');
    game_id = tmp_string.substring((tmp_last + 1), tmp_string.length);
    
    return game_id;
}



function doAjaxGameDelete(gameId, element) {
    tmp_ajax = new Ajax.Request('ajax_game_delete.php', {
         method: 'get',
         parameters: {'id': gameId},
         onSuccess: function (transport) {
             try {
                 data = transport.responseText.evalJSON();
                 if(data.success != "true") {
                     alert(data.error_message);
                 }
                 else {
                     parent_element = element.up().up();
                     parent_element.style.display = 'none';
                 }
             }
             catch(err) {
             }
         }
     });
}



function doAjaxGameEdit(e) {
    element = getElementFromEvent(e);
    game_id = getGameId(element);
    
    // Get the new values from the input widgets.
    new_name = $('input_game_name_' + game_id).value;
    new_region = $('input_game_region_' + game_id).value;
    new_manual = $('input_game_manual_' + game_id).value;
    new_box = $('input_game_box_' + game_id).value;
    new_notes = $('input_game_notes_' + game_id).value;
    
    tmp_ajax = new Ajax.Request('ajax_game_edit.php', {
         method: 'get',
         parameters: {'id': game_id, 'name': new_name, 'region': new_region, 'manual': new_manual, 'box': new_box, 'notes': new_notes},
         onSuccess: function (transport) {
             try {
                 data = transport.responseText.evalJSON();
                 if(data.success != "true") {
                     alert(data.error_message);
                 }
                 else {
                     restoreGameRow(game_id, false);
                 }
             }
             catch(err) {
             }
         }
     });
}