More shared functions into output_table.js

w3c · Aug 5, 2018 · ee45be7 · ee45be7
1 parent 5929b8a
commit ee45be7
Show file tree

Hide file tree

Showing 3 changed files with 113 additions and 80 deletions.
diff --git a/tools/key-event-viewer.css b/tools/key-event-viewer.css
@@ -136,4 +136,16 @@ tr .keydown_row_hilight:hover {
 body {
 	margin: 10px;
 	padding: 0 20px;
+	background-color: #ffffff;
+}
+
+/* Fix for black background in Fullscreen (Chrome). */
+html {
+	background-color: #ffffff;
+}
+
+*:fullscreen, *:-webkit-full-screen, *:-moz-full-screen, *:-ms-fullscreen {
+	background-color: rgba(255,255,255,0);
+	width: 100%;
+	height: 100%;
 }
diff --git a/tools/key-event-viewer.js b/tools/key-event-viewer.js
@@ -1,11 +1,6 @@
 // Keyboard event viewer
 // Gary Kacmarcik - garykac@{gmail|google}.com
 
-// True if the current row is a 'keydown' event.
-// This is used to set the background for the entire row when 'keydown' events are
-// highlighted.
-var _isKeydown = false;
-
 var _key_table_info = [
 	// Unlabeled group
 	["", "empty", [
@@ -58,6 +53,11 @@ var _key_table_info = [
 	]],
 ];
 
+// True if the current row is a 'keydown' event.
+// This is used to set the background for the entire row when 'keydown' events are
+// highlighted.
+var _isKeydown = false;
+
 function setUserAgentText() {
 	var userAgent = navigator.userAgent;
 	uaDiv = document.getElementById("useragent");
@@ -222,32 +222,6 @@ function addCompositionEvent(etype, e) {
 // Helper functions
 // =====
 
-
-function getModifierState(e) {
-	Modifiers = [
-		"Alt", "AltGraph", "Control", "Shift", "Meta",
-		// Locking keys
-		"CapsLock", "NumLock", "ScrollLock",
-		// Linux
-		"Hyper", "Super",
-		// Virtual keyboards
-		"Symbol", "SymbolLock",
-		// Not valid, but check anyway
-		"Fn", "FnLock",
-		];
-	mods = undefined;
-	for (var mod of Modifiers) {
-		if (e.getModifierState(mod)) {
-			if (!mods) {
-				mods = mod;
-			} else {
-				mods += ", " + mod;
-			}
-		}
-	}
-	return mods;
-}
-
 function calcInput() {
 	var value = document.getElementById("input").value;
 	return "'" + value + "'";
@@ -305,13 +279,6 @@ function calcRichKeyVal(eventType, attrName, key) {
 	return document.createTextNode(key);
 }
 
-function calcString(data) {
-	if (data === undefined) {
-		return data;
-	}
-	return "'" + data + "'";
-}
-
 function calcHilightString(eventType, data, addArrow) {
 	if (data === undefined) {
 		return null;
@@ -339,21 +306,6 @@ function setInputFocus(resetData=false) {
 	input.focus();
 }
 
-function handleDefaultPropagation(etype, e) {
-	var preventDefault = document.getElementById("pd_" + etype);
-	if (preventDefault.checked && e.preventDefault) {
-		e.preventDefault();
-	}
-	var stopPropagation = document.getElementById("sp_" + etype);
-	if (stopPropagation.checked && e.stopPropagation) {
-		e.stopPropagation();
-	}
-	// Always prevent default for Tab.
-	if (e.keyCode == 9 || e.code == "Tab") {
-		e.preventDefault();
-	}
-}
-
 function toggleReadonly() {
 	var cbReadonly = document.getElementById("readonlyToggle");
 	var input = document.getElementById("input");
@@ -379,21 +331,3 @@ function toggleOptions() {
 	}
 	setInputFocus();
 }
-
-function showFieldClick(cb) {
-	var celltype = cb.id.split('_')[1];
-	var show = cb.checked;
-
-	var table = document.getElementById("output");
-	for (var ir = 0, row; row = table.rows[ir]; ir++) {
-		for (var ic = 0, cell; cell = row.cells[ic]; ic++) {
-			if (cell.classList.contains(celltype)) {
-				if (show) {
-					cell.style.display = "";
-				} else {
-					cell.style.display = "none";
-				}
-			}
-		}
-	}
-}
diff --git a/tools/output-table.js b/tools/output-table.js
@@ -42,16 +42,23 @@ function createTableHeader(table_info) {
 	var row2 = head.insertRow(-1);  // For column names
 
 	for (var group of _table_info) {
-		var group_title = group[0]
-		var group_type = group[1]
-		var group_style = group_type + '_header'
+		var group_title = group[0];
+		var group_type = group[1];
+		var group_style = group_type + '_header';
 		var columns = group[2];
 		addTableCellText(row1, group_title, group_type, group_style, columns.length);
 
 		for (var col of columns) {
 			var title = col[0];
-			var type = col[1]
-			var style = [type + '_header', 'subheader']
+			var type = col[1];
+			var format = col[2];
+			var options = col[3];
+
+			var style = [type + '_header', 'subheader'];
+			if (options && options['style']) {
+				style.push(options['style']);
+			}
+
 			addTableCellText(row2, title, type, style);
 		}
 	}
@@ -78,9 +85,9 @@ function addEventToOutput(eventinfo, extra_class) {
 				val = _seqId;
 			}
 
-			var style;
-			var align;
-			if (options) {
+			var style = undefined;
+			var align = undefined;
+			if (options && val != "") {
 				style = options['style'];
 				align = options['align'];
 			}
@@ -97,6 +104,12 @@ function addEventToOutput(eventinfo, extra_class) {
 	_seqId++;
 }
 
+// Delete the most recent output row.
+function deleteLastOutputRow() {
+	var table = document.getElementById("output");
+	table.deleteRow(NUM_HEADER_ROWS);
+}
+
 // extra_class: Additional CSS class to add to this row.
 function addOutputRow(extra_class) {
 	var table = document.getElementById("output");
@@ -164,7 +177,9 @@ function addTableCell(row, data, celltype, style, span, align) {
 	}
 }
 
-// =========
+// =====
+// Helper functions
+// =====
 
 function clearChildren(e) {
 	while (e.firstChild !== null) {
@@ -186,3 +201,75 @@ function addEventListener(obj, etype, handler) {
 		obj["on" + etype] = handler;
 	}
 }
+
+function handleDefaultPropagation(etype, e) {
+	var preventDefault = document.getElementById("pd_" + etype);
+	if (preventDefault.checked && e.preventDefault) {
+		e.preventDefault();
+	}
+	var stopPropagation = document.getElementById("sp_" + etype);
+	if (stopPropagation.checked && e.stopPropagation) {
+		e.stopPropagation();
+	}
+	// Always prevent default for Tab.
+	if (e.keyCode == 9 || e.code == "Tab") {
+		e.preventDefault();
+	}
+}
+
+function getModifierState(e) {
+	Modifiers = [
+		"Alt", "AltGraph", "Control", "Shift", "Meta",
+		// Locking keys
+		"CapsLock", "NumLock", "ScrollLock",
+		// Linux
+		"Hyper", "Super",
+		// Virtual keyboards
+		"Symbol", "SymbolLock",
+		// Not valid, but check anyway
+		"Fn", "FnLock",
+		];
+
+	// Safari doesn't define getModifierState for mouse events.
+	if (e.getModifierState === undefined) {
+		return "Undefined";
+	}
+
+	mods = undefined;
+	for (var mod of Modifiers) {
+		if (e.getModifierState(mod)) {
+			if (!mods) {
+				mods = mod;
+			} else {
+				mods += ", " + mod;
+			}
+		}
+	}
+	return mods;
+}
+
+function calcString(data) {
+	if (data === undefined) {
+		return data;
+	}
+	return "'" + data + "'";
+}
+
+function showFieldClick(cb) {
+	var celltype = cb.id.split('_')[1];
+	var show = cb.checked;
+
+	var table = document.getElementById("output");
+	for (var ir = 0, row; row = table.rows[ir]; ir++) {
+		for (var ic = 0, cell; cell = row.cells[ic]; ic++) {
+			if (cell.classList.contains(celltype)) {
+				if (show) {
+					cell.style.display = "";
+				} else {
+					cell.style.display = "none";
+				}
+			}
+		}
+	}
+}
+