Feature Add button PDF Landscape

Hello,

In reference to: https://www.ads-software.com/support/topic/generate-pdf-in-landscape-orientation/

I’m create personal project and i found your plugin, it’s very good plugin.
For my project i need to export some PDF table in landscape.

I modify your code to add this button and i would submit this feature to the community.

1. Open tablepress-datatables-buttons.php
Line 132: edit line to add , 'pdflandscape'
Like that: if ( ! in_array( $button, array( 'copy', 'csv', 'excel', 'pdf', 'print', 'colvis', 'pdflandscape' ), true ) ) {

Line 153: edit line to add , 'pdflandscape'
Like that: foreach ( array( 'copy', 'csv', 'excel', 'pdf', 'pdflandscape' ) as $button ) {

Below line 184: add this `if ( in_array( ‘pdflandscape’, $js_options[‘datatables_buttons’], true ) ) {
$url = plugins_url( ‘js/pdfmake.min.js’, __FILE__ );
wp_enqueue_script( self::$slug . ‘-pdfmake’, $url, array( self::$slug ), self::$version, true );
}`

Save your file: tablepress-datatables-buttons.php

2. Open dataTables.button.js
Line 1091: edit line to add: , 'pdflandscape'
Like that: buttons: [ 'copy', 'excel', 'csv', 'pdf', 'print', 'pdflandscape' ],

Below line 1256: add this `pdflandscape: function( dt, conf ) {
// Common option that will use the HTML5 or Flash export buttons
if ( _dtButtons.pdflandscapeHtml5 && _dtButtons.pdflandscapeHtml5.available( dt, conf ) ) {
return ‘pdflandscapeHtml5’;
}
if ( _dtButtons.pdflandscapeFlash && _dtButtons.pdflandscape.available( dt, conf ) ) {
return ‘pdflandscapeFlash’;
}
},`

Let’s go to: https://jscompress.com/
Copy-Paste content of your “dataTables.buttons.js”, click on “compress javascript” and copy-paste the output code in “dataTables.buttons.min.js”.

Save your file: dataTables.buttons.js and dataTables.buttons.min.js

3. Open buttons.flash.js
Below line 1411: add this `DataTable.ext.buttons.pdflandscapeFlash = $.extend( {}, flashButton, {
className: ‘buttons-pdflandscape buttons-flash’,

text: function ( dt ) {
return dt.i18n( ‘buttons.pdf’, ‘PDF Landscape’ );
},

action: function ( e, dt, button, config ) {
// Set the text
var flash = config._flash;
var data = dt.buttons.exportData( config.exportOptions );
var totalWidth = dt.table().node().offsetWidth;

// Calculate the column width ratios for layout of the table in the PDF
var ratios = dt.columns( config.columns ).indexes().map( function ( idx ) {
return dt.column( idx ).header().offsetWidth / totalWidth;
} );

flash.setAction( ‘pdf’ );
flash.setFileName( _filename( config ) );

_setText( flash, JSON.stringify( {
title: _filename(config, false),
message: typeof config.message == ‘function’ ? config.message(dt, button, config) : config.message,
colWidth: ratios.toArray(),
orientation: config.orientation,
size: config.pageSize,
header: config.header ? data.header : null,
footer: config.footer ? data.footer : null,
body: data.body
} ) );
},

extension: ‘.pdf’,

orientation: ‘landscape’,

pageSize: ‘LEGAL’,

message: ”,

newline: ‘\n’
} );`

Let’s go to: https://jscompress.com/
Copy-Paste content of your “buttons.flash.js”, click on “compress javascript” and copy-paste the output code in “buttons.flash.min.js”.

Save your file: buttons.flash.js and buttons.flash.min.js

4. Open buttons.html5.js
Below line 1340: add this `DataTable.ext.buttons.pdflandscapeHtml5 = {
className: ‘buttons-pdflandscape buttons-html5’,

available: function () {
return window.FileReader !== undefined && _pdfMake();
},

text: function ( dt ) {
return dt.i18n( ‘buttons.pdf’, ‘PDF Landscape’ );
},

action: function ( e, dt, button, config ) {
var newLine = _newLine( config );
var data = dt.buttons.exportData( config.exportOptions );
var rows = [];

if ( config.header ) {
rows.push( $.map( data.header, function ( d ) {
return {
text: typeof d === ‘string’ ? d : d+”,
style: ‘tableHeader’
};
} ) );
}

for ( var i=0, ien=data.body.length ; i<ien ; i++ ) {
rows.push( $.map( data.body[i], function ( d ) {
return {
text: typeof d === ‘string’ ? d : d+”,
style: i % 2 ? ‘tableBodyEven’ : ‘tableBodyOdd’
};
} ) );
}

if ( config.footer && data.footer) {
rows.push( $.map( data.footer, function ( d ) {
return {
text: typeof d === ‘string’ ? d : d+”,
style: ‘tableFooter’
};
} ) );
}

var doc = {
pageSize: config.pageSize,
pageOrientation: config.orientation,
content: [
{
table: {
headerRows: 1,
body: rows
},
layout: ‘noBorders’
}
],
styles: {
tableHeader: {
bold: true,
fontSize: 11,
color: ‘white’,
fillColor: ‘#2d4154’,
alignment: ‘center’
},
tableBodyEven: {},
tableBodyOdd: {
fillColor: ‘#f3f3f3’
},
tableFooter: {
bold: true,
fontSize: 11,
color: ‘white’,
fillColor: ‘#2d4154’
},
title: {
alignment: ‘center’,
fontSize: 15
},
message: {}
},
defaultStyle: {
fontSize: 10
}
};

if ( config.message ) {
doc.content.unshift( {
text: typeof config.message == ‘function’ ? config.message(dt, button, config) : config.message,
style: ‘message’,
margin: [ 0, 0, 0, 12 ]
} );
}

if ( config.title ) {
doc.content.unshift( {
text: _title( config, false ),
style: ‘title’,
margin: [ 0, 0, 0, 12 ]
} );
}

if ( config.customize ) {
config.customize( doc, config );
}

var pdf = _pdfMake().createPdf( doc );

if ( config.download === ‘open’ && ! _isDuffSafari() ) {
pdf.open();
}
else {
pdf.getBuffer( function (buffer) {
var blob = new Blob( [buffer], {type:’application/pdf’} );

_saveAs( blob, _filename( config ) );
} );
}
},

title: ‘*’,

filename: ‘*’,

extension: ‘.pdf’,

exportOptions: {},

orientation: ‘landscape’,

pageSize: ‘LEGAL’,

header: true,

footer: false,

message: null,

customize: null,

download: ‘download’
};`

Let’s go to: https://jscompress.com/
Copy-Paste content of your “buttons.html5.js”, click on “compress javascript” and copy-paste the output code in “buttons.html5.min.js”.

Save your file: buttons.html5.js and buttons.html5.min.js

5. Shortcode
You can add pdflandscape in option of your shortcode to add button PDF Landscape.
[table id=1 datatables_buttons=”pdflandscape” /]