lbailly/traque
1
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages Wiki Activity

factorise moving and change color

Browse source
This commit is contained in:
catvayor 2023-06-06 16:20:35 +02:00
parent 88ecea941f
commit 1154f13962
3 changed files with 24 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

52
static/utils.js
View file

@ -3,7 +3,6 @@ var server = location.hostname;
var port = location.port; var port = location.port;
var socket; var socket;
var id; var id;
var colors = {};
var markers = {}; var markers = {};
var CircleIcon = L.Icon.extend({ var CircleIcon = L.Icon.extend({
@ -57,25 +56,6 @@ function setup_socket_common(){
socket = io.connect({rejectUnauthorized: false, auth: {id: id}}, socket = io.connect({rejectUnauthorized: false, auth: {id: id}},
protocol+"://"+server+":"+port); 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){ socket.on("popup", function(data){
alert(data.content); alert(data.content);
}); });
@ -91,24 +71,34 @@ function setup_socket_common(){
} }
function setup_socket_not_admin(){ 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.id == id)
if(data.color == -1) if(data.color == -1)
markers[data.id].setIcon(self_invisible); markers[data.id].setIcon(self_invisible);
else else
markers[data.id].setIcon(self_icons[data.color]); markers[data.id].setIcon(self_icons[data.color]);
else else
if(data.color == -1) if(data.color == -1)
markers[data.id].setLatLng([0,0]); markers[data.id].setLatLng([0,0]);
else else
markers[data.id].setIcon(icons[data.color]); markers[data.id].setIcon(icons[data.color]);
} }
}); });
} }
////////////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////////////

7
static/vieilleux.html
View file

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

7
traque.js
View file

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