#TimeTrackingTMPL000001
<tmpl_if session.var.adminOn>
	<p><tmpl_var controls></p>
</tmpl_if>

<tmpl_if displayTitle>
	<h2><tmpl_var title></h2>
</tmpl_if>

<tmpl_if description>
	<div class="fontSettings">
		<tmpl_var description>
	</div>
</tmpl_if>

<script language="JavaScript">
   var nextRowNum = <tmpl_var time.report.rows.total>;
   var projectTasks = <tmpl_var project.task.array>  //Do not put a semi colon at the end of this.  The app does it
   
   //-----------------------------------------------------------------------------------
   function changeOptions(proj,task) {
      var projId = proj.value;
	  //Remove all options from task list except first one
	  var optLen = task.options.length;
	  while (task.options.length > 1) {
		 var elem = task.options[1];
		 task.removeChild(elem);
	  }
	  
	  if(projId != "") {
	     //Add new options
	     var array = projectTasks[projId];
         for (var word in array) {
            var opt = document.createElement("option");
	        opt.setAttribute("value",word);
	        opt.appendChild(document.createTextNode(array[word]));
            task.appendChild(opt);
         }
      }
	  
	  //Fix IE Bug which causes dymamic repopulation to fail
	  var newtask = task;
	  var col = task.parentNode;
	  col.removeChild(task);
	  col.appendChild(newtask);
	  
   }
   
   //-----------------------------------------------------------------------------------
   function recalcHours() {
	   var newHours = 0;
	   var rows = document.getElementById("ttbody");
	   var rowLen = rows.childNodes.length;
	   
	   for(var i = 0; i <= rowLen; i++) {
	      var row = rows.childNodes[i];
		  if(row && row.id && row.id.indexOf("row") > -1) {
		     var rowId = row.id;
		     var idPart = rowId.split("_");
		     var rowNum = idPart[1];
		     var hourElem = document.getElementById("hours_"+rowNum+"_formId");
		     if (hourElem) {
		        newHours += parseFloat(hourElem.value);
	         }
	      }
	   }
	   document.getElementById('totalHours').innerHTML = newHours;
   }

   //-----------------------------------------------------------------------------------   
   function getTarget(e) {
      var targ;
      if (!e) var e = window.event;
      if (e.target) targ = e.target;
      else if (e.srcElement) targ = e.srcElement;
      if (targ.nodeType == 3) // defeat Safari bug
         targ = targ.parentNode;
      return targ
   }  

   //-----------------------------------------------------------------------------------    
   function removeRow(e) {
      if(!e) e = window.event || window.Event;
	  var eleId = e;
      if(typeof(e) == "object") {
	    var targ = getTarget(e);
		var eleId = targ.parentNode.parentNode.id;
	  } 
	  var row = document.getElementById(eleId);
	  var ttbody = document.getElementById("ttbody");
      var timeRowCount = getTimeRowCount();
	  if(timeRowCount > 1) {
	     ttbody.removeChild(row);
	     recalcHours();
		 return;
	  }
	  alert("<tmpl_var js.alert.removeRow.error>");
   }
   
   //-----------------------------------------------------------------------------------   
   function getTimeRowCount() {
      var rows = document.getElementById("ttbody");
      var rowLen = rows.childNodes.length;
	  var count = 0;
	  
	  for(var i = 0; i <= rowLen; i++) {
	     var row = rows.childNodes[i];
		 //Skip Text and Attribute Nodes
		 if(row && row.id && row.id.indexOf("row") > -1) count++;
	  }
	  return count;
   }
      
   //-----------------------------------------------------------------------------------  
   function addRow() {
      var rowx = document.getElementById('row_x');
	  var row = rowx.cloneNode(true);
	  //Insert row into the right place
	  var ttbody = document.getElementById('ttbody');
	  ttbody.appendChild(row);
	  
	  row.id='row_'+nextRowNum;
	  //Task Entry Id
	  var rowLen = row.childNodes.length;
	  for ( var i = 0; i < rowLen; i++) {
	     var td = row.childNodes[i];
		 var colLen = td.childNodes.length;
		 for ( var j = 0; j < colLen; j++) {
		    var node = td.childNodes[j];
//			alert(node + " " + node.nodeType);
			//Skip Text and Attirbute Node Types
			if(node.nodeType != 1) continue;
			//alert(node + " " + node.tagName);
			var nodeName = node.name;
				
			//Handle Image Node
			if(node.tagName == "IMG") {
			   var newImg = document.createElement('img');
			   newImg.setAttribute("style","cursor:pointer");
			   newImg.src = "http://frank1.plainblack.net:8084/extras/wobject/TimeTracking/delete.gif";
			   newImg.onclick = removeRow;
			   
			   childLen = node.childNodes.length;
			  // alert("removing this node");
			   td.removeChild(node);
			   
			  // alert("appending new node: " + newImg);
			   td.appendChild(newImg);
			   continue;
			}
			
			//Skip Nodes that have no names
			if(nodeName == "") continue;
			var nameParts = nodeName.split("_");
			var colName = nameParts[0];
			//Set New Node Name
			node.name = colName + "_" + nextRowNum;
			//Set New Node ID
			node.id = colName + "_" + nextRowNum + "_formId";
			
			if(colName == "projectId") {
			   node.onchange = new Function('changeOptions(this,document.getElementById("taskId_'+nextRowNum+'_formId"));'); 
			} 
		 }   
	  
	  }
	  nextRowNum++;
   }
   
   //-----------------------------------------------------------------------------------   
   function validateForm(form) {
      //Set Row Total
      form.rowTotal.value = (nextRowNum - 1);
	  if(parseFloat(document.getElementById('totalHours').innerHTML) > 168) {
	     alert("<tmpl_var js.alert.validate.hours.error>");
		 return false;
	  }
	  
	  var rows = document.getElementById("ttbody");
      var rowLen = rows.childNodes.length;
	  var isValid = true;
	  	  
	  for(var i = 0; i <= rowLen; i++) {
	     var row = rows.childNodes[i];
		 if(row && row.id && row.id.indexOf("row") > -1) {
		    var rowId = row.id;
		    var idPart = rowId.split("_");
		    var rowNum = idPart[1];
		    var taskDateElem = document.getElementById("taskDate_"+rowNum+"_formId");
			taskDateElem.style.background='#FFFFFF';
			var projectElem = document.getElementById("projectId_"+rowNum+"_formId");
			projectElem.style.background='#FFFFFF';
			var taskElem = document.getElementById("taskId_"+rowNum+"_formId");
			taskElem.style.background='#FFFFFF';
			var hourElem = document.getElementById("hours_"+rowNum+"_formId");
			hourElem.style.background='#FFFFFF';
			//Uncomment below if you wish comments to be required
			//var comments = document.getElementById("hours_"+rowNum+"_formId");
			//comments.style.background='#FFFFFF';
			
			//Uncomment below if you wish comments to be required
			//if(taskDateElem.value != "" || projectElem.value != "" || taskElem.value != "" || hourElem.value != "" || comments.value != "" ) {
			//Comment below if you wish comments to be required
			if(taskDateElem.value != "" || projectElem.value != "" || taskElem.value != "" || (hourElem.value != "" && hourElem.value != "0")) {
			   if(taskDateElem.value == "") {
				  taskDateElem.style.background='#FFFF99';
			      isValid = false;
			   } 
			   
			   if(projectElem.value == "") {
			      projectElem.style.background='#FFFF99';
			      isValid = false;
			   } 
			   
			   if(taskElem.value == "") {
			      taskElem.style.background='#FFFF99';
				  isValid = false;
			   } 
			   
			   if(hourElem.value == "" || hourElem.value == 0) {
			      hourElem.style.background='#FFFF99';
				  isValid = false;
			   }
			   
			   //Uncomment below if you wish comments to be required
			   /*if(comments.value == "") {
			      commnts.style.background='#FFFF99';
				  isValid = false;
			   }*/
			}
		 }
	  }
	  
	  if(!isValid) {
	     alert("<tmpl_var js.alert.validate.incomplete.error>");
		 return false;
	  }
	  
	  return true;
   }
   
</script>

<p><tmpl_if project.manage.url><a href="<tmpl_var project.manage.url>"><tmpl_var project.manage.label></a></tmpl_if></p>
<tmpl_var form.header>
<tmpl_var form.timetracker>
<tmpl_var form.footer>

~~~
	<style type="text/css">
		.timeTracking02 {			
			width:850px;
		}
		.timeTracking02 td {
			border:solid silver 1px;
			border-bottom:solid gray 1px;
			font-size:9pt;
			font-family:arial;			
		}
		tr.tt_title td {
			font-weight:bold;			
			background-color:#F0F0F0;
			border-style:none;
			font-size:11pt;
		}
		tr.tt_header td {
			font-weight:bold;
			text-align:center;		
		}
		tr.tt_empty td {
			border-style:none;
		}
		
		.pt-select {
	       font-weight: normal;
	       color: black;
  	       width: 175px;
        }
		.date-select {
		   font-weight: normal;
	       color: black;
  	       width: 100px;
		}
	</style>
