Delay DataTables search by 200ms (references #424)

changelog/55_UNRELEASED_2019-xx-xx.md

@@ -3,4 +3,4 @@
 
 ### General & other fixes
 - Fixed that the meal plan menu entry (sidebar) was not visible when the calendar was disabled (`FEATURE_FLAG_CALENDAR`) (thanks @lwis)
-- Slightly optimized table loading performance (thanks @lwis)
+- Slightly optimized table loading & search performance (thanks @lwis)

public/js/extensions.js

@@ -129,3 +129,19 @@ function IsJsonString(text)
 	}
 	return true;
 }
+
+function Delay(callable, delayMilliseconds)
+{
+	var timer = 0;
+	return function()
+	{
+		var context = this;
+		var args = arguments;
+		
+		clearTimeout(timer);
+		timer = setTimeout(function()
+		{
+			callable.apply(context, args);
+		}, delayMilliseconds || 0);
+	};
+}

public/viewjs/batteries.js

@@ -7,7 +7,7 @@
 $('#batteries-table tbody').removeClass("d-none");
 batteriesTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	batteriesTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.battery-delete-button', function (e)
 {

public/viewjs/batteriesjournal.js

@@ -20,7 +20,7 @@ $("#battery-filter").on("change", function()
 	batteriesJournalTable.column(1).search(text).draw();
 });
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -29,7 +29,7 @@ $("#search").on("keyup", function()
 	}
 
 	batteriesJournalTable.search(value).draw();
