var editableTable = function () {

    var nEditing = null;

    var oTable;

    function events() {

        $(document).on("click", "#new", function (e) {
            e.preventDefault();

            var aiNew = oTable.fnAddData(['', '', '', '', '',
                '<a class="edit" href="">Edit</a>', '<a class="delete" href="">Delete</a>']);
            var nRow = oTable.fnGetNodes(aiNew[0]);
            editRow(oTable, nRow);
            nEditing = nRow;
        });

        $('.datatable').on("click", "a.delete", function (e) {
            e.preventDefault();

            var nRow = $(this).parents('tr')[0];
            oTable.fnDeleteRow(nRow);
        });

        $('.datatable').on("click", "a.edit", function (e) {
            e.preventDefault();

            /* Get the row as a parent of the link that was clicked on */
            var nRow = $(this).parents('tr')[0];

            if (nEditing !== null && nEditing !== nRow) {
                /* Currently editing - but not this row - restore the old before continuing to edit mode */
                restoreRow(oTable, nEditing);
                editRow(oTable, nRow);
                nEditing = nRow;
            } else if (nEditing === nRow && this.innerHTML === "Save") {
                /* Editing this row and want to save it */
                saveRow(oTable, nEditing);
                nEditing = null;
            } else {
                /* No edit in progress - let's start one */
                editRow(oTable, nRow);
                nEditing = nRow;
            }
            return false;
        });
    }

    function restoreRow(oTable, nRow) {
        var aData = oTable.fnGetData(nRow);
        var jqTds = $('>td', nRow);

        for (var i = 0, iLen = jqTds.length; i < iLen; i++) {
            oTable.fnUpdate(aData[i], nRow, i, false);
        }

        oTable.fnDraw();
    }

    function editRow(oTable, nRow) {
        var aData = oTable.fnGetData(nRow);
        var jqTds = $('>td', nRow);
        jqTds[0].innerHTML = '<input type="text" class="form-control" value="' + aData[0] + '">';
        jqTds[1].innerHTML = '<input type="text" class="form-control" value="' + aData[1] + '">';
        jqTds[2].innerHTML = '<input type="text" class="form-control" value="' + aData[2] + '">';
        jqTds[3].innerHTML = '<input type="text" class="form-control" value="' + aData[3] + '">';
        jqTds[4].innerHTML = '<input type="text" class="form-control" value="' + aData[4] + '">';
        jqTds[5].innerHTML = '<a class="edit" href="">Save</a>';
    }

    function saveRow(oTable, nRow) {
        var jqInputs = $('input', nRow);
        oTable.fnUpdate(jqInputs[0].value, nRow, 0, false);
        oTable.fnUpdate(jqInputs[1].value, nRow, 1, false);
        oTable.fnUpdate(jqInputs[2].value, nRow, 2, false);
        oTable.fnUpdate(jqInputs[3].value, nRow, 3, false);
        oTable.fnUpdate(jqInputs[4].value, nRow, 4, false);
        oTable.fnUpdate('<a class="edit" href="">Edit</a>', nRow, 5, false);
        oTable.fnDraw();
    }

    function plugins() {
        oTable = $('.datatable').dataTable({
            "sPaginationType": "bootstrap",
            "sDom": "<'row'<'col-xs-6'l <'toolbar'>><'col-xs-6'f>r>t<'datatable-bottom'<'pull-left'i><'pull-right'p>>"
        });

        $(".toolbar").append('<a id="new" href="javascript:;" class="btn btn-primary mb15 ml15">Add new row</a>');

        $('.chosen').chosen({
            width: "80px"
        });
    }

    return {
        init: function () {
            events();
            plugins();
        }
    };
}();

$(function () {
    "use strict";
    editableTable.init();
});