source: extensions/net.sf.basedb.reggie/trunk/resources/partitionform.jsp @ 1430

<%@ page
  pageEncoding="UTF-8"
  session="false"
  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" 
%>
<%@ 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">
  <link rel="stylesheet" type="text/css" href="reggie.css">
  <script language="JavaScript" src="reggie.js" type="text/javascript" charset="UTF-8"></script>
  
  
<script language="JavaScript">
var debug = false;
var currentStep = 1;

var specimenTubes = null;
var selectedTubes = null;

var partitionDateIsValid = false;

var spWeightsAreValid;
var apWeightsAreValid;
var hisWeightsAreValid;
var oneOrMoreWeightsAreSet;
var nofPiecesAreValid;

function init()
{
  var frm = document.forms['reggie'];
  var selectList = frm.tubesSelect;
  getSpecimenTubes();
  
  var specimenTubeOptions = '';
  if (specimenTubes != null && specimenTubes.length > 0)
  {
    for (var i=0;i<specimenTubes.length;i++)
    {
      var tube = specimenTubes[i];
      selectList.options[selectList.length] = new Option(tube.name, tube.name);
    }
  }
  else
  {
    selectList.disabled = true;
    Main.hide('gonext');    
    setInputStatus('tubes','No tubes available for partition', 'invalid')
  } 
}

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

function step2IsValid()
{
  return partitionDateIsValid;
}

function step3IsValid()
{
  for (var i=0; i<spWeightsAreValid.length; i++)
  {
    
    if (spWeightsAreValid[i] == false ||
        apWeightsAreValid[i] == false ||
        hisWeightsAreValid[i] == false ||
        nofPiecesAreValid[i] == false)
    {
      return false;
    }
    if (oneOrMoreWeightsAreSet[i] == false)
    {
      return false;
    }
  } 
  return true;
}

function gotoStep2()
{
  var frm = document.forms['reggie'];
  var selectList = frm.tubesSelect;
  selectedTubes = new Array();
  for (var i=0;i<selectList.length; i++)
  {
    if (selectList.options[i].selected)
      selectedTubes.push(specimenTubes[i]);
  }   
  
  if (selectedTubes.length == 0)
  {
    setInputStatus('tubes', 'Missing', 'invalid');
    return;
  }
  
  setInputStatus('tubes', '', 'valid');
  // Change section
  frm.tubesSelect.disabled = true;
  
  Main.show('partitionSection');
  Main.show('gocancel');
  var currentTime = new Date();
  frm.partitionDate.value = currentTime.getFullYear().toString()+(currentTime.getMonth()+1).toString()+currentTime.getDate().toString();
  frm.partitionDate.setSelectionRange(0,frm.partitionDate.value.length);
  frm.partitionDate.focus();
  currentStep = 2;
}

