factorise moving and change color

static/utils.js

@@ -3,7 +3,6 @@ var server = location.hostname;
 var port = location.port;
 var socket;
 var id;
-var colors = {};
 var markers = {};
 
 var CircleIcon = L.Icon.extend({
@@ -57,25 +56,6 @@ function setup_socket_common(){
     socket = io.connect({rejectUnauthorized: false, auth: {id: id}},
         protocol+"://"+server+":"+port);
 
-	socket.on("moving", function(data){
-		console.log("moving", data);
-		if(!(data.id in markers)){
-			if(!(data.id in colors))
-				colors[data.id] = 0;
-			var icon;
-			if(data.id == id)
-				icon = self_icons[colors[data.id]];
-			else
-				icon = icons[colors[data.id]];
-			markers[data.id] = L.marker(data.position, {"icon": icon}).addTo(map);
-			if(data.id == id)
-				markers[data.id].setZIndexOffset(10000);
-			markers[data.id].bindPopup(data.id);
-        } else{
-            markers[data.id].setLatLng(data.position);
-        }
-	});
-
 	socket.on("popup", function(data){
 		alert(data.content);
 	});
@@ -91,12 +71,22 @@ function setup_socket_common(){
 }
 
 function setup_socket_not_admin(){
-	socket.on("changeColor", function(data){
+    socket.on("moving", function(data){
-		console.log("changeColor", data);
+        console.log("moving", data);
-		if(data.id in colors && colors[data.id] == -1 && data.id in markers)
+        if(!(data.id in markers)){
-			markers[data.id].addTo(map);
+            var icon;
-		colors[data.id] = data.color;
+            if(data.id == id)
-		if(data.id in markers){
+                icon = self_icons[data.color];
+            else
+                icon = icons[data.color];
+            markers[data.id] = L.marker(data.position, {"icon": icon}).addTo(map);
+            markers[data.id].color = data.color; //do we really need to store this ?
+            if(data.id == id)
+                 markers[data.id].setZIndexOffset(10000);
+            markers[data.id].bindPopup(data.id);
+        } else{
+            markers[data.id].setLatLng(data.position);
+            markers[data.id].color = data.color;
             if(data.id == id)
                 if(data.color == -1)
                     markers[data.id].setIcon(self_invisible);

static/vieilleux.html

@@ -33,7 +33,6 @@
 	<div id="map"></div><br/>
 
 	<div id="below">
-		<input id="name"/><button id="setName">Set team name</button><br/>
 		<input type="number" id="color" min="-1" value="0"/><button id="setColor">Set color</button><br/>
 	</div>
 
@@ -52,12 +51,6 @@
 		//////////////////////////////////////////////////////////////////////////////
 		// SETTINGS -- NAME AND COLOR
 
-		document.querySelector('#setName').addEventListener('click', function(){
-			const input = document.querySelector('#name');
-
-			socket.emit("setName", {"name": input.value});
-		});
-
 		document.querySelector('#setColor').addEventListener('click', function(){
 			const input = document.querySelector('#color');
 

traque.js

@@ -76,9 +76,9 @@ var server = http.createServer(option, function(req, res){
         equipe.pos = position;
         if(equipe.shown)
             for(i in equipes)
-                equipes[i].room.emit('moving', {"id": equipe.id, "position": position});
+                equipes[i].room.emit('moving', {"id": equipe.id, "color": equipe.color, "position": position});
         else {
-            equipe.room.emit('moving', {"id": equipe.id, "position": position});
+            equipe.room.emit('moving', {"id": equipe.id, "color": equipe.color, "position": position});
 //            for(i in admins)
 //                admins[i].emit('moving', {"id": equipe.id, "position": position})
         }
@@ -126,8 +126,7 @@ team_nsp.on('connection', function(socket){
     for(i in equipes){
         if(!equipes[i].shown)
             continue;
-        socket.emit('moving', {"id": i, "position": equipes[i].pos});
+        socket.emit('moving', {"id": i, "color": equipes[i].color, "position": equipes[i].pos});
-        socket.emit('changeColor', {"id": i, "color": equipes[i].color});
     }