main.go

@@ -29,7 +29,7 @@ import (
 	"time"
 )
 
-const VERSION = "v36"
+const VERSION = "v35"
 
 var (
 	logger              *slog.Logger

static/css/default_light/datapoints.css

@@ -1,6 +1,3 @@
-#datapoints-filter.invalid-regex {
-  background-color: #ffd5d5;
-}
 #datapoints {
   display: grid;
   grid-template-columns: repeat(6, min-content);

static/css/gruvbox/datapoints.css

@@ -1,6 +1,3 @@
-#datapoints-filter.invalid-regex {
-  background-color: #ffd5d5;
-}
 #datapoints {
   display: grid;
   grid-template-columns: repeat(6, min-content);

static/less/datapoints.less

@@ -1,9 +1,5 @@
 @import "theme-@{THEME}.less";
 
-#datapoints-filter.invalid-regex {
-	background-color: #ffd5d5;
-}
-
 #datapoints {
 	display: grid;
 	grid-template-columns: repeat(6, min-content);

views/pages/datapoints.gotmpl

@@ -3,46 +3,6 @@
 	{{ $theme := .CONFIG.THEME }}
 	<link rel="stylesheet" type="text/css" href="/css/{{ .VERSION }}/{{ .CONFIG.THEME }}/datapoints.css">
 	<script type="text/javascript" defer>
-
-	function validateRegex(rxp) {
-		try {
-			''.match(rxp)
-			return true
-		} catch {
-			return false
-		}
-	}
-
-	function showDatapoints(id) {
-		if (!id)
-			document
-				.querySelectorAll(`[x-datapoint-id]`)
-				.forEach(matchedDP=>matchedDP.classList.remove('hidden'))
-		else
-			document
-				.querySelectorAll(`[x-datapoint-id="${id}"]`)
-				.forEach(matchedDP=>matchedDP.classList.remove('hidden'))
-	}
-
-	function hideDatapoints(id) {
-		if (!id)
-			document.querySelectorAll(`[x-datapoint-id]`).forEach(matchedDP=>
-				matchedDP.classList.add('hidden')
-			)
-		else
-			document.querySelectorAll(`[x-datapoint-id="${id}"]`).forEach(matchedDP=>
-				matchedDP.classList.add('hidden')
-			)
-	}
-
-	function updateRegexValidatedStatus(validated) {
-		const inputFilter = document.getElementById('datapoints-filter')
-		if (validated)
-			inputFilter.classList.remove('invalid-regex')
-		else
-			inputFilter.classList.add('invalid-regex')
-	}
-
 	function filterDatapoints(inputFilter) {
 		const filter = inputFilter.value.toLowerCase()
 		const datapoints = document.querySelectorAll('#datapoints .name')
@@ -50,25 +10,25 @@
 
 		// Shortcut to show everything if a filter is not given.
 		if (filter == '') {
-			showDatapoints()
+			document.querySelectorAll(`[x-datapoint-id]`).forEach(matchedDP=>
+				matchedDP.classList.remove('hidden')
+			)
 			return
 		}
 
-		// Show nothing if the regex is invalid and can't matching anything.
-		if (!validateRegex(filter)) {
-			hideDatapoints()
-			updateRegexValidatedStatus(false)
-			return
-		} else
-			updateRegexValidatedStatus(true)
-
 		datapoints.forEach(dp=>{
 			const dpName = dp.getAttribute('x-datapoint-name')
+			if (dpName.toLowerCase().includes(filter)) {
 				datapointID = dp.getAttribute('x-datapoint-id')
-			if (dpName.toLowerCase().match(filter))
+				document.querySelectorAll(`[x-datapoint-id="${datapointID}"]`).forEach(matchedDP=>
-				showDatapoints(datapointID)
+					matchedDP.classList.remove('hidden')
-			else
+				)
-				hideDatapoints(datapointID)
+			} else {
+				datapointID = dp.getAttribute('x-datapoint-id')
+				document.querySelectorAll(`[x-datapoint-id="${datapointID}"]`).forEach(matchedDP=>
+					matchedDP.classList.add('hidden')
+				)
+			}
 		})
 	}
 
@@ -89,7 +49,7 @@
 	<a href="/datapoint/edit/0">Create</a>
 
 	<div style="margin-top: 16px">
-		<input id="datapoints-filter" type="text" placeholder="Filter (regexp)" style="width: 320px;"  oninput="filterDatapoints(this)">
+		<input id="datapoints-filter" type="text" placeholder="Filter" style="width: 320px;"  oninput="filterDatapoints(this)">
 	</div>
 
 	<div id="datapoints">