function gotoStep3()
{
  var frm = document.forms['reggie'];
  frm.partitionDate.disabled = true;  
    
  var inputWeightHtml;  
  if (selectedTubes.length > 0)
  {
    spWeightsAreValid = Array();
    apWeightsAreValid = Array();
    hisWeightsAreValid = Array();
    nofPiecesAreValid = Array();
    oneOrMoreWeightsAreSet = Array();
    for (var i=0;i<selectedTubes.length;i++)
    {
      spWeightsAreValid[i] = true;
      apWeightsAreValid[i] = true;
      hisWeightsAreValid[i] = true;
      nofPiecesAreValid[i] = false;
      oneOrMoreWeightsAreSet[i] = false;
    }
        
    inputWeightHtml = '';

    var spTitle = 'SpWeight<br>';
    var apTitle = 'ApWeight<br>';
    var hisTitle = 'HisWeight<br>';
    var nofTitle = 'NofPieces<br>';
    var appearanceTitle = 'Appearance<br>';
    var necrosisTitle = 'Necrosis%<br>';
    var fatTitle = 'Fat%<br>';
    var colouredTitle = 'Coloured<br>';
    var bloodyTitle = 'Bloody<br>';
    
    var appearanceOptions = '<option selected ></option>';  
    appearanceOptions += '<option value="HOMOGENOUS">Homogenous</option>';
    appearanceOptions += '<option value="HETEROGENOUS">Heterogenous</option>';
    
    var necrosisOptions = '<option selected value="0">0</option>';
    necrosisOptions += '<option value="20">20</option>';
    necrosisOptions += '<option value="40">40</option>';
    necrosisOptions += '<option value="60">60</option>';
    necrosisOptions += '<option value="80">80</option>';
    necrosisOptions += '<option value="100">100</option>';
    
    var fatOptions = '<option selected value=0>0</option>';
    fatOptions += '<option value=20>20</option>';
    fatOptions += '<option value=40>40</option>';
    fatOptions += '<option value=60>60</option>';
    fatOptions += '<option value=80>80</option>';
    fatOptions += '<option value=100>100</option>';
    
    for (var i=0;i<selectedTubes.length; i++)
    {
      var tube = selectedTubes[i];
      var nextStep = i<(selectedTubes.length-1) ? 'focusOnEnter(event, \'bloody'+(i+1)+'\')' : '';
      
      inputWeightHtml += '<tr>';
      inputWeightHtml += '<td rowspan=2 class=prompt>'+tube.name;
      // Only show box information if there is something show.      
      if (tube.row != null && tube.column != null)
      {
        inputWeightHtml += ' ['+tube.box+'&nbsp;'+tube.row+tube.column+']';
      }
      inputWeightHtml += '</td>';
      
      inputWeightHtml += '<td style="width:400px;">';
      inputWeightHtml += '<table style="width:100%"><tr>';      
      inputWeightHtml += '<td>'+bloodyTitle+'<input type=checkbox onkeypress="checkOnNumber(event, this);focusOnEnter(event, \'appearance'+i+'\')" onfocus="messageOnFocus(0,'+i+')" name=bloody'+i+' /></td>';
      inputWeightHtml += '<td>'+appearanceTitle+'<select name=appearance'+i+' onfocus="messageOnFocus(1,'+i+')" onkeypress="focusOnEnter(event, \'necrosis'+i+'\')">'+appearanceOptions+'</select></td>';
      inputWeightHtml += '<td>'+necrosisTitle+'<select name=necrosis'+i+' onfocus="messageOnFocus(2,'+i+')" onkeypress="focusOnEnter(event, \'fat'+i+'\')">'+necrosisOptions+'</select></td>';  
      inputWeightHtml += '<td>'+fatTitle+'<select name=fat'+i+' onfocus="messageOnFocus(3,'+i+')" onkeypress="focusOnEnter(event, \'coloured'+i+'\')">'+fatOptions+'</select></td>';
      inputWeightHtml += '<td>'+colouredTitle+'<input type=checkbox name=coloured'+i+' onfocus="messageOnFocus(4,'+i+')" onkeypress="checkOnNumber(event, this);focusOnEnter(event, \'nofPieces'+i+'\')" /></td>'
      inputWeightHtml += '<td>'+nofTitle+'<input name="nofPieces'+i+'" onfocus="messageOnFocus(5,'+i+')" onblur="nofPiecesOnChange('+i+')" onkeypress="focusOnEnter(event, \'spWeight'+i+'\')" size=2 /></td>';
      inputWeightHtml += '<td>'+spTitle+'<input name="spWeight'+i+'" onfocus="messageOnFocus(6,'+i+')" onblur="spWeightOnChange('+i+')" onkeypress="focusOnEnter(event, \'hisWeight'+i+'\')" size=2 /></td>';
      inputWeightHtml += '<td>'+hisTitle+'<input name="hisWeight'+i+'" onfocus="messageOnFocus(7,'+i+')" onblur="hisWeightOnChange('+i+')" onkeypress="focusOnEnter(event, \'apWeight'+i+'\')" size=2 /></td>';
      inputWeightHtml += '<td>'+apTitle+'<input name="apWeight'+i+'" onfocus="messageOnFocus(8,'+i+')" onblur="apWeightOnChange('+i+')" onkeypress="'+nextStep+'" size=2 /></td>';      
      inputWeightHtml += '</tr>';
      inputWeightHtml += '</table>';
      inputWeightHtml += '</td>';
      inputWeightHtml += '<td rowspan=2 class="status" id="'+i+'.status"></td>';      
      inputWeightHtml += '</tr>';
      
      inputWeightHtml += '<tr>';
      inputWeightHtml += '<td style="width:400px;" class="help"><span class="message" id="'+i+'.message"></span><span id="'+i+'.help"></span></td>';      
      inputWeightHtml += '</tr>';     
      inputWeightHtml += '<tr><td>&nbsp;</td></tr>';
    }
    setInnerHTML('weightInputs', inputWeightHtml);
  } 
  Main.show('weightSection');
  Main.hide('gonext');
  Main.show('gocreate');
  frm.bloody0.focus();  
}

