effective_datatables 3.6.3 → 3.7.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 509cfa19dfd481e41030c2ba527e34b23b41fdd66485d53923317b43938e0f56
-  data.tar.gz: bfb1dcae3e580fcf1795290cbb543a68f741b2442484289b23f50c421ae98153
+  metadata.gz: 63197015127b15c2f50203c0cd6b8fad50fd441cefed7bee38e7a1755dd3e131
+  data.tar.gz: e3615c89e3c8c3c0b89c107625d4e9c7ed4f75dc356b29bb16b929d6df4bddf7
 SHA512:
-  metadata.gz: ea2b82022025d623e56b0b2b5425b2161dcc7ae4d7697cf46d132ca9216c217a555cf53d30bc47af88323ceb9dfaac42dbf9e97753a9114fb1742709f60aab51
-  data.tar.gz: ee06ea290b341b2047676f5dd79de2165483f8522c05c6f438d920e94ddb85d9fef63ba4795c6539e10bfb6c7486db308597cdd87daa173358d2dcd7476103aa
+  metadata.gz: b3cfa114b29faca24afed1d84ebdc4276de6c802c2a2682dcf288541438127c15fd60f7897142ec13e89d0abdef3d719509aac5e0fce69d9fe0ca2c8f00d5de7
+  data.tar.gz: d296c07e31f1b00b8b94aaecfbda53612016a3fade4f0631078a0a2f33af79dc2ca64f1ef50a421b10c35d6c60b649da74a741927cede4603467bfe32cee4fe6

data/MIT-LICENSE

