source: extensions/net.sf.basedb.reggie/trunk/resources/scanbquartermonthreportgenerator.jsp @ 1849

Last change on this file since 1849 was 1849, checked in by Nicklas Nordborg, 7 years ago

References #462: Implement a print function that can print complete pages

Implemented a javascript function that opens a popup window and copies the content of a specified html tag (given by the id) to the popup window.

openPrintWindow(ID, printElementId, pageTitle, pageOrientation, printNote)

The change also includes printing changes made in separate branch for #425 in [1723].

File size: 21.5 KB
Line 
1<%@ page
2  pageEncoding="UTF-8"
3  session="false"
4  import="net.sf.basedb.core.User"
5  import="net.sf.basedb.core.DbControl"
6  import="net.sf.basedb.core.SessionControl"
7  import="net.sf.basedb.core.Application"
8  import="net.sf.basedb.clients.web.Base" 
9  import="net.sf.basedb.clients.web.extensions.ExtensionsControl"
10%>
11<%@ taglib prefix="base" uri="/WEB-INF/base.tld" %>
12<%@ taglib prefix="p" uri="/WEB-INF/path.tld" %>
13<%
14final SessionControl sc = Base.getExistingSessionControl(request, true);
15final String ID = sc.getId();
16final float scale = Base.getScale(sc);
17final String home = ExtensionsControl.getHomeUrl("net.sf.basedb.reggie");
18DbControl dc = null;
19try
20{
21  dc = sc.newDbControl();
22  final User user = User.getById(dc, sc.getLoggedInUserId());
23  %>
24<base:page type="default" >
25<base:head scripts="ajax.js" styles="path.css">
26  <link rel="stylesheet" type="text/css" href="css/reggie.css">
27  <script language="JavaScript" src="reggie.js" type="text/javascript" charset="UTF-8"></script>
28  <script language="JavaScript" src="boxplot.js" type="text/javascript" charset="UTF-8"></script>
29   
30   
31  <script language="JavaScript">
32  var currentStep = 1;
33  var debug = true;
34/*
35  var numCols;
36  var unknownSite = 0;
37  var unknownCreation;
38  var numPatientsNoSamples = 0;
39  var debug01 = null;
40*/
41 
42  var intervalIsValid = true;
43 
44  function goNext()
45  {
46    if (currentStep == 1)
47    {
48      gotoStep2();
49    }
50  }
51 
52  function gotoStep2()
53  {
54    var frm = document.forms['reggie'];
55    frm.reporttype.disabled = true;
56    // Hide report period input fields
57    document.getElementById("reportPeriodSubSection01").style.display = 'none';
58    document.getElementById("reportPeriodSubSection02").style.display = 'none';
59    document.getElementById("reportPeriodSubSection04").style.display = 'none';
60    // Hide view type pop-up menu
61    document.getElementById("viewTypeSubSection01").style.display = 'none';
62    document.getElementById("viewTypeSubSection02").style.display = 'none';
63    document.getElementById("viewTypeSubSection04").style.display = 'none';
64    // Hide chart variant pop-up menu
65    document.getElementById("chartVariantSubSection01").style.display = 'none';
66    document.getElementById("chartVariantSubSection02").style.display = 'none';
67    document.getElementById("chartVariantSubSection04").style.display = 'none';
68    if (frm.reporttype[frm.reporttype.selectedIndex].value == 'scanbquartermonthreport')
69    {
70      // Show report period input fields
71      document.getElementById("reportPeriodSubSection01").style.display = 'block';
72      document.getElementById("reportPeriodSubSection02").style.display = 'block';
73      document.getElementById("reportPeriodSubSection04").style.display = 'block';
74      document.getElementById("reportPeriodSubSection01Header").innerHTML="Report period";
75      document.getElementById("reportPeriodSubSection04HelpText").innerHTML="Define which period the report should cover. Empty fields will include all items.";
76      // Set item name for report time step text
77      //document.getElementById("items02").innerHTML="samples";
78      document.getElementById("items03").innerHTML="samples";
79      document.getElementById("items04").innerHTML="samples";
80      document.getElementById("items05").innerHTML="samples";
81      // Show view type pop-up menu
82      document.getElementById("viewTypeSubSection01").style.display = 'block';
83      document.getElementById("viewTypeSubSection02").style.display = 'block';
84      document.getElementById("viewTypeSubSection04").style.display = 'block';
85      // Show chart data pop-up menu
86      document.getElementById("chartVariantSubSection01").style.display = 'block';
87      document.getElementById("chartVariantSubSection02").style.display = 'block';
88      document.getElementById("chartVariantSubSection04").style.display = 'block';
89    }
90    Main.show('itemCountSection');
91       
92    Main.show('gocreate');   
93    Main.hide('gonext');
94    frm.fromdate.focus();
95    currentStep = 2;
96  }
97 
98  function dateOnChange()
99  {
100    var frm = document.forms['reggie'];   
101    var fdate;
102    var tdate;
103   
104    intervalIsValid = false;
105    setInputStatus('displayInterval','','valid');
106    if (frm.fromdate.value != null && frm.fromdate.value != '')
107    {
108      frm.fromdate.value = autoFillDate(frm.fromdate.value);     
109      if (!Dates.isDate(frm.fromdate.value, 'yyyyMMdd'))
110      {
111        setInputStatus('displayInterval','Not a valid from-date', 'invalid');
112        return;
113      }
114      else
115      {
116        fdate = frm.fromdate.value;
117        fdate = new Date(fdate.substr(0,4), parseInt(fdate.substr(4,2), 10)-1, fdate.substr(6,2));
118      }
119    }
120   
121    if (frm.todate.value != null && frm.todate.value != '')
122    {
123      frm.todate.value = autoFillDate(frm.todate.value);
124      if (!Dates.isDate(frm.todate.value, 'yyyyMMdd'))
125      {
126        setInputStatus('displayInterval', 'Not a valid to-date', 'invalid');
127        return;
128      }
129      else
130      {
131        tdate = frm.todate.value;
132        tdate = new Date(tdate.substr(0,4), parseInt(tdate.substr(4,2), 10)-1, tdate.substr(6,2));
133      }
134    }
135   
136    if (tdate != null && fdate != null)
137    {
138      if (fdate > tdate)
139      {
140        setInputStatus('displayInterval', 'Invalid period', 'invalid')
141        return;
142      }     
143    }
144    intervalIsValid = true;
145  }
146 
147  function goCreate()
148  {
149    if (!intervalIsValid) return;
150    var cellElement = document.getElementById('reportcell');
151    var frm = document.forms['reggie'];   
152    var reportType = frm.reporttype[frm.reporttype.selectedIndex].value;   
153    frm.fromdate.disabled = true;
154    frm.todate.disabled = true;
155    var chartVariant = frm.chartvariant[frm.chartvariant.selectedIndex].value;   
156    if (reportType == 'scanbquartermonthreport')
157    {
158      frm.viewtype.disabled = true;
159      frm.chartvariant.disabled = true;
160    }
161    Main.hide('gocreate');
162    Main.show('reportSection');
163    var url = 'ScanBQuarterMonthReport.servlet?ID=<%=ID%>&cmd='+reportType;   
164   
165    if (frm.fromdate.value != null) url += '&fdate='+frm.fromdate.value;
166    if (frm.todate.value != null) url += '&tdate='+frm.todate.value;
167    if (reportType == 'scanbquartermonthreport')
168    {     
169      if (frm.viewtype.value != null) url += '&vtype='+frm.viewtype.value;
170      if (frm.chartvariant.value != null) url += '&cvariant='+frm.chartvariant.value;
171    }
172   
173    var request = Ajax.getXmlHttpRequest();
174    request.open("GET", url, false);
175    request.send(null);
176   
177    if (debug) Main.debug(request.responseText);   
178    var response = JSON.parse(request.responseText); 
179    if (response.status != 'ok')
180    {
181      setFatalError(response.message);
182      return false;
183    }
184    var report = response.report;
185    var permissionDeniedForPatientName = report.permissionDeniedForPatientName;
186    var reportTable;
187   
188    if (report != null)
189    {
190      if ('scanbquartermonthreport' == reportType)
191      {
192        var draw_area_wdt = 700;
193        var draw_area_hgt = 550;
194        var jsonStatisticsPlotArray = report.plotStatistics;
195        // Draw plots
196        setInnerHTML('reportcell', '');
197        for (var plotIndex in jsonStatisticsPlotArray)
198        {
199          //
200          // Get plot JSON data container with extra info and plot data
201          var plotJsonDataContainer = jsonStatisticsPlotArray[plotIndex];
202          // Get plot JSON extra info and plot data
203          var plotChartVariant = plotJsonDataContainer['chartVariant'];
204          var plotViewType = plotJsonDataContainer['viewType'];
205          var plotOptionalHeadline = plotJsonDataContainer['optionalHeadline'];
206          var boxPlotJsonData = plotJsonDataContainer['plotData'];
207          // Create plot from plot JSON data
208          var spacer = document.createElement('text');
209          spacer.innerHTML = "<BR>";
210          if (plotOptionalHeadline != null && plotOptionalHeadline != '')
211          {
212            // Print optional headline
213            var headlineText = document.createElement('text');
214            headlineText.innerHTML = "<BR>" + plotOptionalHeadline + "<BR>";
215            cellElement.appendChild(spacer);
216            cellElement.appendChild(headlineText);
217          }
218          var plotKey = plotChartVariant + '_' + plotViewType;
219/*
220          // Add plot key as debug text
221          var debugText = document.createElement('text');
222          debugText.innerHTML = "<BR>" + plotKey + "<BR>";
223          cellElement.appendChild(spacer);
224          cellElement.appendChild(debugText);
225*/
226          // Add plot
227          var canvasInTable = document.createElement('canvas');
228          canvasInTable.setAttribute('id', plotKey);
229          canvasInTable.setAttribute('width', draw_area_wdt);
230          canvasInTable.setAttribute('height', draw_area_hgt);
231          createBoxPlot(boxPlotJsonData, canvasInTable, draw_area_wdt, draw_area_hgt);
232          cellElement.appendChild(spacer);
233          cellElement.appendChild(canvasInTable);
234        }
235        // Print optional appended info
236        var appendedInfo = report.appendedInfo;
237        if (appendedInfo != null && appendedInfo != '')
238        {
239          // Print optional headline
240          var infoText = document.createElement('text');
241          infoText.innerHTML = "<BR>" + appendedInfo + "<BR>";
242          cellElement.appendChild(spacer);
243          cellElement.appendChild(infoText);
244        }
245      }
246    }
247    else
248    {
249      var messageCell = getTableCellElement('No values could be found during given period', 'reportheader');
250      var messageRow = document.createElement('tr');
251      messageRow.appendChild(messageCell);     
252      var messageTable = getReportTable();
253      messageTable.appendChild(messageRow);
254      reportTable = messageTable;     
255    }
256    Main.show('printButton');
257    Main.show('gorestart');   
258  }
259
260  function getJSONData(jsonObject, key)
261  {
262    var data = getJSONData(jsonObject, key, '');
263    return data;
264  }
265
266  function getJSONData(jsonObject, key, defaultChoice)
267  {
268    var data = defaultChoice;
269    if (jsonObject != null)
270    {
271      if (jsonObject[key] != null)
272      {
273        data = jsonObject[key];
274      }
275    }
276    return data;
277  }
278
279  function getReportTable()
280  {
281      var reportTable = document.createElement('table');
282      reportTable.setAttribute('class','reporttable');
283      reportTable.setAttribute('border','1');     
284      return reportTable;
285  }
286 
287  function getTableCellElement(text, clazz, colspan, rowspan)
288  {
289    var cellElement = document.createElement('td');
290    text = new String(text);   
291    var textArray = text.split("\n");   
292    if (textArray.length > 1)
293    {
294      for (var i=0;i<textArray.length;i++)
295      {       
296        if (i>0)cellElement.appendChild(document.createElement('br'));
297        cellElement.appendChild(document.createTextNode(textArray[i]));
298      }     
299    }
300    else
301    {
302      cellElement.appendChild(document.createTextNode(text));
303    }
304    cellElement.setAttribute('class', clazz);
305    if (colspan != null) cellElement.setAttribute('colspan', colspan);
306    if (rowspan != null) cellElement.setAttribute('rowspan', rowspan);
307   
308    return cellElement;
309  }
310 
311  function getListElement(itemText)
312  {
313    var listElement = document.createElement('li');
314    var textNode = document.createTextNode(itemText);
315    listElement.appendChild(textNode);
316    return listElement;
317  }
318
319  /**
320   *  addHyphensToDateStr()
321   *
322   *  Adds hyphens to date string in yyyymmdd format to
323   *  get yyyy-mm-dd format. If input string already contains
324   *  hyphen(s), the input string is returned unchanged.
325   *  If input string is null or empty, '????-??-??' is returned.
326   *
327   *  @param dateStr String Input date string in yyyy-mm-dd or yyyymmdd format.
328   *  @return String Date string in yyyy-mm-dd format.
329   */
330  function addHyphensToDateString(dateStr)
331  {
332    var dateWithHyphensStr = '????-??-??';
333    if (dateStr != null && dateStr != '')
334    {
335      // Check if input string already contains hyphen
336      if (dateStr.indexOf("-") >= 0)
337      {
338        // Date already has hyphen(s)
339        dateWithHyphensStr = dateStr;
340      }
341      else
342      {
343        // Date in yyyymmdd format
344        var yearStr = dateStr.substr(0,4);
345        var monthStr = dateStr.substr(4,2);
346        var dayStr = dateStr.substr(6,2);     
347        dateWithHyphensStr = yearStr + '-' + monthStr + '-' + dayStr;
348      }
349    }
350    return dateWithHyphensStr;
351  }
352
353  /**
354   *  dateStrToDate()
355   *
356   *  Takes an input date string in yyyy-mm-dd or yyyymmdd format
357   *  and returns a date corresponding to the date string.
358   *  If input string is null or empty, null is returned.
359   *
360   *  @param dateStr String Input date string in yyyy-mm-dd or yyyymmdd format.
361   *  @return Date Date corresponding to input date string.
362   */
363  function dateStrToDate(dateStr)
364  {
365    var date = null;
366    if (dateStr != null && dateStr != '')
367    {
368      // Check if input string already contains hyphen
369      if (dateStr.indexOf("-") >= 0)
370      {
371        // Date in yyyy-mm-dd format
372        var yearStr = dateStr.substr(0,4);
373        var monthStr = dateStr.substr(5,2);
374        var dayStr = dateStr.substr(8,2);     
375        var date = new Date(parseInt(yearStr, 10), parseInt(monthStr, 10)-1, parseInt(dayStr, 10));
376      }
377      else
378      {
379        // Date in yyyymmdd format
380        var yearStr = dateStr.substr(0,4);
381        var monthStr = dateStr.substr(4,2);
382        var dayStr = dateStr.substr(6,2);     
383        var date = new Date(parseInt(yearStr, 10), parseInt(monthStr, 10)-1, parseInt(dayStr, 10));
384      }
385    }
386    return date;
387  }
388
389  /*
390   *  Get the ISO week number for a given date
391   *
392   *  Based on code at http://stackoverflow.com/questions/6117814/get-week-of-year-in-javascript-like-in-php
393   *
394   *  @param date String Input date to get ISO week number for.
395   *  @return int ISO week number for input date.
396   */
397  function getISOWeekNumber(date)
398  {
399    tmpDate = new Date(date);
400    tmpDate.setHours(0,0,0);
401    // Set to nearest Thursday: current date + 4 - current day number
402    // Make Sunday day number 7
403    tmpDate.setDate(tmpDate.getDate() + 4 - (tmpDate.getDay() || 7));
404    // Get first day of year
405    var yearStart = new Date(tmpDate.getFullYear(), 0, 1);
406    // Calculate full weeks to nearast Thursday (86400000 = 24*60*60*1000 number of ms in a day)
407    var weekNo = Math.ceil(( ( (tmpDate - yearStart) / 86400000) + 1)/7);
408    return weekNo;
409  }
410
411  function goPrint()
412  {
413    var printNote = '<b>Note!</b> For better printing set page orientation to <i>portrait</i>.';
414    printNote += ' Scale down to <i>90%</i> to fit 2 plots per page.';
415    openPrintWindow('<%=ID%>', 'reportcell', 'Sample processing statistics', 'portrait', printNote);
416  }
417  </script>
418 
419 
420  </base:head>
421  <base:body onload="init()">
422    <p:path><p:pathelement 
423      title="Reggie" href="<%="index.jsp?ID="+ID%>" 
424      /><p:pathelement title="Sample processing statistics" 
425      /></p:path>
426    <div class="content">
427    <%
428    if (sc.getActiveProjectId() == 0)
429    {
430      %>
431      <div class="messagecontainer note" style="width: 950px; margin-left: 20px; margin-bottom: 20px; margin-right: 0px; font-weight: bold; color: #cc0000;">
432        No project has been selected. You may proceed with the report generation but
433        only your own items will be included in the report.
434      </div>
435      <%
436    }
437    %>
438 
439    <form name="reggie" onsubmit="return false;">
440      <!-- 1. Report type-->
441      <table border="0" cellspacing="0" cellpadding="0" class="stepform">
442      <tr>
443        <td rowspan="3" class="stepno">1</td>
444        <td class="steptitle">Report type</td>
445      </tr>
446      <tr>
447        <td class="stepfields">
448          <table border="0" cellspacing="0" cellpadding="0" width="100%">
449          <tr valign="top">
450            <td class="prompt">Report</td>
451            <td class="input">
452              <select name="reporttype">
453                <option value="scanbquartermonthreport" selected="yes">SCAN-B quarter/month report</option>
454              </select>
455            </td>
456            <td class="status" id="report.status"></td>
457            <td class="help">
458              <span id="report.message" class="message" style="display: none;"></span>
459              Select which report to generate.
460            </td>
461          </tr>
462          </table>
463        </td>
464      </tr>
465      </table>
466     
467      <div id="itemCountSection" style="display:none;">
468        <p></p>
469        <!-- 2. Report parameters-->
470        <table border="0" cellspacing="0" cellpadding="0" class="stepform">
471        <tr>
472          <td rowspan="3" class="stepno">2</td>
473          <td class="steptitle">Report parameters</td>
474        </tr>
475        <tr>
476          <td class="stepfields">
477            <table border="0" cellspacing="0" cellpadding="0" width="100%">           
478            <tr>
479              <td valign="top" class="prompt">
480                <div id="reportPeriodSubSection01" style="display:none;">
481                  <text id="reportPeriodSubSection01Header">Report period</text>
482                </div>
483              </td>
484              <td valign="top" class="input">
485                <div id="reportPeriodSubSection02" style="display:none;">
486                  From<input type="text" onChange="dateOnChange()" size=7 name="fromdate"/>&nbsp;
487                  To<input type="text" onChange="dateOnChange()" size=7 name="todate" />
488                </div>
489              </td>
490              <td valign="top" class="status" id="displayInterval.status"></td>
491              <td class="help">
492                <div id="reportPeriodSubSection04" style="display:none;">
493                  <span id="displayInterval.message" class="message" style="display: none;"></span>
494                  <!--
495                  Define which period the report should cover. Empty fields will include all <text id="items01">items</text>.<br>
496                  -->
497                  <text id="reportPeriodSubSection04HelpText">Parameter help text</text><br>
498                </div>
499              </td>
500            </tr> 
501            <tr>
502              <td valign="top" class="prompt">
503                <div id="viewTypeSubSection01" style="display:none;">
504                  View type
505                </div>
506              </td>
507              <td valign="top" class="input">
508                <div id="viewTypeSubSection02" style="display:none;">
509                  <select name="viewtype">
510                    <option value="QUARTERMONTH" selected="yes">Quarter + Month</option>
511                    <option value="AUTO">Auto</option>
512                    <option value="WEEK">Week</option>
513                    <option value="MONTH">Month</option>
514                    <option value="QUARTER">Quarter</option>
515                    <option value="YEAR">Year</option>
516                  </select>
517                </div>
518              </td>
519              <td valign="top" class="status" id="displayViewType.status"></td>
520              <td class="help">
521                <div id="viewTypeSubSection04" style="display:none;">
522                  <span id="displayViewType.message" class="message" style="display: none;"></span>
523                  Auto will adjust the report depending on the size of the period.
524                  <ul>
525                    <!--
526                    <li>Period shorter than 3 months - <text id="items02">items</text> per week</li>
527                    -->
528                    <li>Period shorter than 13 months - <text id="items03">items</text> per month</li>
529                    <li>Period shorter than 3 years - <text id="items04">items</text> per quarter</li>
530                    <li>Period is 3 years or greater - <text id="items05">items</text> per year</li>
531                  </ul>
532                </div>
533              </td>
534            </tr>
535            <tr>
536              <td valign="top" class="prompt">
537                <div id="chartVariantSubSection01" style="display:none;">
538                  Chart data
539                </div>
540              </td>
541              <td valign="top" class="input">
542                <div id="chartVariantSubSection02" style="display:none;">
543                  <select name="chartvariant">
544                    <option value="allcharts" selected="yes">All</option>
545                    <option value="originalquantitytissue">Original quantity tissue</option>
546                    <option value="quantitytissueused">Quantity tissue used for SCAN-B specimens</option>
547                    <option value="histologypiecequantity">Histology piece quantity</option>
548                    <option value="remainingquantityforscanbspecimen">Remaining quantity for SCAN-B specimens</option>
549                    <option value="originalquantitydna">Original quantity DNA for SCAN-B extractions</option>
550                    <option value="originalquantityrna">Original quantity RNA for SCAN-B extractions</option>
551                    <option value="dnayield">DNA yield</option>
552                    <option value="rnayield">RNA yield</option>
553                    <option value="dnayieldcorrected">DNA yield (corrected for only processing half of the lysate volume)</option>
554                    <option value="rnayieldcorrected">RNA yield (corrected for only processing half of the lysate volume)</option>
555                    <option value="rnaqc">RNA QC</option>
556                    <option value="minutestornalater">Min to RNAlater</option>
557                  </select>
558                </div>
559              </td>
560              <td valign="top" class="status" id="displaychartVariant.status"></td>
561              <td class="help">
562                <div id="chartVariantSubSection04" style="display:none;">
563                  <span id="displaychartVariant.message" class="message" style="display: none;"></span>
564                  Select what data to report.
565                </div>
566              </td>
567            </tr>
568            </table>
569          </td>
570        </tr>
571        </table>
572      </div>
573     
574      <div id="reportSection" style="display:none;">
575        <p></p>
576        <table border="0" cellspacing="0" cellpadding="0" class="stepform">
577        <tr>
578          <td rowspan="3" class="stepno">3</td>
579          <td class="steptitle">Generated report
580            <span id="printButton" class="link" style="float:right; display: none;" onclick="goPrint()"><img src="images/print.png" style="padding-right: 0.5em;">Print version&hellip;</span>
581          </td>
582        </tr>
583        <tr>
584          <td id="reportcell" class="stepfields">
585            <i>Generating report...</i>
586          </td>
587        </tr>
588        </table>
589      </div> 
590     
591      <div class="messagecontainer error" id="errorMessage" style="display: none; width: 950px; margin-left: 20px; margin-bottom: 0px;"></div>   
592       
593      <table style="margin-left: 20px; margin-top: 10px;" class="navigation">
594        <tr>
595          <td><base:button id="gocancel" title="Cancel" onclick="goRestart(false)" style="display: none;"/></td>
596          <td><base:button id="gonext" title="Next" image="<%=home+"/images/gonext.png"%>" onclick="goNext(true)" /></td>
597          <td><base:button id="gocreate" title="Generate" image="<%=home+"/images/gonext.png"%>" onclick="goCreate()" style="display: none;"/></td>         
598          <td><base:button id="gorestart" title="Restart" image="<%=home+"/images/goback.png"%>" onclick="goRestart(true)" style="display: none;"/></td>
599          <td id="gonext.message" class="message"></td>
600        </tr>
601      </table>     
602    </form>
603    </div>
604   
605  </base:body>
606  </base:page>
607  <%
608}
609finally
610{
611  if (dc != null) dc.close();
612}
613%>
Note: See TracBrowser for help on using the repository browser.