slickgrid.js 10.2 KB
var loader = new Slick.Data.RemoteModel(
    $dj.ajax_get_page, $dj.ajax_search_index);

function search_string() {
    "use strict";
    return $('#text-search').val();
}

var slickgrid = {
    grid: null,

    op_names: {
        eq: ["równy", "równa", "równe"],
        ne: ["różny od", "różna od", "różne od"],
        le: ["mniejszy lub równy", "mniejsza lub równa", "mniejsze lub równe"],
        ge: ["większy lub równy", "większa lub równa", "większe lub równe"],
        bw: "zaczyna się od",
        bn: "nie zaczyna się od",
        ew: "kończy się na",
        en: "nie kończy się na",
        cn: "zawiera",
        nc: "nie zawiera",
        re: "pasuje do wzorca",
        nr: "nie pasuje do wzorca"
    },

    active_id: function(cell) {
        "use strict";
        if (cell === undefined)
            cell = slickgrid.grid.getActiveCell();
        var row = cell.row;
        if (row === undefined)
            return undefined;
        return slickgrid.grid.getDataItem(row).id;
    },

    scroll_search: function() {
        "use strict";
        // data = aktualne filtry i sort_rules
        loader.searchRow(search_string(), function (row) {
            slickgrid.grid.scrollRowToTop(row);
            slickgrid.grid.setActiveCell(row, 0);
        });
    },

    search: function() {
        "use strict";
        if ($dj.filtering_mode) {
            loader.setSearch(search_string());
            slickgrid.grid.scrollRowToTop(0);
            slickgrid.ensure_data();
            slickgrid.grid.setActiveCell(0, 0);
        } else {
            slickgrid.scroll_search();
        }
    },

    ensure_data: function() {
        "use strict";
        var vp = slickgrid.grid.getViewport();
        loader.ensureData(vp.top, vp.bottom);
    },

    reload_data: function() {
        "use strict";
        var vp = slickgrid.grid.getViewport();
        loader.reloadData(vp.top, vp.bottom);
    }
};

var options = {
    editable: false,
    enableAddRow: false,
    enableCellNavigation: true
};

function set_columns() {
    "use strict";
    var chosen_column_ids = $('#column-list').val();
    var chosen_columns = $.map(chosen_column_ids, function(id) {
        return slickgrid.all_columns[id];
    });
    slickgrid.grid.setColumns(chosen_columns);
    slickgrid.grid.autosizeColumns();
    /*$.ajaxJSON({
        method: 'post',
        url: $dj.ajax_save_columns,
        data: {columns: chosen_columns}
    });*/ //TODO
}

function update_filter_row(row) {
    "use strict";
    var field = row.find('.field-select').val();
    var field_info = slickgrid.filter_fields[field];
    var op_select = $('<select/>').addClass('op-select');
    var value_input;
    $.each(field_info.ops, function(i, op) {
        var op_name;
        var op_name_info = slickgrid.op_names[op];
        if (typeof op_name_info !== "string") {
            var gender = 'mfn'.indexOf(field_info.gender);
            op_name = op_name_info[gender];
        } else {
            op_name = op_name_info;
        }
        $('<option/>').text(op_name).val(op).appendTo(op_select);
    });
    if (field_info.options) {
        value_input = $('<select/>').addClass('filter-data');
        $.each(field_info.options, function(i, option) {
            $('<option/>').text(option[1]).val(option[0]).appendTo(value_input);
        });
    } else {
        value_input = $('<input/>').attr('type', 'text');
        value_input.addClass('filter-data');
    }
    row.children().eq(1).empty().append(op_select);
    row.children().eq(2).empty().append(value_input);
}

function add_filter(field) {
    "use strict";
    var filter_table = $('#filter-table');
    var row = $('<tr/>');
    var field_select = $('<select/>').addClass('field-select');

    $.each(slickgrid.filter_fields, function(id, filter_field) {
        var option = $('<option/>').text(filter_field.name).val(id);
        if (id === field) {
            option.prop('selected', true);
        }
        option.appendTo(field_select);
    });
    $('<td/>').append(field_select).appendTo(row);
    row.append($('<td/>')).append($('<td/>'));
    var remove_button = $('<input/>').attr('type', 'button').val('-')
        .addClass('remove-filter');
    $('<td/>').append(remove_button).appendTo(row);
    update_filter_row(row);
    filter_table.append(row);
}

function get_filters() {
    "use strict";
    return {
        group_op: $('#group-op').val(),
        rules: $('#filter-table').find('tr').map(function(i, row) {
            var $row = $(row);
            return {
                'field': $row.find('.field-select').val(),
                'op': $row.find('.op-select').val(),
                'data': $row.find('.filter-data').val()
            };
        }).toArray()
    };
}

