From a19cb99b9d7c4da6befd6c7024f441323ae6396a Mon Sep 17 00:00:00 2001
From: Tim Young <tim.young@lightsys.org>
Date: Tue, 30 Apr 2024 17:38:31 -0500
Subject: [PATCH] Getting it so we can click on devices.  Mainly figuring stuff
 out. Committing now because I am about to drive off and I want to have the
 code-base up to date before I travel.

---
 Web/ui.js | 39 ++++++++++++++++++++++++++++++++++++++-
 1 file changed, 38 insertions(+), 1 deletion(-)

diff --git a/Web/ui.js b/Web/ui.js
index 0e9e764..8428f01 100644
--- a/Web/ui.js
+++ b/Web/ui.js
@@ -14,6 +14,7 @@ var uiActions = [];//a list of things on the screen we can click on or process.
 var ui_highlightRect = null;
 var ui_HadHighlight = false;
 var ui_status_height = 25;
+var ui_StatusText="";
 
 //The user interface mode.  0=network, 1=network information, 2=puzzle-selection menu
 var uiMode=1;
@@ -168,6 +169,8 @@ function PrintScreen(WhatPassedIn=-1)
 		MainCanvas_ctx.lineTo(MainCanvas.width, MainCanvas.height - ui_status_height); //Bottom
 		MainCanvas_ctx.stroke();
 
+		var statustext = puzzle.name + ":  " + ui_StatusText;
+		printLeftJustifiedText(MainCanvas_ctx, statustext, menuItemSize + 5, (MainCanvas.height - ui_status_height) + 7);
 
 		MainCanvas_ctx.strokeStyle = "black";
 
@@ -453,7 +456,7 @@ function PrintNetworkDevice(ToPrint)
 		if(dname=="net_hub") dname="hub";	
 		//console.log("printing device " + dname);
 		MainCanvas_ctx.drawImage(imageFromName(dname), rect.spoint.x, rect.spoint.y, rect.width, rect.height);
-		registerActionStruct("square", actionrect, ToPrint, null, null, generic_mouseoverHighlight);
+		registerActionStruct("square", actionrect, ToPrint, device_clickOn, null, generic_mouseoverHighlight);
 
 		//Now, we see if we need to print the name, or a list of IPs..
 		var xpoint = rect.center.x;
@@ -530,6 +533,28 @@ function printCenteredText(canvas_context, text, centerx, top_y, font = "15px se
 	return yHeight; //report back how much space we used.  Just in case they want it.
 }
 
+//print text.  We use y as the top-most y position.
+function printLeftJustifiedText(canvas_context, text, LeftX, top_y, font = "15px serif", textcolor = "black") {
+	var metrics = canvas_context.measureText(text);
+	var yHeight = metrics.fontBoundingBoxAscent + metrics.fontBoundingBoxDescent + tmTextYGap;
+	var xWidth = metrics.width;
+
+	var oldfill = canvas_context.fillStyle;
+	var oldstroke = canvas_context.strokeStyle;
+
+	canvas_context.font = font;
+	canvas_context.fillStyle = textcolor;
+	canvas_context.strokeStyle = textcolor;
+
+	canvas_context.fillText(text, LeftX, top_y + (yHeight / 3));
+
+	//reset stuff when done
+	canvas_context.fillStyle = oldfill;
+	canvas_context.strokeStyle = oldstroke;
+
+	return yHeight; //report back how much space we used.  Just in case they want it.
+}
+
 function convertXYPointToActual(point)
 {
 	//We have an x and y coordinate which needs to be converted to the canvas size
@@ -626,6 +651,10 @@ function clearActionStructs() {
 	uiActions = [];
 }
 
+function setStatus(text) {
+	ui_StatusText = text; //set the text.
+}
+
 //This takes generic information for us to highlight the background
 function generic_mouseoverHighlight(point, actionrec) {
 	//console.log("Found highlight " + JSON.stringify(actionrec));
@@ -646,4 +675,12 @@ function generic_mouseoverHighlight(point, actionrec) {
 	}
 	else
 		PrintScreen();  //two different areas.  Need to print the screen
+}
+
+function device_clickOn(point, actionrec) {
+	if (actionrec.theObject !== null && actionrec.theObject.name !== null) {
+		setStatus(actionrec.theObject.hostname);
+		//We probably do not want to do printecreen here, but we are doing it here now...
+		PrintScreen();
+	}
 }
\ No newline at end of file