Timeline now show pillows in order of light

hugvey/panopticon.py

@@ -293,6 +293,14 @@ def getVoiceHandler(voiceStorage):
                 self.finish()
     return VoiceHandler
 
+class InfoHandler(tornado.web.RequestHandler):
+    def initialize(self, command):
+        self.command = command
+        
+    async def get(self):
+        self.write(json.dumps(self.command.hugvey_ids))
+
+
 class StaticFileWithHeaderHandler(tornado.web.StaticFileHandler):
     def set_extra_headers(self, path):
         """For subclass to add extra headers to the response"""
@@ -314,6 +322,7 @@ class Panopticon(object):
                 {"path": config['web']['files_dir']}),
             (r"/upload", getUploadHandler(self.command)),
             (r"/voice", getVoiceHandler(self.voiceStorage)),
+            (r"/count", InfoHandler, {'command': self.command}),
             (r"/(.*)", StaticFileWithHeaderHandler,
                 {"path": web_dir, "default_filename": 'index.html'}),
         ], debug=True)

www/js/hugvey_timeline.js

@@ -1,6 +1,7 @@
 var ws = new ReconnectingWebSocket( window.location.origin.replace('http', 'ws') +'/ws', null, { debug: false, reconnectInterval: 3000 } );
 
 var seeme = true;
+var tl ;
 
 var error_audio = new Audio('siren.wav');
 var playSoundOnError = true;
@@ -34,6 +35,8 @@ class Timeline{
 		]);
 //		console.log('init timeline');
 		
+		this.lightMap = {};
+
 		let groups = [];
 		for(let hid = 1; hid<=this.count; hid++) {
 			groups.push({id: parseInt(hid), content: 'Hugvey #'+hid});
@@ -107,12 +110,25 @@ class Timeline{
 	    }
 
 	    if(msg['action'] == 'status') {
+	    	// reconstruct mapping of lights to hugveys
+	    	this.lightMap = {}
 	    	for(let hv of msg['hugveys']){
-	    		console.log(hv['language'], hv['status']);
+	    		if(!this.lightMap.hasOwnProperty(hv['light_id'])) {
-	    		let evenOdd = parseInt(hv['id'])%2 ? 'odd': 'even';
+	    			this.lightMap[hv['light_id']] = [];
+	    		}
+	    		this.lightMap[hv['light_id']].push(hv['id']);
+	    	}
+	    	
+	    	// loop over statusses of hugveys and show them at the appropriate lights
+	    	for(let hv of msg['hugveys']){
+//	    		console.log(hv['language'], hv['status']);
+	    		let evenOdd = parseInt(hv['light_id'])%2 ? 'odd': 'even';
 	    		let availableClass = hv['available'] ? 'is-available' : 'is-not-available';
-	    		let realHugveyId = hv['id'] == hv['light_id'] ? "" : `(#${hv['id']})`;
+	    		let realHugveyId = "";
-	    		this.dataGroups.update({id: parseInt(hv['id']), content: `<div class='title'>Hugvey ${hv['light_id']} ${realHugveyId}</div><div class='times'><span class='${hv['time_since_hugvey_spoke_state']}'>${hv['time_since_hugvey_spoke']}</span><span class='${hv['time_since_visitor_spoke_state']}'>${hv['time_since_visitor_spoke']}</span></div>`, className: `status-${hv['status']} ${availableClass} lang-${hv['language']} ${evenOdd}`})
+	    		if(this.lightMap[hv['light_id']].length > 1 || this.lightMap[hv['light_id']][0] != hv['light_id']) {
+	    			realHugveyId = '(#' + this.lightMap[hv['light_id']].join(' #') + ')';	
+	    		}
+	    		this.dataGroups.update({id: parseInt(hv['light_id']), content: `<div class='title'>Hugvey ${hv['light_id']} ${realHugveyId}</div><div class='times'><span class='${hv['time_since_hugvey_spoke_state']}'>${hv['time_since_hugvey_spoke']}</span><span class='${hv['time_since_visitor_spoke_state']}'>${hv['time_since_visitor_spoke']}</span></div>`, className: `status-${hv['status']} ${availableClass} lang-${hv['language']} ${evenOdd}`})
 	    	}
 	    }
 
@@ -120,9 +136,13 @@ class Timeline{
 	    	return;
 	    }
 
-	    console.debug(msg, this);
 
-    	let hv_id = parseInt(msg['id']);
+//    	let hv_id = parseInt(msg['id']);
+    	let hv_machine_id = parseInt(msg['id']);
+    	// map to light id:
+    	let hv_id = Object.keys(this.lightMap).find(key => this.lightMap[key].indexOf(hv_machine_id) >= 0);
+
+	    console.debug(msg, hv_id);
 //		        		 {'action': 'log', 'id':hugvey_id, 'type': items[0], 'info', 'args'}
 		let d, parts;
 		switch(msg['type']){
@@ -135,11 +155,11 @@ class Timeline{
 				let msgContent = parts.join(' ');
 				let mId = 'm-'+msgUuid+'-'+hv_id;
 				d = this.eventDataSet.get(mId);
-				console.log(msgId, msgEvent, msgContent);
+//				console.log(msgId, msgEvent, msgContent);
 				if(d !== null && msgEvent == 'done'){
 					d['end'] = new Date();
 					this.eventDataSet.update(d);
-					console.log('update', d);
+//					console.log('update', d);
 				} else {
 					this.eventDataSet.add({id: mId, content: msgContent, title: `${msgContent} (${msgId})`, start: new Date(), end: new Date(Date.now()+5000), group: hv_id, 'className': 'message'});
 				}
@@ -158,13 +178,13 @@ class Timeline{
 				if(info.startsWith('content')){
 					d = this.eventDataSet.get(scId);
 					if(d !== null){
-						console.log('alter');
+//						console.log('alter');
 						d['content'] = content;
 						d['end']= new Date();
 						d['title'] = content;
 						this.eventDataSet.update(d);
 					} else {
-						console.log('add');
+//						console.log('add');
 						this.eventDataSet.add({id: scId, content: content, title: content, start: new Date(), end: new Date(Date.now() + 1000), group: hv_id, 'className': 'speech'});
 					}
 				}
@@ -200,12 +220,15 @@ class Timeline{
 	}
 }
 
-var tl = new Timeline(ws, document.getElementById('line'), 29);
+let req = new Request('/count');
+fetch(req).then(response => response.json()).then(function(data) {
+	tl = new Timeline(ws, document.getElementById('line'), data.length);
+});
 
 
 
 window.addEventListener('keypress', function(e){
-	console.log(e.keyCode)
+//	console.log(e.keyCode)
 	if(e.keyCode==46){
 		if(seeme){
 			seeme = false;