I'd like to embed pdf documents in a backdrop site. The PDF.js module (https://backdropcms.org/project/pdfjs) looks like it will do this. However, I'm not sure how to make it work. On the PDF.js examples page https://mozilla.github.io/pdf.js/examples/index.html#interactive-examples it looks like the following should work:
var loadingTask = pdfjsLib.getDocument('helloworld.pdf');
loadingTask.promise.then(function(pdf)
// you can now use *pdf* here
});
pdf.getPage(1).then(function(page) {
// you can now use *page* here
});However, even though I set the page to full html, it just formatted the lines as html and didn't render a pdf named helloworld.pdf (which I uploaded). Anyone have thoughts on how to use pdf.js. Thanks in advance.
Comments
It is a field formatter for file fields -- add a file field which allows PDF to the content type. You should be able to select PDF.js in the display options for that field.
1. created a new file type and set it to PDF. That gave the PDF.js display option. I created a new file, set it to this type and was able to display it in a page as hoped.
2. Wanting to place an embedded file into a page below some description, I created a new content type <info-sheet> and on the fields below the body added a file field, setting that to PDF. Then under "manage displays", clicked "manage display" which took me to a form (shown below) where I could set the file display properties to PDF.js. Then I created a new info-sheet, added some text to the body, and uploaded a file. That produced exactly what I was looking for! Thanks.
Follow up Question: Is there a way to easily place a download link without uploading a second file. I could always manually link to the file, but was not sure if there is a way to do this through the backdrop interface so that the download link just shows from the single upload.
There is a link to download in the PDF.js interface already. I don't think there is an option currently to add another link in the display settings, but you could create a new layout with the node/% context and then add the file field again underneath the main content, choosing a different display option for the duplicated field.