source: extensions/net.sf.basedb.reggie/trunk/resources/consentform.jsp @ 1538

<%@ page
  pageEncoding="UTF-8"
  session="false"
  import="net.sf.basedb.core.Application"
  import="net.sf.basedb.core.User"
  import="net.sf.basedb.core.DbControl"
  import="net.sf.basedb.core.SessionControl"
  import="net.sf.basedb.clients.web.Base"
  import="net.sf.basedb.clients.web.util.HTML"
  import="net.sf.basedb.clients.web.extensions.ExtensionsControl"
  import="net.sf.basedb.util.Values"
%>
<%@ taglib prefix="base" uri="/WEB-INF/base.tld" %>
<%@ taglib prefix="p" uri="/WEB-INF/path.tld" %>
<%
final SessionControl sc = Base.getExistingSessionControl(request, true);
final String ID = sc.getId();
final float scale = Base.getScale(sc);
final String home = ExtensionsControl.getHomeUrl("net.sf.basedb.reggie");
DbControl dc = null;
try
{
  dc = sc.newDbControl();
  final User user = User.getById(dc, sc.getLoggedInUserId());
%>
<base:page type="default" >
<base:head scripts="ajax.js" styles="path.css">
  <link rel="stylesheet" type="text/css" href="css/reggie.css">
  <%
  if (Application.getMajorVersion() == 3 && Application.getMinorVersion() == 0)
  {
    %>
    <link rel="stylesheet" type="text/css" href="css/base30.css">
    <%
  }
  %>
  <script language="JavaScript" src="reggie.js" type="text/javascript" charset="UTF-8"></script>

<script language="JavaScript">

var debug = false;
var currentStep = 1;
var caseIsValid = false;
var consentDateIsValid = false;

var consentToId = { "Yes": "consent.yes", "No" : "consent.no", "Not asked": "consent.notAsked" };
var patientInfo;

function init()
{
  var frm = document.forms['reggie'];
  frm.caseName.focus();
}

function step1IsValid()
{
  var frm = document.forms['reggie'];
  var caseName = frm.caseName.value;
  caseIsValid = false;
  if (caseName == '')
  {
    setInputStatus('case', 'Missing', 'invalid');
    frm.caseName.focus();
  }
  else if (!isValidCaseName(caseName))
  {
    setInputStatus('case', 'Only 7-digits name is allowed .', 'invalid');
    frm.caseName.focus();
  }
  else
  {
    setInputStatus('case', '', 'valid');
    caseIsValid = true;
  }
  
  return caseIsValid;
}

function step2IsValid()
{
  return consentDateIsValid;
}

function goNextAuto()
{
  goNext(false);
}

function goNext(manual)
{
  setInnerHTML('gonext.message', '');
  if (currentStep == 1)
  {
    if (step1IsValid()) gotoStep2();
  }
  else if (currentStep == 2)
  {
    if (step2IsValid()) gotoStep3();
  }
}


function gotoStep2()
{
  // Check entered case and pnr with AJAX
  var frm = document.forms['reggie'];
  
  frm.caseName.disabled = true;
  currentStep = 2;
  
  var caseName = frm.caseName.value;
  var request = Ajax.getXmlHttpRequest();
  var url = 'ConsentForm.servlet?ID=<%=ID%>&cmd=GetCaseInfo';
  url += '&caseName=' + caseName;
  request.open("GET", url, false); 
  request.send(null);
  
  if (debug) Main.debug(request.responseText);
  var response = JSON.parse(request.responseText);
  if (response.status != 'ok')
  {
    setFatalError(response.message);
    return false;
  }
  
  Main.hide('gonext');
  Main.show('consentSection');
  
  // Get case information from the AJAX response
  patientInfo = response.patientInfo;
  var caseInfo = response.caseInfo;
  var specimenInfo = response.specimenInfo;
  

  if (caseInfo && caseInfo.consentDate)
  {
    frm.consentDate.value = caseInfo.consentDate;
  }
  frm.consentDate.focus();
  
  if (patientInfo)
  {
    var html = '';
    var numEnabled = 0;
    if (patientInfo.allCases)
    {
      for (var i = 0; i < patientInfo.allCases.length; i++)
      {
        var c = patientInfo.allCases[i];
        var laterality = c.laterality ? ' ('+c.laterality+')' : '';
        var disabled = '';
        if (c.consent)
        {
          disabled = 'disabled';
        }
        else
        {
          numEnabled++;
        }
        html += '<input type="checkbox" name="case.'+c.id+'" id="case.'+c.id+'" checked ' + disabled +'>';
        html += '<label for="case.'+c.id+'">Case: ' + c.name + laterality + '</label><br>';
      }
    }
    
    if (patientInfo.allBlood)
    {
      for (var i = 0; i < patientInfo.allBlood.length; i++)
      {
        var c = patientInfo.allBlood[i];
        var disabled = '';
        if (c.consent)
        {
          disabled = 'disabled';
        }
        else
        {
          numEnabled++;
        }
        html += '<input type="checkbox" name="blood.'+ c.id + '" id="blood.'+c.id+'" checked ' + disabled +'>';
        html += '<label for="blood.'+c.id+'">Blood: ' + c.name + '</label><br>';
      }
    }
    
    document.getElementById('moreCases').innerHTML = html;
    
    if (numEnabled > 0)
    {
      enableConsentOption('consent.yes', true);
      setInputStatus('consent', 'This patient already exists and has at least one case or blood sample with missing consent.', 'valid');
      Main.showInline('morehelp.multiple');
      Main.showInline('morehelp.yesonly');
      Main.show('gocancel');
      Main.show('goregister');
    }
    else
    {
      enableConsentOption('consent.yes', true);
      setInputStatus('consent', '"Yes" has already been registered for all case and blood samples for this patient. It is not possible to change with this wizard.', '');
      Main.show('gorestart');
      frm.consentDate.disabled = true;
    }
    Main.show('moreCasesSection');
  }
  else if (caseInfo)
  {
    // A consent has already been registered for this case
    // We do not support updating this
    enableConsentOption(consentToId[caseInfo.consent], true);
    setInputStatus('consent', '"' + caseInfo.consent + '" has already been registered for this case. It is not possible to change with this wizard.', '');
    Main.show('gorestart');
    frm.consentDate.disabled = true;
  }
  else if (specimenInfo)
  {
    // There is no existing case but there are specimen related to it
    // This wizard will only allow 'Yes' option on the consent form
    enableConsentOption('consent.yes', true);
    setInputStatus('consent', 'Specimen tubes for this case already exists.', 'valid');
    Main.showInline('morehelp.yesonly');
    Main.show('gocancel');
    Main.show('goregister');
  }
  else
  {
    // We have no information about this case -- but allow a consent to be registered in any case
    enableConsentOption('consent.no', true);
    enableConsentOption('consent.notAsked');
    enableConsentOption('consent.yes');
    Main.showInline('morehelp.any');
    Main.show('gocancel');
    Main.show('goregister');
  }

}

function goRegister()
{
  if (!step2IsValid()) return;
  
  var frm = document.forms['reggie'];
  frm.otherReasonIfNotAsked.disabled = true;
  frm.consentDate.disabled = true;
  for (var i = 0; i < frm.consent.length; i++)
  {
    frm.consent[i].disabled = true;
  }
  for (var i = 0; i < frm.reasonIfNotAsked.length; i++)
  {
    frm.reasonIfNotAsked[i].disabled = true;
  }
  
  Main.hide('goregister');
  Main.hide('gocancel');

  var consentInfo = new Object();
  consentInfo.caseName = frm.caseName.value;
  consentInfo.consentDate = frm.consentDate.value;
  consentInfo.consent = Forms.getCheckedRadio(frm.consent).value;
  if (consentInfo.consent == 'Not asked')
  {
    var reasonIfNotAsked = '';
    for (var i = 0; i < frm.reasonIfNotAsked.length; i++)
    {
      var option = frm.reasonIfNotAsked[i];
      if (option.checked)
      {
        if (option.id == 'notAsked.other')
        {
          reasonIfNotAsked += frm.otherReasonIfNotAsked.value;
        }
        else
        {
          var label = document.getElementById(option.id + '.label');
          reasonIfNotAsked += label.innerHTML + '\n';
        }
      }
    }
    consentInfo.reasonIfNotAsked = reasonIfNotAsked;
  }
  
  if (patientInfo)
  {
    var selectedSamples = new Array();
    if (patientInfo.allCases)
    {
      for (var i = 0; i < patientInfo.allCases.length; i++)
      {
        var c = patientInfo.allCases[i];
        var chk = frm['case.'+c.id];
        if (chk.checked && !chk.disabled) selectedSamples[selectedSamples.length] = c.id;
      }
    }
    
    if (patientInfo.allBlood)
    {
      for (var i = 0; i < patientInfo.allBlood.length; i++)
      {
        var c = patientInfo.allBlood[i];
        var chk = frm['blood.'+c.id];
        if (chk.checked && !chk.disabled) selectedSamples[selectedSamples.length] = c.id;
      }
    }
    consentInfo.selectedSamples = selectedSamples;
  }

  var submitInfo = new Object();
  submitInfo.consentInfo = consentInfo;
  
  if (debug) Main.debug(JSON.stringify(submitInfo));
  var request = Ajax.getXmlHttpRequest();
  var url = 'ConsentForm.servlet?ID=<%=ID%>&cmd=RegisterConsent';
  request.open("POST", url, false);
  request.setRequestHeader("Content-Type", "application/json");
  request.send(JSON.stringify(submitInfo));

  if (debug) Main.debug(request.responseText);
  
  var response = JSON.parse(request.responseText);
  if (response.status != 'ok')
  {
    setFatalError(response.message);
    return false;
  }
  
  var msg = '<ul>';
  for (var i = 0; i < response.messages.length; i++)
  {
    msg += '<li>' + response.messages[i];
  }
  msg += '</ul>';
  setInnerHTML('done', msg);
  Main.show('done');
  Main.show('gorestart');
}

function enableConsentOption(optionId, checkIt)
{
  var option = document.getElementById(optionId); // The radio button
  option.disabled = false;
  if (checkIt) option.checked = true;
  var label = document.getElementById(optionId + '.label'); // The label
  Main.removeClass(label, 'disabled');
}

function consentDateOnChange()
{
  var frm = document.forms['reggie'];
  consentDateIsValid = false;
  setInputStatus('consentDate', '', '');
  
  var consentDate = frm.consentDate.value;
  
  if (consentDate == '')
  {
    setInputStatus('consentDate', 'Missing', 'warning');
  }
  else
  {
    // Auto-fill the date if it's only given with 4(MMdd) or 6(yyMMdd) digits.    
    consentDate = autoFillDate(consentDate);
    frm.consentDate.value = consentDate;
  
    if (!Dates.isDate(consentDate, 'yyyyMMdd'))
    {
      setInputStatus('consentDate', 'Not a valid date', 'invalid');
      return;
    }
    setInputStatus('consentDate', '', 'valid');
  }
  
  consentDateIsValid = true;
}


function consentOnChange()
{
  // If "Not asked" is selected we must enable the second question
  var isAsked = !document.getElementById('consent.notAsked').checked;
  
  var frm = document.forms['reggie'];
  var reasonIfNotAsked = frm.reasonIfNotAsked;
  for (var i = 0; i < reasonIfNotAsked.length; i++)
  {
    reasonIfNotAsked[i].disabled = isAsked;
    var label = document.getElementById(reasonIfNotAsked[i].id + '.label');
    Main.addOrRemoveClass(label, 'disabled', isAsked);
  }
  frm.otherReasonIfNotAsked.disabled = isAsked;
  
}

</script>
<style>
.disabled
{
  color: #999999;
  font-style: italic;
}
</style>
</base:head>
<base:body onload="init()">

  <p:path><p:pathelement 
    title="Reggie" href="<%="index.jsp?ID="+ID%>" 
    /><p:pathelement title="Consent form registration" 
    /></p:path>

  <div class="content">
  <%
  if (sc.getActiveProjectId() == 0)
  {
    %>
    <div class="messagecontainer note" style="width: 800px; margin-left: 20px; margin-bottom: 20px; margin-right: 0px; font-weight: bold; color: #cc0000;">
      No project has been selected. You may proceed with the registration but 
      created items will not be shared.
    </div>
    <%
  }
  %>

  <form name="reggie" onsubmit="return false;">
  
  <!-- 1. Case + Personal number -->
  <table border="0" cellspacing="0" cellpadding="0" class="stepform">
  <tr>
    <td rowspan="3" class="stepno">1</td>
    <td class="steptitle">Enter Case Name</td>
  </tr>
  <tr>
    <td class="stepfields">
      <table border="0" cellspacing="0" cellpadding="0" width="100%">
      <tr>
        <td class="prompt">Case name</td>
        <td class="input"><input type="text" name="caseName" 
          size="18" maxlength="12" onkeypress="doOnTabOrEnter(event, goNextAuto)"></td>
        <td class="status" id="case.status"></td>
        <td class="help"><span id="case.message" class="message" style="display: none;"></span>The 7-digit case (barcode) associated with the case.</td>
      </tr>
      </table>
    </td>
  </tr>
  </table>

  <!-- 2. Consent section -->
  <div id="consentSection" style="display: none;">
  <p>
  <table border="0" cellspacing="0" cellpadding="0" class="stepform">
  <tr>
    <td rowspan="2" class="stepno">2</td>
    <td class="steptitle">Consent form</td>
  </tr>
  <tr>
    <td class="stepfields">
      <table border="0" cellspacing="0" cellpadding="0" width="100%">
      <tr valign="top">
        <td class="prompt">Date</td>
        <td class="input" style="padding-left: 0px;">
          <input type="text" name="consentDate" value="" size="12" maxlength="10"
            onblur="consentDateOnChange()">
        </td>
        <td class="status" id="consentDate.status"></td>
        <td class="help">
          <span id="consentDate.message" class="message" style="display: none;"></span>(YYYYMMDD or MMDD)
        </td>
      </tr>
      <tr valign="top">
        <td class="prompt">Consent</td>
        <td class="input" style="padding-left: 0px;">
          <input id="consent.no" type="radio" name="consent" value="No" disabled onchange="consentOnChange()">
            <label id="consent.no.label" for="consent.no" class="disabled">No</label><br>
          <input id="consent.yes" type="radio" name="consent" value="Yes" disabled onchange="consentOnChange()">
            <label id="consent.yes.label" for="consent.yes" class="disabled">Yes</label><br>
          <div id="moreCasesSection" style="display: none;">
            <table border="0" cellpadding="0" cellspacing="0">
            <tr valign="baseline">
              <td><img src="images/joinbottom.gif"></td>
              <td id="moreCases"></td>
            </tr>
            </table>
          </div>
          <input id="consent.notAsked" type="radio" name="consent" value="Not asked" disabled onchange="consentOnChange()">
            <label id="consent.notAsked.label" for="consent.notAsked" class="disabled">Not asked</label>
        </td>
        <td class="status" id="consent.status"></td>
        <td class="help" rowspan="2">
          <span id="consent.message" class="message" style="display: none;"></span>
          <span id="morehelp.multiple" style="display:none;">
            Select the cases and blood samples to register. Cases with
            already existing consent can't be deselected.
          </span>
          <span id="morehelp.yesonly" style="display: none;">
            <b>Yes</b> is the only option supported by this wizard. The other alternatives 
            may require manual deletion of already registered information.
          </span>
          <span id="morehelp.any" style="display: none;">
            There is currently no information about this case.
          </span>
        </td>
      </tr>
      <tr valign="top">
        <td class="subprompt">Reason if not asked</td>
        <td class="input">
          <table border="0" cellpadding="0" cellspacing="0">
          <tr valign="baseline">
            <td><img src="images/joinbottom.gif"></td>
            <td><input id="notAsked.forgot" type="checkbox" name="reasonIfNotAsked" disabled></td>
            <td><label id="notAsked.forgot.label" for="notAsked.forgot" class="disabled">Forgot to ask the patient</label></td>
          </tr>
          
          <tr valign="baseline">
            <td></td>
            <td><input id="notAsked.language" type="checkbox" name="reasonIfNotAsked" disabled></td>
            <td><label id="notAsked.language.label" for="notAsked.language" class="disabled">Language problems</label></td>
          </tr>

          <tr valign="baseline">
            <td></td>
            <td><input id="notAsked.condition" type="checkbox" name="reasonIfNotAsked" disabled></td>
            <td><label id="notAsked.condition.label" for="notAsked.condition" class="disabled">Patient can't decide due to physical and/or mental condition</label></td>
          </tr>

          <tr valign="baseline">
            <td></td>
            <td><input id="notAsked.other" type="checkbox" name="reasonIfNotAsked" disabled></td>
            <td><label id="notAsked.other.label" for="notAsked.other" class="disabled">Other:</label></td>
          </tr>

          <tr valign="baseline">
            <td></td>
            <td colspan="2">
            <textarea name="otherReasonIfNotAsked" rows="3" cols="30" disabled
              onfocus="document.forms['reggie'].reasonIfNotAsked[3].checked = true"></textarea>
            </td>
          </tr>
          </table>

        </td>
        <td class="status" id="notAsked.status"></td>
      </tr>
      </table>
    </td>
  </tr>
  </table>
  </div>
  
  <div class="messagecontainer error" id="errorMessage" style="display: none; width: 800px; margin-left: 20px; margin-bottom: 0px;"></div>

  <div id="done" class="success" style="display: none; width: 800px; margin-left: 20px; margin-top: 20px;"></div>

  <table style="margin-left: 20px; margin-top: 10px;" class="navigation">
  <tr>
    <td><base:button id="gocancel" title="Cancel" onclick="goRestart(false)" style="display: none;"/></td>
    <td><base:button id="gonext" title="Next" image="<%=home+"/images/gonext.png"%>" onclick="goNext(true)"/></td>
    <td><base:button id="goregister" title="Register" image="<%=home+"/images/gonext.png"%>" onclick="goRegister()" style="display: none;"/></td>
    <td><base:button id="gorestart" title="Restart" image="<%=home+"/images/goback.png"%>" onclick="goRestart(true)" style="display: none;"/></td>
    <td id="gonext.message" class="message"></td>
  </tr>
  </table>
  </form>
  </div>
  
</base:body>
</base:page>
<%
}
finally
{
  if (dc != null) dc.close();
}
%>