diff --git a/src/hooks/useQRScanner.ts b/src/hooks/useQRScanner.ts new file mode 100644 index 0000000..c3808bc --- /dev/null +++ b/src/hooks/useQRScanner.ts @@ -0,0 +1,66 @@ +import { useEffect, useMemo, useState } from 'react'; + +import { is_fully } from '../utils/is_fully'; + +type QRScanFunction = (code: string) => void; + +type QRScanConfig = { + onScan?: QRScanFunction; + onCancel?: () => void; +}; + +export const useQRScanner = (config?: QRScanConfig) => { + if (!is_fully()) return { scannedQR: undefined, startScanning: () => {} }; + + const [scannedQR, setScannedQR] = useState(); + + const vId = useMemo(() => Math.random().toString(36).slice(2, 11), []); + + useEffect(() => { + window._fullykiosk[vId] = (state: 'scan' | 'cancel', code?: string) => { + if (state === 'scan' && !!code) { + config?.onScan?.(code); + + setScannedQR(code); + } + + if (state === 'cancel') { + config?.onCancel?.(); + } + }; + + // Register events + fully.bind( + 'onQrScanSuccess', + `_fullykiosk['${vId}']('scan', '$code');` + ); + fully.bind('onQrScanCancelled', `_fullykiosk['${vId}']('cancel');`); + + return () => { + // Unregister events + window._fullykiosk[vId] = undefined; + }; + }, [0]); + + return { + scannedQR, + startScanning: ( + prompt: string, + resultUrl: string, + cameraId: number = -1, + timeout: number = -1, + beepEnabled: boolean = true, + showCancelButton: boolean = true, + useFlashlight: boolean = false + ) => + fully.scanQrCode( + prompt, + resultUrl, + cameraId, + timeout, + beepEnabled, + showCancelButton, + useFlashlight + ), + }; +}; diff --git a/src/hooks/useWifi.ts b/src/hooks/useWifi.ts index c175951..48cb354 100644 --- a/src/hooks/useWifi.ts +++ b/src/hooks/useWifi.ts @@ -1,8 +1,12 @@ import { useEffect, useMemo } from 'react'; +import { is_fully } from '../utils/is_fully'; + window._fullykiosk = window._fullykiosk || {}; export const useWifi = () => { + if (!is_fully()) return { wifiEnabled: undefined, enableWifi: () => {} }; + const wifiEnabled = fully.isWifiEnabled(); const wifiConnected = fully.isWifiConnected(); const networkConnected = fully.isNetworkConnected(); diff --git a/src/index.ts b/src/index.ts index bb75bcf..d5bc17c 100644 --- a/src/index.ts +++ b/src/index.ts @@ -14,6 +14,7 @@ export * from './hooks/useIpv6Address'; export * from './hooks/useKeyboard'; export * from './hooks/useMacAddress'; export * from './hooks/useOrientation'; +export * from './hooks/useQRScanner'; export * from './hooks/useScreenBrightness'; export * from './hooks/useScreenSleep'; export * from './hooks/useSerialNumber'; diff --git a/test/App.tsx b/test/App.tsx index 2c56421..5d96e57 100644 --- a/test/App.tsx +++ b/test/App.tsx @@ -16,6 +16,7 @@ import { useKeyboard, useMacAddress, useOrientation, + useQRScanner, useScreenBrightness, useScreenSleep, useSerialNumber, @@ -67,6 +68,11 @@ export const App: FC = () => { wifiConnected, wifiEnabled, } = useWifi(); + const { scannedQR, startScanning } = useQRScanner({ + onScan: (data) => { + alert(`Scanned QR: ${data}`); + }, + }); return (
@@ -140,6 +146,12 @@ export const App: FC = () => {

+

+

QRCode: {scannedQR}
+ +

); };