Editors

//Object with the content of one page
function Editor(id) {
    this.id = id;
    this.title = 'Page ' + (this.id + 1);
    this.content = '';
}

function createEditor() {
    var id = editors.length;
    var ed = new Editor(id)

    //Adds menu item
    $('#editorMenu').append('<li data-id="'+ ed.id +'"><a href="#" class="menuLink">'+ ed.title +'</a> <a href="#" class="delete">[X]</a></li>');
    editors.push(ed);

    changeEditor(ed);
}

//Checks so the object isn't deleted
//and returns the object
function getEditor(id) {
    if(editors[id] != undefined) {
        return editors[id];
    }else {
        return false;
    }
}

//Sets title and content from input fields to object
function updateEditor(id) {
    var ed = getEditor(id);
    if(ed !== false) {
        ed.content = $('#editorArea').val();
        ed.title = $('#editorTitle').val();
    }
}

//Gets data from object and changes data in the input fields
function changeEditor(ed) {
    $('li').removeClass('active');
    $('li[data-id='+ed.id+']').addClass('active');
    $('#editorTitle').val(ed.title).data('id', ed.id);
    $('#editorArea').val(ed.content).data('id', ed.id);
}

//Runs if you change page in the menu
$(document).on('click', '.menuLink', function(e) {
    var id = $(this).parent('li').data('id');
    ed = getEditor(id);
    if(ed !== false) {
        changeEditor(editors[id]);
    }
    e.preventDefault();
});

//Runs if you click [X]
$(document).on('click', '.delete', function(e) {
    var id = $(this).parent('li').data('id');
    $('li[data-id='+id+']').remove();

    //Leaves undefined in editors at the index with id
    delete(editors[id]);

    var items = $('#editorMenu > li');
    if(items.length === 0) {
        createEditor();
    }else {
        changeEditor(editors[$(items[0]).data('id')]);
    }

    e.preventDefault();
});

//Runs when you click New page
$('#newPage').on('click', function(e) {
    createEditor();
    e.preventDefault();
});

//Runs when you type in the title field or the textarea
$('#editorTitle, #editorArea').on('keydown keyup', function(e) {
    var id = $(this).data('id');
    updateEditor(id);
});

//All pages
var editors = [];
createEditor();