path: root/ishtar_common/templates/blocks/DataTables.html

{% load i18n l10n %}

{% localize off %}
<button id='search_{{name}}' class='btn btn-primary search_button'
        type="button">
    {% trans "Search" %}</button>

{% if url_new %}
<p><a href="#" onclick="open_window('{{url_new}}');">{{new_message}}</a></p>
{% endif %}

<div class="modal fade table-modal-lg" tabindex="-1" role="dialog"
     aria-hidden="true" id="modal_grid_{{name}}">
  <div class="modal-dialog full modal-lg">
      <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
          <div class="current-sheets"></div>
          <div class="current-grid"></div>
      </div>
    </div>
  </div>
</div>

{% for source_id, source_label, source_url, columns, column_labels, export_urls in external_sources %}
<div class="modal fade table-modal-lg" tabindex="-1" role="dialog"
     aria-hidden="true" id="modal_grid_{{name}}_{{source_id}}">
    <div class="modal-dialog full modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="current-sheets"></div>
                <div class="current-grid"></div>
            </div>
        </div>
    </div>
</div>
{% endfor %}

{% if external_sources %}
{% include "blocks/DataTables-external-sources.html" %}
{% endif %}
{% if current_model.STATISTIC_MODALITIES or gallery or use_map %}
{% include "blocks/DataTables-tabs.html" %}
{% else %}
{% include "blocks/DataTables-content.html" %}
{% endif %}

<script type="text/javascript">
$('#modal_grid_{{name}}').on('show.bs.modal', function (e) {
    bs_expand_table("{{name}}");
});

$('#modal_grid_{{name}}').on('hide.bs.modal', function (e) {
    bs_hide_table("{{name}}");
});

{% for source_id, source_label, source_url, columns, column_labels, export_urls in external_sources %}
$('#modal_grid_{{name}}_{{source_id}}').on('show.bs.modal', function (e) {
    bs_expand_table("{{name}}_{{source_id}}");
});

$('#modal_grid_{{name}}_{{source_id}}').on('hide.bs.modal', function (e) {
    bs_hide_table("{{name}}_{{source_id}}");
});
{% endfor %}

{% if gallery or use_map %}
$("#tab-grid-{{name}}").click(function(){
    current_tab = "table";
    datatable_submit_search();
});
{% endif %}
{% if gallery %}
$("#tab-gallery-{{name}}").click(function(){
    current_tab = "gallery";
    gallery_submit_search();
});
{% endif %}
{% if use_map %}
$("#tab-map-{{name}}").click(function(){
    current_tab = "map";
    map_submit_search(current_source);
});
{% endif %}
{% if current_model.STATISTIC_MODALITIES %}
$("#tab-stats-{{name}}").click(function(){
    current_tab = "stats";
    stats_submit_search();
});
{% endif %}


var query_vars = new Array({{col_idx|safe}});
var selItems_{{sname}} = new Array();

{% if gallery %}
gallery_submit_search = function(image_page){
    {% if external_sources %}{% for source_id, source_label, source_url, columns, column_labels, export_urls in external_sources %}
    _gallery_submit_search(image_page, query_vars, "{{name}}", "{{source_url}}", "-{{source_id}}");
    {% endfor %}{% endif %}
    return _gallery_submit_search(image_page, query_vars, "{{name}}", "{{source}}");
};
{% endif %}
{% if use_map %}
map_submit_search = function(){
    if (current_source == "default"){
        return _map_submit_search(query_vars, "{{name}}", "{{source}}");
    }
    {% if external_sources %}{% for source_id, source_label, source_url, columns, column_labels, export_urls in external_sources %}
    else if (current_source == "{{source_id}}"){
        return _map_submit_search(query_vars, "{{name}}", "{{source_url}}", "{{source_id}}");
    }
    {% endfor %}{% endif %}
};
{% endif %}

extra_list = [
 "default"{% for source_id, source_label, source_url, columns, column_labels, export_urls in external_sources %},
"{{source_id}}"{% endfor %}
];

sources = [
 "{{source}}"{% for source_id, source_label, source_url, columns, column_labels, export_urls in external_sources %},
 "{{source_url}}"{% endfor %}
];

stats_submit_search = function(){
    {% if external_sources %}{% for source_id, source_label, source_url, columns, column_labels, export_urls in external_sources %}
    _stats_submit_search(query_vars, "{{name}}", "{{source_url}}", "{{source_id}}");
    {% endfor %}{% endif %}
    return _stats_submit_search(query_vars, "{{name}}", "{{source}}");
};

