map.html

@@ -66,6 +66,18 @@
   }
}

function popupHide() {
   popup.setPosition(undefined);
   popup_feature_id = null;
}

function popupShow(coordinates, id) {
   popup.setPosition(coordinates);
   if(id) {
      popup_feature_id = id;
   }
}

function init() {
   if(!window.jQuery) {
      fail(lang.jquery_not_loaded);
@@ -107,8 +119,8 @@
   });
   
   // display popup on click
   map.on('singleclick', function(evt) {
      var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) { return feature; });
   map.on('singleclick', function(e) {
      var feature = map.forEachFeatureAtPixel(e.pixel, function(feature) { return feature; });
      if(feature) {
         var coordinates = feature.getGeometry().getCoordinates();
         
@@ -120,21 +132,17 @@
            addParaWithText(popup_element, vehicle_type.num + ' ' + vehicle_type.type);
         }
         
         popup.setPosition(coordinates);
         popup_feature_id = feature.getId();
         popupShow(coordinates, feature.getId());
      } else {
         popup.setPosition(undefined);
         popup_feature_id = null;
         popupHide();
      }
   });

   // change mouse cursor when over marker
   map.on('pointermove', function(e) {
      var pixel = map.getEventPixel(e.originalEvent);
      var hit = map.hasFeatureAtPixel(pixel);
      var target = map.getTarget();
      if(target.style)
         target.style.cursor = hit ? 'pointer' : '';
      var hit = map.hasFeatureAtPixel(e.pixel);
      var target = map.getTargetElement();
      target.style.cursor = hit ? 'pointer' : '';
   });
}

@@ -157,6 +165,9 @@
         if(vehicle.isDeleted) {
            if(vehicle_feature) {
               vehicles_source.removeFeature(vehicle_feature);
               if(popup_feature_id == vehicle.id) {
                  popupHide();
               }
            }
            continue;
         }
@@ -196,7 +207,8 @@
                  stroke: new ol.style.Stroke({color: color_type, width: 2}),
                  points: 3,
                  radius: 12,
                  rotation: Math.PI * 2.0 * vehicle.heading / 360.0,
                  rotation: Math.PI * parseFloat(vehicle.heading) / 180.0,
                  rotateWithView: true,
                  angle: 0
               }),
               text: new ol.style.Text({
@@ -208,8 +220,10 @@
            vehicles_source.addFeature(vehicle_feature);
         } else {
            vehicle_feature.setProperties(vehicle);
            if(popup_feature_id == vehicle.id) {
               popup.setPosition(vehicle_feature.getGeometry().getCoordinates());
            vehicle_feature.getStyle().getImage().setRotation(Math.PI * parseFloat(vehicle.heading) / 180.0);
				
            if(popup_feature_id == vehicle_feature.getId()) {
               popupShow(vehicle_feature.getGeometry().getCoordinates());
            }
         }
      }