const { PDFDocument } = PDFLib;

const fileInput = document.getElementById("fileInput");
const fileList = document.getElementById("fileList");
const mergeBtn = document.getElementById("mergeBtn");
const statusText = document.getElementById("status");

let filesArray = [];

// Select files
fileInput.addEventListener("change", function(){

    for(let file of fileInput.files){
        if(file.type === "application/pdf"){
            filesArray.push(file);
        }
    }

    displayFiles();
});

// Show files
function displayFiles(){
    fileList.innerHTML = "";

    filesArray.forEach((file, index)=>{
        let li = document.createElement("li");

        li.innerHTML = `
            ${file.name}
            <button class="remove" onclick="removeFile(${index})">X</button>
        `;

        fileList.appendChild(li);
    });
}

// Remove file
function removeFile(index){
    filesArray.splice(index, 1);
    displayFiles();
}

// Merge PDFs
mergeBtn.addEventListener("click", async function(){

    if(filesArray.length < 2){
        statusText.innerText = "Select at least 2 PDFs ❗";
        return;
    }

    statusText.innerText = "Merging PDFs... ⏳";

    const mergedPdf = await PDFDocument.create();

    for (let file of filesArray) {
        const bytes = await file.arrayBuffer();
        const pdf = await PDFDocument.load(bytes);

        const pages = await mergedPdf.copyPages(pdf, pdf.getPageIndices());

        pages.forEach(page => mergedPdf.addPage(page));
    }

    const mergedBytes = await mergedPdf.save();

    // Download file
    const blob = new Blob([mergedBytes], { type: "application/pdf" });
    const url = URL.createObjectURL(blob);

    const a = document.createElement("a");
    a.href = url;
    a.download = "merged.pdf";
    a.click();

    statusText.innerText = "Download started ✅";
});