Mercurial > hg > orthanc-stone

comparison Applications/StoneWebViewer/WebApplication/print.js @ 1563:e0045462a25c

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
cont print
author Sebastien Jodogne <s.jodogne@gmail.com>
date Fri, 21 Aug 2020 21:57:54 +0200
parents 2a4a6b967053
children e4a52cbbdd70
comparison
equal deleted inserted replaced
1562:2a4a6b967053 1563:e0045462a25c
22 window.alert('GENERAL_PARAGRAPHS.INCOMPATIBLE_PRINT_BROWSER'); 22 window.alert('GENERAL_PARAGRAPHS.INCOMPATIBLE_PRINT_BROWSER');
23 } 23 }
24 24
25 console.log('body size', $body.width(), $body.height()); 25 console.log('body size', $body.width(), $body.height());
26 26
27 //var panes = vm.paneManager.getAllPanes();
28 var $splitpane = $('#viewport'); 27 var $splitpane = $('#viewport');
29 var splitpaneSize = {width: $splitpane.width(), height: $splitpane.height()}; 28 var splitpaneSize = {width: $splitpane.width(), height: $splitpane.height()};
30 console.log(splitpaneSize); 29 console.log(splitpaneSize);
31 var panesCount = { 30 var panesCount = {
32 x: app.layoutCountX, 31 x: app.layoutCountX,
33 y: app.layoutCountY 32 y: app.layoutCountY
34 } 33 }
34
35 var panes = [];
36 $('#viewport canvas').each(function(key, value) {
37 if ($(value).is(':visible')) {
38 console.log(value);
39 panes.push(value);
40 }
41 });
42
35 console.log(panesCount); 43 console.log(panesCount);
36 44
37 for(var i = 0; i < panes.length; i++){ 45 for(var i = 0; i < panes.length; i++){
38 var $pane = panes[i]; 46 var canvas = panes[i];
39 var viewport = vm.viewports[$pane.$$hashKey];
40 var paneSize = { 47 var paneSize = {
41 originalWidth: viewport.getCanvasSize().width, 48 originalWidth: canvas.getBoundingClientRect().width,
42 originalHeight: viewport.getCanvasSize().height, 49 originalHeight: canvas.getBoundingClientRect().height,
43 originalRatio: 0, 50 originalRatio: 0,
44 paneFinalWidth: splitpaneSize.width / panesCount.x, 51 paneFinalWidth: splitpaneSize.width / panesCount.x,
45 paneFinalHeight: splitpaneSize.height / panesCount.y, 52 paneFinalHeight: splitpaneSize.height / panesCount.y,
46 paneFinalRatio: 0, 53 paneFinalRatio: 0,
47 canvasFinalWidth: 0, 54 canvasFinalWidth: 0,
85 } 92 }
86 } 93 }
87 94
88 paneSize.canvasFinalRatio = paneSize.canvasFinalWidth / paneSize.canvasFinalHeight; 95 paneSize.canvasFinalRatio = paneSize.canvasFinalWidth / paneSize.canvasFinalHeight;
89 console.log('paneSizes:', paneSize, 'splitpaneSize:', splitpaneSize, 'panesCount:', panesCount); 96 console.log('paneSizes:', paneSize, 'splitpaneSize:', splitpaneSize, 'panesCount:', panesCount);
90 // viewport.resizeCanvas(paneSize.canvasFinalWidth, paneSize.canvasFinalHeight); 97 //canvas.resizeCanvas(paneSize.canvasFinalWidth, paneSize.canvasFinalHeight);
91 // viewport.draw(); 98 //canvas.draw();
92 var $canvas = $("[data-pane-hashkey='" + $pane.$$hashKey + "']").find('canvas'); 99
93 $canvas.width(paneSize.canvasFinalWidth); 100 console.log(paneSize.canvasFinalWidth + ' ' + paneSize.canvasFinalHeight);
94 $canvas.height(paneSize.canvasFinalHeight); 101 canvas.width = Math.round(paneSize.canvasFinalWidth);
102 canvas.height = Math.round(paneSize.canvasFinalHeight);
103
104
105 /*
106 https://stackoverflow.com/questions/27863783/javascript-canvas-disappears-after-changing-width
107
108 var buffer = document.getElementById('buffer');
109 var context = canvas.getContext('2d');
110 console.log(context);
111 var bufferContext = buffer.getContext('2d');
112 console.log(bufferContext);
113
114 bufferContext.drawImage(canvas, 0, 0); //Make a copy of the canvas to hidden buffer
115 canvas.width = Math.round(paneSize.canvasFinalWidth);
116 canvas.height = Math.round(paneSize.canvasFinalHeight);
117 context.drawImage(buffer, 0, 0); */
95 } 118 }
119
120 stone.AllViewportsUpdateSize(false);
121 $(window).trigger('resize'); // to force screen and canvas recalculation
96 }; 122 };
97 123
98 function afterPrint(){ 124 function afterPrint(){
99 console.log('afterprint'); 125 console.log('afterprint');
100 var $body = $('body'); 126 var $body = $('body');
102 $body.removeClass('print'); 128 $body.removeClass('print');
103 $body.css('width', '100%'); 129 $body.css('width', '100%');
104 $body.css('height', '100%'); 130 $body.css('height', '100%');
105 // $html.css('width', '100%'); 131 // $html.css('width', '100%');
106 // $html.css('height', '100%'); 132 // $html.css('height', '100%');
107 $('.wv-cornerstone-enabled-image canvas').css('width', 'auto'); 133 $('#viewport canvas').css('width', '100%');
108 $('.wv-cornerstone-enabled-image canvas').css('height', 'auto'); 134 $('#viewport canvas').css('height', '100%');
135 stone.AllViewportsUpdateSize(0);
109 $(window).trigger('resize'); // to force screen and canvas recalculation 136 $(window).trigger('resize'); // to force screen and canvas recalculation
110 } 137 }
111 138
112 window.addEventListener('beforeprint', function(event){ 139 window.addEventListener('beforeprint', function(event){
113 beforePrint(event) 140 beforePrint(event)
114 }) 141 });
142
115 var printMedia = window.matchMedia('print'); 143 var printMedia = window.matchMedia('print');
116 printMedia.addListener(function(mql) { 144 printMedia.addListener(function(mql) {
117 if(mql.matches) { 145 if(mql.matches) {
118 console.log('webkit equivalent of onbeforeprint'); 146 console.log('webkit equivalent of onbeforeprint');
119 beforePrint(); 147 beforePrint();