@sanctum-key/react-native-sdk 1.0.14 → 1.0.16

package/src/utils/cropByObb.ts

@@ -1,7 +1,6 @@
-import { Image as RNImage, Platform } from 'react-native';
+import { Platform } from 'react-native';
 import * as ImageManipulator from "expo-image-manipulator";
-import { truncateFields } from '../modules/api/KYCService';
-import { logger } from './logger';
+
 
 type Point = [number, number];
 
@@ -19,7 +18,7 @@ export function getObbConfidence(cardObb: any): number | null {
   const first = cardObb[0];
 
   // New format: first is an object with a confidence field
-  if (first && typeof first === 'object' && 'confidence' in first) {
+  if (first && typeof first === 'object' && !Array.isArray(first) && 'confidence' in first) {
     const score = (first as any).confidence;
     return typeof score === 'number' ? score : null;
   }
@@ -30,44 +29,29 @@ export function getObbConfidence(cardObb: any): number | null {
   return typeof score === 'number' ? score : null;
 }
 
-/**
- * Extracts the card_in_frame flag from card_obb when present.
- * Returns:
- * - true  => card fully in frame
- * - false => card not fully in frame
- * - null  => field not present (backward compatibility)
- */
 /**
  * Extracts the framing data from card_obb.
  * STRICT CHECK: Returns true ONLY if card_in_frame is true AND cropped_sides is empty.
- * Returns:
- * - true  => card fully in frame (no sides cropped)
- * - false => card not fully in frame OR edges are cropped
- * - null  => field not present (backward compatibility)
  */
 export function getCardInFrame(cardObb: any): boolean | null {
   if (!cardObb) return null;
-
-  // card_obb can be an array of objects or a single object
+  
   const first = Array.isArray(cardObb) ? cardObb[0] : cardObb;
 
   if (first && typeof first === 'object' && 'card_in_frame' in first) {
     const isCardInFrame = first.card_in_frame === true;
     const hasCroppedSides = Array.isArray(first.cropped_sides) && first.cropped_sides.length > 0;
 
-    // If the API explicitly says it's not in frame, OR if it lists cropped edges, reject it.
     if (!isCardInFrame || hasCroppedSides) {
       if (hasCroppedSides) {
         console.warn(`Card is cropped on sides: ${first.cropped_sides.join(', ')}`);
       }
-      return false; 
+      return false;
     }
 
-    // If we made it here, card_in_frame is true AND cropped_sides is empty.
-    return true; 
+    return true;
   }
 
-  // Backward compatibility check
   if (cardObb && typeof cardObb === 'object' && 'card_in_frame' in cardObb) {
     const value = (cardObb as any).card_in_frame;
     return typeof value === 'boolean' ? value : null;
@@ -76,6 +60,25 @@ export function getCardInFrame(cardObb: any): boolean | null {
   return null;
 }
 
+
+function extractObbPoints(cardObb: any): Point[] | null {
+  if (!cardObb) return null;
+  const first = Array.isArray(cardObb) ? cardObb[0] : cardObb;
+
+  // New format: { obb: [...], confidence, ... }
+  if (first && typeof first === 'object' && !Array.isArray(first) && 'obb' in first) {
+    const pts = (first as any).obb;
+    if (Array.isArray(pts) && pts.length === 4) return pts as Point[];
+  }
+
+  // Legacy format: [ [p1,p2,p3,p4], confidence ]
+  if (Array.isArray(first) && Array.isArray(first[0]) && first[0].length === 4) {
+    return first[0] as Point[];
+  }
+
+  return null;
+}
+
 // Compute axis-aligned bounding box from oriented quadrilateral
 function computeAabb(points: Point[]) {
   const xs = points.map(p => p[0]);
@@ -101,14 +104,8 @@ async function cropWeb(uri: string, points: Point[]): Promise<string> {
       if (!ctx) return reject(new Error('Canvas context not available'));
       ctx.drawImage(
         img,
-        minX, // sx
-        minY, // sy
-        width, // sw
-        height, // sh
-        0,
-        0,
-        canvas.width,
-        canvas.height
+        minX, minY, width, height, // Source
+        0, 0, canvas.width, canvas.height // Destination
       );
       resolve(canvas.toDataURL('image/jpeg', 0.92));
     };
@@ -117,16 +114,17 @@ async function cropWeb(uri: string, points: Point[]): Promise<string> {
   });
 }
 
-// Fallback: return original for native (no dependency added); caller can still use bbox to draw overlay
 export async function cropByObb(uri: string, cardObb: any): Promise<{ base64?: string; bbox?: { minX: number; minY: number; width: number; height: number } }> {
   try {
-    // card_obb format: [ [ [p1,p2,p3,p4], score ] ] — if confidence too low, don't crop (send full image)
     const confidence = getObbConfidence(cardObb);
     if (confidence !== null && confidence < OBB_CONFIDENCE_THRESHOLD) {
       return {};
     }
-    const first = Array.isArray(cardObb) ? cardObb[0] : null;
-    const points = Array.isArray(first?.[0]) ? (first[0] as Point[]) : null;
+
+    // FIX: Use extractObbPoints() which handles both legacy and new API formats.
+    // The old code used `Array.isArray(first?.[0]) ? first[0] : null`, which
+    // returned null for new-format responses like [{obb:[...], confidence}].
+    const points = extractObbPoints(cardObb);
     if (!points || points.length !== 4) return {};
 
     const { minX, minY, width, height } = computeAabb(points);
@@ -135,7 +133,7 @@ export async function cropByObb(uri: string, cardObb: any): Promise<{ base64?: s
       const base64 = await cropWeb(uri, points);
       return { base64, bbox: { minX, minY, width, height } };
     }
-    // Native: return bbox only; keep base64 undefined
+    
     return { bbox: { minX, minY, width, height } };
   } catch (e) {
     return {};
@@ -143,112 +141,177 @@ export async function cropByObb(uri: string, cardObb: any): Promise<{ base64?: s
 }
 
 
+async function normalizeOrientationAndGetDimensions(
+  uri: string
+): Promise<{ normalizedUri: string; width: number; height: number }> {
+  // Web: canvas already handles EXIF; skip normalization
+  if (Platform.OS === 'web') {
+    return new Promise((resolve, reject) => {
+      const img = new Image();
+      img.onload = () => resolve({ normalizedUri: uri, width: img.naturalWidth, height: img.naturalHeight });
+      img.onerror = reject;
+      img.src = uri;
+    });
+  }
 
-
-// exemple d'appel :
-export async function cropImageWithBBox(uri: string, bbox: any) {
-  // 1️⃣ Récupère la taille originale de l'image
-  await RNImage.getSize(uri, (width, height) => {
-    console.log("Image originale:", width, height);
-  });
-
-  // // 2️⃣ Suppose que ton bbox vient d'une image affichée dans `displayedSize`
-  // const scaleX = originalWidth / displayedSize.width;
-  // const scaleY = originalHeight / displayedSize.height;
-
-  // 3️⃣ Convertir le bbox à la taille réelle scale 0.10 = 10%
-  const crop = {
-    originX: bbox.minX,
-    originY: bbox.minY,
-    width: bbox.width,
-    height: bbox.height,
-  };
-
-  // 4️⃣ Appliquer le crop
-  // @ts-ignore - manipulateAsync is deprecated but still functional, new API (useImageManipulator) is a React hook and not suitable for utility functions
+  // Native: re-encode to bake EXIF rotation into actual pixels
   const result = await ImageManipulator.manipulateAsync(
     uri,
-    [{ crop }],
-    { compress: 1, format: ImageManipulator.SaveFormat.PNG }
+    [], // No transforms — just re-encode to normalize
+    { compress: 1, format: ImageManipulator.SaveFormat.JPEG }
   );
-
-  console.log("Image recadrée:", result.uri);
-  return result.uri;
+  return { normalizedUri: result.uri, width: result.width, height: result.height };
 }
 
-// Fonction pour rogner avec une tolérance de 10% autour du bbox
-export async function cropImageWithBBoxWithTolerance(uri: string, bbox: any, tolerance: number = 0.1): Promise<string> {
-  console.log("cropImageWithBBoxWithTolerance", JSON.stringify(truncateFields({ uri, bbox, tolerance }), null, 2));
-  
-  return new Promise<string>((resolve, reject) => {
+
+export async function cropImageWithBBoxWithTolerance(uri: string, bbox: any, tolerance: number = 0.02): Promise<string> {
+  return new Promise<string>((resolve) => {
     let isResolved = false;
-    
-    // Timeout de sécurité (15 secondes)
+
+    // Safety Timeout (15 seconds — slightly longer to account for normalization step)
     const timeout = setTimeout(() => {
       if (!isResolved) {
         isResolved = true;
-        console.warn("Timeout lors du rognage avec tolérance, utilisation de l'image originale");
-        resolve(uri); // Retourner l'URI original en cas de timeout
+        console.warn("Crop timeout, returning original.");
+        resolve(uri);
       }
     }, 15000);
 
-    // 1️⃣ Récupère la taille originale de l'image
-    RNImage.getSize(uri, (imageWidth, imageHeight) => {
-      if (isResolved) return;
-      
-      // 2️⃣ Calculer la tolérance en pixels (10% de chaque côté)
-      const toleranceX = bbox.width * tolerance;
-      const toleranceY = bbox.height * tolerance;
-
-      // 3️⃣ Ajuster le bbox avec la tolérance
-      // Calculer les nouvelles coordonnées avec tolérance
-      const newMinX = Math.max(0, bbox.minX - toleranceX);
-      const newMinY = Math.max(0, bbox.minY - toleranceY);
-      const newMaxX = Math.min(imageWidth, bbox.minX + bbox.width + toleranceX);
-      const newMaxY = Math.min(imageHeight, bbox.minY + bbox.height + toleranceY);
-
-      // Calculer la largeur et hauteur finales
-      const finalWidth = newMaxX - newMinX;
-      const finalHeight = newMaxY - newMinY;
-
-      const crop = {
-        originX: newMinX,
-        originY: newMinY,
-        width: finalWidth,
-        height: finalHeight,
-      };
-
-      logger.log("cropImageWithBBoxWithTolerance - crop params", JSON.stringify(truncateFields({ uri, crop, tolerance, imageWidth, imageHeight }), null, 2));
-
-      // 4️⃣ Appliquer le crop avec tolérance
-      // @ts-ignore - manipulateAsync is deprecated but still functional, new API (useImageManipulator) is a React hook and not suitable for utility functions
-      ImageManipulator.manipulateAsync(
-        uri,
-        [{ crop }],
-        { compress: 0.95, format: ImageManipulator.SaveFormat.JPEG }
-      )
-        .then((result) => {
-          if (isResolved) return;
+    (async () => {
+      try {
+        // STEP 1: Normalize EXIF orientation.
+        // This is the core fix — on Android the raw photo pixels may be stored
+        // rotated. After this call, normalizedUri has pixels matching the on-screen
+        // orientation and actualWidth/actualHeight are the display-space dimensions.
+        const { normalizedUri, width: actualWidth, height: actualHeight } =
+          await normalizeOrientationAndGetDimensions(uri);
+
+        if (isResolved) return;
+
+        // STEP 2: Resolve bbox to pixel coordinates.
+        // Detect if bbox is percentage (e.g., 0.90) or absolute pixels (e.g., 800).
+        const isPercentageBased = bbox.width <= 1.5 && bbox.height <= 1.5;
+
+        let pixelMinX: number, pixelMinY: number, pixelWidth: number, pixelHeight: number;
+
+        if (isPercentageBased) {
+          pixelMinX = bbox.minX * actualWidth;
+          pixelMinY = bbox.minY * actualHeight;
+          pixelWidth = bbox.width * actualWidth;
+          pixelHeight = bbox.height * actualHeight;
+        } else {
+          pixelMinX = bbox.minX;
+          pixelMinY = bbox.minY;
+          pixelWidth = bbox.width;
+          pixelHeight = bbox.height;
+        }
+
+        // STEP 3: Add tolerance and clamp to image bounds.
+        const toleranceX = pixelWidth * tolerance;
+        const toleranceY = pixelHeight * tolerance;
+
+        const newMinX = Math.max(0, pixelMinX - toleranceX);
+        const newMinY = Math.max(0, pixelMinY - toleranceY);
+        const newMaxX = Math.min(actualWidth, pixelMinX + pixelWidth + toleranceX);
+        const newMaxY = Math.min(actualHeight, pixelMinY + pixelHeight + toleranceY);
+
+        const finalCrop = {
+          originX: Math.floor(newMinX),
+          originY: Math.floor(newMinY),
+          width: Math.max(1, Math.floor(newMaxX - newMinX)),
+          height: Math.max(1, Math.floor(newMaxY - newMinY)),
+        };
+
+        // STEP 4: Perform final crop on the already-normalized image.
+        try {
+          const result = await ImageManipulator.manipulateAsync(
+            normalizedUri,
+            [{ crop: finalCrop }],
+            { compress: 0.95, format: ImageManipulator.SaveFormat.JPEG }
+          );
+
+          if (!isResolved) {
+            isResolved = true;
+            clearTimeout(timeout);
+            resolve(result.uri);
+          }
+        } catch (err) {
+          if (!isResolved) {
+            isResolved = true;
+            clearTimeout(timeout);
+            console.error("ImageManipulator crop failed, returning normalized image", err);
+
+            resolve(normalizedUri);
+          }
+        }
+      } catch (e) {
+        if (!isResolved) {
+          isResolved = true;
+          clearTimeout(timeout);
+          console.error("normalizeOrientationAndGetDimensions failed, returning original", e);
+          resolve(uri);
+        }
+      }
+    })();
+  });
+}
+
+export async function cropToCenterScanArea(
+  uri: string, 
+  scanWidthRatio: number = 0.91, // Match Kotlin's 0.91f
+  scanAreaAspectRatio: number = 1.59 // Standard ID Card ratio
+): Promise<string> {
+  return new Promise<string>((resolve) => {
+    let isResolved = false;
+
+    const timeout = setTimeout(() => {
+      if (!isResolved) {
+        isResolved = true;
+        resolve(uri);
+      }
+    }, 10000);
+
+    (async () => {
+      try {
+        // 1. Use Claude's brilliant EXIF normalization first!
+        const { normalizedUri, width: actualWidth, height: actualHeight } = 
+          await normalizeOrientationAndGetDimensions(uri);
+
+        if (isResolved) return;
+
+        // 2. Apply the Kotlin mathematical centering
+        const scanWidth = actualWidth * scanWidthRatio;
+        const scanHeight = scanWidth / scanAreaAspectRatio;
+        const left = (actualWidth - scanWidth) / 2;
+        const top = (actualHeight - scanHeight) / 2;
+
+        const finalCrop = {
+          originX: Math.max(0, Math.floor(left)),
+          originY: Math.max(0, Math.floor(top)),
+          width: Math.max(1, Math.floor(scanWidth)),
+          height: Math.max(1, Math.floor(scanHeight)),
+        };
+
+        // 3. Perform the final centered crop
+        const result = await ImageManipulator.manipulateAsync(
+          normalizedUri,
+          [{ crop: finalCrop }],
+          { compress: 0.95, format: ImageManipulator.SaveFormat.JPEG }
+        );
+          
+        if (!isResolved) {
           isResolved = true;
           clearTimeout(timeout);
-          console.log("Image recadrée avec tolérance:", result.uri);
           resolve(result.uri);
-        })
-        .catch((error) => {
-          if (isResolved) return;
+        }
+      } catch (err) {
+        if (!isResolved) {
           isResolved = true;
           clearTimeout(timeout);
-          console.error("Erreur lors du rognage avec tolérance:", error);
-          // En cas d'erreur, retourner l'URI original au lieu de rejeter
-          resolve(uri);
-        });
-    }, (error) => {
-      if (isResolved) return;
-      isResolved = true;
-      clearTimeout(timeout);
-      console.error("Erreur lors de la récupération de la taille de l'image:", error);
-      // En cas d'erreur, retourner l'URI original au lieu de rejeter
-      resolve(uri);
-    });
+          console.error("Center crop failed, returning original", err);
+          resolve(uri); // Fallback to raw image
+        }
+      }
+    })();
   });
-}
+}