import { PDFPageProxy } from 'pdfjs-dist';
import { BrowserPDF417Reader } from '@zxing/browser';
import * as pdfJSx from 'pdfjs-dist';


/**
 * Render the first page of a PDF document onto a new canvas.
 * @param {Event} event - The change event from an HTMLInputElement.
 * @return {Promise<HTMLCanvasElement | null>} The canvas with the first page of the PDF, or null if the document is not a PDF.
 */
export async function pdf2canvas(event: React.ChangeEvent<HTMLInputElement>): Promise<HTMLCanvasElement | null> {
    const file = (event.target as HTMLInputElement).files?.[0];

    if(!file) {
        console.error('No file was selected.');
        return null;
    }

    if (file.type !== 'application/pdf') {
        console.error(file.name, 'is not a .pdf file.');
        return null;
    }

    const reader = new FileReader();
    const data = await new Promise<Uint8Array>((resolve, reject) => {
        reader.onload = (e) => resolve(new Uint8Array((e.target as FileReader).result as ArrayBuffer));
        reader.onerror = (e) => reject(e);
        reader.readAsArrayBuffer(file);
    });

    const pdfJS = await import('pdfjs-dist');

    // worker file was manually copied to the `public` folder
    pdfJS.GlobalWorkerOptions.workerSrc = window.location.origin + '/pdf.worker.min.mjs';

    const pdf = await pdfJS.getDocument(data).promise;
    
    const page: PDFPageProxy = await pdf.getPage(1);

    const scale = 1.5;
    const viewport = page.getViewport({ scale });

    const canvas = document.createElement('canvas');
    const context = canvas.getContext('2d');
    canvas.height = viewport.height;
    canvas.width = viewport.width;

    await page.render({ canvasContext: context as CanvasRenderingContext2D, viewport }).promise;

    const codeReader = new BrowserPDF417Reader();

    const result = await codeReader.decodeFromCanvas(canvas);

    console.log(result);

    // codeReader.decode(imageData);
    
    return null;
}