Forum Discussion
Creating downloadable pdf files in Storyline - an update on earlier methods
Thanks to John for the wonderful idea. I did tweak this a bit. My requirment was to just create a pdf with the user responses for many text entry boxes. However I am stuck at one point. Once the text overflows the page, how do I go to the next page? Any javascript experts who can help with this?
Here is the javascript code:
//Retrieve Player Variables
var player = GetPlayer();
learnerName = player.GetVar("name");
learnerEmail = player.GetVar("email");
learnerMessage = player.GetVar("message");
createPdf();
async function createPdf() {
await import("https://unpkg.com/pdf-lib@1.4.0/dist/pdf-lib.min.js")
const { PDFDocument, StandardFonts, rgb } = PDFLib;
// Create a new PDFDocument
const pdfDoc = await PDFDocument.create()
// Embed the Times Roman font
const timesRomanFont = await pdfDoc.embedFont(StandardFonts.TimesRoman)
// Add a blank page to the document
const page = pdfDoc.addPage()
// Get the width and height of the page
const { width, height } = page.getSize()
// Draw a string of text toward the top of the page
const fontSize = 30;
page.setFontSize(fontSize);
const startX = 50;
const maxWidth = width - 10;
const lineSpacer = 8;
let startY = height - 130;
const textContent = learnerName + ' ' + learnerEmail
+ ' ' + learnerMessage;
// page.setFontSize(fontSize);
//page.drawText(textContent,{x:startX, y:startY});
const lines = page.drawText(textContent, {
x: startX,
y: startY,
color: rgb(0, 0, 0),
maxWidth,
lineHeight: fontSize + 5
});
pdfDoc.addPage();
// Serialize the PDFDocument to bytes (a Uint8Array)
const pdfBytes = await pdfDoc.save()
// Trigger the browser to download the PDF document
download(pdfBytes, "Sample.pdf", "application/pdf");
}
Thanks!