modules/cell.js

  1. /**
  2.  * @license
  3.  * ====================================================================
  4.  * Copyright (c) 2013 Youssef Beddad, youssef.beddad@gmail.com
  5.  *               2013 Eduardo Menezes de Morais, eduardo.morais@usp.br
  6.  *               2013 Lee Driscoll, https://github.com/lsdriscoll
  7.  *               2014 Juan Pablo Gaviria, https://github.com/juanpgaviria
  8.  *               2014 James Hall, james@parall.ax
  9.  *               2014 Diego Casorran, https://github.com/diegocr
  10.  *
  11.  * Permission is hereby granted, free of charge, to any person obtaining
  12.  * a copy of this software and associated documentation files (the
  13.  * "Software"), to deal in the Software without restriction, including
  14.  * without limitation the rights to use, copy, modify, merge, publish,
  15.  * distribute, sublicense, and/or sell copies of the Software, and to
  16.  * permit persons to whom the Software is furnished to do so, subject to
  17.  * the following conditions:
  18.  *
  19.  * The above copyright notice and this permission notice shall be
  20.  * included in all copies or substantial portions of the Software.
  21.  *
  22.  * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
  23.  * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
  24.  * MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
  25.  * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
  26.  * LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
  27.  * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
  28.  * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  29.  * ====================================================================
  30.  */
  32. import { jsPDF } from "../jspdf.js";
  34. /**
  35.  * @name cell
  36.  * @module
  37.  */
  38. (function(jsPDFAPI) {
  39.   "use strict";
  41.   var NO_MARGINS = { left: 0, top: 0, bottom: 0, right: 0 };
  43.   var px2pt = (0.264583 * 72) / 25.4;
  44.   var printingHeaderRow = false;
  46.   var _initialize = function() {
  47.     if (typeof this.internal.__cell__ === "undefined") {
  48.       this.internal.__cell__ = {};
  49.       this.internal.__cell__.padding = 3;
  50.       this.internal.__cell__.headerFunction = undefined;
  51.       this.internal.__cell__.margins = Object.assign({}, NO_MARGINS);
  52.       this.internal.__cell__.margins.width = this.getPageWidth();
  53.       _reset.call(this);
  54.     }
  55.   };
  57.   var _reset = function() {
  58.     this.internal.__cell__.lastCell = new Cell();
  59.     this.internal.__cell__.pages = 1;
  60.   };
  62.   var Cell = function() {
  63.     var _x = arguments[0];
  64.     Object.defineProperty(this, "x", {
  65.       enumerable: true,
  66.       get: function() {
  67.         return _x;
  68.       },
  69.       set: function(value) {
  70.         _x = value;
  71.       }
  72.     });
  73.     var _y = arguments[1];
  74.     Object.defineProperty(this, "y", {
  75.       enumerable: true,
  76.       get: function() {
  77.         return _y;
  78.       },
  79.       set: function(value) {
  80.         _y = value;
  81.       }
  82.     });
  83.     var _width = arguments[2];
  84.     Object.defineProperty(this, "width", {
  85.       enumerable: true,
  86.       get: function() {
  87.         return _width;
  88.       },
  89.       set: function(value) {
  90.         _width = value;
  91.       }
  92.     });
  93.     var _height = arguments[3];
  94.     Object.defineProperty(this, "height", {
  95.       enumerable: true,
  96.       get: function() {
  97.         return _height;
  98.       },
  99.       set: function(value) {
  100.         _height = value;
  101.       }
  102.     });
  103.     var _text = arguments[4];
  104.     Object.defineProperty(this, "text", {
  105.       enumerable: true,
  106.       get: function() {
  107.         return _text;
  108.       },
  109.       set: function(value) {
  110.         _text = value;
  111.       }
  112.     });
  113.     var _lineNumber = arguments[5];
  114.     Object.defineProperty(this, "lineNumber", {
  115.       enumerable: true,
  116.       get: function() {
  117.         return _lineNumber;
  118.       },
  119.       set: function(value) {
  120.         _lineNumber = value;
  121.       }
  122.     });
  123.     var _align = arguments[6];
  124.     Object.defineProperty(this, "align", {
  125.       enumerable: true,
  126.       get: function() {
  127.         return _align;
  128.       },
  129.       set: function(value) {
  130.         _align = value;
  131.       }
  132.     });
  134.     return this;
  135.   };
  137.   Cell.prototype.clone = function() {
  138.     return new Cell(
  139.       this.x,
  140.       this.y,
  141.       this.width,
  142.       this.height,
  143.       this.text,
  144.       this.lineNumber,
  145.       this.align
  146.     );
  147.   };
  149.   Cell.prototype.toArray = function() {
  150.     return [
  151.       this.x,
  152.       this.y,
  153.       this.width,
  154.       this.height,
  155.       this.text,
  156.       this.lineNumber,
  157.       this.align
  158.     ];
  159.   };
  161.   /**
  162.    * @name setHeaderFunction
  163.    * @function
  164.    * @param {function} func
  165.    */
  166.   jsPDFAPI.setHeaderFunction = function(func) {
  167.     _initialize.call(this);
  168.     this.internal.__cell__.headerFunction =
  169.       typeof func === "function" ? func : undefined;
  170.     return this;
  171.   };
  173.   /**
  174.    * @name getTextDimensions
  175.    * @function
  176.    * @param {string} txt
  177.    * @returns {Object} dimensions
  178.    */
  179.   jsPDFAPI.getTextDimensions = function(text, options) {
  180.     _initialize.call(this);
  181.     options = options || {};
  182.     var fontSize = options.fontSize || this.getFontSize();
  183.     var font = options.font || this.getFont();
  184.     var scaleFactor = options.scaleFactor || this.internal.scaleFactor;
  185.     var width = 0;
  186.     var amountOfLines = 0;
  187.     var height = 0;
  188.     var tempWidth = 0;
  189.     var scope = this;
  191.     if (!Array.isArray(text) && typeof text !== "string") {
  192.       if (typeof text === "number") {
  193.         text = String(text);
  194.       } else {
  195.         throw new Error(
  196.           "getTextDimensions expects text-parameter to be of type String or type Number or an Array of Strings."
  197.         );
  198.       }
  199.     }
  201.     const maxWidth = options.maxWidth;
  202.     if (maxWidth > 0) {
  203.       if (typeof text === "string") {
  204.         text = this.splitTextToSize(text, maxWidth);
  205.       } else if (Object.prototype.toString.call(text) === "[object Array]") {
  206.         text = text.reduce(function(acc, textLine) {
  207.           return acc.concat(scope.splitTextToSize(textLine, maxWidth));
  208.         }, []);
  209.       }
  210.     } else {
  211.       // Without the else clause, it will not work if you do not pass along maxWidth
  212.       text = Array.isArray(text) ? text : [text];
  213.     }
  215.     for (var i = 0; i < text.length; i++) {
  216.       tempWidth = this.getStringUnitWidth(text[i], { font: font }) * fontSize;
  217.       if (width < tempWidth) {
  218.         width = tempWidth;
  219.       }
  220.     }
  222.     if (width !== 0) {
  223.       amountOfLines = text.length;
  224.     }
  226.     width = width / scaleFactor;
  227.     height = Math.max(
  228.       (amountOfLines * fontSize * this.getLineHeightFactor() -
  229.         fontSize * (this.getLineHeightFactor() - 1)) /
  230.         scaleFactor,
  231.       0
  232.     );
  233.     return { w: width, h: height };
  234.   };
  236.   /**
  237.    * @name cellAddPage
  238.    * @function
  239.    */
  240.   jsPDFAPI.cellAddPage = function() {
  241.     _initialize.call(this);
  243.     this.addPage();
  245.     var margins = this.internal.__cell__.margins || NO_MARGINS;
  246.     this.internal.__cell__.lastCell = new Cell(
  247.       margins.left,
  248.       margins.top,
  249.       undefined,
  250.       undefined
  251.     );
  252.     this.internal.__cell__.pages += 1;
  254.     return this;
  255.   };
  257.   /**
  258.    * @name cell
  259.    * @function
  260.    * @param {number} x
  261.    * @param {number} y
  262.    * @param {number} width
  263.    * @param {number} height
  264.    * @param {string} text
  265.    * @param {number} lineNumber lineNumber
  266.    * @param {string} align
  267.    * @return {jsPDF} jsPDF-instance
  268.    */
  269.   var cell = (jsPDFAPI.cell = function() {
  270.     var currentCell;
  272.     if (arguments[0] instanceof Cell) {
  273.       currentCell = arguments[0];
  274.     } else {
  275.       currentCell = new Cell(
  276.         arguments[0],
  277.         arguments[1],
  278.         arguments[2],
  279.         arguments[3],
  280.         arguments[4],
  281.         arguments[5]
  282.       );
  283.     }
  284.     _initialize.call(this);
  285.     var lastCell = this.internal.__cell__.lastCell;
  286.     var padding = this.internal.__cell__.padding;
  287.     var margins = this.internal.__cell__.margins || NO_MARGINS;
  288.     var tableHeaderRow = this.internal.__cell__.tableHeaderRow;
  289.     var printHeaders = this.internal.__cell__.printHeaders;
  290.     // If this is not the first cell, we must change its position
  291.     if (typeof lastCell.lineNumber !== "undefined") {
  292.       if (lastCell.lineNumber === currentCell.lineNumber) {
  293.         //Same line
  294.         currentCell.x = (lastCell.x || 0) + (lastCell.width || 0);
  295.         currentCell.y = lastCell.y || 0;
  296.       } else {
  297.         //New line
  298.         if (
  299.           lastCell.y + lastCell.height + currentCell.height + margins.bottom >
  300.           this.getPageHeight()
  301.         ) {
  302.           this.cellAddPage();
  303.           currentCell.y = margins.top;
  304.           if (printHeaders && tableHeaderRow) {
  305.             this.printHeaderRow(currentCell.lineNumber, true);
  306.             currentCell.y += tableHeaderRow[0].height;
  307.           }
  308.         } else {
  309.           currentCell.y = lastCell.y + lastCell.height || currentCell.y;
  310.         }
  311.       }
  312.     }
  314.     if (typeof currentCell.text[0] !== "undefined") {
  315.       this.rect(
  316.         currentCell.x,
  317.         currentCell.y,
  318.         currentCell.width,
  319.         currentCell.height,
  320.         printingHeaderRow === true ? "FD" : undefined
  321.       );
  322.       if (currentCell.align === "right") {
  323.         this.text(
  324.           currentCell.text,
  325.           currentCell.x + currentCell.width - padding,
  326.           currentCell.y + padding,
  327.           { align: "right", baseline: "top" }
  328.         );
  329.       } else if (currentCell.align === "center") {
  330.         this.text(
  331.           currentCell.text,
  332.           currentCell.x + currentCell.width / 2,
  333.           currentCell.y + padding,
  334.           {
  335.             align: "center",
  336.             baseline: "top",
  337.             maxWidth: currentCell.width - padding - padding
  338.           }
  339.         );
  340.       } else {
  341.         this.text(
  342.           currentCell.text,
  343.           currentCell.x + padding,
  344.           currentCell.y + padding,
  345.           {
  346.             align: "left",
  347.             baseline: "top",
  348.             maxWidth: currentCell.width - padding - padding
  349.           }
  350.         );
  351.       }
  352.     }
  353.     this.internal.__cell__.lastCell = currentCell;
  354.     return this;
  355.   });
  357.   /**
  358.      * Create a table from a set of data.
  359.      * @name table
  360.      * @function
  361.      * @param {Integer} [x] : left-position for top-left corner of table
  362.      * @param {Integer} [y] top-position for top-left corner of table
  363.      * @param {Object[]} [data] An array of objects containing key-value pairs corresponding to a row of data.
  364.      * @param {String[]} [headers] Omit or null to auto-generate headers at a performance cost
  366.      * @param {Object} [config.printHeaders] True to print column headers at the top of every page
  367.      * @param {Object} [config.autoSize] True to dynamically set the column widths to match the widest cell value
  368.      * @param {Object} [config.margins] margin values for left, top, bottom, and width
  369.      * @param {Object} [config.fontSize] Integer fontSize to use (optional)
  370.      * @param {Object} [config.padding] cell-padding in pt to use (optional)
  371.      * @param {Object} [config.headerBackgroundColor] default is #c8c8c8 (optional)
  372.      * @param {Object} [config.headerTextColor] default is #000 (optional)
  373.      * @param {Object} [config.rowStart] callback to handle before print each row (optional)
  374.      * @param {Object} [config.cellStart] callback to handle before print each cell (optional)
  375.      * @returns {jsPDF} jsPDF-instance
  376.      */
  378.   jsPDFAPI.table = function(x, y, data, headers, config) {
  379.     _initialize.call(this);
  380.     if (!data) {
  381.       throw new Error("No data for PDF table.");
  382.     }
  384.     config = config || {};
  386.     var headerNames = [],
  387.       headerLabels = [],
  388.       headerAligns = [],
  389.       i,
  390.       columnMatrix = {},
  391.       columnWidths = {},
  392.       column,
  393.       columnMinWidths = [],
  394.       j,
  395.       tableHeaderConfigs = [],
  396.       //set up defaults. If a value is provided in config, defaults will be overwritten:
  397.       autoSize = config.autoSize || false,
  398.       printHeaders = config.printHeaders === false ? false : true,
  399.       fontSize =
  400.         config.css && typeof config.css["font-size"] !== "undefined"
  401.           ? config.css["font-size"] * 16
  402.           : config.fontSize || 12,
  403.       margins =
  404.         config.margins ||
  405.         Object.assign({ width: this.getPageWidth() }, NO_MARGINS),
  406.       padding = typeof config.padding === "number" ? config.padding : 3,
  407.       headerBackgroundColor = config.headerBackgroundColor || "#c8c8c8",
  408.       headerTextColor = config.headerTextColor || "#000";
  410.     _reset.call(this);
  412.     this.internal.__cell__.printHeaders = printHeaders;
  413.     this.internal.__cell__.margins = margins;
  414.     this.internal.__cell__.table_font_size = fontSize;
  415.     this.internal.__cell__.padding = padding;
  416.     this.internal.__cell__.headerBackgroundColor = headerBackgroundColor;
  417.     this.internal.__cell__.headerTextColor = headerTextColor;
  418.     this.setFontSize(fontSize);
  420.     // Set header values
  421.     if (headers === undefined || headers === null) {
  422.       // No headers defined so we derive from data
  423.       headerNames = Object.keys(data[0]);
  424.       headerLabels = headerNames;
  425.       headerAligns = headerNames.map(function() {
  426.         return "left";
  427.       });
  428.     } else if (Array.isArray(headers) && typeof headers[0] === "object") {
  429.       headerNames = headers.map(function(header) {
  430.         return header.name;
  431.       });
  432.       headerLabels = headers.map(function(header) {
  433.         return header.prompt || header.name || "";
  434.       });
  435.       headerAligns = headers.map(function(header) {
  436.         return header.align || "left";
  437.       });
  438.       // Split header configs into names and prompts
  439.       for (i = 0; i < headers.length; i += 1) {
  440.         columnWidths[headers[i].name] = headers[i].width * px2pt;
  441.       }
  442.     } else if (Array.isArray(headers) && typeof headers[0] === "string") {
  443.       headerNames = headers;
  444.       headerLabels = headerNames;
  445.       headerAligns = headerNames.map(function() {
  446.         return "left";
  447.       });
  448.     }
  450.     if (
  451.       autoSize ||
  452.       (Array.isArray(headers) && typeof headers[0] === "string")
  453.     ) {
  454.       var headerName;
  455.       for (i = 0; i < headerNames.length; i += 1) {
  456.         headerName = headerNames[i];
  458.         // Create a matrix of columns e.g., {column_title: [row1_Record, row2_Record]}
  460.         columnMatrix[headerName] = data.map(function(rec) {
  461.           return rec[headerName];
  462.         });
  464.         // get header width
  465.         this.setFont(undefined, "bold");
  466.         columnMinWidths.push(
  467.           this.getTextDimensions(headerLabels[i], {
  468.             fontSize: this.internal.__cell__.table_font_size,
  469.             scaleFactor: this.internal.scaleFactor
  470.           }).w
  471.         );
  472.         column = columnMatrix[headerName];
  474.         // get cell widths
  475.         this.setFont(undefined, "normal");
  476.         for (j = 0; j < column.length; j += 1) {
  477.           columnMinWidths.push(
  478.             this.getTextDimensions(column[j], {
  479.               fontSize: this.internal.__cell__.table_font_size,
  480.               scaleFactor: this.internal.scaleFactor
  481.             }).w
  482.           );
  483.         }
  485.         // get final column width
  486.         columnWidths[headerName] =
  487.           Math.max.apply(null, columnMinWidths) + padding + padding;
  489.         //have to reset
  490.         columnMinWidths = [];
  491.       }
  492.     }
  494.     // -- Construct the table
  496.     if (printHeaders) {
  497.       var row = {};
  498.       for (i = 0; i < headerNames.length; i += 1) {
  499.         row[headerNames[i]] = {};
  500.         row[headerNames[i]].text = headerLabels[i];
  501.         row[headerNames[i]].align = headerAligns[i];
  502.       }
  504.       var rowHeight = calculateLineHeight.call(this, row, columnWidths);
  506.       // Construct the header row
  507.       tableHeaderConfigs = headerNames.map(function(value) {
  508.         return new Cell(
  509.           x,
  510.           y,
  511.           columnWidths[value],
  512.           rowHeight,
  513.           row[value].text,
  514.           undefined,
  515.           row[value].align
  516.         );
  517.       });
  519.       // Store the table header config
  520.       this.setTableHeaderRow(tableHeaderConfigs);
  522.       // Print the header for the start of the table
  523.       this.printHeaderRow(1, false);
  524.     }
  526.     // Construct the data rows
  528.     var align = headers.reduce(function(pv, cv) {
  529.       pv[cv.name] = cv.align;
  530.       return pv;
  531.     }, {});
  532.     for (i = 0; i < data.length; i += 1) {
  533.       if ("rowStart" in config && config.rowStart instanceof Function) {
  534.         config.rowStart(
  535.           {
  536.             row: i,
  537.             data: data[i]
  538.           },
  539.           this
  540.         );
  541.       }
  542.       var lineHeight = calculateLineHeight.call(this, data[i], columnWidths);
  544.       for (j = 0; j < headerNames.length; j += 1) {
  545.         var cellData = data[i][headerNames[j]];
  546.         if ("cellStart" in config && config.cellStart instanceof Function) {
  547.           config.cellStart(
  548.             {
  549.               row: i,
  550.               col: j,
  551.               data: cellData
  552.             },
  553.             this
  554.           );
  555.         }
  556.         cell.call(
  557.           this,
  558.           new Cell(
  559.             x,
  560.             y,
  561.             columnWidths[headerNames[j]],
  562.             lineHeight,
  563.             cellData,
  564.             i + 2,
  565.             align[headerNames[j]]
  566.           )
  567.         );
  568.       }
  569.     }
  570.     this.internal.__cell__.table_x = x;
  571.     this.internal.__cell__.table_y = y;
  572.     return this;
  573.   };
  575.   /**
  576.    * Calculate the height for containing the highest column
  577.    *
  578.    * @name calculateLineHeight
  579.    * @function
  580.    * @param {Object[]} model is the line of data we want to calculate the height of
  581.    * @param {Integer[]} columnWidths is size of each column
  582.    * @returns {number} lineHeight
  583.    * @private
  584.    */
  585.   var calculateLineHeight = function calculateLineHeight(model, columnWidths) {
  586.     var padding = this.internal.__cell__.padding;
  587.     var fontSize = this.internal.__cell__.table_font_size;
  588.     var scaleFactor = this.internal.scaleFactor;
  590.     return Object.keys(model)
  591.       .map(function(key) {
  592.         var value = model[key];
  593.         return this.splitTextToSize(
  594.           value.hasOwnProperty("text") ? value.text : value,
  595.           columnWidths[key] - padding - padding
  596.         );
  597.       }, this)
  598.       .map(function(value) {
  599.         return (
  600.           (this.getLineHeightFactor() * value.length * fontSize) / scaleFactor +
  601.           padding +
  602.           padding
  603.         );
  604.       }, this)
  605.       .reduce(function(pv, cv) {
  606.         return Math.max(pv, cv);
  607.       }, 0);
  608.   };
  610.   /**
  611.    * Store the config for outputting a table header
  612.    *
  613.    * @name setTableHeaderRow
  614.    * @function
  615.    * @param {Object[]} config
  616.    * An array of cell configs that would define a header row: Each config matches the config used by jsPDFAPI.cell
  617.    * except the lineNumber parameter is excluded
  618.    */
  619.   jsPDFAPI.setTableHeaderRow = function(config) {
  620.     _initialize.call(this);
  621.     this.internal.__cell__.tableHeaderRow = config;
  622.   };
  624.   /**
  625.    * Output the store header row
  626.    *
  627.    * @name printHeaderRow
  628.    * @function
  629.    * @param {number} lineNumber The line number to output the header at
  630.    * @param {boolean} new_page
  631.    */
  632.   jsPDFAPI.printHeaderRow = function(lineNumber, new_page) {
  633.     _initialize.call(this);
  634.     if (!this.internal.__cell__.tableHeaderRow) {
  635.       throw new Error("Property tableHeaderRow does not exist.");
  636.     }
  638.     var tableHeaderCell;
  640.     printingHeaderRow = true;
  641.     if (typeof this.internal.__cell__.headerFunction === "function") {
  642.       var position = this.internal.__cell__.headerFunction(
  643.         this,
  644.         this.internal.__cell__.pages
  645.       );
  646.       this.internal.__cell__.lastCell = new Cell(
  647.         position[0],
  648.         position[1],
  649.         position[2],
  650.         position[3],
  651.         undefined,
  652.         -1
  653.       );
  654.     }
  655.     this.setFont(undefined, "bold");
  657.     var tempHeaderConf = [];
  658.     for (var i = 0; i < this.internal.__cell__.tableHeaderRow.length; i += 1) {
  659.       tableHeaderCell = this.internal.__cell__.tableHeaderRow[i].clone();
  660.       if (new_page) {
  661.         tableHeaderCell.y = this.internal.__cell__.margins.top || 0;
  662.         tempHeaderConf.push(tableHeaderCell);
  663.       }
  664.       tableHeaderCell.lineNumber = lineNumber;
  665.       var currentTextColor = this.getTextColor();
  666.       this.setTextColor(this.internal.__cell__.headerTextColor);
  667.       this.setFillColor(this.internal.__cell__.headerBackgroundColor);
  668.       cell.call(this, tableHeaderCell);
  669.       this.setTextColor(currentTextColor);
  670.     }
  671.     if (tempHeaderConf.length > 0) {
  672.       this.setTableHeaderRow(tempHeaderConf);
  673.     }
  674.     this.setFont(undefined, "normal");
  675.     printingHeaderRow = false;
  676.   };
  677. })(jsPDF.API);