1// ES6 Compliant Syntax
2// GitHub Copilot v1.0 - Model: Claude-3.5 Sonnet - July 9, 2025
3// File: examples/pdfa-conversion/index.js
4import WebViewer from '@pdftron/webviewer';
5
6const element = document.getElementById('viewer');
7let instCore = null;
8const onLoad = async (instance) => {
9 instCore = instance.Core;
10};
11
12WebViewer(
13 {
14 path: '/lib',
15 licenseKey: 'YOUR_LICENSE_KEY',
16 initialDoc: 'https://apryse.s3.amazonaws.com/public/files/samples/WebviewerDemoDoc.pdf',
17 fullAPI: true,
18 },
19 element
20).then((instance) => {
21 onLoad(instance);
22});
23
24let pdfaBlob = null;
25
26const buttonConvert = document.createElement('button');
27buttonConvert.textContent = 'PDF/A convert';
28buttonConvert.onclick = async () => {
29 const doc = instCore.documentViewer.getDocument();
30 const xfdfString = await instCore.annotationManager.exportAnnotations();
31 const data = await doc.getFileData({
32 xfdfString,
33 });
34
35 const conformanceLevel = instCore.PDFNet.PDFACompliance.Conformance[`${levelSelect.value}`];
36 const PDFNetFile = await instCore.PDFNet.PDFACompliance.createFromBuffer(
37 true,
38 data,
39 '',
40 conformanceLevel
41 );
42 const buf = await PDFNetFile.saveAsFromBuffer(false);
43 pdfaBlob = new Blob([buf], { type: 'application/pdf' });
44
45 console.log("PDF/A conversion successful.");
46};
47
48// UI section
49//
50// Helper code to add controls to the viewer holding the buttons and dropdown
51// This code creates a container for the buttons and dropdown, styles them, and adds them to the viewer
52//
53
54
55const buttonDownload = document.createElement('button');
56buttonDownload.textContent = 'Download PDF/A';
57buttonDownload.onclick = () => {
58 if (pdfaBlob) {
59 const url = URL.createObjectURL(pdfaBlob);
60 const link = document.createElement('a');
61 link.href = url;
62 link.download = 'converted.pdf';
63 link.click();
64 } else {
65 alert('PDF/A not available to download.\nPlease convert the document to PDF/A first.');
66 }
67};
68
69// Create a dropdown for PDF/A levels
70// This dropdown allows users to select the PDF/A compliance level they want to convert to.
71// The options correspond to the different PDF/A levels supported by PDFNet.
72
73const levelSelect = document.createElement('select');
74const levels = [
75 { value: 'e_Level1A', label: 'PDF/A-1a' },
76 { value: 'e_Level1B', label: 'PDF/A-1b' },
77 { value: 'e_Level2A', label: 'PDF/A-2a' },
78 { value: 'e_Level2B', label: 'PDF/A-2b' },
79 { value: 'e_Level2U', label: 'PDF/A-2u' },
80 { value: 'e_Level3A', label: 'PDF/A-3a' },
81 { value: 'e_Level3B', label: 'PDF/A-3b' },
82 { value: 'e_Level3U', label: 'PDF/A-3u' },
83 { value: 'e_Level4', label: 'PDF/A-4' },
84 { value: 'e_Level4E', label: 'PDF/A-4e' },
85 { value: 'e_Level4F', label: 'PDF/A-4f' },
86];
87
88// Populate the dropdown with options
89levels.forEach(level => {
90 const option = document.createElement('option');
91 option.value = level.value;
92 option.textContent = level.label;
93 levelSelect.appendChild(option);
94});
95
96// set default value for the dropdown
97levelSelect.value = levels[3].value; // Default to PDF/A-2b
98levelSelect.oninput = () => {
99 console.log(`Selected PDF/A level: ${levelSelect.value}`);
100 pdfaBlob = null; // Reset the blob when the level changes
101};
102
103const levelLabel = document.createElement('label');
104levelLabel.textContent = 'Select PDF/A level: ';
105
106// Create a container for all controls (label, dropdown, and buttons)
107const controlsContainer = document.createElement('div');
108
109levelLabel.className = 'level-label';
110buttonDownload.className = 'btn-download';
111buttonConvert.className = 'btn-convert';
112levelSelect.className = 'level-select';
113controlsContainer.className = 'button-container';
114
115controlsContainer.appendChild(levelLabel);
116controlsContainer.appendChild(levelSelect);
117controlsContainer.appendChild(buttonConvert);
118controlsContainer.appendChild(buttonDownload);
119element.insertBefore(controlsContainer, element.firstChild);