ldx-widgets/dist/components/pdf_viewer.js

widgets

(function() {
  var PDFViewer, React, ReactDOM, canvas, createClass, div, ref;

  React = require('react');

  createClass = require('create-react-class');

  ReactDOM = require('react-dom');

  ref = React.DOM, div = ref.div, canvas = ref.canvas;


  /*
  Important: This component asummes the PDFJS lib has been loaded (it is not loaded by default), so it should not be rendered unless window.PDFJS?
   */

  PDFViewer = createClass({
    displayName: 'PDFViewer',
    getDefaultProps: function() {
      return {
        showPageDividers: true,
        intent: 'display'
      };
    },
    getInitialState: function() {
      return {
        totalPages: 1
      };
    },
    render: function() {
      var i, intent, page, pages, ref1, ref2, showPageDividers, totalPages;
      totalPages = this.state.totalPages;
      ref1 = this.props, showPageDividers = ref1.showPageDividers, intent = ref1.intent;
      pages = [];
      for (page = i = 0, ref2 = totalPages; 0 <= ref2 ? i < ref2 : i > ref2; page = 0 <= ref2 ? ++i : --i) {
        pages.push(canvas({
          onClick: this.handleClick,
          ref: "pdfCanvas" + page,
          className: 'pdf-canvas',
          key: "page" + page
        }));
        if (page !== totalPages - 1 && showPageDividers && intent !== 'print') {
          pages.push(div({
            className: 'pdf-page-divide',
            key: "divide" + page
          }));
        }
      }
      return div({
        className: 'pdf-container'
      }, pages);
    },
    componentWillMount: function() {
      return this.loadedPageCount = 0;
    },
    componentDidMount: function() {
      return this.renderPDF();
    },
    renderPDF: function() {
      var headers, onError, params, ref1, url;
      ref1 = this.props, url = ref1.url, headers = ref1.headers, onError = ref1.onError;
      params = {
        url: url
      };
      if (headers != null) {
        params.httpHeaders = headers;
      }
      return window.PDFJS.getDocument(params).then((function(_this) {
        return function(pdf) {
          return _this.setState({
            totalPages: pdf.numPages
          }, function() {
            return setTimeout(function() {
              return _this.pageCounter(pdf);
            }, 500);
          });
        };
      })(this))["catch"]((function(_this) {
        return function(err) {
          return typeof onError === "function" ? onError(err) : void 0;
        };
      })(this));
    },
    renderPage: function(pdf, pageNum, cb) {
      var intent, scale;
      intent = this.props.intent;
      scale = (Math.ceil(window.innerWidth / 100)) / 10;
      scale = intent === 'print' ? 3 : scale;
      return pdf.getPage(pageNum).then((function(_this) {
        return function(page) {
          var context, pdfCanvas, renderContext, viewport;
          pdfCanvas = ReactDOM.findDOMNode(_this.refs["pdfCanvas" + page.pageIndex]);
          viewport = page.getViewport(scale);
          context = pdfCanvas.getContext('2d');
          if (intent === 'print') {
            if (page.rotate !== 0) {
              pdfCanvas.style.height = "5.8in";
              pdfCanvas.style.width = "7.5in";
            } else {
              pdfCanvas.style.height = "9.3in";
              pdfCanvas.style.width = "7.19in";
            }
          }
          pdfCanvas.height = viewport.height;
          pdfCanvas.width = viewport.width;
          renderContext = {
            canvasContext: context,
            viewport: viewport,
            intent: intent
          };
          return page.render(renderContext).then(function() {
            return typeof cb === "function" ? cb(pdf) : void 0;
          });
        };
      })(this));
    },
    pageCounter: function(pdf) {
      var base, totalPages;
      totalPages = this.state.totalPages;
      this.loadedPageCount += 1;
      if (typeof (base = this.props).pageCounter === "function") {
        base.pageCounter(totalPages);
      }
      if (this.loadedPageCount < totalPages) {
        return this.renderPage(pdf, this.loadedPageCount, this.pageCounter);
      } else {
        return this.renderPage(pdf, this.loadedPageCount, (function(_this) {
          return function() {
            var base1;
            return typeof (base1 = _this.props).onLoad === "function" ? base1.onLoad() : void 0;
          };
        })(this));
      }
    },
    shouldComponentUpdate: function(nextProps, nextState) {
      return nextState.totalPages !== this.state.totalPages;
    },
    handleClick: function(e) {
      var base;
      return typeof (base = this.props).onClick === "function" ? base.onClick(e) : void 0;
    }
  });

  module.exports = PDFViewer;

}).call(this);