Dave Jarvis' Repositories

git clone https://repo.autonoma.ca/repo/notanexus.git
export default class Page {
  constructor(viewerElement, pdfPage, pageNum, scale = 1.5) {
    this.viewerElement = viewerElement;
    this.pdfPage = pdfPage;
    this.pageNum = pageNum;
    this.scale = scale;
    this.pageElement = null;
    this.textLayer = null;
    this.highlightLayer = null;
    this.viewport = null;
  }

  async render() {
    this.viewport = this.pdfPage.getViewport({ scale: this.scale });
    
    this.pageElement = document.createElement('div');
    this.pageElement.className = 'page';
    this.pageElement.setAttribute('data-page-number', this.pageNum);
    this.pageElement.style.width = this.viewport.width + 'px';
    this.pageElement.style.height = this.viewport.height + 'px';
    
    this.pageElement.style.setProperty('--scale-factor', this.scale);
    this.viewerElement.appendChild(this.pageElement);

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

    const renderContext = {
      canvasContext: context,
      viewport: this.viewport
    };

    await this.pdfPage.render(renderContext).promise;

    this.textLayer = document.createElement('div');
    this.textLayer.className = 'textLayer';
    
    this.textLayer.style.left = '0';
    this.textLayer.style.top = '0';
    this.textLayer.style.right = '0';
    this.textLayer.style.bottom = '0';
    this.textLayer.style.position = 'absolute';
    this.textLayer.style.transformOrigin = '0% 0%';
    
    this.textLayer.style.setProperty('--scale-factor', this.viewport.scale.toString());
    
    this.pageElement.appendChild(this.textLayer);

    this.highlightLayer = document.createElement('div');
    this.highlightLayer.className = 'highlightLayer';
    this.highlightLayer.style.left = '0';
    this.highlightLayer.style.top = '0';
    this.highlightLayer.style.right = '0';
    this.highlightLayer.style.bottom = '0';
    this.highlightLayer.style.position = 'absolute';
    this.highlightLayer.style.transformOrigin = '0% 0%';
    
    this.pageElement.appendChild(this.highlightLayer);

    const textLayer = new pdfjsLib.TextLayer({
      textContentSource: this.pdfPage.streamTextContent(),
      container: this.textLayer,
      viewport: this.viewport
    });
    
    await textLayer.render();
  }

  getPageElement() {
    return this.pageElement;
  }

  getTextLayer() {
    return this.textLayer;
  }

  getHighlightLayer() {
    return this.highlightLayer;
  }

  getPageNumber() {
    return this.pageNum;
  }

  getViewport() {
    return this.viewport;
  }
}