Merge branch 'AMohn9-Update_opacity_onclick'

src/config/leaflet_setup.js

@@ -79,7 +79,9 @@ module.exports = {
   initCenter: initCenter,
   initZoom: initZoom,
   tileLayer: tileLayer,
+  lowOpacity: 0.4,
   opacity: 0.6,
+  highOpacity: 0.9,
   labelOpacity: 0.9,
   weight: 8,
   routeColors: routeColors,

src/utils/data_handler.js

@@ -854,16 +854,38 @@ var addRoutes = function(resultRoutes) {
     var row = solutionList.insertRow(nb_rows);
     row.title = 'Click to center the map';
 
+    var updateRouteOpacities = function (r, highOpacity, lowOpacity) {
+      for (var k = 0; k < routes.length; k++) {
+        if (k == r) {
+          routes[k].setStyle({opacity: highOpacity});
+        } else {
+          routes[k].setStyle({opacity: lowOpacity});
+        }
+      }
+    }
+
     var showRoute = function (r) {
       return function() {
-        routes[r].openPopup()
+        // Increase this route's opacity and decrease others.
+        routes[r].openPopup();
+        routes[r].bringToFront();
+        updateRouteOpacities(r, LSetup.highOpacity, LSetup.lowOpacity);
+
         LSetup.map.fitBounds(routes[r].getBounds(), {
           paddingBottomRight: [panelControl.getWidth(), 0],
           paddingTopLeft: [50, 0],
         });
       }
     };
 
+    path.on({
+      click: showRoute(i),
+      popupclose: function() {
+        for (var k = 0; k < routes.length; k++) {
+          routes[k].setStyle({opacity: LSetup.opacity});
+        }
+      }
+    });
     row.onclick = showRoute(i);
 
     var vCell = row.insertCell(0);