function checkOnNumber(event, element)
{
  if (event.charCode == 48)
  {
    element.checked = false;
  }
  else if (event.charCode == 49)
  {
    element.checked = true;
  }
  return true;
}

function messageOnFocus(order, tubeIndex)
{ 
  var helpMessage;
  switch(order)
  {
    case 0:
      helpMessage = 'Check this if the partition is bloody. Unchecked is default.';
      break;
    case 1:
      helpMessage = 'Select appearance. Empty is default';
      break;
    case 2:
      helpMessage = 'Select percentage of necrosis. \'0\' is default.';
      break;
    case 3:
      helpMessage = 'Select percentage of fat. \'0\' is default.';
      break;
    case 4:
      helpMessage = 'Check this if the partition is coloured. Unchecked is default.';
      break;
    case 5:
      helpMessage = 'Number of pieces in this partition.';
      break;
    case 6:
      helpMessage = 'Sp weight in [mg].';
      break;
    case 7:
      helpMessage = 'His weight in [mg].';
      break;
    case 8:
      helpMessage = 'Ap weight in [mg].';
      break;
    default:
      helpMessage='&nbsp;';
  }
  for (var i=0;i<selectedTubes.length;i++)
  {
    if (i!=tubeIndex) setInnerHTML(i+'.help', '&nbsp;')
  }
  setInnerHTML(tubeIndex+'.help', helpMessage); 
}

function updateInputStatus(tubeIndex)
{
  var frm = document.forms['reggie'];
  if(nofPiecesAreValid[tubeIndex] == false)
  {
    setInputStatus(tubeIndex, 'NofPieces is invalid.', 'invalid');
    frm.elements['nofPieces'+tubeIndex].focus();
    return ;
  }
  if (spWeightsAreValid[tubeIndex] == false)
  {
    setInputStatus(tubeIndex, 'SpWeight is invalid.','invalid');
    return;
  }
  if(hisWeightsAreValid[tubeIndex] == false)
  {
    setInputStatus(tubeIndex, 'HisWeight is invalid.', 'invalid');
    return;
  }
  if(apWeightsAreValid[tubeIndex] == false)
  {
    setInputStatus(tubeIndex, 'APWeight is invalid.', 'invalid');
    return;
  }
  
  var spWeightValue = frm.elements['spWeight'+tubeIndex].value;
  var apWeightValue = frm.elements['apWeight'+tubeIndex].value;
  var hisWeightValue = frm.elements['hisWeight'+tubeIndex].value; 
  if (spWeightValue == '' && apWeightValue == '' && hisWeightValue == '')
  {
    oneOrMoreWeightsAreSet[tubeIndex] = false;
    setInputStatus(tubeIndex, 'No weight is defined.', 'invalid');
    return;
  }
  oneOrMoreWeightsAreSet[tubeIndex] = true; 
  setInputStatus(tubeIndex, '', 'valid');
}

function spWeightOnChange(tubeIndex)
{
  var inputName = 'spWeight'+tubeIndex;
  var frm = document.forms['reggie'];
  var weightInput = frm.elements[inputName].value;
  if (weightInput != '')
  {
    if (weightInput < 0)
    {
      spWeightsAreValid[tubeIndex] = false;
      updateInputStatus(tubeIndex);
      return;
    }
    if (weightInput == '0')
    {
      frm.elements[inputName].value = '';
    }
  } 
  spWeightsAreValid[tubeIndex] = true;
  updateInputStatus(tubeIndex);
}

function apWeightOnChange(tubeIndex)
{
  var inputName = 'apWeight'+tubeIndex;
  var frm = document.forms['reggie'];
  var weightInput = frm.elements[inputName].value;
  if (weightInput != '')
  {
    if (weightInput < 0)
    {
      apWeightsAreValid[tubeIndex] = false;
      updateInputStatus(tubeIndex);
      return;
    } 
    if (weightInput == '0')
    {
      frm.elements[inputName].value = '';
    } 
  }
  apWeightsAreValid[tubeIndex] = true;
  updateInputStatus(tubeIndex);
}