-});
+}, 200));
 
 if (typeof GetUriParam("battery") !== "undefined")
 {

public/viewjs/batteriesoverview.js

@@ -7,7 +7,7 @@
 $('#batteries-overview-table tbody').removeClass("d-none");
 batteriesOverviewTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	batteriesOverviewTable.search(value).draw();
-});
+}, 200));
 
 $("#status-filter").on("change", function()
 {

public/viewjs/chores.js

@@ -7,7 +7,7 @@
 $('#chores-table tbody').removeClass("d-none");
 choresTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	choresTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.chore-delete-button', function (e)
 {

public/viewjs/choresjournal.js

@@ -20,7 +20,7 @@ $("#chore-filter").on("change", function()
 	choresJournalTable.column(1).search(text).draw();
 });
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -29,7 +29,7 @@ $("#search").on("keyup", function()
 	}
 
 	choresJournalTable.search(value).draw();
-});
+}, 200));
 
 if (typeof GetUriParam("chore") !== "undefined")
 {

public/viewjs/choresoverview.js

@@ -7,7 +7,7 @@
 $('#chores-overview-table tbody').removeClass("d-none");
 choresOverviewTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	choresOverviewTable.search(value).draw();
-});
+}, 200));
 
 $("#status-filter").on("change", function()
 {

public/viewjs/equipment.js

@@ -55,7 +55,7 @@ function DisplayEquipment(id)
 	);
 }
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -64,7 +64,7 @@ $("#search").on("keyup", function()
 	}
 
 	equipmentTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.equipment-delete-button', function (e)
 {

public/viewjs/locations.js

@@ -7,7 +7,7 @@
 $('#locations-table tbody').removeClass("d-none");
 locationsTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	locationsTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.location-delete-button', function (e)
 {

public/viewjs/manageapikeys.js

@@ -13,7 +13,7 @@ if (createdApiKeyId !== undefined)
 	$('#apiKeyRow_' + createdApiKeyId).effect('highlight', {}, 3000);
 }
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -22,7 +22,7 @@ $("#search").on("keyup", function()
 	}
 
 	apiKeysTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.apikey-delete-button', function (e)
 {

public/viewjs/productgroups.js

@@ -7,7 +7,7 @@
 $('#productgroups-table tbody').removeClass("d-none");
 groupsTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	groupsTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.product-group-delete-button', function(e)
 {

public/viewjs/products.js

@@ -7,7 +7,7 @@
 $('#products-table tbody').removeClass("d-none");
 productsTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	productsTable.search(value).draw();
-});
+}, 200));
 
 $("#product-group-filter").on("change", function()
 {

public/viewjs/quantityunits.js

@@ -7,7 +7,7 @@
 $('#quantityunits-table tbody').removeClass("d-none");
 quantityUnitsTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	quantityUnitsTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.quantityunit-delete-button', function (e)
 {

public/viewjs/recipes.js

@@ -44,7 +44,7 @@ $("a[data-toggle='tab']").on("shown.bs.tab", function(e)
 	window.localStorage.setItem("recipes_last_tab_id", tabId);
 });
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 
@@ -52,7 +52,7 @@ $("#search").on("keyup", function()
 
 	$(".recipe-gallery-item-container").removeClass("d-none");
 	$(".recipe-gallery-item-container .card-title:not(:contains_case_insensitive(" + value + "))").parent().parent().parent().parent().addClass("d-none");
-});
+}, 200));
 
 $("#status-filter").on("change", function()
 {

public/viewjs/shoppinglist.js

@@ -12,7 +12,7 @@
 $('#shoppinglist-table tbody').removeClass("d-none");
 shoppingListTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -21,7 +21,7 @@ $("#search").on("keyup", function()
 	}
 
 	shoppingListTable.search(value).draw();
-});
+}, 200));
 
 $("#status-filter").on("change", function()
 {

public/viewjs/stockjournal.js

@@ -20,7 +20,7 @@ $("#product-filter").on("change", function()
 	stockJournalTable.column(1).search(text).draw();
 });
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -29,7 +29,7 @@ $("#search").on("keyup", function()
 	}
 
 	stockJournalTable.search(value).draw();
-});
+}, 200));
 
 if (typeof GetUriParam("product") !== "undefined")
 {

public/viewjs/stockoverview.js

@@ -53,7 +53,7 @@ $(".status-filter-button").on("click", function()
 	$("#status-filter").trigger("change");
 });
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -62,7 +62,7 @@ $("#search").on("keyup", function()
 	}
 
 	stockOverviewTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.product-consume-button', function(e)
 {

public/viewjs/taskcategories.js

@@ -7,7 +7,7 @@
 $('#taskcategories-table tbody').removeClass("d-none");
 categoriesTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	categoriesTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.task-category-delete-button', function (e)
 {

public/viewjs/tasks.js

@@ -11,7 +11,7 @@
 $('#tasks-table tbody').removeClass("d-none");
 tasksTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -20,7 +20,7 @@ $("#search").on("keyup", function()
 	}
 
 	tasksTable.search(value).draw();
-});
+}, 200));
 
 $("#status-filter").on("change", function()
 {

public/viewjs/userentities.js

@@ -7,7 +7,7 @@
 $('#userentities-table tbody').removeClass("d-none");
 userentitiesTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	userentitiesTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.userentity-delete-button', function (e)
 {

public/viewjs/userfields.js

@@ -7,7 +7,7 @@
 $('#userfields-table tbody').removeClass("d-none");
 userfieldsTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	userfieldsTable.search(value).draw();
-});
+}, 200));
 
 $("#entity-filter").on("change", function()
 {

public/viewjs/userobjects.js

@@ -7,7 +7,7 @@
 $('#userobjects-table tbody').removeClass("d-none");
 userobjectsTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	userobjectsTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.userobject-delete-button', function (e)
 {

public/viewjs/users.js

@@ -7,7 +7,7 @@
 $('#users-table tbody').removeClass("d-none");
 usersTable.columns.adjust().draw();
 
-$("#search").on("keyup", function()
+$("#search").on("keyup", Delay(function()
 {
 	var value = $(this).val();
 	if (value === "all")
@@ -16,7 +16,7 @@ $("#search").on("keyup", function()
 	}
 
 	usersTable.search(value).draw();
-});
+}, 200));
 
 $(document).on('click', '.user-delete-button', function (e)
 {