jQuery.print.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279
  1. /* @license
  2. * jQuery.print, version 1.6.0
  3. * (c) Sathvik Ponangi, Doers' Guild
  4. * Licence: CC-By (http://creativecommons.org/licenses/by/3.0/)
  5. *--------------------------------------------------------------------------*/
  6. (function ($) {
  7. "use strict";
  8. // A nice closure for our definitions
  9. function jQueryCloneWithSelectAndTextAreaValues(elmToClone, withDataAndEvents, deepWithDataAndEvents) {
  10. // Replacement jQuery clone that also clones the values in selects and textareas as jQuery doesn't for performance reasons - https://stackoverflow.com/questions/742810/clone-isnt-cloning-select-values
  11. // Based on https://github.com/spencertipping/jquery.fix.clone
  12. var $elmToClone = $(elmToClone),
  13. $result = $elmToClone.clone(withDataAndEvents, deepWithDataAndEvents),
  14. $myTextareas = $elmToClone.find('textarea').add($elmToClone.filter('textarea')),
  15. $resultTextareas = $result.find('textarea').add($result.filter('textarea')),
  16. $mySelects = $elmToClone.find('select').add($elmToClone.filter('select')),
  17. $resultSelects = $result.find('select').add($result.filter('select')),
  18. i, l, j, m;
  19. for (i = 0, l = $myTextareas.length; i < l; ++i) {
  20. $($resultTextareas[i]).val($($myTextareas[i]).val());
  21. }
  22. for (i = 0, l = $mySelects.length; i < l; ++i) {
  23. for (j = 0, m = $mySelects[i].options.length; j < m; ++j) {
  24. if ($mySelects[i].options[j].selected === true) {
  25. $resultSelects[i].options[j].selected = true;
  26. }
  27. }
  28. }
  29. return $result;
  30. }
  31. function getjQueryObject(string) {
  32. // Make string a vaild jQuery thing
  33. var jqObj = $("");
  34. try {
  35. jqObj = jQueryCloneWithSelectAndTextAreaValues(string);
  36. } catch (e) {
  37. jqObj = $("<span />")
  38. .html(string);
  39. }
  40. return jqObj;
  41. }
  42. function printFrame(frameWindow, content, options) {
  43. // Print the selected window/iframe
  44. var def = $.Deferred();
  45. try {
  46. frameWindow = frameWindow.contentWindow || frameWindow.contentDocument || frameWindow;
  47. var wdoc = frameWindow.document || frameWindow.contentDocument || frameWindow;
  48. if(options.doctype) {
  49. wdoc.write(options.doctype);
  50. }
  51. wdoc.write(content);
  52. wdoc.close();
  53. var printed = false,
  54. callPrint = function () {
  55. if(printed) {
  56. return;
  57. }
  58. // Fix for IE : Allow it to render the iframe
  59. frameWindow.focus();
  60. try {
  61. // Fix for IE11 - printng the whole page instead of the iframe content
  62. if (!frameWindow.document.execCommand('print', false, null)) {
  63. // document.execCommand returns false if it failed -http://stackoverflow.com/a/21336448/937891
  64. frameWindow.print();
  65. }
  66. // focus body as it is losing focus in iPad and content not getting printed
  67. $('body').focus();
  68. } catch (e) {
  69. frameWindow.print();
  70. }
  71. frameWindow.close();
  72. printed = true;
  73. def.resolve();
  74. };
  75. // Print once the frame window loads - seems to work for the new-window option but unreliable for the iframe
  76. $(frameWindow).on("load", callPrint);
  77. // Fallback to printing directly if the frame doesn't fire the load event for whatever reason
  78. setTimeout(callPrint, options.timeout);
  79. } catch (err) {
  80. def.reject(err);
  81. }
  82. return def;
  83. }
  84. function printContentInIFrame(content, options) {
  85. var $iframe = $(options.iframe + "");
  86. var iframeCount = $iframe.length;
  87. if (iframeCount === 0) {
  88. // Create a new iFrame if none is given
  89. $iframe = $('<iframe height="0" width="0" border="0" wmode="Opaque"/>')
  90. .prependTo('body')
  91. .css({
  92. "position": "absolute",
  93. "top": -999,
  94. "left": -999
  95. });
  96. }
  97. var frameWindow = $iframe.get(0);
  98. return printFrame(frameWindow, content, options)
  99. .done(function () {
  100. // Success
  101. setTimeout(function () {
  102. // Wait for IE
  103. if (iframeCount === 0) {
  104. // Destroy the iframe if created here
  105. $iframe.remove();
  106. }
  107. }, 1000);
  108. })
  109. .fail(function (err) {
  110. // Use the pop-up method if iframe fails for some reason
  111. console.error("Failed to print from iframe", err);
  112. printContentInNewWindow(content, options);
  113. })
  114. .always(function () {
  115. try {
  116. options.deferred.resolve();
  117. } catch (err) {
  118. console.warn('Error notifying deferred', err);
  119. }
  120. });
  121. }
  122. function printContentInNewWindow(content, options) {
  123. // Open a new window and print selected content
  124. var frameWindow = window.open();
  125. return printFrame(frameWindow, content, options)
  126. .always(function () {
  127. try {
  128. options.deferred.resolve();
  129. } catch (err) {
  130. console.warn('Error notifying deferred', err);
  131. }
  132. });
  133. }
  134. function isNode(o) {
  135. /* http://stackoverflow.com/a/384380/937891 */
  136. return !!(typeof Node === "object" ? o instanceof Node : o && typeof o === "object" && typeof o.nodeType === "number" && typeof o.nodeName === "string");
  137. }
  138. $.print = $.fn.print = function () {
  139. // Print a given set of elements
  140. var options, $this, self = this;
  141. // console.log("Printing", this, arguments);
  142. if (self instanceof $) {
  143. // Get the node if it is a jQuery object
  144. self = self.get(0);
  145. }
  146. if (isNode(self)) {
  147. // If `this` is a HTML element, i.e. for
  148. // $(selector).print()
  149. $this = $(self);
  150. if (arguments.length > 0) {
  151. options = arguments[0];
  152. }
  153. } else {
  154. if (arguments.length > 0) {
  155. // $.print(selector,options)
  156. $this = $(arguments[0]);
  157. if (isNode($this[0])) {
  158. if (arguments.length > 1) {
  159. options = arguments[1];
  160. }
  161. } else {
  162. // $.print(options)
  163. options = arguments[0];
  164. $this = $("html");
  165. }
  166. } else {
  167. // $.print()
  168. $this = $("html");
  169. }
  170. }
  171. // Default options
  172. var defaults = {
  173. globalStyles: true,
  174. mediaPrint: false,
  175. stylesheet: null,
  176. noPrintSelector: ".no-print",
  177. iframe: true,
  178. append: null,
  179. prepend: null,
  180. manuallyCopyFormValues: true,
  181. deferred: $.Deferred(),
  182. timeout: 750,
  183. title: null,
  184. doctype: '<!doctype html>'
  185. };
  186. // Merge with user-options
  187. options = $.extend({}, defaults, (options || {}));
  188. var $styles = $("");
  189. if (options.globalStyles) {
  190. // Apply the stlyes from the current sheet to the printed page
  191. $styles = $("style, link, meta, base, title");
  192. } else if (options.mediaPrint) {
  193. // Apply the media-print stylesheet
  194. $styles = $("link[media=print]");
  195. }
  196. if (options.stylesheet) {
  197. // Add a custom stylesheet if given
  198. $styles = $.merge($styles, $('<link rel="stylesheet" href="' + options.stylesheet + '">'));
  199. }
  200. // Create a copy of the element to print
  201. var copy = jQueryCloneWithSelectAndTextAreaValues($this);
  202. // Wrap it in a span to get the HTML markup string
  203. copy = $("<span/>")
  204. .append(copy);
  205. // Remove unwanted elements
  206. copy.find(options.noPrintSelector)
  207. .remove();
  208. // Add in the styles
  209. copy.append(jQueryCloneWithSelectAndTextAreaValues($styles));
  210. // Update title
  211. if (options.title) {
  212. var title = $("title", copy);
  213. if (title.length === 0) {
  214. title = $("<title />");
  215. copy.append(title);
  216. }
  217. title.text(options.title);
  218. }
  219. // Appedned content
  220. copy.append(getjQueryObject(options.append));
  221. // Prepended content
  222. copy.prepend(getjQueryObject(options.prepend));
  223. if (options.manuallyCopyFormValues) {
  224. // Manually copy form values into the HTML for printing user-modified input fields
  225. // http://stackoverflow.com/a/26707753
  226. copy.find("input")
  227. .each(function () {
  228. var $field = $(this);
  229. if ($field.is("[type='radio']") || $field.is("[type='checkbox']")) {
  230. if ($field.prop("checked")) {
  231. $field.attr("checked", "checked");
  232. }
  233. } else {
  234. $field.attr("value", $field.val());
  235. }
  236. });
  237. copy.find("select").each(function () {
  238. var $field = $(this);
  239. $field.find(":selected").attr("selected", "selected");
  240. });
  241. copy.find("textarea").each(function () {
  242. // Fix for https://github.com/DoersGuild/jQuery.print/issues/18#issuecomment-96451589
  243. var $field = $(this);
  244. $field.text($field.val());
  245. });
  246. }
  247. // Get the HTML markup string
  248. var content = copy.html();
  249. // Notify with generated markup & cloned elements - useful for logging, etc
  250. try {
  251. options.deferred.notify('generated_markup', content, copy);
  252. } catch (err) {
  253. console.warn('Error notifying deferred', err);
  254. }
  255. // Destroy the copy
  256. copy.remove();
  257. if (options.iframe) {
  258. // Use an iframe for printing
  259. try {
  260. printContentInIFrame(content, options);
  261. } catch (e) {
  262. // Use the pop-up method if iframe fails for some reason
  263. console.error("Failed to print from iframe", e.stack, e.message);
  264. printContentInNewWindow(content, options);
  265. }
  266. } else {
  267. // Use a new window for printing
  268. printContentInNewWindow(content, options);
  269. }
  270. return this;
  271. };
  272. })(jQuery);