jsPDF
May 24, 2023
I'm trying to build an element into a course where they have to write an essay (up to 3 pages) & fill out a Likert/survey but have a button that will put everything into a pdf. I want to have our logo & a header/title at the top that says "TRAILS Program."
I've tried to look at some of the examples provided here(i.e., jsPDF) & online but I'm so new to javascript & HTML that I'm struggling to get all the elements to work together. Is there someone that is familiar with these that can provide me with a simple code for each? Essentially, I'm trying to do something similar to the attached with less pages, our logo, & a different header.
Any help that can be provided would be GREATLY appreciated!! Thank you.
Allisa C.
2 Replies
Hello Allisa, links to the attachments are broken. Kindly fix it so that someone can take a look at your file and assist you.
Hello,
Thank you, Sandeep! I think the issue might have to do with the sharing restrictions on my work computer that isn’t allowing me to just share the files with everyone.
As mentioned, I’m so new to HTML & JavaScript that I’m not certain on what I need to change in the example I’ve been using in order for it to work the way I’d like it to. Essentially, what I want to do is take the activities I’ve created in storyline & turn them into a PDF when the user clicks on a button.
First, there’s the issue of getting our logo & Header of “TRAILS Program” to show up at the top of the PDF when the PDF is generated.
Second, it’s understanding what I need to change to make it work effortlessly so when the user clicks a button in Storyline, the PDF is generated.
I’ve attached the HTML & JS files I’ve been using as an example but it looks like this is only for an essay style exercise so I’d need some assistance with getting the Likert/Survey to appear as part of the PDF.
Unfortunately, I’m not able to attach the Storyline 360 file for the same sharing reasons as I had with the first file. It was just a very simple layout of a journal or diary on the main slide with 2 pages on the slide. Additionally, there were 5 other slide layers (or pages) that had 2 pages each for a total of 10 pages that have text entry fields for user input. Back to the main slide - there is a slider & arrows to navigate through the pages. However, I think the elements that are most pertinent to my question are the Web Object that has an html file extension but looks like it’s saved locally in My Articulate Projects folder & the Print button that executes the following JavaScript: window.frames[0].frameElement.contentWindow.CreateBook();
I’m not set in stone with using this example so if anyone has a better idea of how to accomplish this, I’m more than open to ideas!
Hopefully, you’ll be able to access the attached zip file & see the HTML & JS codes. I was hoping to avoid typing it here, but I’m willing to do that if you’re unable to access the attached file. Please let me know. Thank you again for your time & assistance with this project. It is so appreciated as I feel like I’m a little over my head.
.