function hisWeightOnChange(tubeIndex)
{
  var inputName = 'hisWeight'+tubeIndex;
  var frm = document.forms['reggie'];
  var weightInput = frm.elements[inputName].value;
  if (weightInput != '')
  {
    if (weightInput < 0)
    {
      hisWeightsAreValid[tubeIndex] = false;
      updateInputStatus(tubeIndex);
      return;
    }
    if (weightInput == '0')
    {
      frm.elements[inputName].value = '';
    }   
  } 
  hisWeightsAreValid[tubeIndex] = true;
  updateInputStatus(tubeIndex);
}

function nofPiecesOnChange(tubeIndex)
{
  var inputName = 'nofPieces'+tubeIndex;
  var frm = document.forms['reggie'];
  var fieldInput = frm.elements[inputName].value;
  if (fieldInput != '')
  {
    if (fieldInput < 0)
    {
      nofPiecesAreValid[tubeIndex] = false;
      updateInputStatus(tubeIndex);
      return;
    } 
    if (fieldInput == '0')
    {
      fieldInput = '';      
      frm.elements[inputName].value = fieldInput;
    }
  } 
  if (fieldInput == '')
  {
    nofPiecesAreValid[tubeIndex] = false;
    updateInputStatus(tubeIndex);
    return;
  }
  nofPiecesAreValid[tubeIndex] = true;
  updateInputStatus(tubeIndex);
}

function partitionDateOnBlur()
{
  var frm = document.forms['reggie'];
  var partitionDate = frm.partitionDate.value;
  var todaysDate = new Date();
  partitionDateIsValid = false;
  
  setInputStatus('partitionDate', '', '');
  
  if (partitionDate != '')
  {
    partitionDate = autoFillDate(partitionDate);
    frm.partitionDate.value = partitionDate;
    
    if (!Dates.isDate(partitionDate, 'yyyyMMdd'))
    {
      setInputStatus('partitionDate', 'Not a valid date', 'invalid');
      return;
    }   
    if (todaysDate < new Date(partitionDate.substring(0,4), new Number(partitionDate.substring(4,6)-1), partitionDate.substring(6)))
    {
      setInputStatus('partitionDate', 'Future dates are not valid','invalid');
      return;
    }
    setInputStatus('partitionDate','','valid');   
  }
  else
  {
    setInputStatus('partitionDate', 'Missing', 'invalid');
    return;
  }
  partitionDateIsValid = true;
}

function getSpecimenTubes()
{
  var frm = document.forms['reggie']; 
  
  var request = Ajax.getXmlHttpRequest();
  var url = 'PartitionRegistration.servlet?ID=<%=ID%>&cmd=GetSpecimenTubes';    
  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;
  } 
  specimenTubes = response.tubeInfo.specimenTubes;
}

