Make maxFaceDistance configurable

src/components/MlDebug.tsx

@@ -15,6 +15,7 @@ export default function MLDebug() {
     const [minClusterSize, setMinClusterSize] = useState<number>(4);
     const [minFaceSize, setMinFaceSize] = useState<number>(24);
     const [batchSize, setBatchSize] = useState<number>(50);
+    const [maxFaceDistance, setMaxFaceDistance] = useState<number>(0.55);
     const [mlResult, setMlResult] = useState<MLSyncResult>({
         allFaces: [],
         clustersWithNoise: {
@@ -64,7 +65,8 @@ export default function MLDebug() {
                 clusterFaceDistance,
                 minClusterSize,
                 minFaceSize,
-                batchSize
+                batchSize,
+                maxFaceDistance
             );
             setMlResult(result);
         } catch (e) {
@@ -108,6 +110,13 @@ export default function MLDebug() {
             <button onClick={() => setBatchSize(200)}>200</button>
             <button onClick={() => setBatchSize(500)}>500</button>
 
+            <p></p>
+            <div>MaxFaceDistance: {maxFaceDistance}</div>
+            <button onClick={() => setMaxFaceDistance(0.45)}>0.45</button>
+            <button onClick={() => setMaxFaceDistance(0.5)}>0.5</button>
+            <button onClick={() => setMaxFaceDistance(0.55)}>0.55</button>
+            <button onClick={() => setMaxFaceDistance(0.6)}>0.6</button>
+
             <p></p>
             <button onClick={onSync}>Run ML Sync</button>
 

src/services/machineLearning/machineLearningService.ts

@@ -32,7 +32,7 @@ class MachineLearningService {
     private clusteringService: ClusteringService;
 
     private clusterFaceDistance = 0.4;
-    private maxFaceDistance = 0.6;
+    private maxFaceDistance = 0.55;
     private minClusterSize = 4;
     private minFaceSize = 24;
     private batchSize = 50;
@@ -63,12 +63,14 @@ class MachineLearningService {
         clusterFaceDistance: number,
         minClusterSize: number,
         minFaceSize: number,
-        batchSize: number
+        batchSize: number,
+        maxFaceDistance: number
     ) {
         this.clusterFaceDistance = clusterFaceDistance;
         this.minClusterSize = minClusterSize;
         this.minFaceSize = minFaceSize;
         this.batchSize = batchSize;
+        this.maxFaceDistance = maxFaceDistance;
 
         // setWasmPath('/js/tfjs/');
         await tf.ready();

src/worker/machineLearning.worker.js

@@ -7,7 +7,8 @@ export class MachineLearningWorker {
         clusterFaceDistance,
         minClusterSize,
         minFaceSize,
-        batchSize
+        batchSize,
+        maxFaceDistance
     ) {
         if (!(typeof navigator !== 'undefined')) {
             console.log(
@@ -22,7 +23,8 @@ export class MachineLearningWorker {
             clusterFaceDistance,
             minClusterSize,
             minFaceSize,
-            batchSize
+            batchSize,
+            maxFaceDistance
         );
         const results = await mlService.sync(token);
         console.log('Ran machine learning sync from worker', results);