grey banner and lots of to-do fixes, to do items all updated from scribbled notes on printout

handbook/computing/todo.js

@@ -0,0 +1,71 @@
+
+document.getElementById("demo").innerHTML = "<span style='color: lime'>Script working CONFIRMED</span>";
+
+// TO DO - make the <dt> italic when any of the <dd> following it are hidden.
+
+// Set up the click handlers:
+var itemlist = document.getElementsByTagName('dd');
+for (i = 0; i < itemlist.length; i++) {
+			itemlist[i].onclick = hideable;
+}
+
+var itemlist = document.getElementsByTagName('dt');
+for (i = 0; i < itemlist.length; i++) {
+			itemlist[i].onclick = showable;
+}
+
+var itemlist = document.getElementsByTagName('h2');
+for (i = 0; i < itemlist.length; i++) {
+			itemlist[i].onclick = h2toggle;
+}
+
+function showable () {
+// When clicking on a <dt> item, show or not all the following <dd> elements
+	if (this.style.fontStyle != "italic") {
+		this.style.fontStyle = "italic";
+	} else {
+		this.style.fontStyle = "normal";
+	}
+	var ddO = this.nextElementSibling;
+  while((ddO !== null) && (ddO.nodeName.toLowerCase() == 'dd')){
+		if (this.style.fontStyle != "normal") {
+			ddO.style.display = 'none';
+		} else {
+			ddO.style.display = 'block';
+		}
+    ddO = ddO.nextElementSibling;
+	}
+
+}
+
+function hideable () {
+// When clicking on a <dd> item, show or not itself
+	var x = this;
+  if (x.style.display != "block") {
+    x.style.display = "block";
+  } else {
+    x.style.display = "none";
+  }
+}
+
+function h2toggle () {
+// When clicking on a <h2> item, toggle the display of absolutely everything
+	var itemlist = document.getElementsByTagName('dd');
+	for (i = 0; i < itemlist.length; i++) {
+		x = itemlist[i]
+		if (x.style.display != "block") {
+		  x.style.display = "block";
+		} else {
+		  x.style.display = "none";
+		}
+	}
+	var dtlist = document.getElementsByTagName('dt');
+	for (i = 0; i < dtlist.length; i++) {
+		x = dtlist[i]
+		if (x.style.fontStyle != "normal") {
+		  x.style.fontStyle = "normal";
+		} else {
+		  x.style.fontStyle = "italic";
+		}
+	}
+}