var currentTab = "Tab1";
var currentFolder = "Folder1";

// state variables to keep track of current tab and folder
// function to switch tabs and folders

function turnOn (newTab, newFolder) {
   if (currentTab != newTab) {
		// adjust the background colors for the tabs
		var thisTab = document.getElementById(newTab);
		thisTab.style.backgroundColor = "#666666";
		var oldTab = document.getElementById(currentTab);
		oldTab.style.backgroundColor = "#bdbdbd";
		oldTab.style.color = "#121212";

		// make the new tab the current tab
		currentTab = newTab;

		// adjust the visibility and background color for the folders
		var thisFolder = document.getElementById(newFolder);
		thisFolder.style.visibility = "visible";
		thisFolder.style.backgroundColor = "#e6e6e6";
		var oldFolder = document.getElementById(currentFolder);
		oldFolder.style.visibility = "hidden";

		// make the new folder the current folder
		currentFolder = newFolder;
	}
}

function showLayer (layerid) {
	var layer = document.getElementById(layerid);
	layer.style.visibility = "visible";
}

function hideLayer(layerid) {
	var layer = document.getElementById(layerid);
	layer.style.visibility = "hidden";
}

function minimize(id) {
	var divTag = document.getElementById(id);
	var contentDiv = divTag.getElementsByTagName("div")[1];
	contentDiv.style.display="none";
}

function maximize(id) {
	var divTag = document.getElementById(id);
	var contentDiv = divTag.getElementsByTagName("div")[1];
	contentDiv.style.display="block";
}

/*******************************************************************************/
/* This following functions show and hide boxes as called by CSS Id's or Names */
/*******************************************************************************/


/* This hides all tables except one which is the one which should be displayed - thereby, creating an effect of showing a long tables in page by page format */

function showTable(currentTableNumber, numberOfTables)
{
   var tableNumber, tableToShow, tableToHide, tableToDelete;
   for (tableNumber=1; tableNumber<(numberOfTables+1); tableNumber++) {
   	tableToDelete = 'table'+tableNumber;
   	tableToShow = 'table'+currentTableNumber;

   	if (tableNumber != currentTableNumber) {
   		tableToHide = document.getElementById (tableToDelete);
   		tableToHide.style.display = "none";
   	}
   	else {
   		tableToShow = document.getElementById (tableToShow);
   		tableToShow.style.display = "block";
   	}
   }
}

/* This hides all boxes except one which is the one which should be displayed. It is used in CreateInvoice.html */

function showBox(currentBoxNumber, numberOfBoxes)
{
   var boxNumber, boxToShow, boxToHide, boxToDelete;
   for (boxNumber=1; boxNumber<(numberOfBoxes+1); boxNumber++) {
   	boxToDelete = 'box'+boxNumber;
   	boxToShow = 'box'+currentBoxNumber;

   	if (boxNumber != currentBoxNumber) {
   		boxToHide = document.getElementById (boxToDelete);
   		boxToHide.style.display = "none";
   	}
   	else {
   		boxToShow = document.getElementById (boxToShow);
   		boxToShow.style.display = "block";
   	}
   }
}

/* This shows only one box and does not have any hiding functionality. It is used in CreateInvoice.html */

function showOneBox(currentBoxNumber)
{
   var boxToShow;
  	boxToShow = 'box'+currentBoxNumber;

  	boxToShow = document.getElementById (boxToShow);
  	boxToShow.style.display = "block";
}

/* This hides a box. It is used in CreateInvoice.html */

function hideOneBox(currentBoxNumber)
{
   var boxToHide;
  	boxToHide = 'box'+currentBoxNumber;

  	boxToHide = document.getElementById (boxToHide);
  	boxToHide.style.display = "none";
}

/* This shows only one box and does not have any hiding functionality. It is used in CreateInvoice.html */
/* It does the same thing as above but call box by name */

function showBoxByName(currentBoxName)
{
   var boxToShow;
  	boxToShow = currentBoxName;

  	boxToShow = document.getElementById (boxToShow);
  	boxToShow.style.display = "block";
}

/* This hides a box. It is used in CreateInvoice.html */

function hideBoxByName(currentBoxName)
{
   var boxToHide;
  	boxToHide = currentBoxName;

  	boxToHide = document.getElementById (boxToHide);
  	boxToHide.style.display = "none";
}



/*******************************************************************************************************************/
/* adding extra row in 'Payment Plan' in CreateInvoice.html - this adds a row of two columns - 'check no:', 'date' */
/*******************************************************************************************************************/


