@regulaforensics/face-sdk 8.4.1471-nightly → 8.4.1482-nightly

package/examples/ionic/package.json

@@ -20,8 +20,8 @@
     "@awesome-cordova-plugins/camera": "^9.6.0",
     "@awesome-cordova-plugins/dialogs": "^9.6.0",
     "@awesome-cordova-plugins/file": "^9.6.0",
-    "@regulaforensics/face-sdk": "8.4.1471-nightly",
-    "@regulaforensics/face-core-basic": "8.5.899-nightly",
+    "@regulaforensics/face-sdk": "8.4.1482-nightly",
+    "@regulaforensics/face-core-basic": "8.5.902-nightly",
     "cordova-android": "^15.1.0",
     "cordova-ios": "^8.1.1",
     "cordova-plugin-camera": "^8.0.0",
@@ -35,7 +35,7 @@
     "typescript": "~6.0.3"
   },
   "overrides": {
-    "serialize-javascript": "^7.1.1",
+    "serialize-javascript": "^7.1.2",
     "uuid": "^11.1.1",
     "source-map-js": "^1.2.2",
     "shell-quote": "^1.11.0"

package/examples/react_native/app.config.ts

@@ -19,9 +19,12 @@ export default ({ config }: ConfigContext): ExpoConfig => ({
   },
   plugins: [
     '@regulaforensics/face-sdk',
+    './scripts/withoutMetroServer',
     ['expo-custom-assets', { assetsPaths: ['./assets'] }],
     ['expo-build-properties', {
+      ios: { networkInspector: false },
       android: {
+        networkInspector: false,
         extraMavenRepos: [
           { url: 'https://maven.regulaforensics.com/RegulaDocumentReader' },
           { url: 'https://maven.regulaforensics.com/RegulaDocumentReader/Beta' },

package/examples/react_native/index.tsx

@@ -6,6 +6,36 @@ import { Alert, Platform } from 'react-native'
 import { launchImageLibrary } from 'react-native-image-picker'
 import { main } from './src/main'
 
+export async function loadAssetIfExists(path: string): Promise<string | null> {
+  if (Platform.OS === 'ios') path = RNFS.MainBundlePath + "/" + path
+  var readFile = Platform.OS === 'ios' ? RNFS.readFile : RNFS.readFileRes
+  try {
+    return await readFile(path, 'base64')
+  } catch {
+    return null
+  }
+}
+
+export async function pickImage(): Promise<string | null> {
+  var response = await launchImageLibrary({
+    mediaType: 'photo',
+    selectionLimit: 1,
+    includeBase64: true
+  })
+  return "data:image/png;base64," + response?.assets?.[0].base64!
+}
+
+export async function chooseOption(): Promise<boolean | null> {
+  return new Promise<boolean | null>((resolve) => {
+    Alert.alert("Select option", "", [
+      { text: "Use gallery", onPress: () => { resolve(false) } },
+      { text: "Use camera", onPress: () => { resolve(true) } }
+    ], { cancelable: true, onDismiss: () => resolve(null) })
+  })
+}
+
+// --------------------------------------------------------------------------------------------------------------------
+
 var webViewRef: any
 const onclicks: any = {}
 const onMessage = (json: any) => {
@@ -50,45 +80,45 @@ const document = {
 }
 
 function parseValue(value: any) {
-  if (value !== true && value !== false) return `"${value}"`
-  return value
+  const json = JSON.stringify(value)
+  return typeof value === 'string' ? `(window.webImages[${json}] ?? ${json})` : json
 }
 
-(globalThis as any).document = document;
-registerRootComponent(() =>
-  <WebView
-    ref={ref => { webViewRef = ref }}
-    onMessage={onMessage}
-    source={require("./index.html")}
-    scrollEnabled={false}
-    overScrollMode={'content'}
-  />
-)
+async function loadWebUI() {
+  const webRoot = Platform.OS === 'ios' ? RNFS.MainBundlePath + '/web/' : 'web/'
+  const readWebFile = Platform.OS === 'ios' ? RNFS.readFile : RNFS.readFileAssets
+  const readWebDir = Platform.OS === 'ios' ? RNFS.readDir : RNFS.readDirAssets
+  const webImages: Record<string, string> = {}
+  const [styles, content] = await Promise.all(['src/main.css', 'src/main.html'].map(path => readWebFile(webRoot + path, 'utf8')))
 
-export async function loadAssetIfExists(path: string): Promise<string | null> {
-  if (Platform.OS === 'ios') path = RNFS.MainBundlePath + "/" + path
-  var readFile = Platform.OS === 'ios' ? RNFS.readFile : RNFS.readFileRes
-  try {
-    return await readFile(path, 'base64')
-  } catch {
-    return null
+  for (const file of (await readWebDir(webRoot + 'images')).filter(file => file.isFile())) {
+    const extension = file.name.split('.').pop()!.toLowerCase()
+    const type = ({ jpg: 'jpeg', svg: 'svg+xml' } as Record<string, string>)[extension] ?? extension
+    webImages['images/' + file.name] = `data:image/${type};base64,${await readWebFile(file.path, 'base64')}`
   }
-}
 
-export async function pickImage(): Promise<string | null> {
-  var response = await launchImageLibrary({
-    mediaType: 'photo',
-    selectionLimit: 1,
-    includeBase64: true
-  })
-  return "data:image/png;base64," + response?.assets?.[0].base64!
+  const html = content.replace(/src="([^"]+)"/g, (match, path) => webImages[path] ? `src="${webImages[path]}"` : match)
+  return `<meta name="viewport" content="initial-scale=1, user-scalable=no, viewport-fit=cover">
+<style>${styles}</style>
+<div id="content" style="height: 100%">${html}</div>
+<script>
+  window.webImages = ${JSON.stringify(webImages)};
+  requestAnimationFrame(() => requestAnimationFrame(() => {
+    window.ReactNativeWebView.postMessage(JSON.stringify({ id: "ready" }))
+  }))
+</script>`
 }
 
-export async function chooseOption(): Promise<boolean | null> {
-  return new Promise<boolean | null>((resolve) => {
-    Alert.alert("Select option", "", [
-      { text: "Use gallery", onPress: () => { resolve(false) } },
-      { text: "Use camera", onPress: () => { resolve(true) } }
-    ], { cancelable: true, onDismiss: () => resolve(null) })
-  })
-}
+(globalThis as any).document = document;
+registerRootComponent(() => {
+  const [html, setHtml] = React.useState('')
+  React.useEffect(() => { loadWebUI().then(setHtml).catch(console.error) }, [])
+  return html ? <WebView
+    ref={ref => { webViewRef = ref }}
+    onMessage={onMessage}
+    originWhitelist={['*']}
+    source={{ html }}
+    scrollEnabled={false}
+    overScrollMode={'content'}
+  /> : null
+})

package/examples/react_native/metro.config.js

@@ -1,7 +1,5 @@
 const config = require('expo/metro-config').getDefaultConfig(__dirname)
 config.watchFolders = [
-    __dirname + '/node_modules'
 ]
-config.resolver.nodeModulesPaths = config.watchFolders
-config.resolver.assetExts.push('css')
+config.resolver.nodeModulesPaths = [__dirname + '/node_modules']
 module.exports = config