Feature Status/Feasibility

[KieranP]

Just stumbled on this project. We're a small company, but for our use case, we need a lot of different functions that work together to produce the result we need. We use Nutrient right now, which does support all we need, but they are quite expensive, and so are on the lookout for an open source alternative.

Here is what we currently use in Nutrient, but different code to express desired API (nutrients is much more verbose):

UI

• Full Featured Viewer (this would include embedded JS that shows/hides paragraphs or form fields when other elements are clicked)
• Form Filling (text, radio, check, date, etc)
• Signatures (both drawn and typed)

JS API

• Ability to save and restoring saved signatures in localStorage

pdf.on('loading', () => {
  const signaturesRaw = localStorage.get('signatures') || '{}'
  pdf.signatures = JSON.parse(signaturesRaw)
})

pdf.on('signature.added', (annotation) => {
  const signaturesRaw = localStorage.get('signatures') || '{}'
  const signatures = JSON.parse(signaturesRaw)

  signatures[annotation.id] = annotation.asBase64()

  const updatedSignatures = JSON.stringify(signatures)
  localStorage.set('signatures', updatedSignatures)
})

pdf.on('signature.removed', (annotation) => {
  const signaturesRaw = localStorage.get('signatures') || '{}'
  const signatures = JSON.parse(signaturesRaw)

  delete signatures[annotation.id]

  const updatedSignatures = JSON.stringify(signatures)
  localStorage.set('signatures', updatedSignatures)
})

• Ability to locate text, redact the area, and replace with signature widget

pdf.on('loaded', () => {
  for (const line of pdf.textLines()) {
    if (line.contents === "[[SIGNATURE]]") {
      pdf.redactArea(line.boundingBox) // boundingBox = { x, y, w, h }
  
      pdf.addWidget(
        EmbedPdf.Widgets.Signature,
        line.boundingBox,
      )
    }
  }
}

• Ability to pre-fill and extract data to/from form fields, e.g.

pdf.on('loaded', () => {
  const prefillResponses = {} // Fetch from DB
  for (const field of pdf.formFields()) {
    field.set(prefillResponses[field.name])
  }
})

saveBtn.on('click', () => {
  const savedResponses = {}
  for (const field of pdf.formFields()) {
    savedResponses[field.name] = field.value
  }
  // Persist to DB
})

• Export functionality

const pdfBinary = pdf.export({ type: 'binary' })
// POST to save file to AWS S3

After looking at the demo, it does not appear that this plugin supports any of those more complex UI or API things yet. The UI has redact functionality, but can't be done with JS API yet.

But rest assured, once these things are supported, we'll be moving over to this and would gladly help sponsor the project to keep it alive at that point.

[bobsingor]

Hi @KieranP,

Thanks for this excellent, detailed breakdown of your use case. You're right that we don't yet have this level of advanced API control, but it's very much in line with where we want to take the project.

Your requirements are a great example of the real-world functionality we want to support, and I'd love to learn more.

I'd be happy to connect to discuss this. Please feel free to send me a message on Discord or book a call directly here:
https://cal.com/embedpdf/1hr

Looking forward to connecting!