function addPaymentPlanRow()
{
	var str1 = '<div id="addPaymentPlanExtraRow"><div class="leftColumn"></div><div class="midColumn"><textLabel><span class="newline">Check No: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Amount</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width: 70px" value="98767-95"><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width: 50px" value=""></textLabel></div><div class="rightColumn"><textLabel><span class="newline">Date</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" value=""></textLabel></div></div>'

	document.getElementById("addPaymentPlanExtraRow").innerHTML=document.getElementById("addPaymentPlanExtraRow").innerHTML+str1

	cntr=cntr + 1;
}





/*******************************************************************************************************************************/
/* adding extra row in 'Final Payment Details' in CreateInvoice.html                                                           */ 
/* this adds a row of one column - 'cash', 'check', 'credit card', 'payment plan' and 'customer account' with appropriate data */
/*******************************************************************************************************************************/


function addCashPaymentDetailsRow()
{
	var str1 = '<div id="addFinalPaymentDetailsExtraRow"><div class="leftColumn"><textLabel><span class="newline">Cash &nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="$100.00"></textLabel><td class="celldataplain_border_right"><img src="../../images/tableEditWhite.png" border="0"></td></div><div id="box12"><div class="leftColumn"><textLabel><span class="newline">Finished&nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="Deposits $100.00" disabled = "true"></textLabel></div><div class="leftColumn"></div><div class="rightColumn"></div></div></div>'

	document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML=document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML+str1
}

function addCashPaymentDetailsEditableRow()
{
	var str1 = '<div id="addFinalPaymentDetailsExtraRow"><div class="leftColumn"><textLabel><span class="newline">Cash &nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="$100.00"><td class="celldataplain_border_right"><img src="../../images/tableEditWhite.png" border="0" onClick="javascript: addCashPaymentDetailsRow()"></td></div></textLabel></div></div>'

	document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML=document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML+str1
}

function addCheckPaymentDetailsRow()
{
	var str1 = '<div id="addFinalPaymentDetailsExtraRow"><div class="leftColumn"><textLabel><span class="newline">Check No: XXX-457 &nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="$100.00"  disabled="true"></textLabel><td class="celldataplain_border_right"><img src="../../images/tableDeleteWhite.png" border="0"></td></div><div id="box12"><div class="leftColumn"><textLabel><span class="newline">Finished&nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="Deposits $100.00" disabled = "true"></textLabel></div><div class="leftColumn"></div><div class="rightColumn"></div></div></div>'

	document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML=document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML+str1
}

function addCreditCardPaymentDetailsRow()
{
	var str1 = '<div id="addFinalPaymentDetailsExtraRow"><div class="leftColumn"><textLabel><span class="newline">Credit Card: xxxx-1234 &nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="$100.00"  disabled="true"><td class="celldataplain_border_right"><img src="../../images/tableDeleteWhite.png" border="0"></td></textLabel></div><div id="box12"><div class="leftColumn"><textLabel><span class="newline">Finished&nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="Deposits $100.00" disabled = "true"></textLabel></div><div class="leftColumn"></div><div class="rightColumn"></div></div></div>'

	document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML=document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML+str1
}

function addPaymentPlanDetailsRow()
{
	var str1 = '<div id="addFinalPaymentDetailsExtraRow"><div class="leftColumn"><textLabel><span class="newline">Payment Plan &nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="$100.00"  disabled="true"><td class="celldataplain_border_right"><img src="../../images/tableDeleteWhite.png" border="0"></td></textLabel></div><div id="box12"><div class="leftColumn"><textLabel><span class="newline">Finished&nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="Deposits $100.00" disabled = "true"></textLabel></div><div class="leftColumn"></div><div class="rightColumn"></div></div></div>'

	document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML=document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML+str1
}

function addCustomerAccountDetailsRow()
{
	var str1 = '<div id="addFinalPaymentDetailsExtraRow"><div class="leftColumn"><textLabel><span class="newline">Customer Account &nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="$100.00"><td class="celldataplain_border_right"><img src="../../images/tableEditWhite.png" border="0"></td></textLabel></div><div id="box12"><div class="leftColumn"><textLabel><span class="newline">Finished&nbsp;</span><br><input name="textfieldName" class="textData" input type="text" name="textfieldName" style="width:100px" value="Deposits $100.00" disabled = "true"></textLabel></div><div class="leftColumn"></div><div class="rightColumn"></div></div></div>'

	document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML=document.getElementById("addFinalPaymentDetailsExtraRow").innerHTML+str1
}





/***********************************************************************************************************************************************/
/* adding payment method line item in the 'Payment Details' table of 'Deposits for this Order' tab of CreateOrder.html - following 5 functions */
/***********************************************************************************************************************************************/