@@ -1,4 +1,4 @@
-Copyright 2017 Code and Effect Inc.
+Copyright 2019 Code and Effect Inc.
 
 Permission is hereby granted, free of charge, to any person obtaining
 a copy of this software and associated documentation files (the

data/app/assets/javascripts/dataTables/locales/en.lang

@@ -0,0 +1,33 @@
+/**
+ * English - this is the default DataTables ships with
+ *  @name English
+ *  @anchor English
+ *  @author <a href="http://www.sprymedia.co.uk/">Allan Jardine</a>
+ */
+
+{
+	"sEmptyTable":     "No data available in table",
+	"sInfo":           "Showing _START_ to _END_ of _TOTAL_ entries",
+	"sInfoEmpty":      "Showing 0 to 0 of 0 entries",
+	"sInfoFiltered":   "(filtered from _MAX_ total entries)",
+	"sInfoPostFix":    "",
+	"sInfoThousands":  ",",
+	"sLengthMenu":     "&nbsp;with _MENU_ per page",
+	"sLoadingRecords": "Loading...",
+	"sProcessing":     "Processing...",
+	"sSearch":         "Search:",
+	"sZeroRecords":    "No matching records found",
+	"oPaginate": {
+		"sFirst":    "First",
+		"sLast":     "Last",
+		"sNext":     "Next",
+		"sPrevious": "Previous"
+	},
+	"oAria": {
+		"sSortAscending":  ": activate to sort column ascending",
+		"sSortDescending": ": activate to sort column descending"
+	},
+  "buttons": {
+    "colvis": "Show / Hide"
+  }
+}

data/app/assets/javascripts/dataTables/locales/es.lang

@@ -0,0 +1,36 @@
+/**
+ * Spanish translation
+ *  @name Spanish
+ *  @anchor Spanish
+ *  @author Giovanni Ariza, Aristobulo Gomez and Roberto Poo
+ */
+
+{
+	"sProcessing":     "Procesando...",
+  "sLengthMenu":     "Mostrar _MENU_ registros",
+  "sZeroRecords":    "No se encontraron resultados",
+  "sEmptyTable":     "Ningún dato disponible en esta tabla =(",
+  "sInfo":           "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
+  "sInfoEmpty":      "Mostrando registros del 0 al 0 de un total de 0 registros",
+  "sInfoFiltered":   "(filtrado de un total de _MAX_ registros)",
+  "sLengthMenu":     "  con _MENU_ por página",
+  "sInfoPostFix":    "",
+  "sSearch":         "Buscar:",
+  "sUrl":            "",
+  "sInfoThousands":  ",",
+  "sLoadingRecords": "Cargando...",
+  "oPaginate": {
+      "sFirst":    "Primero",
+      "sLast":     "Último",
+      "sNext":     "Siguiente",
+      "sPrevious": "Anterior"
+  },
+  "oAria": {
+      "sSortAscending":  ": Activar para ordenar la columna de manera ascendente",
+      "sSortDescending": ": Activar para ordenar la columna de manera descendente"
+  },
+  "buttons": {
+      "copy": "Copiar",
+      "colvis": "Mostrar/Ocultar"
+  }
+}

data/app/assets/javascripts/dataTables/locales/nl.lang

@@ -0,0 +1,30 @@
+/**
+ * Dutch translation
+ *  @name Dutch
+ *  @anchor Dutch
+ *  @author <a href="http://www.blikgooien.nl/">Erwin Kerk</a> and <i>ashwin</i>
+ */
+
+{
+    "sProcessing": "Bezig...",
+    "sLengthMenu": "_MENU_ resultaten weergeven",
+    "sZeroRecords": "Geen resultaten gevonden",
+    "sInfo": "_START_ tot _END_ van _TOTAL_ resultaten",
+    "sInfoEmpty": "Geen resultaten om weer te geven",
+    "sInfoFiltered": " (gefilterd uit _MAX_ resultaten)",
+    "sInfoPostFix": "",
+    "sSearch": "Zoeken:",
+    "sEmptyTable": "Geen resultaten aanwezig in de tabel",
+    "sInfoThousands": ".",
+    "sLoadingRecords": "Een moment geduld aub - bezig met laden...",
+    "oPaginate": {
+        "sFirst": "Eerste",
+        "sLast": "Laatste",
+        "sNext": "Volgende",
+        "sPrevious": "Vorige"
+    },
+    "oAria": {
+        "sSortAscending":  ": activeer om kolom oplopend te sorteren",
+        "sSortDescending": ": activeer om kolom aflopend te sorteren"
+    }
+}

data/app/assets/javascripts/effective_datatables/filters.js.coffee

@@ -1,3 +1,4 @@
+# Don't scope by .datatables_wrapper here, because it's out of the wrapper!
 $(document).on 'click', 'a[data-apply-effective-datatables-filters]', (event) ->
   event.preventDefault()
   $form = $(event.currentTarget).closest('.effective-datatables-filters')

data/app/assets/javascripts/effective_datatables/flash.js.coffee

@@ -0,0 +1,31 @@
+flash = (message, status = '') ->
+  @context[0].oFeatures.bProcessing = false
+
+  message ||= 'Processing...'
+
+  if status == 'danger'
+    message = 'Error: ' + message
+
+  $processing = $(@table().node()).siblings('.dataTables_processing')
+
+  if status.length > 0
+    $processing.addClass("alert-#{status}")
+
+  $processing.html(message).show()
+
+  timeout = $processing.data('timeout')
+  clearTimeout(timeout) if timeout
+
+  delay = (if status == 'danger' then 4000 else 1500)
+
+  $processing.html(message).data('timeout', setTimeout( =>
+      $processing.html('Processing...')
+      $processing.removeClass('alert-success alert-info alert-warning alert-danger alert-error')
+      $processing.hide()
+      @context[0].oFeatures.bProcessing = true
+    , delay)
+  )
+
+  return @
+
+$.fn.DataTable.Api.register('flash()', flash);

data/app/assets/javascripts/effective_datatables/initialize.js.coffee

@@ -1,14 +1,12 @@
-initializeDataTables = ->
-  $('table.effective-datatable').each ->
-    return if $.fn.DataTable.fnIsDataTable(this)
-
+initializeDataTables = (target) ->
+  $(target || document).find('table.effective-datatable:not(.initialized)').each ->
     datatable = $(this)
-    input_js_options = datatable.data('input-js-options') || {}
-    buttons_export_columns = input_js_options['buttons_export_columns'] || ':not(.col-actions)'
-    simple = ('' + datatable.data('simple') == 'true')
+    options = datatable.data('options') || {}
+    buttons_export_columns = options['buttons_export_columns'] || ':not(.col-actions)'
+    reorder = datatable.data('reorder')
 
-    if input_js_options['buttons'] == false
-      input_js_options['buttons'] = []
+    if options['buttons'] == false
+      options['buttons'] = []
 
     init_options =
       ajax: { url: datatable.data('source'), type: 'POST' }
@@ -16,10 +14,10 @@ initializeDataTables = ->
       buttons: [
         {
           extend: 'colvis',
-          text: 'Show / Hide',
           postfixButtons: [
-            { extend: 'colvisGroup', text: 'Show all', show: ':hidden'},
-            { extend: 'colvisRestore', text: 'Show default'}
+            { extend: 'colvisGroup', text: 'Show all', show: ':hidden', className: 'buttons-colvisGroup-first'},
+            { extend: 'colvisGroup', text: 'Show none', hide: ':visible' },
+            { extend: 'colvisGroup', text: 'Show default', hide: ':not(.colvis-default)', show: '.colvis-default' }
           ]
         },
         {
@@ -49,9 +47,8 @@ initializeDataTables = ->
       deferLoading: [datatable.data('display-records'), datatable.data('total-records')]
       deferRender: true
       displayStart: datatable.data('display-start')
-      dom: "<'row'<'col-sm-12'B>><'row'<'col-sm-12'tr>><'row'<'col-sm-6 dataTables_entries'il><'col-sm-6'p>>"
       iDisplayLength: datatable.data('display-length')
-      language: { 'lengthMenu': '&nbsp;with _MENU_ per page'}
+      language: datatable.data('language')
       lengthMenu: [[5, 10, 25, 50, 100, 250, 500, 9999999], ['5', '10', '25', '50', '100', '250', '500', 'All']]
       order: datatable.data('display-order')
       processing: true
@@ -63,7 +60,7 @@ initializeDataTables = ->
         $table = $(api.table().node())
         $form = $(".effective-datatables-filters[aria-controls='#{$table.attr('id')}']").first()
 
-        params['cookie'] = $table.data('cookie')
+        params['attributes'] = $table.data('attributes')
         params['authenticity_token'] = $table.data('authenticity-token')
 
         if $form.length > 0
@@ -78,8 +75,7 @@ initializeDataTables = ->
       scrollCollapse: true
       pagingType: 'simple_numbers'
       initComplete: (settings) ->
-        initializeReset(this.api())
-        initializeBulkActions(this.api())
+        initializeButtons(this.api())
         initializeSearch(this.api())
       drawCallback: (settings) ->
         $table = $(this.api().table().node())
@@ -95,36 +91,21 @@ initializeDataTables = ->
           if settings['json']['charts']
             drawCharts($table, settings['json']['charts'])
 
-        drawBulkActions($table)
+          $table.children('tbody').trigger('effective-bootstrap:initialize')
 
     # Copies the bulk actions html, stored in a data attribute on the table, into the buttons area
-    initializeBulkActions = (api) ->
-      $table = $(api.table().node())
-
-      if $table.data('bulk-actions')
-        $table.closest('.dataTables_wrapper').children().first().find('.dt-buttons').prepend($table.data('bulk-actions'))
-
-    initializeReset = (api) ->
+    initializeButtons = (api) ->
       $table = $(api.table().node())
+      $buttons = $table.closest('.dataTables_wrapper').children().first().find('.dt-buttons')
 
       if $table.data('reset')
-        $table.closest('.dataTables_wrapper').children().first().find('.dt-buttons').prepend($table.data('reset'))
-
-    # After we perform a bulk action, we have to re-select the checkboxes manually and do a bit of house keeping
-    drawBulkActions = ($table) ->
-      selected = $table.data('bulk-actions-restore-selected-values')
+        $buttons.prepend($table.data('reset'))
 
-      $bulkActions = $table.closest('.dataTables_wrapper').children().first().find('.buttons-bulk-actions').children('button')
+      if $table.data('reorder')
+        $buttons.prepend($table.data('reorder'))
 
-      if selected && selected.length > 0
-        $table.find("input[data-role='bulk-actions-resource']").each (_, input) ->
-          $input = $(input)
-          $input.prop('checked', selected.indexOf($input.val()) > -1)
-
-        $bulkActions.removeAttr('disabled')
-        $table.data('bulk-actions-restore-selected-values', [])
-      else
-        $bulkActions.attr('disabled', 'disabled')
+      if $table.data('bulk-actions')
+        $buttons.prepend($table.data('bulk-actions'))
 
     drawAggregates = ($table, aggregates) ->
       $tfoot = $table.find('tfoot').first()
@@ -152,7 +133,7 @@ initializeDataTables = ->
           api.settings()[0].aoPreSearchCols[index].sSearch = settings.search
 
         if settings.searchHtml  # Append the search html and initialize input events
-          $th.append('<br>' + settings.searchHtml)
+          $th.append(settings.searchHtml)
           initializeSearchEvents($th)
 
     # Sets up the proper events for each input
@@ -169,6 +150,7 @@ initializeDataTables = ->
           $input.on 'change', (event) -> dataTableSearch($(event.currentTarget))
         else if $input.is('input')
           $input.delayedChange ($input) -> dataTableSearch($input)
+          $input.on('paste', -> dataTableSearch($input))
 
     # Do the actual search
     dataTableSearch = ($input) ->   # This is the function called by a select or input to run the search
@@ -177,27 +159,33 @@ initializeDataTables = ->
       table = $input.closest('table.dataTable')
       table.DataTable().column("#{$input.data('column-name')}:name").search($input.val()).draw()
 
-    if simple
-      init_options['dom'] = "<'row'<'col-sm-12'tr>>" # Just show the table
-      datatable.addClass('simple')
+    if reorder
+      init_options['rowReorder'] = { selector: 'td.col-_reorder', snapX: true, dataSrc: datatable.data('reorder-index') }
 
     # Let's actually initialize the table now
-    table = datatable.dataTable(jQuery.extend(init_options, input_js_options))
+    table = datatable.dataTable(jQuery.extend(init_options, options))
+
+    # Fix a tabindex issue
+    table.children('tbody').children('tr').children('td[tabindex]').removeAttr('tabindex')
 
     # Apply EffectiveFormInputs to the Show x per page dropdown
-    if datatable.data('effective-form-inputs')
-      try table.closest('.dataTables_wrapper').find('.dataTables_length select').removeAttr('name').select2(minimumResultsForSearch: 100)
+    try table.closest('.dataTables_wrapper').find('.dataTables_length select').removeAttr('name').select2(minimumResultsForSearch: 100)
+
+    if reorder
+      table.DataTable().on('row-reorder', (event, diff, edit) -> $(event.target).DataTable().reorder(event, diff, edit))
+
+    table.addClass('initialized')
+    table.children('thead').trigger('effective-bootstrap:initialize')
+    true
 
 destroyDataTables = ->
-  $('table.effective-datatable').each ->
-    if $.fn.DataTable.fnIsDataTable(this)
-      $(this).DataTable().destroy()
+  $('.effective-datatables-inline-expanded').removeClass('effective-datatables-inline-expanded')
+  $('table.effective-datatable').each -> try $(this).removeClass('initialized').DataTable().destroy()
 
 $ -> initializeDataTables()
+$(document).on 'effective-datatables:initialize', (event) -> initializeDataTables(event.currentTarget)
+
 $(document).on 'page:change', -> initializeDataTables()
 $(document).on 'turbolinks:load', -> initializeDataTables()
 $(document).on 'turbolinks:render', -> initializeDataTables()
 $(document).on 'turbolinks:before-cache', -> destroyDataTables()
-
-
-

data/app/assets/javascripts/effective_datatables/inline_crud.js.coffee

@@ -0,0 +1,217 @@
+# To achieve inline crud, we use rails' data-remote links, and override their behaviour when inside a datatable
+# This works with EffectiveForm.remote_form which is part of the effective_bootstrap gem.
+
+# We click the New/Edit/Action button from the col-actions
+$(document).on 'ajax:beforeSend', '.dataTables_wrapper .col-actions', (e, xhr, settings) ->
+  $action = $(e.target)
+  $table = $(e.target).closest('table')
+
+  return true if ('' + $action.data('inline')) == 'false'
+
+  $params = $.param({_datatable_id: $table.attr('id'), _datatable_attributes: $table.data('attributes'), _datatable_action: true })
+  settings.url += (if settings.url.indexOf('?') == -1 then '?' else '&') + $params
+
+  if $action.closest('.effective-datatables-inline-row,table.dataTable').hasClass('effective-datatables-inline-row')
+    # Nothing.
+  else if $action.closest('tr').parent().prop('tagName') == 'THEAD'
+    beforeNew($action)
+  else
+    beforeEdit($action)
+
+  true
+
+# We have either completed the resource action, or fetched the inline form to load.
+$(document).on 'ajax:success', '.dataTables_wrapper .col-actions', (event, data) ->
+  $action = $(event.target)
+
+  return true if ('' + $action.data('inline')) == 'false'
+
+  if data.length > 0
+    return true if data.indexOf('Turbolinks.clearCache()') == 0 && data.includes("Turbolinks.visit(")
+    return true if data.indexOf('<html') >= 0
+
+  if ($action.data('method') || 'get') == 'get'
+    if $action.closest('tr').parent().prop('tagName') == 'THEAD' then afterNew($action) else afterEdit($action)
+  else
+    afterAction($action)
+
+  EffectiveForm.remote_form_payload = ''
+  EffectiveForm.remote_form_commit = ''
+  EffectiveForm.remote_form_flash = ''
+
+  true
+
+# There was an error completing something
+$(document).on 'ajax:error', '.dataTables_wrapper', (event) ->
+  $action = $(event.target)
+
+  return true if ('' + $action.data('inline')) == 'false'
+
+  afterError($action)
+
+  EffectiveForm.remote_form_payload = ''
+  EffectiveForm.remote_form_commit = ''
+  EffectiveForm.remote_form_flash = ''
+  true
+
+# Submitting an inline datatables form
+$(document).on 'ajax:beforeSend', '.dataTables_wrapper .col-inline-form', (e, xhr, settings) ->
+  $table = $(e.target).closest('table')
+
+  $params = $.param({_datatable_id: $table.attr('id'), _datatable_attributes: $table.data('attributes') })
+  settings.url += (if settings.url.indexOf('?') == -1 then '?' else '&') + $params
+
+  true
+
+# The inline form has been submitted successfully
+$(document).on 'effective-form:success', '.dataTables_wrapper .col-inline-form', (event, flash) ->
+  $action = $(event.target)
+
+  $tr = $action.closest('tr')
+  $table = $tr.closest('table')
+
+  if $tr.hasClass('effective-datatables-new-resource')
+    $table.DataTable().flash(flash || 'Item created', 'success')
+    $tr.fadeOut('slow')
+
+    $actions = $table.children('thead').find('th.col-actions')
+    $actions.children('svg').remove()
+    $actions.children('a').fadeIn()
+  else
+    $table.DataTable().flash(flash || 'Item updated', 'success')
+    $tr.fadeOut('slow')
+
+  $table.DataTable().draw()
+
+beforeNew = ($action) ->
+  $table = $action.closest('table')
+  $th = $action.closest('th')
+
+  # Hide New Button
+  $th.children('a').hide()
+
+  # Append spinner and show Processing
+  $th.append($table.data('spinner'))
+  $table.DataTable().flash()
+  $table.one 'draw.dt', (event) ->
+    $th.find('a').show().siblings('svg').remove() if event.target == event.currentTarget
+
+afterNew = ($action) ->
+  $tr = $action.closest('tr')
+  $table = $tr.closest('table')
+  $action.siblings('svg').remove()
+
+  html = buildRow($tr.children('th').length, EffectiveForm.remote_form_payload)
+
+  $tr = $("<tr class='effective-datatables-inline-row effective-datatables-new-resource' role='row'>#{html}</tr>")
+  $table.children('tbody').prepend($tr)
+
+  expand($table)
+  $tr.trigger('turbolinks:load')
+  $tr.hide().fadeIn()
+
+beforeEdit = ($action) ->
+  $table = $action.closest('table')
+  $td = $action.closest('td')
+
+  # Hide dropdown
+  $td.find('.dropdown-toggle').dropdown('toggle')
+  $td.children('.btn-group').hide()
+  $td.children('a').hide()
+
+  # Append spinner and show Processing
+  $td.append($table.data('spinner'))
+  $table.DataTable().flash()
+
+afterEdit = ($action) ->
+  $tr = $action.closest('tr')
+  $table = $tr.closest('table')
+
+  html = buildRow($tr.children('td').length, EffectiveForm.remote_form_payload)
+
+  $tr.data('inline-form-original-html', $tr.children().detach())
+  $tr.html(html)
+  $tr.addClass('effective-datatables-inline-row')
+
+  expand($table)
+  $tr.trigger('turbolinks:load')
+  $tr.hide().fadeIn()
+
+# This is when one of the resource actions completes
+afterAction = ($action) ->
+  $table = $action.closest('table')
+
+  if EffectiveForm.remote_form_flash.length > 0
+    flash = EffectiveForm.remote_form_flash[0]
+    $table.DataTable().flash(flash[1], flash[0])
+  else
+    $table.DataTable().flash('Successfully ' + $action.attr('title'), 'success')
+
+  $table.DataTable().draw()
+
+afterError = ($action) ->
+  $table = $action.closest('table')
+  $td = $action.closest('td')
+
+  # Show dropdown
+  $td.children('.btn-group').show()
+
+  # Hide spinner
+  $td.children('svg').hide()
+
+  # Cancel
+  cancel($table)
+
+  # Don't redraw
+  $table.DataTable().flash('unable to ' + ($action.attr('title') || 'complete action'), 'danger')
+
+buildRow = (length, payload) ->
+  "<td class='col-inline-form' colspan='#{length-1}'><div class='container'>#{payload}</div></td>" +
+  "<td class='col-actions col-actions-inline-form'>" +
+    "<a href='#' class='btn btn-sm btn-outline-primary' title='Cancel' data-role='inline-form-cancel'>Cancel</a>" +
+  "</td>"
+
+expand = ($table) ->
+  $wrapper = $table.closest('.dataTables_wrapper').addClass('effective-datatables-inline-expanded')
+  $table.on 'draw.dt', (event) ->
+    $wrapper.removeClass('effective-datatables-inline-expanded') if event.target == event.currentTarget
+
+cancel = ($table) ->
+  $wrapper = $table.closest('.dataTables_wrapper')
+  if $wrapper.find('.effective-datatables-inline-row').length == 0
+    $wrapper.removeClass('effective-datatables-inline-expanded')
+
+# Cancel button clicked. Blow away new tr, or restore edit tr
+# No data will have changed at this point
+$(document).on 'click', ".dataTables_wrapper a[data-role='inline-form-cancel']", (event) ->
+  $tr = $(event.currentTarget).closest('tr')
+
+  if $tr.hasClass('effective-datatables-new-resource')
+    $tr.fadeOut('slow', ->
+      $table = $(this).closest('table')
+
+      $actions = $table.children('thead').find('th.col-actions')
+      $actions.children('svg').remove()
+      $actions.children('a').fadeIn()
+
+      $(this).remove()
+      cancel($table)
+    )
+  else
+    $tr.fadeOut('slow', ->
+      $table = $(this).closest('table')
+      $tr.html($tr.data('inline-form-original-html'))
+
+      $td = $tr.children('.col-actions').first()
+      $td.children('svg').remove()
+
+      $toggle = $td.find('.dropdown-toggle')
+      $toggle.dropdown('toggle') if $toggle.parent().hasClass('show')
+      $td.children('.btn-group').show()
+      $td.children('a').show()
+
+      $tr.removeClass('effective-datatables-inline-row').fadeIn()
+      cancel($table)
+    )
+
+  false