map connected/disconnected shown as border of label

docroot/last/index.html

@@ -16,8 +16,7 @@
 
       #map-canvas { height: 100% }
       #wrapper { position: relative; }
-      #mapover { position: absolute; top: 10px; left: 120px; z-index: 99; background: red; }
-      #maplabel { position: absolute; top: 10px; left: 180px; z-index: 99;
+      #maplabel { position: absolute; top: 10px; left: 120px; z-index: 99;
 	background: white;
 	font-size: 1.2em;
 	padding: 4px;
@@ -33,7 +32,6 @@
   	<div id="output"></div>
     <div id="wrapper">
       <div id="map-canvas" style='width: 100%; height: 600px;'/></div>
-      <div id="mapover"></div>
       <div id="maplabel"></div>
     </div>
   </body>

docroot/last/websock.js

@@ -3,7 +3,7 @@ var ws_url;
 var ws;
 
 function setColor(element, color) {
-	element.style.backgroundColor = color;
+	element.style.border = '2px solid ' + color;
 }
 
 var out = function(message) {
@@ -19,16 +19,14 @@ function ws_connect() {
 	ws = new WebSocket(ws_url);
 
 	ws.onopen = function(ev) {
-		setColor(mapover, 'green');
-		document.getElementById('mapover').textContent = 'Connected';
+		setColor(maplabel, 'green');
 		var msg = 'LAST';
 		// out('SENT: ' + msg);
 		ws.send(msg);
 	};
 
 	ws.onclose = function(ev) {
-		setColor(mapover, 'red');
-		document.getElementById('mapover').textContent = 'Disconnected';
+		setColor(maplabel, 'red');
 		setTimeout(ws_connect, reconnectTimeout);
 	};