source: extensions/net.sf.basedb.reggie/trunk/resources/persinfo.jsp @ 1317

<%@ 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.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);
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">
<script language="JavaScript">

var currentStep = 1;
var pnrIsValid = false;
var caseIsValid = false;
var lateralityIsValid = false;

var patientInfo = null;
var caseInfo = null;

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

function step1IsValid()
{
  return pnrIsValid && caseIsValid;
}

function step2IsValid()
{
  var formOk = true;
  var frm = document.forms['reggie'];

  // New patient only
  if (!patientInfo.id)
  {
    // Validate 'New patient' form
    if (frm.allFirstNames.value == '')
    {
      setInputStatus('allFirstNames', 'Missing', 'invalid');
      frm.allFirstNames.focus();
      formOk = false;
    }
    else
    {
      setInputStatus('allFirstNames', '', 'valid');
    }
    
    if (frm.familyName.value == '')
    {
      setInputStatus('familyName', 'Missing', 'invalid');
      frm.familyName.focus();
      formOk = false;
    }
    else
    {
      setInputStatus('familyName', '', 'valid');
    }

    if (frm.patientCode.value == '')
    {
      setInputStatus('patientCode', 'Missing', 'invalid');
      frm.patientCode.focus();
      formOk = false;
    }
    else
    {
      setInputStatus('patientCode', '', 'valid');
    } 
  }
  return formOk;
}

function step3IsValid()
{
  return lateralityIsValid;
}

function goNext()
{
  if (currentStep == 1)
  {
    if (step1IsValid()) gotoStep2();
  }
  else if (currentStep == 2)
  {
    if (step2IsValid()) gotoStep3();
  }
}

function caseNameOnChange()
{
  var frm = document.forms['reggie'];
  var caseName = frm.caseName.value;
  if (caseName == '')
  {
    setInputStatus('case', 'Missing', 'invalid');
    return;
  }
  setInputStatus('case', '', 'valid');
  caseIsValid = true;
}

function personalNumberOnChange()
{
  var frm = document.forms['reggie'];
  var pnr = frm.personalNumber.value;
  pnrIsValid = false;
  
  if (pnr.length < 12)
  {
    setInputStatus('pnr', 'Too short', 'invalid');
    return;
  }
  
  if (!Dates.isDate(pnr.substring(0, 8), 'yyyyMMdd'))
  {
    setInputStatus('pnr', 'Not a valid date', 'invalid');
    return;
  }
  
  var sum = 0;
  var factor = 2;
  var x = '';
  for (var i = 2; i < 11; i++)
  {
    var digit = parseInt(pnr.substr(i, 1));
    var tmp = factor * digit;
    x += '(' + factor + '*' + digit+')';
    sum += tmp >= 10 ? tmp - 9: tmp;
    factor = factor == 2 ? 1 : 2;
  }
  
  var control = 10 - (sum % 10);
  if (control == 10) control = 0;
  if (control != parseInt(pnr.substr(11, 1)))
  {
    setInputStatus('pnr', 'Invalid control digit', 'invalid');
    return;
  }
  
  setInputStatus('pnr', '', 'valid');
  pnrIsValid = true;
}

function lateralityOnChange()
{
  lateralityIsValid = false;
  
  // Check selected laterality against specimen tubes
  var frm = document.forms['reggie'];
  var selectedLaterality = Forms.getCheckedRadio(frm.laterality);
  
  // No laterality/case selected
  if (selectedLaterality == null) 
  {
    setInputStatus('laterality', 'Not selected', 'invalid');
    return;
  }
  setInputStatus('laterality', '', 'valid');
  lateralityIsValid = true;
  
  var laterality = selectedLaterality.value;
  if (laterality.match(/\d+/))
  {
    // It is the ID of an existing case
    for (var i = 0; i < patientInfo.cases.length; i++)
    {
      var cse = patientInfo.cases[i];
      if (cse.id == laterality)
      {
        laterality = cse.laterality;
        break;
      }
    }
  }
  else  if (laterality == '') 
  {
    laterality = null;
  }
    
  // No specimen tubes?
  if (!caseInfo.specimen || caseInfo.specimen.length == 0) return;
  
  for (var i = 0; i < caseInfo.specimen.length; i++)
  {
    var specimen = caseInfo.specimen[i];
    if (specimen.laterality != laterality)
    {
      if (specimen.laterality == null)
      {
        setInputStatus('laterality', 'Specimen tubes are updated to: ' + laterality, 'valid')
      }
      else
      {
        setInputStatus('laterality', 'Not same laterality as specimen tubes', 'warning');
      }
      return;
    }
  }
}

