Skip to content

Custom Quality Function

By default, the component automatically takes a picture when the built-in document detector picks up a suitable frame

It is possible to make custom function for determining the quality of the frame

  1. Subscribe to the open event and get the html video element

    const idliveDocCapture = document.querySelector('idlive-document-capture');
    
    idliveDocCapture.addEventListener('open', (event) => {
        const { video } = event.detail[0];
    
        checkVideoQuality(video);
    });
    
  2. Implement a quality function to find a suitable frame. It should call the takePhoto action when it finds a frame to capture

    const checkVideoQuality = (video) => {
        SomeDocDetector.detectBestFrame(video).then(() => {
            idliveDocCapture.takePhoto();
        });
    };
    
  3. Optional you can disable auto capture so that the built-in document detector does not automatically take a photo

    <idlive-document-capture
        auto_capture_disabled
    >
    </idlive-document-capture>
    
  4. Optional you can import the version of the library without a document detector, which is smaller than the standard version

    import 'idlive-document-capture-web/index-no-detector';
    

Check out example