function addCashPaymentDetailsInCreateOrder()
{
	var formByID = document.forms["addPaymentForm"];
	var addPaymentForm = document.forms["addPaymentForm"];

	var addCashValue2 = addPaymentForm["addCashField2"].value;

var str1 = '<div id="tableDepositDataContents"><tr><td class="celldataplain_border_right" width="70">No:</td><td class="celldataplain_border_right" width="285">Cash</td><td class="celldataplain_border_right" width="130">' + addCashValue2 + '</td><td class="celldataplain_border_right" width="100">11/2/06 16:30</td><td class="celldataplain_border_right" width="80"><a href="#"><img src="../../images/tableDeleteWhite.png" border="0"></a></td></tr></div>' 

	document.getElementById("tableDepositDataContents").innerHTML=document.getElementById("tableDepositDataContents").innerHTML + str1
}

function addCheckPaymentDetailsInCreateOrder()
{
	var formByID = document.forms["addPaymentForm"];
	var addPaymentForm = document.forms["addPaymentForm"];

	var addCheckValue1 = addPaymentForm["addCheckField1"].value;
	var addCheckValue2 = addPaymentForm["addCheckField2"].value;

var str1 = '<div id="tableDepositDataContents"><tr><td class="celldataplain_border_right" width="70">No:</td><td class="celldataplain_border_right" width="285">Check No:' + addCheckValue1 + '</td><td class="celldataplain_border_right" width="130">' + addCheckValue2 + '</td><td class="celldataplain_border_right" width="100">11/2/06 16:30</td><td class="celldataplain_border_right" width="80"><a href="#"><img src="../../images/tableDeleteWhite.png" border="0"></a></td></tr></div>' 

	document.getElementById("tableDepositDataContents").innerHTML=document.getElementById("tableDepositDataContents").innerHTML + str1
}

function addCreditCardPaymentDetailsInCreateOrder()
{
	var formByID = document.forms["addPaymentForm"];
	var addPaymentForm = document.forms["addPaymentForm"];

	var addCreditCardValue1 = addPaymentForm["addCreditCardField1"].value;
	var addCreditCardValue2 = addPaymentForm["addCreditCardField2"].value;

var str1 = '<div id="tableDepositDataContents"><tr><td class="celldataplain_border_right" width="70">No:</td><td class="celldataplain_border_right" width="285">Credit Card No:' + addCreditCardValue1 + '</td><td class="celldataplain_border_right" width="130">' + addCreditCardValue2 + '</td><td class="celldataplain_border_right" width="100">11/2/06 16:30</td><td class="celldataplain_border_right" width="80"><a href="#"><img src="../../images/tableDeleteWhite.png" border="0"></a></td></tr></div>' 

	document.getElementById("tableDepositDataContents").innerHTML=document.getElementById("tableDepositDataContents").innerHTML + str1
}

function addPaymentPlanDetailsInCreateOrder()
{
	var formByID = document.forms["addPaymentForm"];
	var addPaymentForm = document.forms["addPaymentForm"];

	var addPaymentPlanValue1 = addPaymentForm["addPaymentPlanField1"].value;
	var addPaymentPlanValue2 = addPaymentForm["addPaymentPlanField2"].value;

var str1 = '<div id="tableDepositDataContents"><tr><td class="celldataplain_border_right" width="70">No:</td><td class="celldataplain_border_right" width="285">Payment Plan ' + addPaymentPlanValue1 + '</td><td class="celldataplain_border_right" width="130">' + addPaymentPlanValue2 + '</td><td class="celldataplain_border_right" width="100">11/2/06 16:30</td><td class="celldataplain_border_right" width="80"><a href="#"><img src="../../images/tableDeleteWhite.png" border="0"></a></td></tr></div>' 

	document.getElementById("tableDepositDataContents").innerHTML=document.getElementById("tableDepositDataContents").innerHTML + str1
}

function addCustomerAccountDetailsInCreateOrder()
{
	var formByID = document.forms["addPaymentForm"];
	var addPaymentForm = document.forms["addPaymentForm"];

	var addCustomerAccountValue2 = addPaymentForm["addCashField2"].value;

var str1 = '<div id="tableDepositDataContents"><tr><td class="celldataplain_border_right" width="70">No:</td><td class="celldataplain_border_right" width="285">Customer Account</td><td class="celldataplain_border_right" width="130">' + addCustomerAccountValue2 + '</td><td class="celldataplain_border_right" width="100">11/2/06 16:30</td><td class="celldataplain_border_right" width="80"><a href="#"><img src="../../images/tableDeleteWhite.png" border="0"></a></td></tr></div>' 

	document.getElementById("tableDepositDataContents").innerHTML=document.getElementById("tableDepositDataContents").innerHTML + str1
}



