Mercurial > hg > orthanc-stone
comparison Applications/StoneWebViewer/WebApplication/print.js @ 1562:2a4a6b967053
starting work on print
author | Sebastien Jodogne <s.jodogne@gmail.com> |
---|---|
date | Thu, 20 Aug 2020 18:17:38 +0200 |
parents | |
children | e0045462a25c |
comparison
equal
deleted
inserted
replaced
1561:cf652990abb1 | 1562:2a4a6b967053 |
---|---|
1 function beforePrint(event){ | |
2 console.log('beforePrint'); | |
3 var $body = $('body'); | |
4 $body.addClass('print'); | |
5 | |
6 // because firefox does not support/executes codes after the cloned document as been rendered | |
7 // https://bugzilla.mozilla.org/show_bug.cgi?format=default&id=1048317 | |
8 // we cannot calculate using the good body size for the clone document | |
9 // so we have to hardcode the body width (meaning we can only renders in A4 in firefox); | |
10 var uaParser = new UAParser(); | |
11 var isFirefox = (uaParser.getBrowser().name === 'Firefox'); | |
12 var isIE = (uaParser.getBrowser().name === 'IE'); | |
13 var isEdge = (uaParser.getBrowser().name === 'Edge'); | |
14 console.log('ua parser', uaParser.getBrowser()); | |
15 if(isFirefox || isIE || isEdge){ | |
16 $body.css('width', '8.5in'); | |
17 $body.css('height', '11in'); | |
18 // console.log('html size', $html.width(), $html.height()); | |
19 } | |
20 | |
21 if(isIE){ | |
22 window.alert('GENERAL_PARAGRAPHS.INCOMPATIBLE_PRINT_BROWSER'); | |
23 } | |
24 | |
25 console.log('body size', $body.width(), $body.height()); | |
26 | |
27 //var panes = vm.paneManager.getAllPanes(); | |
28 var $splitpane = $('#viewport'); | |
29 var splitpaneSize = {width: $splitpane.width(), height: $splitpane.height()}; | |
30 console.log(splitpaneSize); | |
31 var panesCount = { | |
32 x: app.layoutCountX, | |
33 y: app.layoutCountY | |
34 } | |
35 console.log(panesCount); | |
36 | |
37 for(var i = 0; i < panes.length; i++){ | |
38 var $pane = panes[i]; | |
39 var viewport = vm.viewports[$pane.$$hashKey]; | |
40 var paneSize = { | |
41 originalWidth: viewport.getCanvasSize().width, | |
42 originalHeight: viewport.getCanvasSize().height, | |
43 originalRatio: 0, | |
44 paneFinalWidth: splitpaneSize.width / panesCount.x, | |
45 paneFinalHeight: splitpaneSize.height / panesCount.y, | |
46 paneFinalRatio: 0, | |
47 canvasFinalWidth: 0, | |
48 canvasFinalHeight: 0, | |
49 canvasFinalRatio: 0 | |
50 }; | |
51 paneSize.originalRatio = paneSize.originalWidth / paneSize.originalHeight; | |
52 paneSize.paneFinalRatio = paneSize.paneFinalWidth / paneSize.paneFinalHeight; | |
53 | |
54 if(paneSize.paneFinalRatio > 1){ | |
55 // If pane width ratio means it's width is larger than it's height | |
56 if(paneSize.paneFinalRatio > paneSize.originalRatio){ | |
57 // the final pane is larger than the original | |
58 // So we should fit on the height to recalc the ratio | |
59 console.log('case 1'); | |
60 paneSize.canvasFinalHeight = paneSize.paneFinalHeight; | |
61 paneSize.canvasFinalWidth = paneSize.canvasFinalHeight * paneSize.originalRatio; // Then we calc the width according the ratio | |
62 } else { | |
63 // the final pane is higher than or equal to the original | |
64 // So we should fit on the width | |
65 console.log('case 2'); | |
66 paneSize.canvasFinalWidth = paneSize.paneFinalWidth; | |
67 paneSize.canvasFinalHeight = paneSize.canvasFinalWidth / paneSize.originalRatio; // Then we calc the width according the ratio | |
68 | |
69 } | |
70 } else { | |
71 // If pane width ratio means it's height is higher than it's height | |
72 if(paneSize.paneFinalRatio > paneSize.originalRatio){ | |
73 // the final pane is larger than the original | |
74 // So we should fit on the height to recalc the ratio | |
75 console.log('case 3'); | |
76 paneSize.canvasFinalHeight = paneSize.paneFinalHeight; | |
77 paneSize.canvasFinalWidth = paneSize.canvasFinalHeight * paneSize.originalRatio; // Then we calc the width according the ratio | |
78 } else { | |
79 // the final pane is higher than or equal to the original | |
80 // So we should fit on the width | |
81 console.log('case 4'); | |
82 paneSize.canvasFinalWidth = paneSize.paneFinalWidth; | |
83 paneSize.canvasFinalHeight = paneSize.canvasFinalWidth / paneSize.originalRatio; // Then we calc the width according the ratio | |
84 | |
85 } | |
86 } | |
87 | |
88 paneSize.canvasFinalRatio = paneSize.canvasFinalWidth / paneSize.canvasFinalHeight; | |
89 console.log('paneSizes:', paneSize, 'splitpaneSize:', splitpaneSize, 'panesCount:', panesCount); | |
90 // viewport.resizeCanvas(paneSize.canvasFinalWidth, paneSize.canvasFinalHeight); | |
91 // viewport.draw(); | |
92 var $canvas = $("[data-pane-hashkey='" + $pane.$$hashKey + "']").find('canvas'); | |
93 $canvas.width(paneSize.canvasFinalWidth); | |
94 $canvas.height(paneSize.canvasFinalHeight); | |
95 } | |
96 }; | |
97 | |
98 function afterPrint(){ | |
99 console.log('afterprint'); | |
100 var $body = $('body'); | |
101 // var $html = $('html'); | |
102 $body.removeClass('print'); | |
103 $body.css('width', '100%'); | |
104 $body.css('height', '100%'); | |
105 // $html.css('width', '100%'); | |
106 // $html.css('height', '100%'); | |
107 $('.wv-cornerstone-enabled-image canvas').css('width', 'auto'); | |
108 $('.wv-cornerstone-enabled-image canvas').css('height', 'auto'); | |
109 $(window).trigger('resize'); // to force screen and canvas recalculation | |
110 } | |
111 | |
112 window.addEventListener('beforeprint', function(event){ | |
113 beforePrint(event) | |
114 }) | |
115 var printMedia = window.matchMedia('print'); | |
116 printMedia.addListener(function(mql) { | |
117 if(mql.matches) { | |
118 console.log('webkit equivalent of onbeforeprint'); | |
119 beforePrint(); | |
120 } | |
121 }); | |
122 | |
123 window.addEventListener('afterprint', function(){ | |
124 afterPrint(); | |
125 });$ | |
126 | |
127 /*vm.cancelPrintMode = function(){ | |
128 afterPrint(); | |
129 } | |
130 */ |