pdf catalogue with php

// [z] : PDF CATALOGUE
// ===================
// [z f:"folder"]
//   folder : folder within page resources folder to cataloge
//
function catalogue($document){
  global $resources;
  $regex = '!(\[z(?:[^\]]*)\])!';
  preg_match_all($regex,$document,$matches,PREG_SET_ORDER);
  if(count($matches)>0){
    echo('<script>if (document.readyState === "complete" || (document.readyState !== "loading" && !document.documentElement.doScroll)) {createPDFThumbnails();} else {document.addEventListener("DOMContentLoaded", createPDFThumbnails);}</script>'); // Delay loading thumbnails until page has loaded.                           
  }
  foreach ($matches as $match){
    $folder = get_parameter('f',$match[1],'');
    $directory = $resources.'/'.$folder;
    if(!is_dir($directory)){
      $replacement = "ERROR - No such folder";
    }
    else{
      $files = array_filter(preg_grep('/^([^.])/', scandir($directory)),function($v){return !is_dir($v);}); // Not working
      $replacement = '';
      foreach($files as $file){
        $id = hrtime($get_as_number=TRUE);
        $path = $resources.'/'.$folder.'/'.$file;
        $replacement .= '<div class="catalogue_card">';
        $replacement .= '<a href="'.$directory.'/'.$file.'" target="_blank">';
        $replacement .= '<img class="catalogue_image" data-pdf-thumbnail-file="'.$path.'" src="stock/pdf_icon.png">';
        $replacement .= '</a>';
        $replacement .= '<span class="catalogue_title" id="'.$id.'_title">Loading...</span><br/>';
        $replacement .= '<span class="catalogue_subject" id="'.$id.'_subject">Loading...</span><br/>';
        $replacement .= '<span class="catalogue_author" id="'.$id.'_author">Loading...</span>';
        $replacement .= '<script>';
        $replacement .= 'pdf_catalogue("'.$path.'","'.$id.'")';
        $replacement .= '</script>';
        $replacement .= '</div>';
      }        
    }
    $document = str_replace($match[0],$replacement,$document);
  }
  return $document;
}

var pdfjsLib = window['pdfjs-dist/build/pdf']; // This is some sort of shortcut - leave alone.
pdfjsLib.GlobalWorkerOptions.workerSrc = 'scripts/pdf.js/pdf.worker.js'; // Path from webroot

function pdf_catalogue(file_url,id){
  var loadingTask = pdfjsLib.getDocument(file_url);
  loadingTask.promise.then(function(pdf) {
    pdf.getMetadata().then(function(details) {
     $author = details.info.Author;
     $subject = details.info.Subject;
     $title = details.info.Title;
     document.getElementById(id+"_title").innerHTML=$title;
     document.getElementById(id+"_subject").innerHTML=$subject;
     document.getElementById(id+"_author").innerHTML=$author;
  }).catch(function(err) {
    console.log('Error getting meta data');
    console.log(err);
  });
});
}

function createPDFThumbnails(){
  var nodesArray = Array.prototype.slice.call(document.querySelectorAll('img[data-pdf-thumbnail-file]'));
  nodesArray.forEach(function(element){
    var filePath = element.getAttribute('data-pdf-thumbnail-file');
    var imgWidth = element.getAttribute('data-pdf-thumbnail-width') || 64;
    var imgHeight = element.getAttribute('data-pdf-thumbnail-height') || 64;			
    loadingTask = pdfjsLib.getDocument(filePath);
    loadingTask.promise.then(function(pdf) {
      pdf.getPage(1).then(function(page) {
        var canvas = document.createElement("canvas");
        var context = canvas.getContext('2d');
        canvas.fillStyle = 'transparent';
        canvas.height = canvas.width = Math.max(imgHeight,imgWidth); // Create square canvas to fit
        var viewport = page.getViewport({scale:1}); // Get actual size of pdf page at scale 1
        var scale = Math.min(canvas.width / viewport.width, canvas.height / viewport.height); // Calculate scale
        var viewport = page.getViewport({scale:scale}); // Scale the viewport
        page.render({canvasContext:context,viewport:viewport}).promise.then(function(){
          element.src = canvas.toDataURL();
        });
      });
    });
  });
};