made heartbeat visible on client side

resources/css/style.css

@@ -145,3 +145,13 @@ h2{
 .link{
 	cursor: pointer;
 }
+
+#heartbeat {
+    width: 15px;
+    height: 15px;
+    background: lime;
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    display: none;
+}

resources/js/plan.js

@@ -96,6 +96,11 @@ function enableMove(ev){
 	return false; // otherwise body.click would also be triggered
 }
 
+function heartbeat(data){
+	$('#heartbeat').show().fadeOut(2000);
+	return false;
+}
+
 function moveTile(x,y){	
 	console.log("moveTile:",selected.id,x,y);
 	$.ajax({
@@ -150,6 +155,13 @@ function runAction(ev){
 	return false;
 }
 
+function stream(ev){
+	var data = ev.data;
+	if (data.startsWith("heartbeat")) return heartbeat(data);
+	console.log(data);
+	
+}
+
 window.onload = function () {
 	var isDragging = false;
 	console.log($(BODY).each(function(){console.log(this)}));
@@ -158,8 +170,5 @@ window.onload = function () {
 	$('.menu .move .list div').click(enableMove);
 	$('.menu .actions .list > div').click(runAction);
 	$(BODY).click(bodyClick);
-	var stream = new EventSource("stream");
+	(new EventSource("stream")).onmessage = stream;
-	stream.onmessage = function(ev){
-		console.log(ev);
-	}
 }

src/main/java/de/srsoftware/web4rail/Plan.java

@@ -104,37 +104,6 @@ public class Plan {
 	public Plan() {
 		new Heartbeat().start();
 	}
-	
-	public void heatbeat() {
-		stream("hearbeat @ "+new Date().getTime());
-	}
-
-	private void stream(String data) {
-		LOG.debug("streaming {}",data);
-		Vector<OutputStreamWriter> badClients = null;
-		for (Entry<OutputStreamWriter, Integer> entry : clients.entrySet()) {
-			OutputStreamWriter client = entry.getKey();
-			try {
-				client.write("data: "+data+"\n\n");
-				client.flush();
-				clients.put(client,0);
-			} catch (IOException e) {
-				int errorCount = entry.getValue()+1;
-				LOG.info("Error #{} on client: {}",errorCount,e.getMessage());
-				if (errorCount > 4) {
-					if (badClients == null) badClients = new Vector<OutputStreamWriter>();
-					try {
-						client.close();
-					} catch (IOException e1) {}
-					badClients.add(client);
-				} else clients.put(client,errorCount);
-			}
-		}
-		if (badClients != null) for (OutputStreamWriter client: badClients) {
-			LOG.info("Disconnecting client.");
-			clients.remove(client);			
-		}
-	}
 
 	private Tag actionMenu() throws IOException {
 		Tag tileMenu = new Tag("div").clazz("actions").content(t("Actions"));		
@@ -207,7 +176,15 @@ public class Plan {
 		HashMap<Integer, Tile> column = tiles.get(x);
 		return column == null ? null : column.get(y);
 	}
+	
+	private Tag heartbeat() {
+		return new Tag("div").id("heartbeat").content("");
+	}
 
+	public void heatbeat() {
+		stream("heartbeat @ "+new Date().getTime());
+	}
+	
 	public Page html() throws IOException {
 		Page page = new Page().append("<div id=\"plan\">");
 		for (Entry<Integer, HashMap<Integer, Tile>> column : tiles.entrySet()) {
@@ -218,9 +195,15 @@ public class Plan {
 				if (tile != null) page.append("\t\t"+tile.tag(null)+"\n");
 			}
 		}
-		return page.append(menu()).append(messages()).append("</div>").style("css/style.css").js("js/jquery-3.5.1.min.js").js("js/plan.js");
+		return page
+				.append(menu())
+				.append(messages())
+				.append(heartbeat())
+				.append("</div>")
+				.style("css/style.css")
+				.js("js/jquery-3.5.1.min.js")
+				.js("js/plan.js");
 	}
-	
 	public static Plan load(String filename) throws IOException, ClassNotFoundException, InstantiationException, IllegalAccessException, IllegalArgumentException, InvocationTargetException, NoSuchMethodException, SecurityException {
 		Plan result = new Plan();
 		File file = new File(filename+".plan");
@@ -466,6 +449,33 @@ public class Plan {
 		return old;
 	}
 	
+	private void stream(String data) {
+		LOG.debug("streaming {}",data);
+		Vector<OutputStreamWriter> badClients = null;
+		for (Entry<OutputStreamWriter, Integer> entry : clients.entrySet()) {
+			OutputStreamWriter client = entry.getKey();
+			try {
+				client.write("data: "+data+"\n\n");
+				client.flush();
+				clients.put(client,0);
+			} catch (IOException e) {
+				int errorCount = entry.getValue()+1;
+				LOG.info("Error #{} on client: {}",errorCount,e.getMessage());
+				if (errorCount > 4) {
+					if (badClients == null) badClients = new Vector<OutputStreamWriter>();
+					try {
+						client.close();
+					} catch (IOException e1) {}
+					badClients.add(client);
+				} else clients.put(client,errorCount);
+			}
+		}
+		if (badClients != null) for (OutputStreamWriter client: badClients) {
+			LOG.info("Disconnecting client.");
+			clients.remove(client);			
+		}
+	}
+	
 	private String t(String message, Object...fills) {
 		return Translation.get(Application.class, message, fills);
 	}