From 38a47b8eff80b889bcb395ad20532cc47c3273a9 Mon Sep 17 00:00:00 2001
From: lmstrand <lmstrand@gmail.com>
Date: Fri, 24 Nov 2023 14:08:21 +0200
Subject: [PATCH] Bug 35396: Replace Datatables' column filters throttling with
 input timeout

This patch replaces throttling filter events with a typing timeout for datatable filtering events. This patch should increase filtering responsiveness to datatables that have column filtering enabled across Koha.

To test:
1) Get a datatable with multiple results showing in intranet, for example search patrons with no search string to get all patrons in a filterable datatable result view or open Receive orders page that shows pending orders and order lines in Acquisitions like /cgi-bin/koha/acqui/parcel.pl?invoiceid=xxx
2) Type a character into a Datatable column filtering field
=> notice a filtering event fires right after the first character has been entered
3) Keep typing
=> notice multiple sequential filtering events being fired during the typing and one at the end when typing has stopped
4) Apply patch
5) Start typing into a filtering field
=> Note that during typing no filtering events are being fired unless the time between entering characters exceeds 500ms
6) End typing into the filter field
=> notice that just one filtering event fires at the end of typing if characters were entered sequentially faster than 500ms apart.

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
---
 koha-tmpl/intranet-tmpl/prog/js/datatables.js | 31 ++++++++++++-------
 1 file changed, 19 insertions(+), 12 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/js/datatables.js b/koha-tmpl/intranet-tmpl/prog/js/datatables.js
index 564edbba4b0..c8b916535bb 100644
--- a/koha-tmpl/intranet-tmpl/prog/js/datatables.js
+++ b/koha-tmpl/intranet-tmpl/prog/js/datatables.js
@@ -911,17 +911,24 @@ function _dt_add_filters(table_node, table_dt, filters_options = {}) {
                 }
             }
 
-            var search = $.fn.dataTable.util.throttle( function ( i, val ) {
-                table_dt
-                    .column( i )
-                    .search( val )
-                    .draw();
-            }, 500);
-
-            $( input_type, this ).on( 'keyup change', function () {
-                if ( table_dt.column(i).search() !== this.value ) {
-                    if ( input_type == "input" ) {
-                        search(i, this.value)
+            function delay(callback, ms) {
+                var timer = 0;
+                return function () {
+                    var context = this, args = arguments;
+                    clearTimeout(timer);
+                    timer = setTimeout(function () {
+                        callback.apply(context, args);
+                    }, ms || 0);
+                };
+            }
+
+            $(input_type, this).on('keyup change', (delay(function () {
+                if (table_dt.column(i).search() !== this.value) {
+                    if (input_type == "input") {
+                        table_dt
+                            .column(i)
+                            .search(this.value)
+                            .draw();
                     } else {
                         table_dt
                             .column(i)
@@ -929,7 +936,7 @@ function _dt_add_filters(table_node, table_dt, filters_options = {}) {
                             .draw();
                     }
                 }
-            } );
+            }, 500)));
         } else {
             $(this).html('');
         }
-- 
2.34.1