Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix PDF format #307

Closed
taylorsmithgg opened this issue Jan 29, 2015 · 8 comments
Closed

Fix PDF format #307

taylorsmithgg opened this issue Jan 29, 2015 · 8 comments

Comments

@taylorsmithgg
Copy link

Suggestion: https://atmospherejs.com/pascoual/pdfkit

Implement document-based pdf generation, as Blaze.saveAsPDF seems unreliable and has poor formatting support.

@aaronjudd aaronjudd added this to the Core Architecture milestone Jan 29, 2015
@aaronjudd
Copy link
Contributor

For more background see: #52

In looking at pdfkit again, it looks like it now has client side functionality (not sure if that was always there or not). Not sure if the atmosphere package is exporting to client, but we'd probably want to include the pdfkit npm as a core library and export to client as well. One of my wish lists was to not have to have special pdf templates, reusing meteor templates. We'll need to see if this is possible (html -> pdf), or how difficult this would be for people to make customization if we use pdfkit.

@aaronjudd
Copy link
Contributor

I built a test package to that installs pdfkit, with the same format as ongowork:pdf and tested that way. the problem with pdfkit, and the reason I didn't choose it the first time around... is that to support html-> pdf conversion you need http://wkhtmltopdf.org/ installed (and also true with a whole bunch other npm modules).

General requirements:

  • we don't want to have to prep/manual install the environment if that can be avoided
  • html to pdf for re-use of existing templates (so that we can use BlazeToHTML)
  • prefer to reuse existing templates, but we could have special ones if we must, but should be user-legible (don't want anyone to have to learn special pdf speak).

For the umpteenth time, I wonder if PDF is something that is really required, VS a browser print screen or email.

@aaronjudd
Copy link
Contributor

I've updated the formatting and given the pdf it's own layout. At least it now prints the info and is sort of useable as an invoice. It's still ugly, and the jsPDF formatting is impossibly broken / malfunctioning. I don't think this is the long term answer. I tried html2canvas to jsPDF as well: ie

  html2canvas $(document.body), onrendered: (canvas) ->
    imgData = canvas.toDataURL('image/png')
    doc = new jsPDF('p', 'mm')
    doc.addImage imgData, 'PNG', 10, 10
    doc.save 'sample-file.pdf'
    return

(had to add the html2canvas files for this)

This does render a fairly decent image of the invoice, and insert into a pdf, but I wasn't able to stream direct from Blaze to this - it had to be injected into an element, and then pass the element to the html2canvas. this was just a bit too kludge for me.

@aaronjudd aaronjudd removed the ready label Feb 14, 2015
@danielgindi
Copy link
Contributor

Maybe we should just use an HTML interpreter to parse HTML files and format PDF files? This way we will also be able to switch PDF libs if necessary...
I'm sure we can find something useful. Sometimes we can use modules that are not meant for that... I have recently used UglifyJS to tokenize the JS files in node.js apps, detect require statements and squash everything to one file. And it was kind of easy.

@gouthamve
Copy link
Contributor

The layout problems could arise from the css source files (like bootstrap) not in the html rendered by Blaze. This means jsPDF doesn't see a stylesheet link.
Also we cannot deliver the css through cdn so we need to have the css in Reaction-core and stylesheet link it in the template to be rendered.

@aaronjudd
Copy link
Contributor

from @gouthamve

This is frustrating, I couldn’t find the compiled css files or rather I didn’t want to use them (they are hidden in some random.css in .meteor/). So I added the official bootstrap in the public folder and linked it to the template. The rendered template used the new css file but jsPDF did not. I have no idea how jsPDF works :( Any ideas @aaronjudd ?

@gouthamve
Copy link
Contributor

I looked into some alternates because jsPDF is not reliable for html to pdf conversion. I found two options:

  1. Phantomjs: We could use phantom js and render the pdf.
  2. Using the browsers print/export to PDF functionality: We can show the invoice and add a button which triggers the browser function.

I am in favour of having Phantomjs instead of second option as it seems natural but I havent had time so I dont know if its possible to produce PDFs using phantom in Meteor.

@aaronjudd
Copy link
Contributor

See #52 re phantomjs: it worked, sort of, but we had issues with it as well. That was the initial solution I implemented.

aaronjudd added a commit that referenced this issue Dec 3, 2015
@aaronjudd aaronjudd removed the backlog label Dec 16, 2015
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants