From fcd1a8b12bddd2d4d6927a297896440bc79852fd Mon Sep 17 00:00:00 2001
From: Dave Lane <dave@oerfoundation.org>
Date: Wed, 25 Sep 2024 16:08:30 +1200
Subject: [PATCH] further improvements WIP

---
 src/routes/+layout.svelte |  3 ++-
 src/routes/+page.svelte   | 56 +++++++++++++++++++++++++--------------
 2 files changed, 38 insertions(+), 21 deletions(-)

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index abebd7c..af849e6 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -27,9 +27,10 @@
     footer {
         display: inline-grid;
         margin: 4em, auto, 0, auto;
-        grid-template-columns: 1fr 1fr 1fr;
+        grid-template-columns: 2fr 3fr 1fr;
     }
     footer div {
         text-align: left;
+        margin-left: 1em;
     }
 </style>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 322b67e..b028948 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -248,33 +248,46 @@
 		return flat;
 	}
 
-	// filter technologies based on a list of Categories
-	function filterTechnologiesByCategoryList(technologies, list) {
-		//console.log('looking for tech in categories: ', list);
+	// filter technologies based on an array of filterables on tech and a list of filters
+	function filterTechnologiesByArray(technologies, field, list) {
 		const included = [];
 		technologies.forEach(function (tech) {
 			if (hasInstances(tech)) {
-				const intersection = inCommon(tech.categories, list);
-				console.log('for tech: ', tech.name);
-				console.log('categories: ', tech.categories);
-				console.log('list: ', list);
-				console.log('intersection: ', intersection);
+			    let arr = tech[field]
+				const intersection = inCommon(arr, list);
 				if (intersection && intersection.constructor === Array) {
-					//console.log('found intersection!', intersection.constructor);
 					console.log('intersection length: ', intersection.length);
 					if (intersection.length > 0) {
-						//console.log('including tech: ', tech);
 						included.push(tech);
 					}
-				} else {
-					console.log('intersection not array');
 				}
 			}
 		});
-		console.log('found ' + included.length + ' technologies.');
+		//console.log('found ' + included.length + ' technologies.');
 		return included;
 	}
 
+	// filter technologies based on a single filterable value on tech and a list of filters
+	function filterTechnologiesByValue(technologies, field, list) {
+		const included = [];
+		technologies.forEach(function (tech) {
+			if (hasInstances(tech)) {
+				let arr = [tech[field]];
+				const intersection = inCommon(arr, list);
+				if (intersection && intersection.constructor === Array) {
+					console.log('intersection length: ', intersection.length);
+					if (intersection.length > 0) {
+						included.push(tech);
+					}
+				}
+			}
+		});
+		//console.log('found ' + included.length + ' technologies.');
+		return included;
+	}
+
+	//
+	// process the data received by the web request!
 	const results = processData(webservices);
 
 	//const technologies = webservices.technologies;
@@ -319,17 +332,20 @@
 
 	// reactive stuff...
 	$: {
-		//console.log('about to filterTechnologiesByCategoryList');
-		filteredTechnologies = filterTechnologiesByCategoryList(results.active_services, flattenFilter($categoryFilter));
+		console.log('about to filterTechnologiesByCategoryList');
+		// filter by categories
+		filteredTechnologies = filterTechnologiesByArray(results.active_services, 'categories',
+			flattenFilter($categoryFilter));
+		// filter by analogues
+		filteredTechnologies = filterTechnologiesByArray(results.active_services, 'analogues',
+			flattenFilter($analogueFilter));
+		filteredTechnologies = filterTechnologiesByValue(results.active_services, 'license',
+			flattenFilter($licenseFilter));
+
 		//filteredTechnologies = filterTechnologiesByCategoryList(results.all_services, flattenFilter($categoryFilter));
 		const technologies = sortTechnologies(filteredTechnologies);
 	}
 
-	/*function flipOn(list, id) {
-	    console.log('list: ' + list + ', id: ' + id);
-	    return true;
-	}*/
-
 </script>
 
 <div class="webservices">