import { r as registerInstance, d as createEvent, h, e as getElement } from './index-7ec78587.js';
import { p as pdf } from './pdf-d424d590.js';
import './buffer-es6-c2f042fd.js';

const akordPdfViewerSpaCss = "akord-pdf-viewer-spa{--cursor-dark:url(\"/assets/dark_zoom.svg\"), zoom-in;--cursor-light:url(\"/assets/light_zoom.svg\"), zoom-in}akord-pdf-viewer-spa .dark-mode{cursor:var(--cursor-dark)}akord-pdf-viewer-spa .light-mode{cursor:var(--cursor-light)}akord-pdf-viewer-spa canvas{margin:auto;display:block;width:100%;height:100%}akord-pdf-viewer-spa .pdf-nav-buttons{position:sticky;display:inline-block;bottom:5px;left:50%;background-color:rgba(60, 60, 60, 0.4);border-radius:10px;opacity:0;transform:translate(-50%, 0);transition:opacity ease-out 0.5s}akord-pdf-viewer-spa .pdf-nav-buttons.active{opacity:1}akord-pdf-viewer-spa ion-buttons ion-button ion-icon{background:transparent;fill:black !important}";

pdf.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.5.207/pdf.worker.min.js';
let AkordPdfViewerSpa = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.pageRendered = createEvent(this, "pageRendered", 7);
    this.pageChange = createEvent(this, "pageChange", 7);
    this.pageNum = 1; // hardcoded to start at the page 1
    this.pageNumPending = null;
    this.scale = 0.9; // hardcoded to scale the document to full canvas size
    /**
     * Rotate the PDF in degrees
     * {number}
     */
    this.rotation = 0;
    this.darkMode = false;
  }
  /**
   * Listen for changes to src
   * @param newValue
   * @param oldValue
   */
  doSrc(newValue, oldValue) {
    if (newValue === oldValue) {
      return;
    }
    this.loadAndRender(newValue);
  }
  /**
   * Page forward
   * {MouseEvent} e
   */
  async pageNext(e) {
    e.preventDefault();
    if (this.pageNum >= this.pdfDocument.numPages) {
      return;
    }
    this.pageNum += 1;
    this.queueRenderPage(this.pageNum);
    this.handleMouseEnter();
  }
  /**
   * Page backward
   * e
   */
  async pagePrev(e) {
    e.preventDefault();
    if (this.pageNum <= 1) {
      return;
    }
    this.pageNum -= 1;
    this.queueRenderPage(this.pageNum);
    this.handleMouseEnter();
  }
  /**
   * Render the page based on pageNumber
   * {number} pageNumber
   */
  renderPage(pageNumber) {
    this.isPageRendering = true;
    this.pdfDocument
      .getPage(pageNumber)
      .then((page) => {
      const viewport = page.getViewport({ scale: this.scale, rotation: this.rotation });
      this.canvas.height = viewport.height;
      this.canvas.width = viewport.width;
      // Render PDF page into canvas context
      const renderContext = {
        viewport,
        canvasContext: this.ctx
      };
      // Render page method
      const renderTask = page.render(renderContext);
      // Wait for rendering to finish
      renderTask.promise
        .then(() => {
        this.isPageRendering = false;
        this.pageRendered.emit(this.pageNum);
        if (this.pageNumPending !== null) {
          this.renderPage(this.pageNumPending); // New page rendering is pending
          this.pageChange.emit(this.pageNumPending); // emit
          this.pageNumPending = null;
        }
      });
    });
  }
  queueRenderPage(pageNumber) {
    if (this.isPageRendering) {
      this.pageNumPending = pageNumber;
    }
    else {
      this.renderPage(pageNumber);
    }
  }
  componentDidLoad() {
    this.ctx = this.canvas.getContext('2d');
    if (this.src) {
      this.loadAndRender(this.src);
    }
  }
  loadAndRender(src) {
    pdf
      .getDocument(src).promise
      .then((pdfDocument) => {
      this.pdfDocument = pdfDocument;
      this.renderPage(this.pageNum);
    });
  }
  handleMouseEnter() {
    var _a;
    (_a = this.btns) === null || _a === void 0 ? void 0 : _a.classList.add('active');
    clearTimeout(this.zoomButtonsHideTimeout);
  }
  handleMouseLeave() {
    this.zoomButtonsHideTimeout = setTimeout(() => { var _a; return (_a = this.btns) === null || _a === void 0 ? void 0 : _a.classList.remove('active'); }, 1000);
  }
  handleMouseMove() {
    this.handleMouseEnter();
    this.handleMouseLeave();
  }
  render() {
    var _a;
    return (h("div", { class: this.containerClass, style: { height: `${this.height}px` }, onMouseMove: () => this.handleMouseMove() }, h("canvas", { ref: e => this.canvas = e, class: this.darkMode ? 'dark-mode' : 'light-mode' }), h("ion-buttons", { ref: e => (this.btns = e), class: 'pdf-nav-buttons', onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("ion-button", { class: "events-prevent", disabled: this.pageNum === 1, fill: "clear", size: "small", onClick: this.pagePrev.bind(this) }, h("ion-icon", { slot: "icon-only", src: '/assets/arrow_left.svg' })), h("ion-button", { class: "events-prevent", disabled: this.pageNum === ((_a = this.pdfDocument) === null || _a === void 0 ? void 0 : _a.numPages), fill: "clear", size: "small", onClick: this.pageNext.bind(this) }, h("ion-icon", { slot: "icon-only", src: '/assets/arrow_right.svg' })))));
  }
  get component() { return getElement(this); }
  static get watchers() { return {
    "src": ["doSrc"]
  }; }
};
AkordPdfViewerSpa.style = akordPdfViewerSpaCss;

export { AkordPdfViewerSpa as akord_pdf_viewer_spa };
