admin can find a team

static/utils.js

@@ -13,6 +13,14 @@ var CircleIcon = L.Icon.extend({
     }
 });
 
+var BigCircleIcon = L.Icon.extend({
+    options: {
+        iconSize:     [40, 60],
+        iconAnchor:   [20, 30],
+        popupAnchor:  [0, 0]
+    }
+});
+
 var SelfIcon = L.Icon.extend({
     options: {
         iconSize:     [20, 30],
@@ -36,6 +44,21 @@ var icons = [
     new CircleIcon({ iconUrl: '/icons/11.png' }),
 ];
 
+var big_icons = [
+    new BigCircleIcon({ iconUrl: '/icons/self_0.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_1.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_2.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_3.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_4.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_5.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_6.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_7.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_8.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_9.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_10.png' }),
+    new BigCircleIcon({ iconUrl: '/icons/self_11.png' }),
+];
+
 var self_icons = [
     new SelfIcon({ iconUrl: '/icons/self_0.png' }),
     new SelfIcon({ iconUrl: '/icons/self_1.png' }),

templates/admin.html.hbs

@@ -138,6 +138,7 @@
     var equipes = {};
     var equipes_markers = {};
     var info_table = document.getElementById("teamInfos");
+    var bigTeam = "";
 
     function show_update(id){
       var equipe = equipes[id];
@@ -156,9 +157,18 @@
         document.getElementById(`${id}.bonus.blurred`).value = state.blur_codes;
       }
       equipes_markers[id].setLatLng(equipe.pos);
-      equipes_markers[id].setIcon(icons[equipe.color]);
+      equipes_markers[id].setIcon((id == bigTeam ? big_icons : icons)[equipe.color]);
     }
 
+    function over(id){
+      bigTeam = id;
+      show_update(id);
+    };
+    function leave(id){
+      bigTeam = "";
+      show_update(id);
+    };
+
     evtSource = new EventSource("/admin/events?tok={{tok}}");
     function update(data) {
       {{#if dbg}}console.log(data);{{/if}}
@@ -214,7 +224,7 @@
                   </td>`;
           row += `<td></td>`;
         }
-        info_table.innerHTML += `<tr>${row}</tr>`
+        info_table.innerHTML += `<tr onmouseover="over('${id}')" onmouseout="leave('${id}')">${row}</tr>`
         equipes[id] = data;
         equipes_markers[id] = L.marker([0,0], {"icon": icons[0] }).addTo(map);
         equipes_markers[id].bindPopup(data.name);