1
0
Fork 0
freesewing/sites/shared/components/workbench/exporting/pdfExporter.js

173 lines
5.3 KiB
JavaScript
Raw Normal View History

2022-08-17 13:11:22 -05:00
import PDFDocument from 'pdfkit/js/pdfkit.standalone'
import SVGtoPDF from 'svg-to-pdfkit'
import fileSaver from 'file-saver'
/**
* About these numbers, as they are the hardest part of all this:
* PdfKit, the library we're using for pdf generation, uses points as a unit, so when we tell it things like where to put the svg and how big the svg is, we need those numbers to be in points
* The svg uses mm internally, so when we do spatial reasoning inside the svg, we need to know values in mm
* */
// multiply a pixel value by this to get a points value
const pxToPoints = (72/96);
// multiply a mm value by this to get a pixel value
const mmToPx = 3.77953
// multiply a mm value by this to get a points value
2022-08-21 10:26:35 +01:00
// const mmToPoints = mmToPx * pxToPoints
const mmToPoints = 2.834645669291339
2022-08-17 13:11:22 -05:00
/**
* Freesewing's first explicit class?
* handles pdf exporting
*/
export default class Exporter {
/** the name of the design, this is used to title the exported pdf */
designName
/** the svg element to embed in the pdf */
svg
/** the document configuration */
settings
/** the pattern instance that is being exported */
pattern
/** the pdfKit instance that is writing the document */
pdf
2022-08-21 10:26:35 +01:00
buffers
2022-08-17 13:11:22 -05:00
/** the usable width (excluding margin) of the pdf page, in points */
pageWidth
/** the usable height (excluding margin) of the pdf page, in points */
pageHeight
/** the page margin, in points */
margin
/** the number of columns of pages in the svg */
columns
/** the number of rows of pages in the svg */
rows
/** the width of the svg element, in points */
svgWidth
/** the height of the svg element, in points */
svgHeight
/** a dictionary to track which pages actually have anything on them */
pagesWithContent = {}
2022-08-21 10:26:35 +01:00
constructor({svg, settings, pages}) {
2022-08-17 13:11:22 -05:00
this.settings = settings
2022-08-21 10:26:35 +01:00
this.pagesWithContent = pages.withContent;
this.svg = svg
2022-08-17 13:11:22 -05:00
this.createPdf()
this.margin = this.settings.margin * mmToPoints // margin is in mm because it comes from us, so we convert it to points
2022-08-21 10:26:35 +01:00
this.pageHeight = this.pdf.page.height - this.margin * 2 // this is in points because it comes from pdfKit
this.pageWidth = this.pdf.page.width - this.margin * 2// this is in points because it comes from pdfKit
2022-08-17 13:11:22 -05:00
// get the pages data
this.columns = pages.cols
this.rows = pages.rows
// then set the svg's width and height in points to include all pages in full (the original svg will have been set to show only as much page as is occupied)
2022-08-21 10:26:35 +01:00
this.svgWidth = this.columns * pages.width * mmToPoints
this.svgHeight = this.rows * pages.height * mmToPoints
2022-08-17 13:11:22 -05:00
}
/** pdf page usable (excluding margin) width, in mm */
get pageWidthInMm() { return this.pageWidth / mmToPoints }
/** pdf page usable (excluding margin) height, in mm */
get pageHeightInMm() { return this.pageHeight / mmToPoints }
/** create the pdf document */
createPdf() {
// instantiate with the correct size and orientation
this.pdf = new PDFDocument({
size: this.settings.size.toUpperCase(),
layout: this.settings.orientation
})
// PdfKit wants to flush the buffer on each new page.
// We don't want to try to save the document until it's complete, so we have to manage the buffers ourselves
2022-08-21 10:26:35 +01:00
this.buffers = [];
2022-08-17 13:11:22 -05:00
// add new data to our buffer storage
2022-08-21 10:26:35 +01:00
this.pdf.on('data', this.buffers.push.bind(this.buffers));
2022-08-17 13:11:22 -05:00
}
/** export to pdf */
2022-08-21 10:26:35 +01:00
async export(onComplete) {
// when the end event fires, then we save the whole thing
this.pdf.on('end', () => {
// convert buffers to a blob
const blob = new Blob(this.buffers, {
type: 'application/pdf'
})
onComplete(blob)
});
2022-08-17 13:11:22 -05:00
await this.generateCoverPage()
await this.generatePages();
this.save()
}
/** generate the cover page for the pdf */
async generateCoverPage() {
// don't make one if it's not requested
if (!this.settings.coverPage) {
return
}
//abitrary margin for visual space
let coverMargin = 50
let coverHeight = this.pageHeight - coverMargin * 2
let coverWidth = this.pageWidth - coverMargin * 2
// add the entire pdf to the page, so that it fills the available space as best it can
2022-08-21 10:26:35 +01:00
await SVGtoPDF(this.pdf, this.svg, coverMargin, coverMargin, {
2022-08-17 13:11:22 -05:00
width: coverWidth,
height: coverHeight,
assumePt: true,
// use aspect ratio to center it
preserveAspectRatio: 'xMidYMid meet'
});
}
/** generate the pages of the pdf */
async generatePages() {
// pass the same options to the svg converter for each page
const options = {
assumePt: true,
width: this.svgWidth,
height: this.svgHeight,
2022-08-21 10:26:35 +01:00
preserveAspectRatio: 'xMinYMin slice',
2022-08-17 13:11:22 -05:00
}
// everything is offset by half a margin so that it's centered on the page
2022-08-21 10:26:35 +01:00
const startMargin = this.margin
2022-08-17 13:11:22 -05:00
for (var h = 0; h < this.rows; h++) {
for (var w = 0; w < this.columns; w++) {
// skip empty pages
if (!this.pagesWithContent[h][w]) continue;
// position it
let x = -w * this.pageWidth + startMargin
let y = -h * this.pageHeight + startMargin
// if there was no cover page, the first page already exists
if (this.settings.coverPage || h+w > 0) {
// otherwise make a new page
this.pdf.addPage()
}
// add the pdf to the page, offset by the page distances
2022-08-21 10:26:35 +01:00
await SVGtoPDF(this.pdf, this.svg, x, y, options)
2022-08-17 13:11:22 -05:00
}
}
}
/** download the pdf */
save() {
this.pdf.end();
}
}