/****************************************************************************/
/* adding new Reminder Procedure in the 'Reminders' table of Reminders.html */
/****************************************************************************/


function addNewReminderProcedureInReminders()
{
	var formByID = document.forms["addReminderForm"];
	var addReminderForm = document.forms["addReminderForm"];

	var addProcedureCodeValue = addReminderForm["addProcedureCode"].value;
	var addProcedureDescriptionValue = addReminderForm["addProcedureDescription"].value;

var str1 = '<div id="tableReminderDataContents"><tr><td class="celldata_no_color_border_right" width="45"></td><td class="celldata_no_color_border_right" width="105">' + addProcedureCodeValue + '</td><td class="celldata_no_color_border_right" width="170">' + addProcedureDescriptionValue + '</td><td class="celldata_no_color_no_right_border" width="72"><a onClick = "javascript: showBox(2,4);">View&nbsp;&nbsp;</a><a><img src="../../images/tableEditWhite.png" border="0" onClick = "javascript: showBox(3,4);"></a></td></tr></div>' 

	document.getElementById("tableReminderDataContents").innerHTML=document.getElementById("tableReminderDataContents").innerHTML + str1
}



/***************************************************************************************/
/* the following functions allow items to be picked from one list and added to another */
/***************************************************************************************/



// Control flags for list selection and sort sequence
// Sequence is on option value (first 2 chars - can be stripped off in form processing)
// It is assumed that the select list is in sort sequence initially
var singleSelect = true;  // Allows an item to be selected once only
var sortSelect = true;  // Only effective if above flag set to true
var sortPick = true;  // Will order the picklist in sort sequence

// Initialise - invoked on load

function initIt() {
	var selectList = document.getElementById("SelectList");
	var pickList = document.getElementById("PickList");
	var pickOptions = pickList.options;
	pickOptions[0] = null;  // Remove initial entry from picklist (was only used to set default width)
	selectList.focus();  // Set focus on the selectlist
}

// Adds a selected item into the picklist

function addIt() {
	var selectList = document.getElementById("SelectList");
	var selectIndex = selectList.selectedIndex;
	var selectOptions = selectList.options;
	var pickList = document.getElementById("PickList");
	var pickOptions = pickList.options;
	var pickOLength = pickOptions.length;
	// An item must be selected
	if (selectIndex > -1) {
		pickOptions[pickOLength] = new Option(selectList[selectIndex].text);
		pickOptions[pickOLength].value = selectList[selectIndex].value;
		// If single selection, remove the item from the select list
		if (singleSelect) {
			selectOptions[selectIndex] = null;
		}
		if (sortPick) {
			var tempText;
			var tempValue;
			// Sort the pick list
			while (pickOLength > 0 && pickOptions[pickOLength].value < pickOptions[pickOLength-1].value) {
				tempText = pickOptions[pickOLength-1].text;
				tempValue = pickOptions[pickOLength-1].value;
				pickOptions[pickOLength-1].text = pickOptions[pickOLength].text;
				pickOptions[pickOLength-1].value = pickOptions[pickOLength].value;
				pickOptions[pickOLength].text = tempText;
				pickOptions[pickOLength].value = tempValue;
				pickOLength = pickOLength - 1;
			}
		}
	}
}

// Deletes an item from the picklist

function delIt() {
	var selectList = document.getElementById("SelectList");
	var selectOptions = selectList.options;
	var selectOLength = selectOptions.length;
	var pickList = document.getElementById("PickList");
	var pickIndex = pickList.selectedIndex;
	var pickOptions = pickList.options;
	if (pickIndex > -1) {
		// If single selection, replace the item in the select list
		if (singleSelect) {
			selectOptions[selectOLength] = new Option(pickList[pickIndex].text);
			selectOptions[selectOLength].value = pickList[pickIndex].value;
		}
		pickOptions[pickIndex] = null;
		if (singleSelect && sortSelect) {
			var tempText;
			var tempValue;
			// Re-sort the select list
			while (selectOLength > 0 && selectOptions[selectOLength].value < selectOptions[selectOLength-1].value) {
				tempText = selectOptions[selectOLength-1].text;
				tempValue = selectOptions[selectOLength-1].value;
				selectOptions[selectOLength-1].text = selectOptions[selectOLength].text;
				selectOptions[selectOLength-1].value = selectOptions[selectOLength].value;
				selectOptions[selectOLength].text = tempText;
				selectOptions[selectOLength].value = tempValue;
				selectOLength = selectOLength - 1;
			}
		}
	}
}