Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix for Growth Chart’s print functionality being extremely slow in IE. #39

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 17 additions & 0 deletions css/gc-pview-print.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
#vitals {
border-color: transparent;
}

#PatientHeader, #PredictedHeightHeader {
background-color: transparent;
color: #666;
}

#PaperPredictedHeight {
overflow: inherit;
}

#RightPaper {
transform-origin: left;
transform: scale(.8,.9);
}
11 changes: 8 additions & 3 deletions css/print.css
Original file line number Diff line number Diff line change
Expand Up @@ -66,18 +66,23 @@ h1 {
margin: 0;
}

#container {
display: inline-block;
text-align: left;
margin: auto;
}

.frame {
border: 1px solid #666;
display: inline-block;
text-align: left;
width: 1000px;
margin:auto;
}

#header {
background: transparent;
padding: 0 10px 10px;
text-align: left;
width: 1000px;
margin: auto;
}

Expand Down Expand Up @@ -110,7 +115,7 @@ svg {
#view-parental,
#view-table,
.timeline {
display: none;
display: block;
}

.view-clinical #view-clinical,
Expand Down
51 changes: 51 additions & 0 deletions gc-print.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Growth Chart Print Preview</title>
<link rel="stylesheet" type="text/css" href="css/gc-pview.css" />
<link rel="stylesheet" type="text/css" href="css/print.css" />
<link rel="stylesheet" type="text/css" href="css/gc-pview-print.css" />
</head>
<body>
<div id="print-toolbar">
<a href="javascript:window.print();" class="print-link">
<img src="img/print.png" alt="" />
<span data-translatecontent="STR_6020"></span>
</a>
</div>
<div id="container">
<div id="header">
<h1 class="patient-name" data-translatecontent="STR_6021">Patient`s name</h1>
<label class="gender-color" data-translatecontent="STR_155"></label> <span class="patient-gender title"></span>
<label class="gender-color" data-translatecontent="STR_157"></label> <span class="patient-birth title"></span>
<label class="gender-color" data-translatecontent="STR_156"></label> <span class="patient-age title"></span>
<span id="weekerID" class="weeker" style="display:none;">
<label class="gender-color">{</label>
<span id="weekerValue" class="value title" style="margin-right: 0"></span>
<label class="gender-color">}</label>&nbsp;&nbsp;
</span>
<span id="correctedAgeID" style="display: none;">
<label class="gender-color" data-translatecontent="STR_6022"></label>
<span id="corrected-age" class="title"></span>
</span>
<span id="today"></span>
</div>
<div class="frame">
<div id="timeline-top"></div>
<div id="stage">
<div id="view-table" class="tab-panel"></div>
</div>
<div id="timeline-bottom"></div>
</div>
</div>
<script>
/**
* This call to the function on the opener is for indicating that the UI is ready to accept updates from the GC main
* window.
*/
window.opener.printFunctionalityLoaded(window);
</script>
</body>
</html>
80 changes: 79 additions & 1 deletion js/gc-app.js
Original file line number Diff line number Diff line change
Expand Up @@ -475,12 +475,90 @@

NS.App.print = function() {
if (PRINT_WINDOW === null || PRINT_WINDOW.closed) {
PRINT_WINDOW = window.open("print-charts.html", "printWindow", "resizable=yes,scrollbars=yes,status=yes,top=10,left=10,width=1100,height=800");
PRINT_WINDOW = window.open("gc-print.html", "printWindow", "resizable=yes,scrollbars=yes,status=yes,top=10,left=10,width=1100,height=800");
} else {
PRINT_WINDOW.focus();
PRINT_WINDOW.location.reload();
}
};
/**
* Function to be accessed by the print popup window once the popup UI has loaded. This function updates the UI on the popup
* by populating the graph, table or parent view based on what is selected on the main GC window.
* Why: To resolve the issue mentioned here : https://github.com/smart-on-fhir/growth-chart-app/issues/26
* @param POPUP_HANDLE window handle sent in by the popup while calling this method on opener.
*/
window.printFunctionalityLoaded = function(POPUP_HANDLE) {
if (POPUP_HANDLE === PRINT_WINDOW) {
GC.Util.translateHTML(PRINT_WINDOW.document);

$('.patient-name', PRINT_WINDOW.document).text(GC.currentPatient.name);
$('.patient-age', PRINT_WINDOW.document).text(GC.currentPatient.getCurrentAge().toString(GC.chartSettings.timeInterval));
$('.patient-birth', PRINT_WINDOW.document).text(GC.currentPatient.DOB.toString(GC.chartSettings.dateFormat));
$('.patient-gender', PRINT_WINDOW.document).text(GC.str("STR_SMART_GENDER_" + GC.currentPatient.gender));

if (GC.currentPatient.weeker) {
var weekerStr = GC.str("STR_3006");
PRINT_WINDOW.document.getElementById("weekerID").style.visibility = "visible";
PRINT_WINDOW.document.getElementById("weekerValue").innerHTML = GC.currentPatient.weeker + " " + weekerStr;
} else {
PRINT_WINDOW.document.getElementById("weekerID").style.visibility = "hidden";
}

var currentAge = GC.currentPatient.getCurrentAge();
var correctedAge = GC.currentPatient.getCorrectedAge();
if (correctedAge > currentAge || correctedAge < currentAge) {
PRINT_WINDOW.document.getElementById("correctedAgeID").style.visibility = "visibile";
PRINT_WINDOW.document.getElementById("corrected-age").innerHTML = correctedAge.toString(GC.chartSettings.timeInterval);
} else {
PRINT_WINDOW.document.getElementById("correctedAgeID").style.visibility = "hidden";
}

$("#today", PRINT_WINDOW.document).text(new XDate().toString("ddMMMyyyy HH:MM TT"));

var chartType = GC.App.getViewType();

$("html", PRINT_WINDOW)
.toggleClass("view-clinical", chartType == "graphs" || chartType == "table")
.toggleClass("view-parental", chartType == "parent")
.toggleClass("view-charts", chartType == "graphs")
.toggleClass("view-table", chartType == "table");

PRINT_WINDOW.document.title = GC.currentPatient.name + (
chartType == "graphs" ? " - Charts" :
chartType == "table" ? " - Data" :
chartType == "parent" ? " - Parental View" :
""
) + " " + (new XDate().toString("ddMMMyyyy HH-MMTT"));

if (chartType === 'graphs') {
var mw_TimeLineTop = document.getElementById('timeline-top');
var mw_TimeLineBottom = document.getElementById('timeline-bottom');

var pw_TimeLineTop = PRINT_WINDOW.document.getElementById('timeline-top');
var pw_TimeLineBottom = PRINT_WINDOW.document.getElementById('timeline-bottom');

pw_TimeLineTop.outerHTML = mw_TimeLineTop.outerHTML;
pw_TimeLineBottom.outerHTML = mw_TimeLineBottom.outerHTML;
}

if (chartType === 'graphs' || chartType === 'parent') {
var mw_Stage = document.getElementById('stage');
var pw_Stage = PRINT_WINDOW.document.getElementById('stage');
pw_Stage.outerHTML = mw_Stage.outerHTML;
}
if (chartType === 'parent') {
$('#PatientHeadertexts', PRINT_WINDOW).addClass('heading');
$('#PatientHeadertexts', PRINT_WINDOW).html(GC.str('STR_177'));
}

if (chartType === 'table') {
PRINT_WINDOW.document.getElementById('view-table').outerHTML = GC.TableViewForPrint().join("");
}
}
else {
console.log("Print window instance didnt match.");
}
};

NS.App.getLastDataAge = function() {
var out = 0;
Expand Down
14 changes: 12 additions & 2 deletions js/gc-grid-view.js
Original file line number Diff line number Diff line change
Expand Up @@ -480,7 +480,9 @@
}

function renderTableViewForPrint(container) {
$(container).empty();
if (container) {
$(container).empty();
}

var printScheme = [
{
Expand Down Expand Up @@ -665,7 +667,11 @@

html[j++] = '</table>';

$(container).html(html.join(""));
if (container){
$(container).html(html.join(""));
} else {
return html;
}
}

function getVelocityUnits(baseUnits) {
Expand Down Expand Up @@ -886,6 +892,10 @@
selectByAge : PRINT_MODE ? $.noop : selectByAge
};

NS.TableViewForPrint = function () {
return renderTableViewForPrint();
};

$(function() {
if (!PRINT_MODE) {
$("#stage").bind("scroll resize", updateDataTableLayout);
Expand Down