Skip to main content
Participant
September 9, 2022
Question

Re-Rending PDF's OnClick (Working Code)

  • September 9, 2022
  • 2 replies
  • 487 views

Hello. I just wanted to share a fun little web app I made with the adobe pdf API.  It's a sheet music repertoire that loads new pdf files with the click of a new song.  It was a bit of a struggle to figure out the code, so I hope it might help someone else! 

 

Here's the site: https://www.clairmusic.com/apollo

Bellow is the code!

 

<!--Adobe PDF reader -->

<script src="https://documentcloud.adobe.com/view-sdk/viewer.js"></script>
<script type="text/javascript">

function renderPdf(fileName, url) {
console.log(fileName, url);
var adobeDCView = new AdobeDC.View({ clientId: "<ID>", divId: "adobe-dc-view" });
adobeDCView.previewFile({
content: { location: { url }},
metaData: { fileName }
}, {
embedMode:"FULL_WINDOW",
focusOnRendering: false,
defaultViewMode: "FIT_WIDTH",
enableSearchAPIs: false,
showZoomControl: false,
});
}

$('.piecenamecontainer').on('click', function () {renderPdf($(this).find('.piecename').text(), $(this).find('.pdf').text()) });
document.addEventListener("adobe_dc_view_sdk.ready", function () { renderPdf("<initial name>", "<Inital pdf URL>") });

</script>

This topic has been closed for replies.

2 replies

Joel Geraci
Community Expert
Community Expert
September 13, 2022

Nice work. I've shared your link internally.

Raymond Camden
Community Manager
Community Manager
September 9, 2022

Wow, this is pretty freaking cool!

Participant
September 9, 2022

Thankssss!!!