function goNextOnTab(event)
{
  if (event.keyCode == 9) setTimeout('goNext()', 200);
  return true;
}

function goNextOnTabOrEnter(event)
{
  if (event.keyCode == 9 || event.keyCode == 13) setTimeout('goNext()', 200);
  return true;
}

function focusOnEnter(event, inputField)
{
  if (event.keyCode == 13) setTimeout("document.forms['reggie']."+inputField+".focus()", 200);
  return true;
}

function gotoStep2()
{
  // Check entered case and pnr with AJAX
  var frm = document.forms['reggie'];
  frm.caseName.disabled = true;
  frm.personalNumber.disabled = true;
  currentStep = 2;
  
  var pnr = frm.personalNumber.value;
  var caseName = frm.caseName.value;
  var request = Ajax.getXmlHttpRequest();
  var url = 'PersonalRegistration.servlet?ID=<%=ID%>&cmd=CheckPersonalNumberAndCaseName';
  url += '&personalNumber=' + pnr;
  url += '&caseName=' + caseName;
  request.open("GET", url, false); 
  request.send(null);
  
  //setInnerHTML('debug', request.responseText);
  
  var response = JSON.parse(request.responseText);
  if (response.status != 'ok')
  {
    setFatalError(response.message);
    return false;
  }
  
  Main.show('gocancel');
  
  // Get biosource information from the AJAX response
  patientInfo = response.patientInfo;
  caseInfo = response.caseInfo;
  
  if (!patientInfo.id)
  {
    Main.show('newPatientSection');
    frm.patientCode.value=patientInfo.name;
    setInnerHTML('new.dateOfBirth', patientInfo.dateOfBirth);
    setInnerHTML('new.gender', patientInfo.gender);
    frm.familyName.focus();
  }
  else
  {
    Main.show('existingPatientSection');
    setInnerHTML('existing.patientCode', patientInfo.name);
    setInnerHTML('existing.familyName', patientInfo.familyName);
    setInnerHTML('existing.allFirstNames', patientInfo.allFirstNames);
    setInnerHTML('existing.dateOfBirth', patientInfo.dateOfBirth);
    setInnerHTML('existing.gender', patientInfo.gender);
    gotoStep3();
  }
}

function gotoStep3()
{
  // Check entered case and pnr with AJAX
  var frm = document.forms['reggie'];
  
  if (!patientInfo.id)
  {
    frm.patientCode.disabled = true;
    frm.familyName.disabled = true;
    frm.allFirstNames.disabled = true;
    patientInfo.familyName = frm.familyName.value;
    patientInfo.allFirstNames = frm.allFirstNames.value;
  }
  currentStep = 3;
  
  // Generate list of specimen tubes
  var hasLeftSpecimen = false;
  var hasRightSpecimen = false;
  var hasUnknownSpecimen = false;
  var thisCaseLaterality = null;
  var hasPAD = false;
  if (caseInfo.specimen && caseInfo.specimen.length > 0)
  {
    var specimenTubes = '';
    Main.hide('reasonIfNoSpecimenSection'); 
    for (var i = 0; i < caseInfo.specimen.length; i++)
    {
      var specimen = caseInfo.specimen[i];
      specimenTubes += specimen.name;
      if (specimen.pad) hasPAD = true;
      if (specimen.laterality) 
      {
        specimenTubes += ' ('+specimen.laterality + ')';
        Forms.checkRadio(frm.laterality, specimen.laterality);
        if (specimen.laterality == 'LEFT') hasLeftSpecimen = true;
        if (specimen.laterality == 'RIGHT') hasRightSpecimen = true;
        thisCaseLaterality = specimen.laterality;
      }
      else
      {
        hasUnknownSpecimen = true;
        specimenTubes += ' (<i>unknown laterality</i>)';
      }
      specimenTubes += '<br>';
    }
    setInnerHTML('specimenTubes', specimenTubes);
    
    // Check that all specimen tubes have the same laterality
    var numLateralities = 0;
    if (hasLeftSpecimen) numLateralities++;
    if (hasRightSpecimen) numLateralities++;
    if (hasUnknownSpecimen) numLateralities++;
    if (numLateralities > 1)
    {
      setInputStatus('specimenTubes', 'Specimen tubes with different laterality', 'warning');
      thisCaseLaterality = null;
    }
  }

  Main.showHide('padSection', !hasPAD);
  
  Main.show('caseSection');
  
  // Existing cases for this patient
  var hasLeftCase = false;
  var hasRightCase = false;
  var hasUnknownCase = false;
  if (patientInfo.cases && patientInfo.cases.length > 0)
  {
    var cases = '';
    for (var i = 0; i < patientInfo.cases.length; i++)
    {
      var cc = patientInfo.cases[i];
      cases += '<input type="radio" name="laterality" value="' + cc.id + '"';
      if (cc.laterality == 'LEFT') 
      {
        if (hasLeftCase) setInputStatus('laterality', 'Two cases with laterality=LEFT', 'warning');
        hasLeftCase = true;
      }
      else if (cc.laterality == 'RIGHT') 
      {
        if (hasRightCase) setInputStatus('laterality', 'Two cases with laterality=RIGHT', 'warning');
        hasRightCase = true;
      }
      else
      {
        hasUnknownCase = true;  
      }
      if (cc.laterality == thisCaseLaterality) cases += ' checked';
      cases += ' onclick="lateralityOnChange()">' + cc.name;
      if (cc.laterality) 
      {
        cases += ' (' + cc.laterality + ')<br>';
      }
      else
      {
        cases += ' (<i>unknown laterality</i>)<br>';
      }
    }
    
    if (patientInfo.cases.length == 1)
    {
      if (!hasLeftCase)
      {
        cases += '<input type="radio" name="laterality" value="LEFT" ';
        if (thisCaseLaterality == 'LEFT') cases += ' checked';
        cases += ' onclick="lateralityOnChange()"><i>new case</i> (LEFT)<br>';
      }
      if (!hasRightCase)
      {
        cases += '<input type="radio" name="laterality" value="RIGHT"';
        if (thisCaseLaterality == 'RIGHT') cases += ' checked';
        cases += ' onclick="lateralityOnChange()"><i>new case</i> (RIGHT)<br>';
      }
      cases += '<input type="radio" name="laterality" value=""';
      if (thisCaseLaterality == null) cases += ' checked';
      cases += ' onclick="lateralityOnChange()"><i>new case</i> (<i>unknown laterality</i>)<br>';
    }
    
    if (patientInfo.cases.length == 2)
    {
      setInnerHTML('laterality.prompt', 'Merge with case'); 
    }
    else
    {
      setInnerHTML('laterality.prompt', 'Merge/create new case'); 
    }
    
    setInnerHTML('laterality.input', cases);
  }
  lateralityOnChange();

  Main.hide('gonext');
  Main.show('gocreate');
}

