{% load i18n %}

<p class="text-center">

<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>

{% if gallery %}
{% include "blocks/DataTables-gallery.html" %}
{% else %}
{% include "blocks/DataTables-content.html" %}
{% endif %}

<script type="text/javascript" language='javascript'>
$('#modal_grid_{{name}}').on('show.bs.modal', function (e) {
    $('#grid_{{name}}_wrapper').appendTo(
        '#modal_grid_{{name}} .modal-body .current-grid');
    $('#window').appendTo(
        '#modal_grid_{{name}} .modal-body .current-sheets');
    $('#grid_{{name}}').DataTable().clear().draw();
    current_modal = $("#modal_grid_{{name}}");
});

$('#modal_grid_{{name}}').on('hide.bs.modal', function (e) {
    $('#grid_{{name}}_wrapper').appendTo(
        '#grid_{{name}}_meta_wrapper');
    $('#window').appendTo('#window_wrapper');
    $('#grid_{{name}}').DataTable().clear().draw();
    current_modal = null;
});

{% if gallery %}
$("#tab-gallery-{{name}}").click(function(){
    current_tab = "gallery";
    gallery_submit_search();
});

$("#tab-grid-{{name}}").click(function(){
    current_tab = "table";
    datatable_submit_search();
});
{% endif %}


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

{% if gallery %}
gallery_submit_search = function(){
    var data = search_get_query_data(query_vars, "{{name}}");
    var nb_select = jQuery("#id_{{name}}-length_image").val();
    if (!nb_select) nb_select = 10;

    var url = "{{source}}json-image?length=" + nb_select + "&submited=1&" + data;
    $.getJSON(url, function(data) {
        var timestamp = Math.floor(Date.now() / 1000);
        var gallery_id = "gallery-" + timestamp;
        $("#tab-content-gallery-{{name}}").html(
            render_gallery(data, "{{name}}", nb_select, gallery_id));
        $("#id_{{name}}-length_image").change(gallery_submit_search);
        register_image_gallery(gallery_id);
        $('.card[data-toggle="tooltip"]').tooltip();
    });

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

datatable_submit_search = function(){
    var data = search_get_query_data(query_vars, "{{name}}");
    var mygrid = jQuery("#grid_{{name}}");
    var url = "{{source}}?submited=1&" + data;
    datatable_{{sname}}.ajax.url(url).load();
    var csv_url = "{{source}}csv?submited=1&" + data;
    $(".{{sname}}-csv").attr("href", csv_url);
    var csv_full_url = "{{source_full}}csv?submited=1&" + data;
    $(".{{sname}}-csv-full").attr("href", csv_full_url);
    {% for slug, name, extra_source in extra_sources %}
    $(".{{slug}}-csv-full").attr("href", '{{extra_source}}csv?submited=1&' + data);
    {% endfor %}

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


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

  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) {
            manage_pinned_search("{{name}}", json);
            return json.rows;
        }
    },
    "select": {
        "style": {% if multiple_select or quick_actions %}'multi'{% else %}'single'{% endif %}
    },
    {% if multiple_select or quick_actions %}"buttons": [
        {% for url, title, icon, target 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}}");
                dt_qa_open(url);
                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": 'lBtip',
    {% else %}
    "dom": 'ltip',
    {% 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', dt_single_enable_disable_submit_button);
  datatable_{{sname}}.on('deselect', dt_single_enable_disable_submit_button);
  {% else %}
  datatable_{{sname}}.on('select', dt_multi_enable_disable_submit_button);
  datatable_{{sname}}.on('deselect', dt_multi_enable_disable_submit_button);
  {% 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 %}

});

  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>