<!-- Hide from JavaScript-Impaired Browsers;

// Code to hide, show or toggle visibility of DIVision blocks
// It hides DIVs by absolutely moving them to the far left off-screen
// Use:
// 		Save file to server
//		Load file in HTML page code 
//			<SCRIPT TYPE="text/JavaScript" SRC="{path_to_file}pagecode.js"></SCRIPT>
//			[Note: {path_to_file} is the path in URL form to the pagecode.js file such as http://server.com/path/]
//		Create your DIVs with unique IDs
//		[Note: NAV="yes" attribute is critical and *must* be included]
//		> To hide a DIV at load, use this line:
//			<DIV ID="name1" NAV="yes" STYLE="position: absolute; left: -4000px;">
//		> Otherwise, use:
//			<DIV ID="name1" NAV="yes">
//		Using Javascript tags (onclick, onsubmit, onblur, onfocus... where appropriate)
//		> To show only one DIV block, and hide all others, use:
//			...onclick (et at)="showOneDivOL('name1')"
//		> To show a DIV block use:
//			...onclick (et at)="showDivOL('name1')"
//		> To hide a DIV block use:
//			...onclick (et al)="hideDivOL('name')"
//		[Note: make sure DIV IDs within showDivOL, showOneDivOL and hideDivOL are surrounded by single quotes '']
//
// This code uses very limited Javascript.  Its power is in the controlling of the CSS position.
 
function toggleDivOL(elemID) {
	// toggle a specific DIV (can be used with any DIV in page)
    var elem = document.getElementById(elemID);
    if (elem.style.position != 'absolute') {
        elem.style.position = 'absolute';
        elem.style.left = '-4000px';
    } else {
        elem.style.position = 'relative';
        elem.style.left = '0px';
    }
}

function showDivOL(elemID) {
	// show a specific DIV (can be used with any DIV in page)
    var elem = document.getElementById(elemID);
    elem.style.position = 'relative';
    elem.style.left = '0px';
}

function hideDivOL(elemID) {
	// hide a specific DIV (can be used with any DIV in page)
    var elem = document.getElementById(elemID);
    elem.style.position = 'absolute';
    elem.style.left = '-4000px';
}

function toggleOneDivOL(elemID) {
	// create object array of all div tags in the document
	var tag = document.getElementsByTagName('DIV');

	// create the child layer object using the argument passed to the function
	var elem = document.getElementById(elemID);

	// the show/hide layer has an attribute nav="yes" in it
	// to distiguish it from other DIV elements in the page
	if (elem.getAttribute("nav")) {
		for (x=0; x<tag.length; x++) {
			//hide all div layers with the 'nav' attribute
			if (tag[x].getAttribute("nav") && tag[x] != elem) {
                tag[x].style.position = 'absolute';
                tag[x].style.left = '-4000px';
			}
		}
        // toggle (show <-> hide) only the elemID layer 
		if (elem.style.position != 'relative') {
            elem.style.position = 'relative';
            elem.style.left = '0px';
		} else {
            elem.style.position = 'absolute';
            elem.style.left = '-4000px';
		}
		
		// erase all nav="yes" marked form fields
		clearFormValues();
		
		// change choiceselected hidden field to new choice
		var control = document.getElementById('choiceselected');
		control.value = elem.id;
	}
}

function showOneDivOL(elemID) {
	// create object array of all div tags in the document
	var tag = document.getElementsByTagName('DIV');

	// create the child layer object using the argument passed to the function
	var elem = document.getElementById(elemID);

	// the show/hide layer has an attribute nav="yes" in it
	// to distiguish it from other DIV elements in the page
	if (elem.getAttribute("nav")) {
		for (x=0; x<tag.length; x++) {
			//hide all div layers with the 'nav' attribute
			if (tag[x].getAttribute("nav") && tag[x] != elem) {
                tag[x].style.position = 'absolute';
                tag[x].style.left = '-4000px';
			}
		}
        // show only the elemID layer 
        elem.style.position = 'relative';
        elem.style.left = '0px';
		
		// erase all nav="yes" marked form fields
		clearFormValues();
		
		// change choiceselected hidden field to new choice
		var control = document.getElementById('choiceselected');
		control.value = elem.id;
	}
}

function toggleChoiceListImage(elemID) {
	// change icon filename location to where you saved these files
	var plusimg = "http://www.womensenterprise.ca/mentor/images/shape-tzopen.gif";
	var minusimg = "http://www.womensenterprise.ca/mentor/images/shape-tzclose.gif";
	
	// toggle the (+) to (-) image for this list item element
	var tag = document.getElementsByTagName('IMG');

	// create the child layer object using the argument passed to the function
	var elem = document.getElementById(elemID);
	
	// the list item an attribute nav="yes" in it
	// to distiguish it from other LI elements in the page
    for (x=0; x<tag.length; x++) {
        //set all img src with the 'nav' attribute to (+) [tzopen]
        if (tag[x].getAttribute("nav") && tag[x] != elem) {
        	tag[x].src = plusimg;
       	}
    }
    // change the elemID style image to a (-) [tzclose]
	if (elem.src != plusimg) {
		elem.src = plusimg;
	} else {
		elem.src = minusimg;
	}
}

function clearFormValues() {
	// create object array of all input tags in the document
	var tag = document.getElementsByTagName('INPUT');
	
	// clear all tag values with the 'nav' attribute
	for (x=0; x<tag.length; x++) {
		if (tag[x].getAttribute("nav")) {
			if (tag[x].type == 'text') {
				tag[x].value = "";
			} else if (tag[x].type == 'checkbox') {
				tag[x].checked = false;
			} else if (tag[x].type == 'password') {
				tag[x].value = "";
			} else if (tag[x].type == 'file') {
				tag[x].value = "";
			}
		}
	}
}

clearFormValues();

//End Hide-->