# Ghana Card Detector
A JavaScript/TypeScript library for detecting and capturing Ghana ID Cards using browser-based computer vision.
## Features
- Real-time Ghana Card detection using TensorFlow.js and a YOLOv8 model
- Automatic and manual card capture options
- Quality assessment for captured cards (alignment, aspect ratio, etc.)
- Responsive design that works on mobile and desktop devices
- Built-in UI components with customizable styling
- TypeScript support with full type definitions
## Installation
```bash
npm install ghana-card-detector
```
## Requirements
- TensorFlow.js (peer dependency)
- TensorFlow.js TFLite (peer dependency)
- A YOLOv8 TFLite model for card detection
## Basic Usage
### HTML Structure
```html
Ghana Card Detector Demo
Ghana Card Auto-Capture
Initializing detector...
Start Camera
Manual Capture
Enable Auto-Capture
Captured Card
No card captured yet
Submit
```
### JavaScript Integration
```javascript
// app.js
import GhanaCardDetector from 'ghana-card-detector';
document.addEventListener('DOMContentLoaded', async () => {
// Create detector instance
const detector = new GhanaCardDetector({
modelPath: 'path/to/model.tflite',
confidenceThreshold: 0.85,
minConsecutiveDetections: 3,
onCapture: (imageDataUrl) => {
console.log('Card captured:', imageDataUrl);
// Send to your backend or do something with the image
}
});
// Initialize detector
try {
await detector.initialize();
// Start camera automatically after initialization (optional)
await detector.startCamera();
} catch (error) {
console.error('Failed to initialize detector:', error);
}
});
```
### Using with TypeScript
```typescript
import GhanaCardDetector, { DetectorOptions } from 'ghana-card-detector';
document.addEventListener('DOMContentLoaded', async () => {
const options: DetectorOptions = {
modelPath: 'path/to/model.tflite',
confidenceThreshold: 0.85,
onCapture: (imageDataUrl: string) => {
// Handle captured image
},
onStatusCha …