function goCreate()
{
  if (!step3IsValid()) return;
  
  Main.hide('gocancel');
  Main.hide('gocreate');
  
  var frm = document.forms['reggie'];
  var tubeInfo = new Object();
  
  var specimens = selectedTubes;
  var nofTubes = specimens.length;
  var partitionDateValue = frm.elements['partitionDate'].value;
  tubeInfo.partitionDate = partitionDateValue;
  for (var i=0; i<nofTubes; i++)
  {
    frm.elements['spWeight'+i].disabled = true;
    frm.elements['apWeight'+i].disabled = true;
    frm.elements['hisWeight'+i].disabled = true;
    frm.elements['nofPieces'+i].disabled = true;
    frm.elements['bloody'+i].disabled = true;
    frm.elements['appearance'+i].disabled = true;
    frm.elements['necrosis'+i].disabled = true;
    frm.elements['fat'+i].disabled = true;
    frm.elements['coloured'+i].disabled = true;
        
    var specimenTube = specimens[i];
    
    var spWeightValue = frm.elements['spWeight'+i].value; 
    if (spWeightValue != '') specimenTube.spWeight = spWeightValue;
    var apWeightValue = frm.elements['apWeight'+i].value;
    if (apWeightValue != '') specimenTube.apWeight = apWeightValue;
    var hisWeightValue = frm.elements['hisWeight'+i].value;
    if (hisWeightValue != '') specimenTube.hisWeight = hisWeightValue;
    var nofPiecesValue = frm.elements['nofPieces'+i].value;
    if (nofPiecesValue != '') specimenTube.nofPieces = nofPiecesValue;
    
    var partitionComment = '';  
    var appearanceElement = frm.elements['appearance'+i];
    var necrosisElement = frm.elements['necrosis'+i];
    var fatElement = frm.elements['fat'+i];
    var appearanceValue = appearanceElement.options[appearanceElement.selectedIndex].value;   
    var necrosisValue = necrosisElement.options[necrosisElement.selectedIndex].value;
    var fatValue = fatElement.options[fatElement.selectedIndex].value;
    
    // Generate partition comment string
    if (frm.elements['bloody'+i].checked == true) partitionComment += 'BLOODY';
    if (appearanceValue != '') partitionComment += (partitionComment.length>0 ? ';' : '') + appearanceValue;
    if (necrosisValue != '0') partitionComment += (partitionComment.length>0 ? ';' : '') + 'NECROSIS'+necrosisValue+'%';
    if (fatValue != '0') partitionComment += (partitionComment.length>0 ? ';' : '') + 'FAT'+fatValue+'%';
    if (frm.elements['coloured'+i].checked == true) partitionComment += partitionComment.length>0 ? ';COLOURED' : 'COLOURED';
    
    specimenTube.operatorPartitionComment = partitionComment.length > 0 ? partitionComment : null;
    
    specimens[i] = specimenTube;    
  } 
  tubeInfo.specimens = specimens;
  var submitInfo = new Object();
  submitInfo.tubeInfo = tubeInfo;
  
  if (debug) Main.debug(JSON.stringify(caseInfo));
  
  var request = Ajax.getXmlHttpRequest();
  var url = 'PartitionRegistration.servlet?ID=<%=ID%>&cmd=CreatePartitions';
  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');
}
</script>


</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="Partition 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 name-->
  <table border="0" cellspacing="0" cellpadding="0" class="stepform">
  <tr>
    <td rowspan="3" class="stepno">1</td>
    <td class="steptitle">Select specimen tubes</td>
  </tr>
  <tr>
    <td class="stepfields">
      <table border="0" cellspacing="0" cellpadding="0" width="100%">
      <tr valign="top">
        <td class="prompt">Specimen tubes</td>
        <td class="input"><select style="width:50%" name="tubeSelect" id="tubesSelect" multiple="multiple" size="5" onkeypress='doOnTab(event, goNext)'></select></td>
        <td class="status" id="tubes.status"></td>
        <td class="help"><span id="tubes.message" class="message" style="display: none;"></span>Select specimen tubes to include in the partition.</td>
      </tr>
      </table>
    </td>
  </tr>
  </table>
  
  <!-- 2. General partition information -->
  <div id="partitionSection" style="display: none;">
    <p></p>
    <table border="0" cellspacing="0" cellpadding="0" class="stepform">
    <tr>
      <td rowspan="2" class="stepno">2</td>
      <td class="steptitle">Enter partition information</td>
    </tr>
    <tr>
      <td class="stepfields">
        <table border="0" cellspacing="0" cellpadding="0" width="100%">
        <tr valign="top">
          <td class="prompt">Partition date</td>
          <td class="input"><input type="text" name="partitionDate" 
             onkeypress="doOnTabOrEnter(event, goNext)" size="12" maxlength="10" onBlur="partitionDateOnBlur()"></td>
          <td class="status" id="partitionDate.status"></td>
          <td class="help"><span id="partitionDate.message" class="message" style="display: none;"></span>The date when the partition was done.</td>
        </tr>       
        </table>
      </td>
    </tr>
    </table>
  </div>
  
  <div id="weightSection" style="display:none;">
    <p></p>
    <table border="0" cellspacing="0" cellpadding="0" class="stepform">
    <tr>
      <td rowspan="2" class="stepno">3</td>
      <td class="steptitle">Enter weight information</td>   
    </tr>
    <tr>
      <td class="stepfields">
        <table id="weightInputs" border="0" cellspacing="0" cellpadding="0" width="100%"></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;" 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="gonext.gif" onclick="goNext(true)"/></td>
      <td><base:button id="gocreate" title="Create" image="gonext.gif" onclick="goCreate()" style="display: none;"/></td>
      <td><base:button id="goupdate" title="Update" 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>
      <td id="gonext.message" class="message"></td>
    </tr>
  </table>
  </form>
  
</base:body>
</base:page>
<%
}
finally
{
  if (dc != null) dc.close();
}
%>