$(function() {
    "use strict";
    slickgrid.element = $('#' + slickgrid.grid_element_id);
    slickgrid.grid = new Slick.Grid(
        slickgrid.element, loader.data, slickgrid.columns, options);

    //slickgrid.grid.setSelectionModel(new Slick.RowSelectionModel());

    slickgrid.grid.onViewportChanged.subscribe(function (e, args) {
        slickgrid.ensure_data();
    });

    slickgrid.grid.onSort.subscribe(function (e, args) {
        loader.setSort(args.sortCol.field, args.sortAsc ? 1 : -1);
        slickgrid.ensure_data();
    });

    var timeout_handler;
    var last_active_row;
    slickgrid.grid.onActiveCellChanged.subscribe(function(e, cell) {
        if (cell.row === last_active_row)
            return;
        if (last_active_row !== undefined && edit.changed) {
            if (!window.confirm('Czy chcesz porzucić niezapisane zmiany?')) {
                slickgrid.grid.setActiveCell(last_active_row, 0);
                return;
            }
        }
        last_active_row = cell.row;
        if (cell.row !== undefined) {
            clearTimeout(timeout_handler);
            timeout_handler = setTimeout(function() {
                common.busy_on();
                slickgrid.load_content(slickgrid.active_id(cell));
            }, 500);
        }
    });

    var loadingIndicator = null;
    loader.onDataLoading.subscribe(function () {
        if (!loadingIndicator) {
            loadingIndicator = $(
                "<span class='loading-indicator'><label>Ładowanie..." +
                "</label></span>").appendTo(document.body);
            var $g = slickgrid.element;

            loadingIndicator
                .css("position", "absolute")
                .css("top", $g.position().top + $g.height() / 2 - loadingIndicator.height() / 2)
                .css("left", $g.position().left + $g.width() / 2 - loadingIndicator.width() / 2);
        }

        loadingIndicator.show();
    });

    loader.onDataLoaded.subscribe(function (e, args) {
        for (var i = args.from; i <= args.to; i++) {
            slickgrid.grid.invalidateRow(i);
        }

        slickgrid.grid.updateRowCount();
        slickgrid.grid.render();

        loadingIndicator.fadeOut();
        layout.adjust_grid_size();
        var num = slickgrid.grid.getDataLength();
        document.title = slickgrid.grid_caption + ' (' + num + ')';

        if (!slickgrid.grid.getActiveCell()) {
            var vp = slickgrid.grid.getViewport();
            slickgrid.grid.setActiveCell(vp.top, 0);
        }
    });

    // wyszukiwanie
    var search_timeout_handler;
    $("#text-search").keyup(function (e) {
        if (e.which === 13) {
            slickgrid.search();
        } else if ($dj.auto_search) {
            clearTimeout(search_timeout_handler);
            search_timeout_handler = setTimeout(slickgrid.search, 500);
        }
    });

    if ($dj.filtering_mode) {
        loader.setSearch(search_string());
    }

    $('#search-button').click(slickgrid.search);

    // sortowanie
    loader.setSort($dj.sort_rules || slickgrid.initial_sort_rules);

    // filtry
    var filter_table = $('#filter-table');
    add_filter(slickgrid.main_field);
    $('#choose-filter-dialog').dialog({
        autoOpen: false,
        width: 'auto',
        modal: false,
        buttons: [
            {
                text: "Zapisz filtr"
            },
            {
                text: "Załaduj filtr"
            },
            {
                text: 'Filtruj',
                click: function() {
                    loader.setFilter(get_filters());
                    slickgrid.ensure_data();
                }
            }
        ]
    });
    $('#add-filter-button').click(function() {
        add_filter(slickgrid.main_field);
    });
    $(document).on('change', '.field-select', function() {
        update_filter_row($(this).closest('tr'));
    });
    $(document).on('click', '.remove-filter', function() {
       $(this).closest('tr').remove();
    });

    $('#filter-button').click(function() {
        $('#choose-filter-dialog').dialog('open');
    });

    // TODO ustawić filtr jeśli był zapamiętany
    //loader.setFilters();

    // wybór kolumn
    $('#choose-columns-dialog').dialog({
        autoOpen: false,
        width: 'auto',
        modal: true,
        buttons: [
            {
                text: "Anuluj",
                click: function () {
                    $(this).dialog("close");
                }
            },
            {
                text: "Zatwierdź",
                click: function() {
                    set_columns();
                    $(this).dialog("close");
                }
            }
        ]
    });
    var column_list = $('#column-list');
    $('#show-columns-button').click(function() {
        $('#choose-columns-dialog').dialog('open');
        column_list.multiselect('refresh');
    });
    var column_ids = [];
    function add_column_option(column, selected) {
        var option = $('<option/>');
        option.attr('value', column.id);
        option.prop('selected', selected);
        option.text(column.name);
        column_list.append(option);
    }
    $.each(slickgrid.columns, function(i, column) {
        add_column_option(column, true);
        column_ids.push(column.id);
    });
    $.each(slickgrid.all_columns, function(id, column) {
        if (column_ids.indexOf(id) === -1)
            add_column_option(column, false);
    });
    column_list.multiselect({
        sortable: true
    });

    // load the first page
    slickgrid.grid.onViewportChanged.notify();

    layout.adjust_tabs();
});