brightcove.js
6 years ago
jmpress.js
6 years ago
jquery.cycle.min.js
9 years ago
main.js
6 years ago
quiz.js
5 years ago
recipes-printthis.js
4 years ago
recipes.js
6 years ago
slideshow-shortcode.js
4 years ago
recipes-printthis.js
292 lines
| 1 | /*! |
| 2 | * printThis v1.9.0 |
| 3 | * @desc Printing plug-in for jQuery |
| 4 | * @author Jason Day |
| 5 | * |
| 6 | * Resources (based on) : |
| 7 | * jPrintArea: http://plugins.jquery.com/project/jPrintArea |
| 8 | * jqPrint: https://github.com/permanenttourist/jquery.jqprint |
| 9 | * Ben Nadal: http://www.bennadel.com/blog/1591-Ask-Ben-Print-Part-Of-A-Web-Page-With-jQuery.htm |
| 10 | * |
| 11 | * Licensed under the MIT licence: |
| 12 | * http://www.opensource.org/licenses/mit-license.php |
| 13 | * |
| 14 | * (c) Jason Day 2015 |
| 15 | */ |
| 16 | /* |
| 17 | * Usage: |
| 18 | * |
| 19 | * $("#mySelector").printThis({ |
| 20 | * debug: false, * show the iframe for debugging |
| 21 | * importCSS: true, * import page CSS |
| 22 | * importStyle: false, * import style tags |
| 23 | * printContainer: true, * grab outer container as well as the contents of the selector |
| 24 | * loadCSS: "path/to/my.css", * path to additional css file - us an array [] for multiple |
| 25 | * pageTitle: "", * add title to print page |
| 26 | * removeInline: false, * remove all inline styles from print elements |
| 27 | * printDelay: 333, * variable print delay |
| 28 | * header: null, * prefix to html |
| 29 | * footer: null, * postfix to html |
| 30 | * base: false, * preserve the BASE tag, or accept a string for the URL |
| 31 | * formValues: true * preserve input/form values |
| 32 | * canvas: false * copy canvas elements (experimental) |
| 33 | * doctypeString: '...' * enter a different doctype for older markup |
| 34 | * }); |
| 35 | * |
| 36 | * Notes: |
| 37 | * - the loadCSS will load additional css (with or without @media print) into the iframe, adjusting layout |
| 38 | * |
| 39 | */ |
| 40 | ( function ( $ ) { |
| 41 | var opt; |
| 42 | $.fn.printThis = function ( options ) { |
| 43 | opt = $.extend( {}, $.fn.printThis.defaults, options ); |
| 44 | var $element = this instanceof jQuery ? this : $( this ); |
| 45 | |
| 46 | var strFrameName = 'printThis-' + new Date().getTime(); |
| 47 | |
| 48 | if ( window.location.hostname !== document.domain && navigator.userAgent.match( /msie/i ) ) { |
| 49 | // Ugly IE hacks due to IE not inheriting document.domain from parent |
| 50 | // checks if document.domain is set by comparing the host name against document.domain |
| 51 | var iframeSrc = |
| 52 | 'javascript:document.write("<head><script>document.domain=\\"' + |
| 53 | document.domain + |
| 54 | '\\";</s' + |
| 55 | 'cript></head><body></body>")'; |
| 56 | var printI = document.createElement( 'iframe' ); |
| 57 | printI.name = 'printIframe'; |
| 58 | printI.id = strFrameName; |
| 59 | printI.className = 'MSIE'; |
| 60 | document.body.appendChild( printI ); |
| 61 | printI.src = iframeSrc; |
| 62 | } else { |
| 63 | // other browsers inherit document.domain, and IE works if document.domain is not explicitly set |
| 64 | var $frame = $( "<iframe id='" + strFrameName + "' name='printIframe' />" ); |
| 65 | $frame.appendTo( 'body' ); |
| 66 | } |
| 67 | |
| 68 | var $iframe = $( '#' + strFrameName ); |
| 69 | |
| 70 | // show frame if in debug mode |
| 71 | if ( ! opt.debug ) |
| 72 | $iframe.css( { |
| 73 | position: 'absolute', |
| 74 | width: '0px', |
| 75 | height: '0px', |
| 76 | left: '-600px', |
| 77 | top: '-600px', |
| 78 | } ); |
| 79 | |
| 80 | // $iframe.ready() and $iframe.load were inconsistent between browsers |
| 81 | setTimeout( function () { |
| 82 | // Add doctype to fix the style difference between printing and render |
| 83 | function setDocType( $iframe, doctype ) { |
| 84 | var win, doc; |
| 85 | win = $iframe.get( 0 ); |
| 86 | win = win.contentWindow || win.contentDocument || win; |
| 87 | doc = win.document || win.contentDocument || win; |
| 88 | doc.open(); |
| 89 | doc.write( doctype ); |
| 90 | doc.close(); |
| 91 | } |
| 92 | if ( opt.doctypeString ) { |
| 93 | setDocType( $iframe, opt.doctypeString ); |
| 94 | } |
| 95 | |
| 96 | var $doc = $iframe.contents(), |
| 97 | $head = $doc.find( 'head' ), |
| 98 | $body = $doc.find( 'body' ), |
| 99 | $base = $( 'base' ), |
| 100 | baseURL; |
| 101 | |
| 102 | // add base tag to ensure elements use the parent domain |
| 103 | if ( opt.base === true && $base.length > 0 ) { |
| 104 | // take the base tag from the original page |
| 105 | baseURL = $base.attr( 'href' ); |
| 106 | } else if ( typeof opt.base === 'string' ) { |
| 107 | // An exact base string is provided |
| 108 | baseURL = opt.base; |
| 109 | } else { |
| 110 | // Use the page URL as the base |
| 111 | baseURL = document.location.protocol + '//' + document.location.host; |
| 112 | } |
| 113 | |
| 114 | $head.append( '<base href="' + baseURL + '">' ); |
| 115 | |
| 116 | // import page stylesheets |
| 117 | if ( opt.importCSS ) |
| 118 | $( 'link[rel=stylesheet]' ).each( function () { |
| 119 | var href = $( this ).attr( 'href' ); |
| 120 | if ( href ) { |
| 121 | var media = $( this ).attr( 'media' ) || 'all'; |
| 122 | $head.append( |
| 123 | "<link type='text/css' rel='stylesheet' href='" + href + "' media='" + media + "'>" |
| 124 | ); |
| 125 | } |
| 126 | } ); |
| 127 | |
| 128 | // import style tags |
| 129 | if ( opt.importStyle ) |
| 130 | $( 'style' ).each( function () { |
| 131 | $( this ).clone().appendTo( $head ); |
| 132 | } ); |
| 133 | |
| 134 | // add title of the page |
| 135 | if ( opt.pageTitle ) $head.append( '<title>' + opt.pageTitle + '</title>' ); |
| 136 | |
| 137 | // import additional stylesheet(s) |
| 138 | if ( opt.loadCSS ) { |
| 139 | if ( $.isArray( opt.loadCSS ) ) { |
| 140 | jQuery.each( opt.loadCSS, function ( index, value ) { |
| 141 | $head.append( "<link type='text/css' rel='stylesheet' href='" + this + "'>" ); |
| 142 | } ); |
| 143 | } else { |
| 144 | $head.append( "<link type='text/css' rel='stylesheet' href='" + opt.loadCSS + "'>" ); |
| 145 | } |
| 146 | } |
| 147 | |
| 148 | // print header |
| 149 | if ( opt.header ) $body.append( opt.header ); |
| 150 | |
| 151 | if ( opt.canvas ) { |
| 152 | // add canvas data-ids for easy access after the cloning. |
| 153 | var canvasId = 0; |
| 154 | $element.find( 'canvas' ).each( function () { |
| 155 | $( this ).attr( 'data-printthis', canvasId++ ); |
| 156 | } ); |
| 157 | } |
| 158 | |
| 159 | // grab $.selector as container |
| 160 | if ( opt.printContainer ) $body.append( $element.outer() ); |
| 161 | // otherwise just print interior elements of container |
| 162 | else |
| 163 | $element.each( function () { |
| 164 | $body.append( $( this ).html() ); |
| 165 | } ); |
| 166 | |
| 167 | if ( opt.canvas ) { |
| 168 | // Re-draw new canvases by referencing the originals |
| 169 | $body.find( 'canvas' ).each( function () { |
| 170 | var cid = $( this ).data( 'printthis' ), |
| 171 | $src = $( '[data-printthis="' + cid + '"]' ); |
| 172 | |
| 173 | this.getContext( '2d' ).drawImage( $src[ 0 ], 0, 0 ); |
| 174 | |
| 175 | // Remove the mark-up from the original |
| 176 | $src.removeData( 'printthis' ); |
| 177 | } ); |
| 178 | } |
| 179 | |
| 180 | // capture form/field values |
| 181 | if ( opt.formValues ) { |
| 182 | // loop through inputs |
| 183 | var $input = $element.find( 'input' ); |
| 184 | if ( $input.length ) { |
| 185 | $input.each( function () { |
| 186 | var $this = $( this ), |
| 187 | $name = $( this ).attr( 'name' ), |
| 188 | $checker = $this.is( ':checkbox' ) || $this.is( ':radio' ), |
| 189 | $iframeInput = $doc.find( 'input[name="' + $name + '"]' ), |
| 190 | $value = $this.val(); |
| 191 | |
| 192 | // order matters here |
| 193 | if ( ! $checker ) { |
| 194 | $iframeInput.val( $value ); |
| 195 | } else if ( $this.is( ':checked' ) ) { |
| 196 | if ( $this.is( ':checkbox' ) ) { |
| 197 | $iframeInput.attr( 'checked', 'checked' ); |
| 198 | } else if ( $this.is( ':radio' ) ) { |
| 199 | $doc |
| 200 | .find( 'input[name="' + $name + '"][value="' + $value + '"]' ) |
| 201 | .attr( 'checked', 'checked' ); |
| 202 | } |
| 203 | } |
| 204 | } ); |
| 205 | } |
| 206 | |
| 207 | // loop through selects |
| 208 | var $select = $element.find( 'select' ); |
| 209 | if ( $select.length ) { |
| 210 | $select.each( function () { |
| 211 | var $this = $( this ), |
| 212 | $name = $( this ).attr( 'name' ), |
| 213 | $value = $this.val(); |
| 214 | $doc.find( 'select[name="' + $name + '"]' ).val( $value ); |
| 215 | } ); |
| 216 | } |
| 217 | |
| 218 | // loop through textareas |
| 219 | var $textarea = $element.find( 'textarea' ); |
| 220 | if ( $textarea.length ) { |
| 221 | $textarea.each( function () { |
| 222 | var $this = $( this ), |
| 223 | $name = $( this ).attr( 'name' ), |
| 224 | $value = $this.val(); |
| 225 | $doc.find( 'textarea[name="' + $name + '"]' ).val( $value ); |
| 226 | } ); |
| 227 | } |
| 228 | } // end capture form/field values |
| 229 | |
| 230 | // remove inline styles |
| 231 | if ( opt.removeInline ) { |
| 232 | // $.removeAttr available jQuery 1.7+ |
| 233 | if ( $.isFunction( $.removeAttr ) ) { |
| 234 | $doc.find( 'body *' ).removeAttr( 'style' ); |
| 235 | } else { |
| 236 | $doc.find( 'body *' ).attr( 'style', '' ); |
| 237 | } |
| 238 | } |
| 239 | |
| 240 | // print "footer" |
| 241 | if ( opt.footer ) $body.append( opt.footer ); |
| 242 | |
| 243 | setTimeout( function () { |
| 244 | if ( $iframe.hasClass( 'MSIE' ) ) { |
| 245 | // check if the iframe was created with the ugly hack |
| 246 | // and perform another ugly hack out of neccessity |
| 247 | window.frames[ 'printIframe' ].focus(); |
| 248 | $head.append( '<script> window.print(); </s' + 'cript>' ); |
| 249 | } else { |
| 250 | // proper method |
| 251 | if ( document.queryCommandSupported( 'print' ) ) { |
| 252 | $iframe[ 0 ].contentWindow.document.execCommand( 'print', false, null ); |
| 253 | } else { |
| 254 | $iframe[ 0 ].contentWindow.focus(); |
| 255 | $iframe[ 0 ].contentWindow.print(); |
| 256 | } |
| 257 | } |
| 258 | |
| 259 | // remove iframe after print |
| 260 | if ( ! opt.debug ) { |
| 261 | setTimeout( function () { |
| 262 | $iframe.remove(); |
| 263 | }, 1000 ); |
| 264 | } |
| 265 | }, opt.printDelay ); |
| 266 | }, 333 ); |
| 267 | }; |
| 268 | |
| 269 | // defaults |
| 270 | $.fn.printThis.defaults = { |
| 271 | debug: false, // show the iframe for debugging |
| 272 | importCSS: true, // import parent page css |
| 273 | importStyle: false, // import style tags |
| 274 | printContainer: true, // print outer container/$.selector |
| 275 | loadCSS: '', // load an additional css file - load multiple stylesheets with an array [] |
| 276 | pageTitle: '', // add title to print page |
| 277 | removeInline: false, // remove all inline styles |
| 278 | printDelay: 333, // variable print delay |
| 279 | header: null, // prefix to html |
| 280 | footer: null, // postfix to html |
| 281 | formValues: true, // preserve input/form values |
| 282 | canvas: false, // Copy canvas content (experimental) |
| 283 | base: false, // preserve the BASE tag, or accept a string for the URL |
| 284 | doctypeString: '<!DOCTYPE html>', // html doctype |
| 285 | }; |
| 286 | |
| 287 | // $.selector container |
| 288 | jQuery.fn.outer = function () { |
| 289 | return $( $( '<div></div>' ).html( this.clone() ) ).html(); |
| 290 | }; |
| 291 | } )( jQuery ); |
| 292 |