oqapi/webgui
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

solidified JavaScript methods to preserve style and avoid bugs

Browse source
This commit is contained in:
Frank Dillon 2006-06-02 15:37:57 +00:00
parent 5e2816edf3
commit 4e4a3fa51c
2 changed files with 378 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

68
docs/upgrades/templates-6.99.3/wgtemplate_default_tt_row.tmpl Normal file
View file

@ -0,0 +1,68 @@
#TimeTrackingTMPL000003
<table class="timeTracking02" cellpadding="3" cellspacing="0">
<tbody id="ttbody">
<tr class="tt_title" id="tt_title">
<td colspan="4" align="left"><tmpl_var time.report.header></td>
<td colspan="2" align="right"><tmpl_var time.report.hours.label> <strong style="color:red;" id="totalHours"><tmpl_var time.totalHours></strong></td>
</tr>
<tr class="tt_header" id="tt_header">
<td width="10%"><tmpl_var time.report.date.label></td>
<td width="20%"><tmpl_var time.report.project.label></td>
<td width="20%"><tmpl_var time.report.task.label></td>
<td width="10%"><tmpl_var time.report.hours.label></td>
<td width="40%"><tmpl_var time.report.comments.label></td>
<td>&#160;</td>
</tr>
<tmpl_loop time.entry.loop>
<tr id="<tmpl_var row.id>">
<td class="cell"><tmpl_var form.taskEntryId><tmpl_var form.date></td>
<td class="cell"><tmpl_var form.project></td>
<td class="cell"><tmpl_var form.task></td>
<td class="cell"><tmpl_var form.hours></td>
<td class="cell"><tmpl_var form.comments></td>
<td><img src="<tmpl_var extras>/delete.gif" border="0" onclick="removeRow('<tmpl_var row.id>')" style="cursor:pointer"/></td>
</tr>
</tmpl_loop>
<tr class="tt_empty" id="tt_empty">
<td colspan="6" style="border-top:solid gray 2px;">
<table width="100%" cellpadding="2" cellspacing="0">
<tr>
<td align="left"><a href="<tmpl_var report.lastWeek.url>" class="PM_blueLink"><b>&lsaquo;</b> Last Week</a></td>
<td align="right"><a href="<tmpl_var report.nextWeek.url>" class="PM_blueLink">Next Week <b>&rsaquo;</b></a></td>
</tr>
<tr>
<td colspan="2" style="border-bottom:solid #F0F0F0 1px;">&nbsp;</td>
</tr>
<tr>
<td style="width:60%;" align="left">
<tmpl_var time.report.complete.label><tmpl_var form.isComplete>
</td>
<td style="width:40%" align="right">
<input type="button" value="<tmpl_var time.add.row.label>" onclick="addRow();" /> &#160; <input type="submit" value="<tmpl_var time.save.label>" />
</td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
<tmpl_unless report.isComplete>
<table style="display:none" id="tt_table">
<tbody>
<tr id="<tmpl_var row.id>">
<td class="cell"><tmpl_var form.taskEntryId><tmpl_var form.date></td>
<td class="cell"><tmpl_var form.project></td>
<td class="cell"><tmpl_var form.task></td>
<td class="cell"><tmpl_var form.hours></td>
<td class="cell"><tmpl_var form.comments></td>
<td><img src="<tmpl_var extras>/delete.gif" border="0" onclick="removeRow()" style="cursor:pointer" /></td>
</tr>
</tbody>
</table>
</tmpl_unless>
~~~

310
docs/upgrades/templates-6.99.3/wgtemplate_default_tt_view.tmpl Normal file
View file

@ -0,0 +1,310 @@
#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) e = window.event || 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);
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 countRows(ttbody) {
var tbLen = ttbody.childNodes.length;
var rowCount = 0;
for (var i = (tbLen - 1); i >= 0; i--) {
if(ttbody.childNodes[i].nodeType != 1) continue;
rowCount++;
}
return rowCount;
}
//-----------------------------------------------------------------------------------
function addRow() {
var rowx = document.getElementById('row_x');
var ttbody = document.getElementById('ttbody');
//Insert row into the right place
var rowCount = countRows(ttbody); //Count actual rows for firefox b/c it's stupid
var row = ttbody.insertRow((rowCount-2));
row.id='row_'+nextRowNum;
//Task Entry Id
var rowLen = rowx.childNodes.length;
for ( var i = 0; i < rowLen; i++) {
if(rowx.childNodes[i].nodeType != 1) continue;
// create the cell
var clonetd = rowx.childNodes[i].cloneNode(true);
var td = row.appendChild(clonetd);
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 = "<tmpl_var extras>/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;
}
a.PM_blueLink {
color:#29587E;
text-decoration:none;
font-weight:bold;
}
a.PM_blueLink:hover {
text-decoration:underline;
}
.pt-select {
font-weight: normal;
color: black;
width: 175px;
}
.date-select {
font-weight: normal;
color: black;
width: 100px;
}
</style>