function goCreate()
{
  if (!step3IsValid()) return;
  
  Main.hide('gocreate');
  Main.hide('gocancel');
  var frm = document.forms['reggie'];

  caseInfo.laterality = Forms.getCheckedRadio(frm.laterality).value;
  caseInfo.reasonIfNoSpecimen = frm.reasonIfNoSpecimen.value;
  caseInfo.pad = frm.pad.value;

  for (var i = 0; i < frm.laterality.length; i++)
  {
    frm.laterality[i].disabled = true;
  }
  frm.reasonIfNoSpecimen.disabled = true;
  frm.pad.disabled = true;

  var submitInfo = new Object();
  submitInfo.patientInfo = patientInfo;
  submitInfo.caseInfo = caseInfo;

  //setInnerHTML('debug', JSON.stringify(submitInfo));
  
  var request = Ajax.getXmlHttpRequest();
  var url = 'PersonalRegistration.servlet?ID=<%=ID%>&cmd=Create';
  request.open("POST", url, false);
  request.setRequestHeader("Content-Type", "application/json");
  request.send(JSON.stringify(submitInfo));

  //setInnerHTML('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 setInnerHTML(id, html)
{
  var tag = document.getElementById(id);
  if (!tag) alert('No tag with id='+id);
  tag.innerHTML = html;
}

function setInputStatus(prefix, message, clazz)
{
  var tag = document.getElementById(prefix + '.status');
  tag.className = 'status ' + clazz;
  
  setInnerHTML(prefix + '.message', message);
  if (message)
  {
    Main.showInline(prefix + '.message');
  }
  else
  {
    Main.hide(prefix + '.message');
  }
}

function setFatalError(message)
{
  setInnerHTML('errorMessage', message);
  Main.show('errorMessage');
  Main.hide('gonext');
  Main.hide('gocancel');
  Main.show('gorestart');
}

function goRestart(force)
{
  if (!force && !confirm('Cancel this registration?')) return;
  location.href = location.href;
}
</script>
<style>

.stepform
{
  margin-left: 20px;
  border: 1px solid #999999;
  width: 800px;
  table-layout: fixed;
}

.stepno 
{
  width: 20px;
  font-size: 20px;
  font-weight: bold;
  color: #E0E0E0;
  background: #555577;
  vertical-align: top;
  text-align: center;
}

.steptitle
{
  width: 780px;
  color: #333377;
  background: #E0E0E0;
  font-weight: bold;
  padding: 1px 4px 1px 4px;
  border-bottom: 1px solid #999999;
}

.nextstep
{
  width: 780px;
  color: #333377;
  background: #E0E0E0;
  font-weight: bold;
  padding: 1px 4px 1px 4px;
  border-top: 1px solid #999999;
}

.stepfields
{
  width: 780px; 
}

.stepfields .prompt
{
  width: 150px;
  font-weight: bold;
  padding: 1px 2px 1px 2px;
}

.stepfields .input
{
  width: 250px;
  padding: 1px 2px 1px 2px;
}

.stepfields .status
{
  width: 30px;
  padding: 1px 2px 1px 2px;
}

.stepfields .help
{
  background: #e0e0e0;
  width: 350px;
  font-style: italic;
  padding: 1px 2px 1px 2px;
}

.stepfields .message
{
  color: #cc0000;
  font-weight: bold;
  padding-right: 6px;
}

.status.invalid:before
{
  content: url('../../images/error.gif');
}
.status.warning:before
{
  content: url('../../images/warning.gif');
}
.status.valid:before
{
  content: url('../../images/ok.gif');
}
.success ul
{
  list-style-image: url('../../images/ok.gif');
}
</style>
</base:head>
<base:body onload="init()">

  <p:path style="margin-top: 20px; margin-bottom: 10px;">
    <p:pathelement title="Reggie" href="<%="index.jsp?ID="+ID%>" />
    <p:pathelement title="Personal information registration" />
  </p:path>

  <%
  if (sc.getActiveProjectId() == 0)
  {
    %>
    <base:note type="warning" 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.
    </base:note>
    <%
  }
  %>

  <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 and Personal Number</td>
  </tr>
  <tr>
    <td class="stepfields">
      <table border="0" cellspacing="0" cellpadding="0" width="100%">
      <tr valign="top">
        <td class="prompt">Case name</td>
        <td class="input"><input type="text" name="caseName" 
          size="18" maxlength="12" onblur="caseNameOnChange()" onkeypress="focusOnEnter(event, 'personalNumber')"></td>
        <td class="status" id="case.status"></td>
        <td class="help"><span id="case.message" class="message" style="display: none;"></span>The case (barcode) associated with this patient.</td>
      </tr>
      <tr>
        <td class="prompt">Personal number</td>
        <td class="input"><input type="text" name="personalNumber" 
          size="18" maxlength="12" onkeyup="personalNumberOnChange()" onkeypress="goNextOnTabOrEnter(event)"></td>
        <td class="status" id="pnr.status"></td>
        <td class="help"><span id="pnr.message" class="message" style="display: none;"></span>(YYYYMMDDZZZZ)</td>
      </tr>
      </table>
    </td>
  </tr>
  </table>

  <!-- 2. New patient registration -->
  <div id="newPatientSection" style="display: none;">
  <p>
  <table border="0" cellspacing="0" cellpadding="0" class="stepform">
  <tr>
    <td rowspan="2" class="stepno">2</td>
    <td class="steptitle">New patient: Enter all names</td>
  </tr>
  <tr>
    <td class="stepfields">
      <table border="0" cellspacing="0" cellpadding="0" width="100%">
      <tr>
        <td class="prompt">Patient code</td>
        <td class="input"><input type="text" name="patientCode" 
          value="" size="18" maxlength="12" 
          onkeypress="focusOnEnter(event, 'familyName')"></td>
        <td class="status" id="patientCode.status"></td>
        <td class="help"><span id="patientCode.message" class="message" style="display: none;"></span></td>
      </tr>
      <tr valign="top">
        <td class="prompt">Family name</td>
        <td class="input"><input type="text" name="familyName" 
          value="" size="35" maxlength="255"
          onkeypress="focusOnEnter(event, 'allFirstNames')"></td>
        <td class="status" id="familyName.status"></td>
        <td class="help"><span id="familyName.message" class="message" style="display: none;"></span>Keep hyphens, keep åäö, replace all special accented letters [e.g. éèü etc] with standard alphabet character.</td>
      </tr>
      <tr valign="top">
        <td class="prompt">All first names</td>
        <td class="input"><input type="text" name="allFirstNames" 
          size="35" maxlength="255" onkeypress="goNextOnTabOrEnter(event)"></td>
        <td class="status" id="allFirstNames.status"></td>
        <td class="help"><span id="allFirstNames.message" class="message" style="display: none;"></span>Type all names, see FamilyName comment on valid characters.</td>
      </tr>
      <tr>
        <td class="prompt">Gender</td>
        <td class="input" id="new.gender"></td>
        <td class="status"></td>
        <td class="help"></td>
      </tr>
      <tr>
        <td class="prompt">Date of birth</td>
        <td class="input" id="new.dateOfBirth"></td>
        <td class="status"></td>
        <td class="help"></td>
      </tr>
      </table>
    </td>
  </tr>
  </table>
  </div>
  
  <!-- 2b. Existing patient -->
  <div id="existingPatientSection" style="display: none;">
  <p>
  <table border="0" cellspacing="0" cellpadding="0" class="stepform">
  <tr>
    <td rowspan="2" class="stepno">2</td>
    <td class="steptitle">Existing patient: Verify names</td>
  </tr>
  <tr>
    <td class="stepfields">
      <table border="0" cellspacing="0" cellpadding="0" width="100%">
      <tr>
        <td class="prompt">Patient code</td>
        <td class="input" id="existing.patientCode"></td>
        <td class="status"></td>
        <td class="help"></td>
      </tr>
      <tr>
        <td class="prompt">Family name</td>
        <td class="input" id="existing.familyName"></td>
        <td class="status"></td>
        <td class="help"></td>
      </tr>
      <tr>
        <td class="prompt">All first names</td>
        <td class="input" id="existing.allFirstNames"></td>
        <td class="status"></td>
        <td class="help"></td>
      </tr>
      <tr>
        <td class="prompt">Gender</td>
        <td class="input" id="existing.gender"></td>
        <td class="status"></td>
        <td class="help"></td>
      </tr>
      <tr>
        <td class="prompt">Date of birth</td>
        <td class="input" id="existing.dateOfBirth"></td>
        <td class="status"></td>
        <td class="help"></td>
      </tr>
      </table>
    </td>
  </tr>
  </table>
  </div>


  <!-- 3. Case registration -->
  <div id="caseSection" style="display: none;">
  <p>
  <table border="0" cellspacing="0" cellpadding="0" class="stepform">
  <tr>
    <td rowspan="2" class="stepno">3</td>
    <td class="steptitle">About this case</td>
  </tr>
  <tr>
    <td class="stepfields">
      <table border="0" cellspacing="0" cellpadding="0" width="100%">
      <tr valign="top">
        <td class="prompt" id="laterality.prompt">Laterality</td>
        <td class="input" id="laterality.input">
          <input type="radio" name="laterality" value="LEFT" onclick="lateralityOnChange()">LEFT<br>
          <input type="radio" name="laterality" value="RIGHT" onclick="lateralityOnChange()">RIGHT<br>
          <input type="radio" name="laterality" value="" checked onclick="lateralityOnChange()"><i>unknown</i>
        </td>
        <td class="status" id="laterality.status"></td>
        <td class="help"><span id="laterality.message" class="message" style="display: none;"></span></td>
      </tr>
      <tr valign="top">
        <td class="prompt">Specimen tubes</td>
        <td class="input" id="specimenTubes"><i>not found</i></td>
        <td class="status" id="specimenTubes.status"></td>
        <td class="help"><span id="specimenTubes.message" class="message" style="display: none;"></span>The specimen tube(s) associated with this case.</td>
      </tr>
      <tr id="padSection" valign="top">
        <td class="prompt">PAD</td>
        <td class="input"><input type="text" name="pad" 
          value="" size="35" maxlength="255"
          onkeypress="focusOnEnter(event, 'reasonIfNoSpecimen')"></td>
        <td class="status"></td>
        <td class="help"></td>
      </tr>
      <tr id="reasonIfNoSpecimenSection" valign="top">
        <td class="prompt">Reason if no specimen</td>
        <td class="input"><textarea rows="3" cols="30" name="reasonIfNoSpecimen" value=""></textarea></td>
        <td class="status"></td>
        <td class="help">Comment why there was no specimen tubes in the delivery.</td>
      </tr>
      </table>
    </td>
  </tr>
  </table>
  </div>

  <div class="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;">
  <tr>
    <td><base:button id="gocancel" title="Cancel" onclick="goRestart(false)" style="display: none;"/></td>
    <td><base:button id="gonext" title="Next" image="gonext.gif" onclick="goNext()"/></td>
    <td><base:button id="gocreate" title="Create" image="gonext.gif" onclick="goCreate()" style="display: none;"/></td>
    <td><base:button id="gorestart" title="Restart" image="goback.gif" onclick="goRestart(true)" style="display: none;"/></td>
  </tr>
  </table>
  </form>

  <pre>
  <div id="debug"></div>
  </pre>
  
</base:body>
</base:page>
<%
}
finally
{
  if (dc != null) dc.close();
}
%>