diff --git a/src/index.d.ts b/src/index.d.ts index 640760d..5c5d325 100644 --- a/src/index.d.ts +++ b/src/index.d.ts @@ -11,6 +11,8 @@ declare namespace printJS { documentTitle?: string; header?: any; headerStyle?: string; + footer?: any; + footerStyle?: string; maxWidth?: number; targetStyle?: string | string[]; targetStyles?: string | string[]; diff --git a/src/js/functions.js b/src/js/functions.js index bf41674..e8548f4 100644 --- a/src/js/functions.js +++ b/src/js/functions.js @@ -62,6 +62,29 @@ export function addHeader (printElement, params) { printElement.insertBefore(headerContainer, printElement.childNodes[0]) } +export function addFooter (printElement, params) { + // Create the footer container div + let footerContainer = document.createElement('div') + + // Check if the footer is text or raw html + if (isRawHTML(params.footer)) { + footerContainer.innerHTML = params.footer + } else { + // Create footer element + let footerElement = document.createElement('h1') + + // Create footer text node + let footerNode = document.createTextNode(params.footer) + + // Build and style + footerElement.appendChild(footerNode) + footerElement.setAttribute('style', params.footerStyle) + footerContainer.appendChild(footerElement) + } + + printElement.insertBefore(footerContainer, printElement.childNodes.lastChild) +} + export function cleanUp (params) { // If we are showing a feedback message to user, remove it if (params.showModal) Modal.close() diff --git a/src/js/html.js b/src/js/html.js index 5e8b96d..559166a 100644 --- a/src/js/html.js +++ b/src/js/html.js @@ -1,4 +1,4 @@ -import { collectStyles, addHeader } from './functions' +import { collectStyles, addHeader, addFooter } from './functions' import Print from './print' export default { @@ -20,6 +20,11 @@ export default { addHeader(params.printableElement, params) } + // Add footer + if (params.footer) { + addFooter(params.printableElement, params) + } + // Print html element contents Print.send(params, printFrame) } diff --git a/src/js/image.js b/src/js/image.js index c56b2d6..4277fba 100644 --- a/src/js/image.js +++ b/src/js/image.js @@ -1,4 +1,4 @@ -import { addHeader } from './functions' +import { addHeader, addFooter } from './functions' import Print from './print' import Browser from './browser' @@ -42,6 +42,11 @@ export default { // Check if we are adding a print header if (params.header) addHeader(params.printableElement, params) + // Check if we are adding a print footer + if (params.footer) { + addFooter(params.printableElement, params) + } + // Print image Print.send(params, printFrame) } diff --git a/src/js/init.js b/src/js/init.js index c486687..8d2515e 100644 --- a/src/js/init.js +++ b/src/js/init.js @@ -18,6 +18,8 @@ export default { type: 'pdf', header: null, headerStyle: 'font-weight: 300;', + footer: null, + footerStyle: 'font-weight: 300;', maxWidth: 800, properties: null, gridHeaderStyle: 'font-weight: bold; padding: 5px; border: 1px solid #dddddd;', diff --git a/src/js/json.js b/src/js/json.js index 9aa2a5a..36e072c 100644 --- a/src/js/json.js +++ b/src/js/json.js @@ -1,4 +1,4 @@ -import { capitalizePrint, addHeader } from './functions' +import { capitalizePrint, addHeader, addFooter } from './functions' import Print from './print' export default { @@ -38,6 +38,11 @@ export default { // Build the printable html data params.printableElement.innerHTML += jsonToHTML(params) + // Check if we are adding a print footer + if (params.footer) { + addFooter(params.printableElement, params) + } + // Print the json data Print.send(params, printFrame) } diff --git a/src/js/raw-html.js b/src/js/raw-html.js index 66566ff..71ea651 100644 --- a/src/js/raw-html.js +++ b/src/js/raw-html.js @@ -1,4 +1,5 @@ import Print from './print' +import { addHeader, addFooter } from './functions' export default { print: (params, printFrame) => { @@ -9,6 +10,16 @@ export default { // Set our raw html as the printable element inner html content params.printableElement.innerHTML = params.printable + // Add header + if (params.header) { + addHeader(params.printableElement, params) + } + + // Add footer + if (params.footer) { + addFooter(params.printableElement, params) + } + // Print html contents Print.send(params, printFrame) } diff --git a/test/manual/index.html b/test/manual/index.html index b548110..56f154e 100644 --- a/test/manual/index.html +++ b/test/manual/index.html @@ -48,6 +48,8 @@ function printHtml() { printJS({ printable: 'test', + header: 'JSON Print Test', + footer: 'JSON Print Footer', type: 'html' }) } @@ -58,6 +60,8 @@

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

`, type: 'raw-html', + header: 'JSON Print Header', + footer: 'JSON Print Footer', style: '.blueText {color:blue;}' }) } @@ -106,7 +110,8 @@ } ], type: 'json', - header: 'JSON Print Test', + header: 'JSON Print Test', + footer: 'JSON Print Footer', documentTitle: 'Print.js JSON Test' }) } @@ -181,6 +186,8 @@ 'test-01.jpg', 'test-02.jpg' ], + header: 'JSON Print Test', + footer: 'JSON Print Footer', type: 'image' }) } @@ -317,4 +324,4 @@

Form Elements

- \ No newline at end of file +