datatable_submit_search = function(not_submited){
    var data = search_get_query_data(query_vars, "{{name}}");
    var mygrid = jQuery("#grid_{{name}}");
    var url = "";
    if (!not_submited){
        url = "{{source}}?submited=1&" + data;
    } else {
        url = "{{source}}?" + data;
    }

    datatable_{{sname}}.ajax.url(url);
    datatable_{{sname}}.draw();
{% if external_sources %}{% for source_id, source_label, source_url, columns, column_labels, export_urls in external_sources %}
    if (!not_submited){
        url = "{{source_url}}?submited=1&" + data;
    } else {
        url = "{{source_url}}?" + data;
    }
    datatable_{{sname}}_{{source_id}}.ajax.url(url);
    datatable_{{sname}}_{{source_id}}.draw();
{% endfor %}{% endif %}

    setTimeout(  // wait for modal-progress to be loaded on the page
        function(){
            $('.modal-progress').modal('show');
        }, 50
    );

    return false;
};

update_submit_args = function(source_cls){
    if (!source_cls) source_cls = "sources-default";
    let data = search_get_query_data(query_vars, "{{name}}");
    let extra = "?submited=1&" + data;
    let csv_url = "{{source}}csv" + extra;
    $("." + source_cls + " .{{sname}}-csv").attr("href", csv_url);
    let csv_full_url = "{{source_full}}csv?submited=1&" + data;
    $("." + source_cls + " .{{sname}}-csv-full").attr("href", csv_full_url);
    {% for slug, name, extra_source in extra_sources %}
    $("." + source_cls + " .{{slug}}-csv-full").attr("href", '{{extra_source}}csv?submited=1&' + data);{% endfor %}
    {% for template in current_model.label_templates %}
    $("." + source_cls + " .{{template.slug}}-labels").attr("href", '{{template.get_baselink_for_labels}}?submited=1&' + data);{% endfor %}

    $("." + source_cls + " .{{sname}}-csv-external").each(function(){
        let url = $(this).attr("href").split('?')[0] + extra;
        $(this).attr("href", url);
    });

    if ($('.modal-progress').length > 0){
        $('.modal-progress').modal('hide');
    }
    return false;
};

update_select_args = function(dt, source_cls){
    let nb_row = dt.rows( { selected: true } ).count();
    $("." + source_cls + " .sl-number").html(nb_row);
    if (nb_row == 0){
        $("." + source_cls + " .selected-lines .sl-whole").show();
        $("." + source_cls + " .selected-lines .sl-selected").hide();
        update_submit_args(source_cls);
        return;
    }
    $("." + source_cls + " .selected-lines .sl-selected").show();
    $("." + source_cls + " .selected-lines .sl-whole").hide();
    let extra_sources = [{% for slug, name, extra_source in extra_sources %}
        ["{{slug}}", "{{name}}", "{{extra_source}}"]{% if not forloop.last %},{% endif %}
    {% endfor %}];
    let extra_tpl = [{% for template in current_model.label_templates %}
        ["{{template.slug}}", "{{template.get_baselink_for_labels}}"]{% if not forloop.last %},{% endif %}
    {% endfor %}];
    update_export_urls(dt, source_cls, "{{sname}}", "{{source}}", "{{source_full}}", extra_sources, extra_tpl);
}

var current_source = "default";

