@logicamente.info/react-pdf-viewer
Version:
A React PDF viewer component, bootstrap compatible, with controls based on PDF.js.
223 lines (181 loc) • 8.95 kB
JavaScript
;
exports.__esModule = true;
exports["default"] = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _pdfjsDist = _interopRequireDefault(require("pdfjs-dist"));
var _pdfWorker = _interopRequireDefault(require("pdfjs-dist/build/pdf.worker.entry"));
var _Alert = _interopRequireDefault(require("./Alert"));
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
_pdfjsDist["default"].GlobalWorkerOptions.workerSrc = _pdfWorker["default"];
var pdf = null;
var RenderPdf = function RenderPdf(_ref) {
var document = _ref.document,
withCredentials = _ref.withCredentials,
password = _ref.password,
pageNum = _ref.pageNum,
scale = _ref.scale,
rotation = _ref.rotation,
pageCount = _ref.pageCount,
protectContent = _ref.protectContent,
watermark = _ref.watermark,
alert = _ref.alert;
var _useState = (0, _react.useState)({
status: false,
message: ''
}),
error = _useState[0],
setError = _useState[1];
var canvasRef = (0, _react.useRef)(null);
var AlertComponent = alert || _Alert["default"];
var fetchPDF = /*#__PURE__*/function () {
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
var objDocInit, page, viewport, canvas, canvasContext, renderContext, renderTask, text, diagonal, opacity, size, color, metrics, width, height;
return _regenerator["default"].wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
_context.prev = 0;
objDocInit = {
withCredentials: withCredentials,
password: password
};
if (document.url === undefined) {
objDocInit.data = atob(document.base64);
} else {
objDocInit.url = document.url;
}
_context.next = 5;
return _pdfjsDist["default"].getDocument(objDocInit).promise;
case 5:
pdf = _context.sent;
_context.prev = 6;
_context.next = 9;
return pdf.getPage(pageNum);
case 9:
page = _context.sent;
viewport = page.getViewport({
scale: scale,
rotation: rotation
}); // Prepare canvas using PDF page dimensions
canvas = canvasRef.current;
canvas.height = viewport.height;
canvas.width = viewport.width; // Render PDF page into canvas context
canvasContext = canvas.getContext('2d');
renderContext = {
canvasContext: canvasContext,
viewport: viewport
};
renderTask = page.render(renderContext);
_context.prev = 17;
_context.next = 20;
return renderTask.promise;
case 20:
if (Object.entries(watermark).length !== 0) {
// watermark config
text = watermark.text, diagonal = watermark.diagonal, opacity = watermark.opacity, size = watermark.size, color = watermark.color; // setup watermark text for filling
canvasContext.globalAlpha = opacity;
canvasContext.font = size * scale + "px Comic Sans MS";
canvasContext.fillStyle = color; // get the metrics with font settings
metrics = canvasContext.measureText(text);
width = metrics.width;
height = size * scale; // height is font size
canvasContext.translate(viewport.width / 2, viewport.height / 2); // rotate the context and center the text
if (diagonal) {
canvasContext.rotate(-0.785);
}
canvasContext.fillText(text, -width / 2, height / 2);
} // call pageCountfunction
pageCount(pdf.numPages);
_context.next = 28;
break;
case 24:
_context.prev = 24;
_context.t0 = _context["catch"](17);
console.warn('Error occured while rendering !\n', _context.t0);
setError({
status: true,
message: 'Erro ao renderizar !'
});
case 28:
_context.next = 34;
break;
case 30:
_context.prev = 30;
_context.t1 = _context["catch"](6);
console.warn('Error while reading the pages !\n', _context.t1);
setError({
status: true,
message: 'Erro ao ler páginas !'
});
case 34:
_context.next = 40;
break;
case 36:
_context.prev = 36;
_context.t2 = _context["catch"](0);
console.warn('Error while opening the document !\n', _context.t2);
setError({
status: true,
message: 'Erro ao abrir documento !'
});
case 40:
case "end":
return _context.stop();
}
}
}, _callee, null, [[0, 36], [6, 30], [17, 24]]);
}));
return function fetchPDF() {
return _ref2.apply(this, arguments);
};
}();
(0, _react.useEffect)(function () {
fetchPDF();
}, [document, password, pageNum, scale, rotation, pageCount]);
if (error.status) {
pageCount(-1);
return /*#__PURE__*/_react["default"].createElement(AlertComponent, {
message: error.message
});
}
return /*#__PURE__*/_react["default"].createElement("canvas", {
onContextMenu: function onContextMenu(e) {
return protectContent ? e.preventDefault() : null;
},
ref: canvasRef,
width: typeof window !== 'undefined' && window.innerWidth,
height: typeof window !== 'undefined' && window.innerHeight
});
};
RenderPdf.propTypes = process.env.NODE_ENV !== "production" ? {
document: _propTypes["default"].any.isRequired,
withCredentials: _propTypes["default"].bool,
password: _propTypes["default"].string,
pageNum: _propTypes["default"].number.isRequired,
scale: _propTypes["default"].number.isRequired,
rotation: _propTypes["default"].number.isRequired,
pageCount: _propTypes["default"].func,
protectContent: _propTypes["default"].bool,
alert: _propTypes["default"].any,
watermark: _propTypes["default"].shape({
text: _propTypes["default"].string,
diagonal: _propTypes["default"].bool,
opacity: _propTypes["default"].string,
size: _propTypes["default"].string,
color: _propTypes["default"].string
})
} : {};
RenderPdf.defaultProps = {
pageCount: function pageCount() {},
protectContent: false,
watermark: {}
};
var _default = RenderPdf;
exports["default"] = _default;
module.exports = exports.default;