From 0c1936126c4f2fa8d73f054f18334331e2df57ef Mon Sep 17 00:00:00 2001
From: Ruben van de Ven <git@rubenvandeven.com>
Date: Wed, 13 Nov 2019 23:43:02 +0100
Subject: [PATCH] Console changes

---
 www/index.html            |  2 +-
 www/js/hugvey_console.js  | 41 ++++++++++++++++++++++++++++-----------
 www/js/hugvey_timeline.js |  5 +++--
 3 files changed, 34 insertions(+), 14 deletions(-)

diff --git a/www/index.html b/www/index.html
index a0a1f47..8411397 100644
--- a/www/index.html
+++ b/www/index.html
@@ -44,7 +44,7 @@
 				@click="showHugvey(hv)"
 				>
 				<h1>
-					{{ hv.id }}
+					{{ hv.light_id }} <span v-if="hv.id != hv.light_id">(#{{hv.id}})</span>
 				</h1>
 				<div class='status'>{{ hv.status }}</div>
 				 <div v-if="hv.status != 'off' && hv.status != 'gone' && hv.status != 'loading'">
diff --git a/www/js/hugvey_console.js b/www/js/hugvey_console.js
index ea7c7eb..b0828ed 100644
--- a/www/js/hugvey_console.js
+++ b/www/js/hugvey_console.js
@@ -38,11 +38,22 @@ class Panopticon {
                 	}
                 },
                 changeLanguageForAvailable: function(code){
-                	console.log('TODO: set loader icon for 3 sec', this);
-                	panopticon.send( { action: 'change_language_for_available', lang_code: code } );
                 	let el = document.getElementById("change-lang-"+code);
                 	el.classList.add('loading');
-                	setTimeout(function(){el.classList.remove('loading');}, 3000);
+                	console.log(el);
+                	panopticon.send( { action: 'change_language_for_available', lang_code: code } );
+                	// TODO: loop with a timer
+                	let i = 0;
+                	for(let hv of panopticon.hugveys.hugveys) {
+                		setTimeout(function(){
+                			console.log(hv['available']);
+                			if(hv.hasOwnProperty('available') && hv['available']) {
+                				panopticon.change_language(hv.id, code);
+                			}
+                		}, i * 1000);
+                		i++;
+                	}
+                	setTimeout(function(){el.classList.remove('loading');}, i*1000);
                 },
                 block: function(hv) {
                 	hv.status = "loading";
@@ -90,19 +101,27 @@ class Panopticon {
                     panopticon.updateSelectedHugvey();
                 },
                 unblockAll: function(){
+                	let i = 0;
                 	for(let hv of panopticon.hugveys.hugveys) {
-                		if(hv.status == 'blocked') {
-	                		hv.status = "loading";
-	                		panopticon.unblock(hv.id)
-                		}
+                		setTimeout(function(){
+	                		if(hv.status == 'blocked') {
+		                		hv.status = "loading";
+		                		panopticon.unblock(hv.id)
+	                		}
+                		}, i * 1000);
+                		i++;
                 	}
                 },
                 startAll: function(){
+                	let i = 0;
                 	for(let hv of panopticon.hugveys.hugveys) {
-                		if(hv.status == 'available') {
-	                		hv.status = "loading";
-	                		panopticon.restart(hv.id)
-                		}
+                		setTimeout(function(){
+	                		if(hv.status == 'available') {
+		                		hv.status = "loading";
+		                		panopticon.restart(hv.id)
+	                		}
+                		}, i * 1000);
+                		i++;
                 	}
                 },
             }
diff --git a/www/js/hugvey_timeline.js b/www/js/hugvey_timeline.js
index c09b87a..814ab41 100644
--- a/www/js/hugvey_timeline.js
+++ b/www/js/hugvey_timeline.js
@@ -110,8 +110,9 @@ class Timeline{
 	    	for(let hv of msg['hugveys']){
 	    		console.log(hv['language'], hv['status']);
 	    		let evenOdd = parseInt(hv['id'])%2 ? 'odd': 'even';
-	    		let availableClass = hv['available'] ? 'is-available' : 'is-not-available'
-	    		this.dataGroups.update({id: parseInt(hv['id']), content: `<div class='title'>Hugvey #${hv['id']}</div><div class='times'><span>${hv['time_since_hugvey_spoke']}</span><span>${hv['time_since_visitor_spoke']}</span></div>`, className: `status-${hv['status']} ${availableClass} lang-${hv['language']} ${evenOdd}`})
+	    		let availableClass = hv['available'] ? 'is-available' : 'is-not-available';
+	    		let realHugveyId = hv['id'] == hv['light_id'] ? "" : `(#${hv['id']})`;
+	    		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}`})
 	    	}
 	    }