jQuery(document).ready(function(){
  jQuery("#search_{{name}}").click(
    main_submit_search
  );

  {% if external_sources %}
  $("#source_button_default").click(
    function(){
        current_source = "default";
        $(".sources").hide();
        $(".sources-default").show();
        redraw_plots("{{name}}", "default");
        if (current_tab == "map") map_submit_search();
        $(this).parent().children().removeClass("btn-primary").addClass("btn-secondary");
        $(this).removeClass("active").removeClass("btn-secondary").addClass("btn-primary");
        return false;
    }
  );
  {% for source_id, source_label, source_url, columns, column_labels, export_urls in external_sources %}
  $("#source_button_{{source_id}}").click(
    function(){
        current_source = "{{source_id}}";
        $(".sources").hide();
        $(".sources-{{source_id}}").show();
        redraw_plots("{{name}}", "{{source_id}}");
        $("#grid_{{name}}_{{source_id}}").DataTable().clear().draw();
        if (current_tab == "map") map_submit_search();
        $(this).parent().children().removeClass("btn-primary").addClass("btn-secondary");
        $(this).removeClass("active").removeClass("btn-secondary").addClass("btn-primary");
        return false;
    }
  );
  {% endfor %}
  $("#source_button_default").click();
  {% endif %}

  var base_source = "{{source}}";

  if (default_search_vector){
    base_source += "?search_vector=" + default_search_vector + "&submited=1";
  }

  datatable_options = {
    "ajax": {
        "url": base_source,
        "dataSrc": function (json) {
            if (!default_search_vector) manage_pinned_search("{{name}}", json);
            update_submit_args();
            setTimeout(  // 50ms is waited on load so...
                function(){
                    $('.modal-progress').modal('hide');
                }, 50);
            dt_update_badge("default", json.recordsTotal);
            return json.rows;
        }
    },
    "deferLoading": 0,
    "select": {
        "style": {% if multiple_select or quick_actions %}'multi'{% else %}'single'{% endif %}
    },
    {% if multiple_select or quick_actions %}"buttons": [
        {% for url, title, icon, target, is_popup in quick_actions %}
        {
            {% if target == 'one' %}extend: 'selectedSingle',
            {% elif target == 'many' %}extend: 'selected',
            {% endif %}
            className: "btn btn-success",
            text: "{{icon}}",
            titleAttr: "{{title}}",
            action: function (e, dt, node, config) {
                var url = dt_generate_qa_url(dt, "{{url}}");
            {% if is_popup %}
                dt_qa_open(url);
            {% else %}
                window.location.href = url;
            {% endif %}
                return false;
            }
        },
        {% if not forloop.last %},{% endif %}
        {% endfor %}{% if quick_actions%},{% endif %}
        {
            extend: 'selectAll',
            text: '<i class="fa fa-check-circle-o"></i>',
            titleAttr: "{% trans 'Select all items' %}"
        },
        {
            extend: 'selectNone',
            text: '<i class="fa fa-times"></i>',
            titleAttr: "{% trans 'Deselect' %}"
        }
    ],
    "dom": 'liBtp',
    {% else %}
    "dom": 'litp',
    {% endif %}
    "columns": [
        { "data": "id", "visible": false },
        { "data": "link", "orderable": false },{% for col in extra_cols %}
        { "data": "{{col}}", "defaultContent": "-",
          "render": $.fn.dataTable.render.ellipsis( 70, true ) }{% if not forloop.last %},{% endif %}{% endfor %}
    ],
     "initComplete": function(settings, json) {
        var api = new $.fn.dataTable.Api(settings);
        {% if not multiple_select %}dt_single_enable_disable_submit_button(null, api);
        {% else %}dt_multi_enable_disable_submit_button(null, api);{% endif %}
     }
  };

  if (!debug) $.fn.dataTable.ext.errMode = 'none';

  $.extend(datatable_options, datatables_default);
  if (datatables_i18n) datatable_options['language'] = datatables_i18n;
  datatable_{{sname}} = jQuery("#grid_{{name}}").DataTable(datatable_options);

  {% if not multiple_select %}
  datatable_{{sname}}.on(
    'select',
    function(e, dt, type, indexes){
        update_select_args(dt, 'sources-default');
        dt_single_enable_disable_submit_button(e, dt, type, indexes);
    }
  );
  datatable_{{sname}}.on(
    'deselect',
    function(e, dt, type, indexes){
        update_select_args(dt, 'sources-default');
        dt_single_enable_disable_submit_button(e, dt, type, indexes);
    }
  );
  {% else %}
  datatable_{{sname}}.on(
    'select',
    function(e, dt, type, indexes){
        update_select_args(dt, 'sources-default');
        dt_multi_enable_disable_submit_button(e, dt, type, indexes);
    }
  );
  datatable_{{sname}}.on(
    'deselect',
    function(e, dt, type, indexes){
        update_select_args(dt, 'sources-default');
        dt_multi_enable_disable_submit_button(e, dt, type, indexes);
    }
  );
  {% endif %}

{% if external_sources %}{% for source_id, source_label, source_url, columns, column_labels, export_urls in external_sources %}
  var base_external_source = "{{source_url}}";

  if (default_search_vector){
    base_external_source += "?search_vector=" + default_search_vector + "&submited=1";
  }

  datatable_options_{{source_id}} = {
    "ajax": {
        "url": base_external_source,
        "dataSrc": function (json) {
            setTimeout(  // 50ms is waited on load so...
                function(){
                    $('.modal-progress').modal('hide');
                }, 500);
            dt_update_badge("{{source_id}}", json.recordsTotal);
            return json.rows;
        }
    },
    "deferLoading": 0,
    "select": {
        "style": 'multi'
    },
    {% if export_urls %}
    "buttons": [
        {
            extend: 'selectAll',
            text: '<i class="fa fa-check-circle-o"></i>',
            titleAttr: "{% trans 'Select all items' %}"
        },
        {
            extend: 'selectNone',
            text: '<i class="fa fa-times"></i>',
            titleAttr: "{% trans 'Deselect' %}"
        }
    ],
    "dom": 'liBtp',
    {% else %}
    "dom": 'litp',
    {% endif %}
    "columns": [
        { "data": "id", "visible": false },
        { "data": "link", "orderable": false },{% for col in columns %}
        { "data": "{{col}}", "defaultContent": "-",
          "render": $.fn.dataTable.render.ellipsis( 70, true ) }{% if not forloop.last %},{% endif %}{% endfor %}
    ]
  };
  $.extend(datatable_options_{{source_id}}, datatables_default);
  if (datatables_i18n) datatable_options_{{source_id}}['language'] = datatables_i18n;
  datatable_{{sname}}_{{source_id}} = jQuery("#grid_{{name}}_{{source_id}}").DataTable(datatable_options_{{source_id}});
  datatable_{{sname}}_{{source_id}}.on(
    'select',
    function(e, dt, type, indexes){
        update_select_args(dt, 'sources-{{source_id}}');
    }
  );
  datatable_{{sname}}_{{source_id}}.on(
    'deselect',
    function(e, dt, type, indexes){
        update_select_args(dt, 'sources-{{source_id}}');
    }
  );

{% endfor %}{% endif %}

{% if multiple %}
  jQuery("#add_button_{{name}}").click(function (){
    var mygrid = jQuery("#grid_{{name}}");
    var idx = mygrid.getGridParam('selrow');
    var lbl_cols = new Array({{multi_cols|safe}});
    var label = "";
    for (var id in lbl_cols){
        if(id == 1){
            label += " (";
        }else if (id > 1){
            label += " ; ";
        }
        label += mygrid.getCell(idx, lbl_cols[id]);
    }
    if (id > 0){
        label += ")";
    }
    for (id in selItems_{{sname}}){
        if(selItems_{{sname}}[id] == idx){
            return false;
        }
    }
    selItems_{{sname}}.push(idx);
    jQuery("#selectmulti_{{name}}").append(
               "<li id='selected_{{name}}_"+idx+"'>\
<a href='#' class='remove' \
  onclick=\"multiRemoveItem(selItems_{{sname}}, '{{name}}', "+ idx +");\
  return false;\" title=\"{{remove}}\">X</a>" + label + "</li>");
    return true;
  });
  jQuery("#submit_form").click(function (){
    jQuery("#hidden_{{name}}").val(selItems_{{sname}});
    return true;
  });
{% else %}
  jQuery("#submit_form").click(function (){
    var data = datatable_{{sname}}.rows( { selected: true } ).data();
    {% if multiple_select %}
    var value = "";
    for (k in data){
        if (typeof data[k]['id'] != "undefined") {
            if (value) value += ",";
            value += data[k]['id'];
        }
    }
    {% else %}
    var value = data[0]['id'];
    {% endif %}
    jQuery("#hidden_{{name}}").val(value);
    return true;
  });
{% endif %}
  get_search_parameters_from_url();
  datatable_submit_search(true);
});

  function get_next_table_id(c_id){
    var has_current_id = false;

    ids = datatable_{{sname}}.column(0).data();
    for (idx=0 ; idx < ids.length; idx++){
        if (has_current_id) return ids[idx];
        if (ids[idx] == c_id) has_current_id = true;
    }
    return false;
  }
  function get_previous_table_id(c_id){
    var previous_id = 0;

    ids = datatable_{{sname}}.column(0).data();
    for (idx in ids){
        if (ids[idx] == c_id){
            if (previous_id) return previous_id;
            return false;
        }
        previous_id = ids[idx];
    }
    return false;
  }
</script>
{% endlocalize %}