    <script>
    pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.10.377/pdf.worker.min.js';
    let naturalWidth = 0;
    let naturalHeight = 0;
    let userZoom = 1;
     async function loadPDF(url) {
      try {
        if ($("#flipbook").data('turn')) {
          $("#flipbook").turn("destroy").html("");
        } else {
          $("#flipbook").html("");
        }
        const pdf = await pdfjsLib.getDocument(url).promise;
        const flipbookContainer = document.getElementById('flipbook');
         const firstPage = await pdf.getPage(1);
        const defaultViewport = firstPage.getViewport({ scale: 1 });
        const defaultWidth = defaultViewport.width;
        const defaultHeight = defaultViewport.height;
        const availableWidth = window.innerWidth * 0.8;
        const availableHeight = window.innerHeight * 0.8;
        const initialScale = Math.min( availableWidth / (2 * defaultWidth), availableHeight / defaultHeight );
        let pageWidth, pageHeight;
        for (let pageNumber = 1; pageNumber <= pdf.numPages; pageNumber++) {
          const page = await pdf.getPage(pageNumber);
          const viewport = page.getViewport({ scale: initialScale });
          if (pageNumber === 1) {
            pageWidth = viewport.width;
            pageHeight = viewport.height;
            naturalWidth = pageWidth * 2;
            naturalHeight = pageHeight;
            flipbookContainer.style.width = naturalWidth + 'px';
            flipbookContainer.style.height = naturalHeight + 'px';
          }
          const canvas = document.createElement('canvas');
          canvas.width = viewport.width;
          canvas.height = viewport.height;
          const context = canvas.getContext('2d');
          const renderContext = { canvasContext: context, viewport: viewport };
          await page.render(renderContext).promise;
          const pageDiv = document.createElement('div');
          pageDiv.className = 'page';
          pageDiv.style.width = viewport.width + 'px';
          pageDiv.style.height = viewport.height + 'px';
          pageDiv.appendChild(canvas);
           pageDiv.addEventListener('click', function(e) {
            const rect = pageDiv.getBoundingClientRect();
            const clickX = e.clientX - rect.left;
            if (clickX < rect.width / 2) {
              $("#flipbook").turn("previous");
            } else {
              $("#flipbook").turn("next");
            }
          });
          flipbookContainer.appendChild(pageDiv);
        }
        $("#flipbook").turn({
          width: naturalWidth,
          height: naturalHeight,
          autoCenter: true,
          duration: 1000,
          gradients: true,
          acceleration: true
        });
        updateFlipbookScale();
        pdf.destroy();
      } catch (error) {
        console.error("Erreur lors du chargement du PDF :", error);
      }
    }
function updateFlipbookScale() {
  const flipbook = document.getElementById('flipbook');
  const availableWidth = window.innerWidth * 0.9;
  const availableHeight = window.innerHeight * 0.9;
  const baseScale = Math.min(availableWidth / naturalWidth, availableHeight / naturalHeight);
  const scaleFactor = baseScale * userZoom;
  flipbook.style.transform = 'scale(' + scaleFactor + ')';
  flipbook.style.transformOrigin = 'top left'; // Assure un alignement en haut à gauche
}
    function generateFileThumbnails() {
      $.getJSON('list-pdfs.php', function(pdfFiles) {
        const container = document.getElementById('fileThumbnails');
        container.innerHTML = "";
        const grid = document.createElement('div');
        grid.className = "thumbnailGrid";
        pdfFiles.forEach(function(fileName) {
          pdfjsLib.getDocument(fileName).promise.then(function(pdf) {
            return pdf.getPage(1);
          }).then(function(page) {
            const desiredHeight = 150;
            const viewport = page.getViewport({ scale: 1 });
            const scale = desiredHeight / viewport.height;
            const thumbViewport = page.getViewport({ scale: scale });
            const thumbContainer = document.createElement('div');
            thumbContainer.style.textAlign = "center";
            const canvas = document.createElement('canvas');
            canvas.width = thumbViewport.width;
            canvas.height = thumbViewport.height;
            const context = canvas.getContext('2d');
            const renderContext = { canvasContext: context, viewport: thumbViewport };
            page.render(renderContext).promise.then(function() {
              canvas.addEventListener('click', function() {
                // Pour actualiser la page, rediriger en ajoutant le paramètre "file" dans l'URL
                window.location.href = window.location.pathname + "?file=" + encodeURIComponent(fileName);
              });
            });
            thumbContainer.appendChild(canvas);
             let shortName = fileName.replace(/\.pdf$/i, "");
            const nameElement = document.createElement('div');
            nameElement.textContent = shortName;
            nameElement.style.fontSize = "12px";
            nameElement.style.marginTop = "4px";
            thumbContainer.appendChild(nameElement);
            grid.appendChild(thumbContainer);
          }).catch(function(error) {
            console.error("Erreur lors de la génération de la vignette pour " + fileName, error);
          });
        });
        container.appendChild(grid);
      });
    }
    function checkUrlForFile() {
      const params = new URLSearchParams(window.location.search);
      if (params.has('file')) {
        const file = params.get('file');
        loadPDF(file);
        document.getElementById('downloadBtn').setAttribute('href', file);
        document.getElementById('currentFileName').textContent = file;
      } else {
        loadPDF("votre-fichier.pdf");
      }
    }
    document.addEventListener("DOMContentLoaded", function() {
      checkUrlForFile();
      generateFileThumbnails();
      window.addEventListener('resize', updateFlipbookScale);
       document.getElementById('zoomIn').addEventListener('click', function() {
        userZoom *= 1.2;
        updateFlipbookScale();
      });
      document.getElementById('zoomOut').addEventListener('click', function() {
        userZoom /= 1.2;
        updateFlipbookScale();
      });
      document.getElementById('prevPage').addEventListener('click', function() {
        $("#flipbook").turn("previous");
      });
      document.getElementById('nextPage').addEventListener('click', function() {
        $("#flipbook").turn("next");
      });
      document.getElementById('printBtn').addEventListener('click', function() {
        window.print();
      });
    });
        </script>