@srsergio/taptapp-ar 1.0.81 → 1.0.83

package/dist/compiler/controller.d.ts

@@ -62,15 +62,13 @@ declare class Controller {
     _detectAndMatch(inputData: any, targetIndexes: number[]): Promise<{
         targetIndex: any;
         modelViewTransform: any;
+        featurePoints: any[];
     }>;
     _trackAndUpdate(inputData: any, lastModelViewTransform: number[][], targetIndex: number): Promise<{
         modelViewTransform: any;
-        screenCoords: {
-            x: number;
-            y: number;
-        }[];
+        screenCoords: any[];
         reliabilities: number[];
-        stabilities: any[];
+        stabilities: number[];
     }>;
     processVideo(input: any): void;
     stopProcessVideo(): void;

package/dist/compiler/controller.js

@@ -185,58 +185,80 @@ class Controller {
     async _detectAndMatch(inputData, targetIndexes) {
         const { featurePoints } = this.fullDetector.detect(inputData);
         const { targetIndex: matchedTargetIndex, modelViewTransform } = await this._workerMatch(featurePoints, targetIndexes);
-        return { targetIndex: matchedTargetIndex, modelViewTransform };
+        return { targetIndex: matchedTargetIndex, modelViewTransform, featurePoints };
     }
     async _trackAndUpdate(inputData, lastModelViewTransform, targetIndex) {
         const { worldCoords, screenCoords, reliabilities, indices = [], octaveIndex = 0 } = this.tracker.track(inputData, lastModelViewTransform, targetIndex);
         const state = this.trackingStates[targetIndex];
         if (!state.pointStabilities)
             state.pointStabilities = [];
+        if (!state.lastScreenCoords)
+            state.lastScreenCoords = [];
         if (!state.pointStabilities[octaveIndex]) {
-            // Initialize stabilities for this octave if not exists
             const numPoints = this.tracker.prebuiltData[targetIndex][octaveIndex].px.length;
-            state.pointStabilities[octaveIndex] = new Float32Array(numPoints).fill(0.5); // Start at 0.5
+            state.pointStabilities[octaveIndex] = new Float32Array(numPoints).fill(0);
+            state.lastScreenCoords[octaveIndex] = new Array(numPoints).fill(null);
         }
         const stabilities = state.pointStabilities[octaveIndex];
-        const currentStabilities = [];
-        // Update all points in this octave
+        const lastCoords = state.lastScreenCoords[octaveIndex];
+        // Update stability for ALL points in the current octave
         for (let i = 0; i < stabilities.length; i++) {
-            const isTracked = indices.includes(i);
-            if (isTracked) {
-                stabilities[i] = Math.min(1.0, stabilities[i] + 0.35); // Fast recovery (approx 3 frames)
+            const isCurrentlyTracked = indices.includes(i);
+            if (isCurrentlyTracked) {
+                const idxInResult = indices.indexOf(i);
+                stabilities[i] = Math.min(1.0, stabilities[i] + 0.4); // Fast attack
+                lastCoords[i] = screenCoords[idxInResult]; // Update last known position
             }
             else {
-                stabilities[i] = Math.max(0.0, stabilities[i] - 0.12); // Slightly more forgiving loss
+                stabilities[i] = Math.max(0.0, stabilities[i] - 0.08); // Slow decay (approx 12 frames/0.2s)
             }
         }
-        // Collect stabilities and FILTER OUT excessive flickerers (Dead Zone)
-        const filteredWorldCoords = [];
-        const filteredScreenCoords = [];
-        const filteredStabilities = [];
-        for (let i = 0; i < indices.length; i++) {
-            const s = stabilities[indices[i]];
-            if (s > 0.3) { // Hard Cutoff: points with <30% stability are ignored
-                filteredWorldCoords.push(worldCoords[i]);
-                filteredScreenCoords.push(screenCoords[i]);
-                filteredStabilities.push(s);
+        // Collect points for the UI: both currently tracked AND hibernating
+        const finalScreenCoords = [];
+        const finalReliabilities = [];
+        const finalStabilities = [];
+        const finalWorldCoords = [];
+        for (let i = 0; i < stabilities.length; i++) {
+            if (stabilities[i] > 0) {
+                const isCurrentlyTracked = indices.includes(i);
+                finalScreenCoords.push(lastCoords[i]);
+                finalStabilities.push(stabilities[i]);
+                if (isCurrentlyTracked) {
+                    const idxInResult = indices.indexOf(i);
+                    finalReliabilities.push(reliabilities[idxInResult]);
+                    finalWorldCoords.push(worldCoords[idxInResult]);
+                }
+                else {
+                    finalReliabilities.push(0); // Hibernating points have 0 reliability
+                }
             }
         }
-        // STRICT QUALITY CHECK: Prevent "sticky" tracking on background noise.
-        // We require a minimum number of high-confidence AND STABLE points.
-        const stableAndReliable = reliabilities.filter((r, idx) => r > 0.75 && stabilities[indices[idx]] > 0.5).length;
-        if (stableAndReliable < 6 || filteredWorldCoords.length < 8) {
-            return { modelViewTransform: null, screenCoords: [], reliabilities: [], stabilities: [] };
+        // STRICT QUALITY CHECK: We only update the transform if we have enough HIGH CONFIDENCE points
+        const stableAndReliable = reliabilities.filter((r, idx) => r > 0.8 && stabilities[indices[idx]] > 0.6).length;
+        if (stableAndReliable < 6 || finalWorldCoords.length < 8) {
+            return {
+                modelViewTransform: null,
+                screenCoords: finalScreenCoords,
+                reliabilities: finalReliabilities,
+                stabilities: finalStabilities
+            };
         }
         const modelViewTransform = await this._workerTrackUpdate(lastModelViewTransform, {
-            worldCoords: filteredWorldCoords,
-            screenCoords: filteredScreenCoords,
-            stabilities: filteredStabilities
+            worldCoords: finalWorldCoords,
+            screenCoords: finalWorldCoords.map((_, i) => {
+                const globalIdx = indices[i];
+                return lastCoords[globalIdx];
+            }),
+            stabilities: finalWorldCoords.map((_, i) => {
+                const globalIdx = indices[i];
+                return stabilities[globalIdx];
+            })
         });
         return {
             modelViewTransform,
-            screenCoords: filteredScreenCoords,
-            reliabilities: reliabilities.filter((_, idx) => stabilities[indices[idx]] > 0.3),
-            stabilities: filteredStabilities
+            screenCoords: finalScreenCoords,
+            reliabilities: finalReliabilities,
+            stabilities: finalStabilities
         };
     }
     processVideo(input) {
@@ -282,9 +304,10 @@ class Controller {
                         const result = await this._trackAndUpdate(inputData, trackingState.currentModelViewTransform, i);
                         if (result === null || result.modelViewTransform === null) {
                             trackingState.isTracking = false;
-                            trackingState.screenCoords = [];
-                            trackingState.reliabilities = [];
-                            trackingState.stabilities = [];
+                            // Keep points for the last update so they can be shown as it "asoma"
+                            trackingState.screenCoords = result?.screenCoords || [];
+                            trackingState.reliabilities = result?.reliabilities || [];
+                            trackingState.stabilities = result?.stabilities || [];
                         }
                         else {
                             trackingState.currentModelViewTransform = result.modelViewTransform;
@@ -297,24 +320,27 @@ class Controller {
                     trackingState.showing = this.featureManager.shouldShow(i, trackingState.isTracking);
                     if (wasShowing && !trackingState.showing) {
                         trackingState.trackingMatrix = null;
-                        this.onUpdate && this.onUpdate({ type: "updateMatrix", targetIndex: i, worldMatrix: null });
                         this.featureManager.notifyUpdate({ type: "reset", targetIndex: i });
                     }
-                    if (trackingState.showing) {
-                        const worldMatrix = this._glModelViewMatrix(trackingState.currentModelViewTransform, i);
-                        // Calculate confidence score based on point stability
-                        const stabilities = trackingState.stabilities || [];
-                        const avgStability = stabilities.length > 0
-                            ? stabilities.reduce((a, b) => a + b, 0) / stabilities.length
-                            : 0;
-                        const filteredMatrix = this.featureManager.applyWorldMatrixFilters(i, worldMatrix, { stability: avgStability });
-                        trackingState.trackingMatrix = filteredMatrix;
-                        let finalMatrix = [...filteredMatrix];
-                        const isInputRotated = input.width === this.inputHeight && input.height === this.inputWidth;
-                        if (isInputRotated) {
-                            const rotationFeature = this.featureManager.getFeature("auto-rotation");
-                            if (rotationFeature) {
-                                finalMatrix = rotationFeature.rotate(finalMatrix);
+                    // Always notify update if we have points or if visibility changed
+                    if (trackingState.showing || (trackingState.screenCoords && trackingState.screenCoords.length > 0) || (wasShowing && !trackingState.showing)) {
+                        const worldMatrix = trackingState.showing ? this._glModelViewMatrix(trackingState.currentModelViewTransform, i) : null;
+                        let finalMatrix = null;
+                        if (worldMatrix) {
+                            // Calculate confidence score based on point stability
+                            const stabilities = trackingState.stabilities || [];
+                            const avgStability = stabilities.length > 0
+                                ? stabilities.reduce((a, b) => a + b, 0) / stabilities.length
+                                : 0;
+                            const filteredMatrix = this.featureManager.applyWorldMatrixFilters(i, worldMatrix, { stability: avgStability });
+                            trackingState.trackingMatrix = filteredMatrix;
+                            finalMatrix = [...filteredMatrix];
+                            const isInputRotated = input.width === this.inputHeight && input.height === this.inputWidth;
+                            if (isInputRotated) {
+                                const rotationFeature = this.featureManager.getFeature("auto-rotation");
+                                if (rotationFeature) {
+                                    finalMatrix = rotationFeature.rotate(finalMatrix);
+                                }
                             }
                         }
                         this.onUpdate && this.onUpdate({

package/dist/compiler/matching/matching.js

@@ -3,6 +3,8 @@ import { compute as hammingCompute } from "./hamming-distance.js";
 import { computeHoughMatches } from "./hough.js";
 import { computeHomography } from "./ransacHomography.js";
 import { multiplyPointHomographyInhomogenous, matrixInverse33 } from "../utils/geometry.js";
+import { FourierEncoder } from "../utils/fourier-encoder.js";
+const encoder = new FourierEncoder(4);
 const INLIER_THRESHOLD = 5.0; // Tightened from 10 to 5 for better precision
 const MIN_NUM_INLIERS = 8; // Restored to 8
 const CLUSTER_MAX_POP = 20;
@@ -94,7 +96,7 @@ const match = ({ keyframe, querypoints, querywidth, queryheight, debugMode }) =>
         return { debugExtra };
     // Second pass with homography guided matching
     const HInv = matrixInverse33(H, 0.00001);
-    const dThreshold2 = 100; // 10 * 10
+    const dThreshold2 = 400; // 20 * 20 - Expanded search window thanks to Fourier filtering
     const matches2 = [];
     const hi00 = HInv[0], hi01 = HInv[1], hi02 = HInv[2];
     const hi10 = HInv[3], hi11 = HInv[4], hi12 = HInv[5];
@@ -113,14 +115,29 @@ const match = ({ keyframe, querypoints, querywidth, queryheight, debugMode }) =>
         const col = querypoint.maxima ? kmax : kmin;
         if (!col)
             continue;
-        const cx = col.x, cy = col.y, cd = col.d;
+        const cx = col.x, cy = col.y, cd = col.d, cf = col.f;
         const qDesc = querypoint.descriptors;
+        // Fourier encoding of the mapped point (where it SHOULD be in the keyframe)
+        const qFourier = encoder.encode(mapX / keyframe.w, mapY / keyframe.h);
         for (let k = 0, clen = cx.length; k < clen; k++) {
             const dx = cx[k] - mapX;
             const dy = cy[k] - mapY;
             const d2 = dx * dx + dy * dy;
             if (d2 > dThreshold2)
                 continue;
+            // 🚀 MOONSHOT: Fourier Spatial Harmony Check
+            // We check if the stored point's Fourier signature matches its predicted position
+            let fourierSim = 0;
+            if (cf) {
+                for (let fidx = 0; fidx < 16; fidx++) {
+                    fourierSim += (cf[k * 16 + fidx] / 127) * qFourier[fidx];
+                }
+            }
+            else {
+                fourierSim = 16; // Backward compatibility
+            }
+            if (fourierSim < 8)
+                continue; // Reject if spatially dissonant (low harmonic match)
             const d = hammingCompute({ v1: cd, v1Offset: k * descSize, v2: qDesc });
             if (d < bestD1) {
                 bestD2 = bestD1;

package/dist/compiler/offline-compiler.d.ts

@@ -5,8 +5,10 @@
  * que NO depende de TensorFlow, eliminando todos los problemas de
  * inicialización, bloqueos y compatibilidad.
  */
+import { FourierEncoder } from "./utils/fourier-encoder.js";
 export declare class OfflineCompiler {
     data: any;
+    fourierEncoder: FourierEncoder;
     constructor();
     compileImageTargets(images: any[], progressCallback: (p: number) => void): Promise<any>;
     _compileTarget(targetImages: any[], progressCallback: (p: number) => void): Promise<{
@@ -117,6 +119,7 @@ export declare class OfflineCompiler {
         a: Int16Array<ArrayBuffer>;
         s: Uint8Array<ArrayBuffer>;
         d: Uint32Array<ArrayBuffer>;
+        f: Int8Array<ArrayBuffer>;
         t: any;
     };
     _compactTree(node: any): any;

package/dist/compiler/offline-compiler.js

@@ -9,6 +9,7 @@ import { buildTrackingImageList, buildImageList } from "./image-list.js";
 import { extractTrackingFeatures } from "./tracker/extract-utils.js";
 import { DetectorLite } from "./detector/detector-lite.js";
 import { build as hierarchicalClusteringBuild } from "./matching/hierarchical-clustering.js";
+import { FourierEncoder } from "./utils/fourier-encoder.js";
 import * as msgpack from "@msgpack/msgpack";
 // Detect environment
 const isNode = typeof process !== "undefined" &&
@@ -17,6 +18,7 @@ const isNode = typeof process !== "undefined" &&
 const CURRENT_VERSION = 7; // Protocol v7: Moonshot - 4-bit Packed Tracking Data
 export class OfflineCompiler {
     data = null;
+    fourierEncoder = new FourierEncoder(4);
     constructor() {
         console.log("⚡ OfflineCompiler: Main thread mode (no workers)");
     }
@@ -186,6 +188,7 @@ export class OfflineCompiler {
         const angle = new Int16Array(count);
         const scale = new Uint8Array(count);
         const descriptors = new Uint32Array(count * 2);
+        const fourier = new Int8Array(count * 16); // 4 frequencies * 4 components (sin/cos x/y)
         for (let i = 0; i < count; i++) {
             x[i] = Math.round((points[i].x / width) * 65535);
             y[i] = Math.round((points[i].y / height) * 65535);
@@ -195,6 +198,11 @@ export class OfflineCompiler {
                 descriptors[i * 2] = points[i].descriptors[0];
                 descriptors[(i * 2) + 1] = points[i].descriptors[1];
             }
+            // 🚀 MOONSHOT: Fourier Positional Encoding
+            const feat = this.fourierEncoder.encode(points[i].x / width, points[i].y / height);
+            for (let j = 0; j < 16; j++) {
+                fourier[i * 16 + j] = Math.round(feat[j] * 127);
+            }
         }
         return {
             x,
@@ -202,6 +210,7 @@ export class OfflineCompiler {
             a: angle,
             s: scale,
             d: descriptors,
+            f: fourier,
             t: this._compactTree(tree.rootNode),
         };
     }
@@ -278,6 +287,9 @@ export class OfflineCompiler {
                     if (col.d instanceof Uint8Array) {
                         col.d = new Uint32Array(col.d.buffer.slice(col.d.byteOffset, col.d.byteOffset + col.d.byteLength));
                     }
+                    if (col.f instanceof Uint8Array) {
+                        col.f = new Int8Array(col.f.buffer.slice(col.f.byteOffset, col.f.byteOffset + col.f.byteLength));
+                    }
                 }
             }
         }

package/dist/compiler/simple-ar.d.ts

@@ -23,6 +23,10 @@ export interface SimpleAROptions {
         }[];
         reliabilities?: number[];
         stabilities?: number[];
+        detectionPoints?: {
+            x: number;
+            y: number;
+        }[];
     }) => void) | null;
     cameraConfig?: MediaStreamConstraints['video'];
     debug?: boolean;
@@ -47,6 +51,10 @@ declare class SimpleAR {
         }[];
         reliabilities?: number[];
         stabilities?: number[];
+        detectionPoints?: {
+            x: number;
+            y: number;
+        }[];
     }) => void) | null;
     cameraConfig: MediaStreamConstraints['video'];
     debug: boolean;

package/dist/compiler/simple-ar.js

@@ -113,7 +113,66 @@ class SimpleAR {
             if (this.debug)
                 this._updateDebugPanel(this.isTracking);
         }
-        const { targetIndex, worldMatrix, modelViewTransform, screenCoords, reliabilities, stabilities } = data;
+        const { targetIndex, worldMatrix, modelViewTransform, screenCoords, reliabilities, stabilities, detectionPoints } = data;
+        // Project points to screen coordinates
+        let projectedPoints = [];
+        if (screenCoords && screenCoords.length > 0) {
+            const containerRect = this.container.getBoundingClientRect();
+            const videoW = this.video.videoWidth;
+            const videoH = this.video.videoHeight;
+            const isPortrait = containerRect.height > containerRect.width;
+            const isVideoLandscape = videoW > videoH;
+            const needsRotation = isPortrait && isVideoLandscape;
+            const proj = this.controller.projectionTransform;
+            const vW = needsRotation ? videoH : videoW;
+            const vH = needsRotation ? videoW : videoH;
+            const pScale = Math.max(containerRect.width / vW, containerRect.height / vH);
+            const dW = vW * pScale;
+            const dH = vH * pScale;
+            const oX = (containerRect.width - dW) / 2;
+            const oY = (containerRect.height - dH) / 2;
+            projectedPoints = screenCoords.map((p) => {
+                let sx, sy;
+                if (needsRotation) {
+                    sx = oX + (dW / 2) - (p.y - proj[1][2]) * pScale;
+                    sy = oY + (dH / 2) + (p.x - proj[0][2]) * pScale;
+                }
+                else {
+                    sx = oX + (dW / 2) + (p.x - proj[0][2]) * pScale;
+                    sy = oY + (dH / 2) + (p.y - proj[1][2]) * pScale;
+                }
+                return { x: sx, y: sy };
+            });
+        }
+        let projectedDetectionPoints = [];
+        if (detectionPoints && detectionPoints.length > 0) {
+            const containerRect = this.container.getBoundingClientRect();
+            const videoW = this.video.videoWidth;
+            const videoH = this.video.videoHeight;
+            const isPortrait = containerRect.height > containerRect.width;
+            const isVideoLandscape = videoW > videoH;
+            const needsRotation = isPortrait && isVideoLandscape;
+            const proj = this.controller.projectionTransform;
+            const vW = needsRotation ? videoH : videoW;
+            const vH = needsRotation ? videoW : videoH;
+            const pScale = Math.max(containerRect.width / vW, containerRect.height / vH);
+            const dW = vW * pScale;
+            const dH = vH * pScale;
+            const oX = (containerRect.width - dW) / 2;
+            const oY = (containerRect.height - dH) / 2;
+            projectedDetectionPoints = detectionPoints.map((p) => {
+                let sx, sy;
+                if (needsRotation) {
+                    sx = oX + (dW / 2) - (p.y - proj[1][2]) * pScale;
+                    sy = oY + (dH / 2) + (p.x - proj[0][2]) * pScale;
+                }
+                else {
+                    sx = oX + (dW / 2) + (p.x - proj[0][2]) * pScale;
+                    sy = oY + (dH / 2) + (p.y - proj[1][2]) * pScale;
+                }
+                return { x: sx, y: sy };
+            });
+        }
         if (worldMatrix) {
             if (!this.isTracking) {
                 this.isTracking = true;
@@ -121,60 +180,26 @@ class SimpleAR {
                 this.onFound && this.onFound({ targetIndex });
             }
             this.lastMatrix = worldMatrix;
-            // We use the matrix from the controller directly (it's already filtered there)
             this._positionOverlay(modelViewTransform, targetIndex);
-            // Project points to screen coordinates
-            let projectedPoints = [];
-            if (screenCoords && screenCoords.length > 0) {
-                const containerRect = this.container.getBoundingClientRect();
-                const videoW = this.video.videoWidth;
-                const videoH = this.video.videoHeight;
-                const isPortrait = containerRect.height > containerRect.width;
-                const isVideoLandscape = videoW > videoH;
-                const needsRotation = isPortrait && isVideoLandscape;
-                const proj = this.controller.projectionTransform;
-                const vW = needsRotation ? videoH : videoW;
-                const vH = needsRotation ? videoW : videoH;
-                const pScale = Math.max(containerRect.width / vW, containerRect.height / vH);
-                const dW = vW * pScale;
-                const dH = vH * pScale;
-                const oX = (containerRect.width - dW) / 2;
-                const oY = (containerRect.height - dH) / 2;
-                projectedPoints = screenCoords.map((p) => {
-                    let sx, sy;
-                    if (needsRotation) {
-                        sx = oX + (dW / 2) - (p.y - proj[1][2]) * pScale;
-                        sy = oY + (dH / 2) + (p.x - proj[0][2]) * pScale;
-                    }
-                    else {
-                        sx = oX + (dW / 2) + (p.x - proj[0][2]) * pScale;
-                        sy = oY + (dH / 2) + (p.y - proj[1][2]) * pScale;
-                    }
-                    return { x: sx, y: sy };
-                });
-            }
-            this.onUpdateCallback && this.onUpdateCallback({
-                targetIndex,
-                worldMatrix,
-                screenCoords: projectedPoints,
-                reliabilities,
-                stabilities
-            });
         }
         else {
             if (this.isTracking) {
                 this.isTracking = false;
                 this.overlay && (this.overlay.style.opacity = '0');
                 this.onLost && this.onLost({ targetIndex });
-                this.onUpdateCallback && this.onUpdateCallback({
-                    targetIndex,
-                    worldMatrix: null,
-                    screenCoords: [],
-                    reliabilities: [],
-                    stabilities: []
-                });
             }
         }
+        // Always notify the callback if we have points, or if we just lost tracking
+        if (projectedPoints.length > 0 || projectedDetectionPoints.length > 0 || (worldMatrix === null && data.type === 'updateMatrix')) {
+            this.onUpdateCallback && this.onUpdateCallback({
+                targetIndex,
+                worldMatrix,
+                screenCoords: projectedPoints,
+                reliabilities: reliabilities || [],
+                stabilities: stabilities || [],
+                detectionPoints: projectedDetectionPoints
+            });
+        }
     }
     _positionOverlay(mVT, targetIndex) {
         if (!this.overlay || !this.markerDimensions[targetIndex])

package/dist/compiler/utils/fourier-encoder.d.ts

@@ -0,0 +1,25 @@
+/**
+ * 🚀 Moonshot: Fourier Positional Encoding
+ *
+ * Maps 2D coordinates (x, y) to a high-dimensional frequency space.
+ * Used in Transformer Positional Encoding, NeRFs, and modern Generative AI.
+ *
+ * Theory: gamma(p) = [sin(2^0 * pi * p), cos(2^0 * pi * p), ..., sin(2^L-1 * pi * p), cos(2^L-1 * pi * p)]
+ */
+export declare class FourierEncoder {
+    private frequencies;
+    private L;
+    constructor(L?: number);
+    /**
+     * Encodes a normalized coordinate (0-1) into Fourier features
+     * @param x Normalized X
+     * @param y Normalized Y
+     * @returns Float32Array of size 4 * L
+     */
+    encode(x: number, y: number): Float32Array;
+    /**
+     * Fast dot product between two fourier encodings
+     * This measures "harmonic spatial similarity"
+     */
+    static similarity(v1: Float32Array, v2: Float32Array): number;
+}

package/dist/compiler/utils/fourier-encoder.js

@@ -0,0 +1,47 @@
+/**
+ * 🚀 Moonshot: Fourier Positional Encoding
+ *
+ * Maps 2D coordinates (x, y) to a high-dimensional frequency space.
+ * Used in Transformer Positional Encoding, NeRFs, and modern Generative AI.
+ *
+ * Theory: gamma(p) = [sin(2^0 * pi * p), cos(2^0 * pi * p), ..., sin(2^L-1 * pi * p), cos(2^L-1 * pi * p)]
+ */
+export class FourierEncoder {
+    frequencies;
+    L;
+    constructor(L = 4) {
+        this.L = L;
+        this.frequencies = [];
+        for (let i = 0; i < L; i++) {
+            this.frequencies.push(Math.pow(2, i) * Math.PI);
+        }
+    }
+    /**
+     * Encodes a normalized coordinate (0-1) into Fourier features
+     * @param x Normalized X
+     * @param y Normalized Y
+     * @returns Float32Array of size 4 * L
+     */
+    encode(x, y) {
+        const result = new Float32Array(this.L * 4);
+        let idx = 0;
+        for (const freq of this.frequencies) {
+            result[idx++] = Math.sin(freq * x);
+            result[idx++] = Math.cos(freq * x);
+            result[idx++] = Math.sin(freq * y);
+            result[idx++] = Math.cos(freq * y);
+        }
+        return result;
+    }
+    /**
+     * Fast dot product between two fourier encodings
+     * This measures "harmonic spatial similarity"
+     */
+    static similarity(v1, v2) {
+        let dot = 0;
+        for (let i = 0; i < v1.length; i++) {
+            dot += v1[i] * v2[i];
+        }
+        return dot / (v1.length / 2); // Normalize by number of components
+    }
+}

package/dist/react/TaptappAR.js

@@ -12,13 +12,20 @@ export const TaptappAR = ({ config, className = "", showScanningOverlay = true,
         const url = config.videoSrc.toLowerCase().split('?')[0];
         return videoExtensions.some(ext => url.endsWith(ext)) || config.videoSrc.includes('video');
     }, [config.videoSrc]);
-    return (_jsxs("div", { className: `taptapp-ar-wrapper ${className} ${status}`, style: { position: 'relative', width: '100%', height: '100%', overflow: 'hidden' }, children: [showScanningOverlay && status === "scanning" && (_jsx("div", { className: "taptapp-ar-overlay taptapp-ar-scanning", children: _jsxs("div", { className: "scanning-content", children: [_jsxs("div", { className: "scanning-frame", children: [_jsx("img", { className: "target-preview", src: config.targetImageSrc, alt: "Target", crossOrigin: "anonymous" }), _jsx("div", { className: "scanning-line" })] }), _jsx("p", { className: "scanning-text", children: "Apunta a la imagen para comenzar" })] }) })), showErrorOverlay && status === "error" && (_jsx("div", { className: "taptapp-ar-overlay taptapp-ar-error", children: _jsxs("div", { className: "error-content", children: [_jsx("span", { className: "error-icon", children: "\u26A0\uFE0F" }), _jsx("p", { className: "error-title", children: "No se pudo iniciar AR" }), _jsx("p", { className: "error-text", children: "Verifica los permisos de c\u00E1mara" }), _jsx("button", { className: "retry-btn", onClick: () => window.location.reload(), children: "Reintentar" })] }) })), _jsx("div", { ref: containerRef, className: "taptapp-ar-container", onClick: toggleVideo, style: { width: '100%', height: '100%' }, children: isVideo ? (_jsx("video", { ref: overlayRef, className: "taptapp-ar-overlay-element", src: config.videoSrc, preload: "auto", loop: true, playsInline: true, muted: true, crossOrigin: "anonymous" })) : (_jsx("img", { ref: overlayRef, className: "taptapp-ar-overlay-element", src: config.videoSrc || config.targetImageSrc, crossOrigin: "anonymous", alt: "AR Overlay" })) }), status === "tracking" && (_jsx("div", { className: "taptapp-ar-points-overlay", children: trackedPoints.filter(p => p.reliability > 0.7).map((point, i) => (_jsx("div", { className: "tracking-point", style: {
-                        left: `${point.x}px`,
-                        top: `${point.y}px`,
-                        width: `${(2 + point.reliability * 6) * (0.4 + point.stability * 0.6)}px`,
-                        height: `${(2 + point.reliability * 6) * (0.4 + point.stability * 0.6)}px`,
-                        opacity: (0.3 + (point.reliability * 0.4)) * (0.2 + point.stability * 0.8)
-                    } }, i))) })), _jsx("style", { children: `
+    return (_jsxs("div", { className: `taptapp-ar-wrapper ${className} ${status}`, style: { position: 'relative', width: '100%', height: '100%', overflow: 'hidden' }, children: [showScanningOverlay && status === "scanning" && (_jsx("div", { className: "taptapp-ar-overlay taptapp-ar-scanning", children: _jsxs("div", { className: "scanning-content", children: [_jsxs("div", { className: "scanning-frame", children: [_jsx("img", { className: "target-preview", src: config.targetImageSrc, alt: "Target", crossOrigin: "anonymous" }), _jsx("div", { className: "scanning-line" })] }), _jsx("p", { className: "scanning-text", children: "Apunta a la imagen para comenzar" })] }) })), showErrorOverlay && status === "error" && (_jsx("div", { className: "taptapp-ar-overlay taptapp-ar-error", children: _jsxs("div", { className: "error-content", children: [_jsx("span", { className: "error-icon", children: "\u26A0\uFE0F" }), _jsx("p", { className: "error-title", children: "No se pudo iniciar AR" }), _jsx("p", { className: "error-text", children: "Verifica los permisos de c\u00E1mara" }), _jsx("button", { className: "retry-btn", onClick: () => window.location.reload(), children: "Reintentar" })] }) })), _jsx("div", { ref: containerRef, className: "taptapp-ar-container", onClick: toggleVideo, style: { width: '100%', height: '100%' }, children: isVideo ? (_jsx("video", { ref: overlayRef, className: "taptapp-ar-overlay-element", src: config.videoSrc, preload: "auto", loop: true, playsInline: true, muted: true, crossOrigin: "anonymous" })) : (_jsx("img", { ref: overlayRef, className: "taptapp-ar-overlay-element", src: config.videoSrc || config.targetImageSrc, crossOrigin: "anonymous", alt: "AR Overlay" })) }), trackedPoints.length > 0 && (_jsx("div", { className: "taptapp-ar-points-overlay", style: { opacity: status === "tracking" ? 1 : 0.6 }, children: trackedPoints
+                    .map((point, i) => {
+                    const isStable = point.stability > 0.8 && point.reliability > 0.5;
+                    const size = (2 + point.reliability * 6) * (0.6 + point.stability * 0.4);
+                    return (_jsx("div", { className: `tracking-point ${!isStable ? 'flickering' : ''}`, style: {
+                            left: `${point.x}px`,
+                            top: `${point.y}px`,
+                            width: `${size}px`,
+                            height: `${size}px`,
+                            opacity: (0.3 + (point.reliability * 0.5)) * (0.2 + point.stability * 0.8),
+                            backgroundColor: isStable ? 'black' : '#00ff00',
+                            boxShadow: isStable ? '0 0 2px rgba(255, 255, 255, 0.8)' : '0 0 8px #00ff00'
+                        } }, i));
+                }) })), _jsx("style", { children: `
                 .taptapp-ar-wrapper {
                     background: #000;
                     color: white;
@@ -114,11 +121,15 @@ export const TaptappAR = ({ config, className = "", showScanningOverlay = true,
                 .tracking-point {
                     position: absolute;
                     background: black;
-                    border: 1px solid rgba(255,255,255,0.5); /* Better contrast */
+                    border: 1px solid rgba(255,255,255,0.5);
                     border-radius: 50%;
                     transform: translate(-50%, -50%);
                     box-shadow: 0 0 2px rgba(255, 255, 255, 0.8);
                     pointer-events: none;
+                    transition: background-color 0.3s ease, box-shadow 0.3s ease, width 0.2s ease, height 0.2s ease, opacity 0.2s ease;
+                }
+                .tracking-point.flickering {
+                    z-index: 101;
                 }
             ` })] }));
 };

package/dist/react/use-ar.js

@@ -40,7 +40,8 @@ export const useAR = (config) => {
                     overlay: overlayRef.current,
                     scale: config.scale,
                     debug: false,
-                    onUpdate: ({ screenCoords, reliabilities, stabilities }) => {
+                    onUpdate: (data) => {
+                        const { screenCoords, reliabilities, stabilities } = data;
                         if (screenCoords && reliabilities && stabilities) {
                             const points = screenCoords.map((p, i) => ({
                                 x: p.x,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@srsergio/taptapp-ar",
-    "version": "1.0.81",
+    "version": "1.0.83",
     "description": "Ultra-fast Augmented Reality (AR) SDK for Node.js and Browser. Image tracking with 100% pure JavaScript, zero-dependencies, and high-performance compilation.",
     "keywords": [
         "augmented reality",

package/src/compiler/controller.ts

@@ -252,7 +252,7 @@ class Controller {
             featurePoints,
             targetIndexes,
         );
-        return { targetIndex: matchedTargetIndex, modelViewTransform };
+        return { targetIndex: matchedTargetIndex, modelViewTransform, featurePoints };
     }
 
     async _trackAndUpdate(inputData: any, lastModelViewTransform: number[][], targetIndex: number) {
@@ -264,58 +264,80 @@ class Controller {
 
         const state = this.trackingStates[targetIndex];
         if (!state.pointStabilities) state.pointStabilities = [];
+        if (!state.lastScreenCoords) state.lastScreenCoords = [];
+
         if (!state.pointStabilities[octaveIndex]) {
-            // Initialize stabilities for this octave if not exists
             const numPoints = (this.tracker as any).prebuiltData[targetIndex][octaveIndex].px.length;
-            state.pointStabilities[octaveIndex] = new Float32Array(numPoints).fill(0.5); // Start at 0.5
+            state.pointStabilities[octaveIndex] = new Float32Array(numPoints).fill(0);
+            state.lastScreenCoords[octaveIndex] = new Array(numPoints).fill(null);
         }
 
         const stabilities = state.pointStabilities[octaveIndex];
-        const currentStabilities: number[] = [];
+        const lastCoords = state.lastScreenCoords[octaveIndex];
 
-        // Update all points in this octave
+        // Update stability for ALL points in the current octave
         for (let i = 0; i < stabilities.length; i++) {
-            const isTracked = indices.includes(i);
-            if (isTracked) {
-                stabilities[i] = Math.min(1.0, stabilities[i] + 0.35); // Fast recovery (approx 3 frames)
+            const isCurrentlyTracked = indices.includes(i);
+            if (isCurrentlyTracked) {
+                const idxInResult = indices.indexOf(i);
+                stabilities[i] = Math.min(1.0, stabilities[i] + 0.4); // Fast attack
+                lastCoords[i] = screenCoords[idxInResult]; // Update last known position
             } else {
-                stabilities[i] = Math.max(0.0, stabilities[i] - 0.12); // Slightly more forgiving loss
+                stabilities[i] = Math.max(0.0, stabilities[i] - 0.08); // Slow decay (approx 12 frames/0.2s)
             }
         }
 
-        // Collect stabilities and FILTER OUT excessive flickerers (Dead Zone)
-        const filteredWorldCoords = [];
-        const filteredScreenCoords = [];
-        const filteredStabilities = [];
-
-        for (let i = 0; i < indices.length; i++) {
-            const s = stabilities[indices[i]];
-            if (s > 0.3) { // Hard Cutoff: points with <30% stability are ignored
-                filteredWorldCoords.push(worldCoords[i]);
-                filteredScreenCoords.push(screenCoords[i]);
-                filteredStabilities.push(s);
+        // Collect points for the UI: both currently tracked AND hibernating
+        const finalScreenCoords: any[] = [];
+        const finalReliabilities: number[] = [];
+        const finalStabilities: number[] = [];
+        const finalWorldCoords: any[] = [];
+
+        for (let i = 0; i < stabilities.length; i++) {
+            if (stabilities[i] > 0) {
+                const isCurrentlyTracked = indices.includes(i);
+                finalScreenCoords.push(lastCoords[i]);
+                finalStabilities.push(stabilities[i]);
+
+                if (isCurrentlyTracked) {
+                    const idxInResult = indices.indexOf(i);
+                    finalReliabilities.push(reliabilities[idxInResult]);
+                    finalWorldCoords.push(worldCoords[idxInResult]);
+                } else {
+                    finalReliabilities.push(0); // Hibernating points have 0 reliability
+                }
             }
         }
 
-        // STRICT QUALITY CHECK: Prevent "sticky" tracking on background noise.
-        // We require a minimum number of high-confidence AND STABLE points.
-        const stableAndReliable = reliabilities.filter((r: number, idx: number) => r > 0.75 && stabilities[indices[idx]] > 0.5).length;
+        // STRICT QUALITY CHECK: We only update the transform if we have enough HIGH CONFIDENCE points
+        const stableAndReliable = reliabilities.filter((r: number, idx: number) => r > 0.8 && stabilities[indices[idx]] > 0.6).length;
 
-        if (stableAndReliable < 6 || filteredWorldCoords.length < 8) {
-            return { modelViewTransform: null, screenCoords: [], reliabilities: [], stabilities: [] };
+        if (stableAndReliable < 6 || finalWorldCoords.length < 8) {
+            return {
+                modelViewTransform: null,
+                screenCoords: finalScreenCoords,
+                reliabilities: finalReliabilities,
+                stabilities: finalStabilities
+            };
         }
 
         const modelViewTransform = await this._workerTrackUpdate(lastModelViewTransform, {
-            worldCoords: filteredWorldCoords,
-            screenCoords: filteredScreenCoords,
-            stabilities: filteredStabilities
+            worldCoords: finalWorldCoords,
+            screenCoords: finalWorldCoords.map((_, i) => {
+                const globalIdx = indices[i];
+                return lastCoords[globalIdx];
+            }),
+            stabilities: finalWorldCoords.map((_, i) => {
+                const globalIdx = indices[i];
+                return stabilities[globalIdx];
+            })
         });
 
         return {
             modelViewTransform,
-            screenCoords: filteredScreenCoords,
-            reliabilities: reliabilities.filter((_, idx) => stabilities[indices[idx]] > 0.3),
-            stabilities: filteredStabilities
+            screenCoords: finalScreenCoords,
+            reliabilities: finalReliabilities,
+            stabilities: finalStabilities
         };
     }
 
@@ -371,9 +393,10 @@ class Controller {
                         );
                         if (result === null || result.modelViewTransform === null) {
                             trackingState.isTracking = false;
-                            trackingState.screenCoords = [];
-                            trackingState.reliabilities = [];
-                            trackingState.stabilities = [];
+                            // Keep points for the last update so they can be shown as it "asoma"
+                            trackingState.screenCoords = result?.screenCoords || [];
+                            trackingState.reliabilities = result?.reliabilities || [];
+                            trackingState.stabilities = result?.stabilities || [];
                         } else {
                             trackingState.currentModelViewTransform = result.modelViewTransform;
                             trackingState.screenCoords = result.screenCoords;
@@ -387,29 +410,33 @@ class Controller {
 
                     if (wasShowing && !trackingState.showing) {
                         trackingState.trackingMatrix = null;
-                        this.onUpdate && this.onUpdate({ type: "updateMatrix", targetIndex: i, worldMatrix: null });
                         this.featureManager.notifyUpdate({ type: "reset", targetIndex: i });
                     }
 
-                    if (trackingState.showing) {
-                        const worldMatrix = this._glModelViewMatrix(trackingState.currentModelViewTransform, i);
+                    // Always notify update if we have points or if visibility changed
+                    if (trackingState.showing || (trackingState.screenCoords && trackingState.screenCoords.length > 0) || (wasShowing && !trackingState.showing)) {
+                        const worldMatrix = trackingState.showing ? this._glModelViewMatrix(trackingState.currentModelViewTransform, i) : null;
+
+                        let finalMatrix = null;
 
-                        // Calculate confidence score based on point stability
-                        const stabilities = trackingState.stabilities || [];
-                        const avgStability = stabilities.length > 0
-                            ? stabilities.reduce((a: number, b: number) => a + b, 0) / stabilities.length
-                            : 0;
+                        if (worldMatrix) {
+                            // Calculate confidence score based on point stability
+                            const stabilities = trackingState.stabilities || [];
+                            const avgStability = stabilities.length > 0
+                                ? stabilities.reduce((a: number, b: number) => a + b, 0) / stabilities.length
+                                : 0;
 
-                        const filteredMatrix = this.featureManager.applyWorldMatrixFilters(i, worldMatrix, { stability: avgStability });
-                        trackingState.trackingMatrix = filteredMatrix;
+                            const filteredMatrix = this.featureManager.applyWorldMatrixFilters(i, worldMatrix, { stability: avgStability });
+                            trackingState.trackingMatrix = filteredMatrix;
 
-                        let finalMatrix = [...filteredMatrix];
+                            finalMatrix = [...filteredMatrix];
 
-                        const isInputRotated = input.width === this.inputHeight && input.height === this.inputWidth;
-                        if (isInputRotated) {
-                            const rotationFeature = this.featureManager.getFeature<AutoRotationFeature>("auto-rotation");
-                            if (rotationFeature) {
-                                finalMatrix = rotationFeature.rotate(finalMatrix);
+                            const isInputRotated = input.width === this.inputHeight && input.height === this.inputWidth;
+                            if (isInputRotated) {
+                                const rotationFeature = this.featureManager.getFeature<AutoRotationFeature>("auto-rotation");
+                                if (rotationFeature) {
+                                    finalMatrix = rotationFeature.rotate(finalMatrix);
+                                }
                             }
                         }
 

package/src/compiler/matching/matching.js

@@ -3,6 +3,9 @@ import { compute as hammingCompute } from "./hamming-distance.js";
 import { computeHoughMatches } from "./hough.js";
 import { computeHomography } from "./ransacHomography.js";
 import { multiplyPointHomographyInhomogenous, matrixInverse33 } from "../utils/geometry.js";
+import { FourierEncoder } from "../utils/fourier-encoder.js";
+
+const encoder = new FourierEncoder(4);
 
 const INLIER_THRESHOLD = 5.0; // Tightened from 10 to 5 for better precision
 const MIN_NUM_INLIERS = 8;  // Restored to 8
@@ -108,7 +111,7 @@ const match = ({ keyframe, querypoints, querywidth, queryheight, debugMode }) =>
 
   // Second pass with homography guided matching
   const HInv = matrixInverse33(H, 0.00001);
-  const dThreshold2 = 100; // 10 * 10
+  const dThreshold2 = 400; // 20 * 20 - Expanded search window thanks to Fourier filtering
   const matches2 = [];
 
   const hi00 = HInv[0], hi01 = HInv[1], hi02 = HInv[2];
@@ -132,9 +135,12 @@ const match = ({ keyframe, querypoints, querywidth, queryheight, debugMode }) =>
     const col = querypoint.maxima ? kmax : kmin;
     if (!col) continue;
 
-    const cx = col.x, cy = col.y, cd = col.d;
+    const cx = col.x, cy = col.y, cd = col.d, cf = col.f;
     const qDesc = querypoint.descriptors;
 
+    // Fourier encoding of the mapped point (where it SHOULD be in the keyframe)
+    const qFourier = encoder.encode(mapX / keyframe.w, mapY / keyframe.h);
+
     for (let k = 0, clen = cx.length; k < clen; k++) {
       const dx = cx[k] - mapX;
       const dy = cy[k] - mapY;
@@ -142,6 +148,19 @@ const match = ({ keyframe, querypoints, querywidth, queryheight, debugMode }) =>
 
       if (d2 > dThreshold2) continue;
 
+      // 🚀 MOONSHOT: Fourier Spatial Harmony Check
+      // We check if the stored point's Fourier signature matches its predicted position
+      let fourierSim = 0;
+      if (cf) {
+        for (let fidx = 0; fidx < 16; fidx++) {
+          fourierSim += (cf[k * 16 + fidx] / 127) * qFourier[fidx];
+        }
+      } else {
+        fourierSim = 16; // Backward compatibility
+      }
+
+      if (fourierSim < 8) continue; // Reject if spatially dissonant (low harmonic match)
+
       const d = hammingCompute({ v1: cd, v1Offset: k * descSize, v2: qDesc });
 
       if (d < bestD1) {

package/src/compiler/offline-compiler.ts

@@ -10,6 +10,7 @@ import { buildTrackingImageList, buildImageList } from "./image-list.js";
 import { extractTrackingFeatures } from "./tracker/extract-utils.js";
 import { DetectorLite } from "./detector/detector-lite.js";
 import { build as hierarchicalClusteringBuild } from "./matching/hierarchical-clustering.js";
+import { FourierEncoder } from "./utils/fourier-encoder.js";
 import * as msgpack from "@msgpack/msgpack";
 
 // Detect environment
@@ -21,6 +22,7 @@ const CURRENT_VERSION = 7; // Protocol v7: Moonshot - 4-bit Packed Tracking Data
 
 export class OfflineCompiler {
     data: any = null;
+    fourierEncoder = new FourierEncoder(4);
 
     constructor() {
         console.log("⚡ OfflineCompiler: Main thread mode (no workers)");
@@ -230,6 +232,7 @@ export class OfflineCompiler {
         const angle = new Int16Array(count);
         const scale = new Uint8Array(count);
         const descriptors = new Uint32Array(count * 2);
+        const fourier = new Int8Array(count * 16); // 4 frequencies * 4 components (sin/cos x/y)
 
         for (let i = 0; i < count; i++) {
             x[i] = Math.round((points[i].x / width) * 65535);
@@ -241,6 +244,12 @@ export class OfflineCompiler {
                 descriptors[i * 2] = points[i].descriptors[0];
                 descriptors[(i * 2) + 1] = points[i].descriptors[1];
             }
+
+            // 🚀 MOONSHOT: Fourier Positional Encoding
+            const feat = this.fourierEncoder.encode(points[i].x / width, points[i].y / height);
+            for (let j = 0; j < 16; j++) {
+                fourier[i * 16 + j] = Math.round(feat[j] * 127);
+            }
         }
 
         return {
@@ -249,6 +258,7 @@ export class OfflineCompiler {
             a: angle,
             s: scale,
             d: descriptors,
+            f: fourier,
             t: this._compactTree(tree.rootNode),
         };
     }
@@ -337,6 +347,9 @@ export class OfflineCompiler {
                     if (col.d instanceof Uint8Array) {
                         col.d = new Uint32Array(col.d.buffer.slice(col.d.byteOffset, col.d.byteOffset + col.d.byteLength));
                     }
+                    if (col.f instanceof Uint8Array) {
+                        col.f = new Int8Array(col.f.buffer.slice(col.f.byteOffset, col.f.byteOffset + col.f.byteLength));
+                    }
                 }
             }
         }

package/src/compiler/simple-ar.ts

@@ -18,7 +18,8 @@ export interface SimpleAROptions {
         worldMatrix: number[],
         screenCoords?: { x: number, y: number }[],
         reliabilities?: number[],
-        stabilities?: number[]
+        stabilities?: number[],
+        detectionPoints?: { x: number, y: number }[]
     }) => void) | null;
     cameraConfig?: MediaStreamConstraints['video'];
     debug?: boolean;
@@ -36,7 +37,8 @@ class SimpleAR {
         worldMatrix: number[],
         screenCoords?: { x: number, y: number }[],
         reliabilities?: number[],
-        stabilities?: number[]
+        stabilities?: number[],
+        detectionPoints?: { x: number, y: number }[]
     }) => void) | null;
     cameraConfig: MediaStreamConstraints['video'];
     debug: boolean;
@@ -163,7 +165,70 @@ class SimpleAR {
             if (this.debug) this._updateDebugPanel(this.isTracking);
         }
 
-        const { targetIndex, worldMatrix, modelViewTransform, screenCoords, reliabilities, stabilities } = data;
+        const { targetIndex, worldMatrix, modelViewTransform, screenCoords, reliabilities, stabilities, detectionPoints } = data;
+
+        // Project points to screen coordinates
+        let projectedPoints = [];
+        if (screenCoords && screenCoords.length > 0) {
+            const containerRect = this.container.getBoundingClientRect();
+            const videoW = this.video!.videoWidth;
+            const videoH = this.video!.videoHeight;
+            const isPortrait = containerRect.height > containerRect.width;
+            const isVideoLandscape = videoW > videoH;
+            const needsRotation = isPortrait && isVideoLandscape;
+            const proj = this.controller!.projectionTransform;
+
+            const vW = needsRotation ? videoH : videoW;
+            const vH = needsRotation ? videoW : videoH;
+            const pScale = Math.max(containerRect.width / vW, containerRect.height / vH);
+            const dW = vW * pScale;
+            const dH = vH * pScale;
+            const oX = (containerRect.width - dW) / 2;
+            const oY = (containerRect.height - dH) / 2;
+
+            projectedPoints = screenCoords.map((p: any) => {
+                let sx, sy;
+                if (needsRotation) {
+                    sx = oX + (dW / 2) - (p.y - proj[1][2]) * pScale;
+                    sy = oY + (dH / 2) + (p.x - proj[0][2]) * pScale;
+                } else {
+                    sx = oX + (dW / 2) + (p.x - proj[0][2]) * pScale;
+                    sy = oY + (dH / 2) + (p.y - proj[1][2]) * pScale;
+                }
+                return { x: sx, y: sy };
+            });
+        }
+
+        let projectedDetectionPoints = [];
+        if (detectionPoints && detectionPoints.length > 0) {
+            const containerRect = this.container.getBoundingClientRect();
+            const videoW = this.video!.videoWidth;
+            const videoH = this.video!.videoHeight;
+            const isPortrait = containerRect.height > containerRect.width;
+            const isVideoLandscape = videoW > videoH;
+            const needsRotation = isPortrait && isVideoLandscape;
+            const proj = this.controller!.projectionTransform;
+
+            const vW = needsRotation ? videoH : videoW;
+            const vH = needsRotation ? videoW : videoH;
+            const pScale = Math.max(containerRect.width / vW, containerRect.height / vH);
+            const dW = vW * pScale;
+            const dH = vH * pScale;
+            const oX = (containerRect.width - dW) / 2;
+            const oY = (containerRect.height - dH) / 2;
+
+            projectedDetectionPoints = detectionPoints.map((p: any) => {
+                let sx, sy;
+                if (needsRotation) {
+                    sx = oX + (dW / 2) - (p.y - proj[1][2]) * pScale;
+                    sy = oY + (dH / 2) + (p.x - proj[0][2]) * pScale;
+                } else {
+                    sx = oX + (dW / 2) + (p.x - proj[0][2]) * pScale;
+                    sy = oY + (dH / 2) + (p.y - proj[1][2]) * pScale;
+                }
+                return { x: sx, y: sy };
+            });
+        }
 
         if (worldMatrix) {
             if (!this.isTracking) {
@@ -173,63 +238,25 @@ class SimpleAR {
             }
 
             this.lastMatrix = worldMatrix;
-
-            // We use the matrix from the controller directly (it's already filtered there)
             this._positionOverlay(modelViewTransform, targetIndex);
-
-            // Project points to screen coordinates
-            let projectedPoints = [];
-            if (screenCoords && screenCoords.length > 0) {
-                const containerRect = this.container.getBoundingClientRect();
-                const videoW = this.video!.videoWidth;
-                const videoH = this.video!.videoHeight;
-                const isPortrait = containerRect.height > containerRect.width;
-                const isVideoLandscape = videoW > videoH;
-                const needsRotation = isPortrait && isVideoLandscape;
-                const proj = this.controller!.projectionTransform;
-
-                const vW = needsRotation ? videoH : videoW;
-                const vH = needsRotation ? videoW : videoH;
-                const pScale = Math.max(containerRect.width / vW, containerRect.height / vH);
-                const dW = vW * pScale;
-                const dH = vH * pScale;
-                const oX = (containerRect.width - dW) / 2;
-                const oY = (containerRect.height - dH) / 2;
-
-                projectedPoints = screenCoords.map((p: any) => {
-                    let sx, sy;
-                    if (needsRotation) {
-                        sx = oX + (dW / 2) - (p.y - proj[1][2]) * pScale;
-                        sy = oY + (dH / 2) + (p.x - proj[0][2]) * pScale;
-                    } else {
-                        sx = oX + (dW / 2) + (p.x - proj[0][2]) * pScale;
-                        sy = oY + (dH / 2) + (p.y - proj[1][2]) * pScale;
-                    }
-                    return { x: sx, y: sy };
-                });
+        } else {
+            if (this.isTracking) {
+                this.isTracking = false;
+                this.overlay && (this.overlay.style.opacity = '0');
+                this.onLost && this.onLost({ targetIndex });
             }
+        }
 
+        // Always notify the callback if we have points, or if we just lost tracking
+        if (projectedPoints.length > 0 || projectedDetectionPoints.length > 0 || (worldMatrix === null && data.type === 'updateMatrix')) {
             this.onUpdateCallback && this.onUpdateCallback({
                 targetIndex,
                 worldMatrix,
                 screenCoords: projectedPoints,
-                reliabilities,
-                stabilities
+                reliabilities: reliabilities || [],
+                stabilities: stabilities || [],
+                detectionPoints: projectedDetectionPoints
             });
-
-        } else {
-            if (this.isTracking) {
-                this.isTracking = false;
-                this.overlay && (this.overlay.style.opacity = '0');
-                this.onLost && this.onLost({ targetIndex });
-                this.onUpdateCallback && this.onUpdateCallback({
-                    targetIndex,
-                    worldMatrix: null as any,
-                    screenCoords: [],
-                    reliabilities: [],
-                    stabilities: []
-                });
-            }
         }
     }
 

package/src/compiler/utils/fourier-encoder.ts

@@ -0,0 +1,53 @@
+/**
+ * 🚀 Moonshot: Fourier Positional Encoding
+ * 
+ * Maps 2D coordinates (x, y) to a high-dimensional frequency space.
+ * Used in Transformer Positional Encoding, NeRFs, and modern Generative AI.
+ * 
+ * Theory: gamma(p) = [sin(2^0 * pi * p), cos(2^0 * pi * p), ..., sin(2^L-1 * pi * p), cos(2^L-1 * pi * p)]
+ */
+
+export class FourierEncoder {
+    private frequencies: number[];
+    private L: number;
+
+    constructor(L: number = 4) {
+        this.L = L;
+        this.frequencies = [];
+        for (let i = 0; i < L; i++) {
+            this.frequencies.push(Math.pow(2, i) * Math.PI);
+        }
+    }
+
+    /**
+     * Encodes a normalized coordinate (0-1) into Fourier features
+     * @param x Normalized X
+     * @param y Normalized Y
+     * @returns Float32Array of size 4 * L
+     */
+    encode(x: number, y: number): Float32Array {
+        const result = new Float32Array(this.L * 4);
+        let idx = 0;
+
+        for (const freq of this.frequencies) {
+            result[idx++] = Math.sin(freq * x);
+            result[idx++] = Math.cos(freq * x);
+            result[idx++] = Math.sin(freq * y);
+            result[idx++] = Math.cos(freq * y);
+        }
+
+        return result;
+    }
+
+    /**
+     * Fast dot product between two fourier encodings
+     * This measures "harmonic spatial similarity"
+     */
+    static similarity(v1: Float32Array, v2: Float32Array): number {
+        let dot = 0;
+        for (let i = 0; i < v1.length; i++) {
+            dot += v1[i] * v2[i];
+        }
+        return dot / (v1.length / 2); // Normalize by number of components
+    }
+}

package/src/react/TaptappAR.tsx

@@ -90,21 +90,29 @@ export const TaptappAR: React.FC<TaptappARProps> = ({
             </div>
 
             {/* Tracking Points Layer */}
-            {status === "tracking" && (
-                <div className="taptapp-ar-points-overlay">
-                    {trackedPoints.filter(p => p.reliability > 0.7).map((point, i) => (
-                        <div
-                            key={i}
-                            className="tracking-point"
-                            style={{
-                                left: `${point.x}px`,
-                                top: `${point.y}px`,
-                                width: `${(2 + point.reliability * 6) * (0.4 + point.stability * 0.6)}px`,
-                                height: `${(2 + point.reliability * 6) * (0.4 + point.stability * 0.6)}px`,
-                                opacity: (0.3 + (point.reliability * 0.4)) * (0.2 + point.stability * 0.8)
-                            }}
-                        />
-                    ))}
+            {trackedPoints.length > 0 && (
+                <div className="taptapp-ar-points-overlay" style={{ opacity: status === "tracking" ? 1 : 0.6 }}>
+                    {trackedPoints
+                        .map((point, i) => {
+                            const isStable = point.stability > 0.8 && point.reliability > 0.5;
+                            const size = (2 + point.reliability * 6) * (0.6 + point.stability * 0.4);
+
+                            return (
+                                <div
+                                    key={i}
+                                    className={`tracking-point ${!isStable ? 'flickering' : ''}`}
+                                    style={{
+                                        left: `${point.x}px`,
+                                        top: `${point.y}px`,
+                                        width: `${size}px`,
+                                        height: `${size}px`,
+                                        opacity: (0.3 + (point.reliability * 0.5)) * (0.2 + point.stability * 0.8),
+                                        backgroundColor: isStable ? 'black' : '#00ff00',
+                                        boxShadow: isStable ? '0 0 2px rgba(255, 255, 255, 0.8)' : '0 0 8px #00ff00'
+                                    }}
+                                />
+                            );
+                        })}
                 </div>
             )}
 
@@ -204,11 +212,15 @@ export const TaptappAR: React.FC<TaptappARProps> = ({
                 .tracking-point {
                     position: absolute;
                     background: black;
-                    border: 1px solid rgba(255,255,255,0.5); /* Better contrast */
+                    border: 1px solid rgba(255,255,255,0.5);
                     border-radius: 50%;
                     transform: translate(-50%, -50%);
                     box-shadow: 0 0 2px rgba(255, 255, 255, 0.8);
                     pointer-events: none;
+                    transition: background-color 0.3s ease, box-shadow 0.3s ease, width 0.2s ease, height 0.2s ease, opacity 0.2s ease;
+                }
+                .tracking-point.flickering {
+                    z-index: 101;
                 }
             `}</style>
         </div>

package/src/react/use-ar.ts

@@ -62,9 +62,10 @@ export const useAR = (config: ARConfig): UseARReturn => {
                     overlay: overlayRef.current!,
                     scale: config.scale,
                     debug: false,
-                    onUpdate: ({ screenCoords, reliabilities, stabilities }) => {
+                    onUpdate: (data: any) => {
+                        const { screenCoords, reliabilities, stabilities } = data;
                         if (screenCoords && reliabilities && stabilities) {
-                            const points = screenCoords.map((p, i) => ({
+                            const points = screenCoords.map((p: any, i: number) => ({
                                 x: p.x,
                                 y: p.y,
                                 reliability: reliabilities[i],