Popup works again.

[philipp/winterrodeln/mediawiki_extensions/wrmap.git] / wrmap.js

diff --git a/wrmap.js b/wrmap.js
index ab45a89f1e3d745f99a2ce9a0232ff872a3c8bb1..878b70982faa1cec46f186d855b6d901e2ca8a63 100644 (file)
--- a/wrmap.js
+++ b/wrmap.js
@@ -95,20 +95,40 @@ function init_wrmap(i, jq_map) {
 
        function get_feature_title(feature) {
                var title = feature.get('type');
+               if (title == 'sledrun') return feature.get('name');
                title = title.charAt(0).toUpperCase() + title.slice(1); // first letter uppercase
                if (feature.get('name')) title += ': ' + feature.get('name');
                return title;
        }
 
+       // Returns 0 to 5 for features that represent sledruns as their condition
+       var get_sledrun_condition = function(feature) {
+               var condition = feature.get('condition');
+               if (condition === undefined) return 0;
+               return condition;
+       }
+
        function style_point_function(feature, resolution) {
-               var src = img_path + '/marker_p_' + feature.get('type') + '.png';
-               return new ol.style.Style({
-                       image: new ol.style.Icon({
-                               src: src,
-                               imgSize: [20, 34],
-                               anchor: [0.5, 1.0]
-                       }),
-               });
+               if (feature.get('type') == 'sledrun') {
+                       var condition = get_sledrun_condition(feature);
+                       var src = img_path + '/marker_c_sledrun_' + condition + 'nn.png';
+                       return new ol.style.Style({
+                               image: new ol.style.Icon({
+                                       src: src,
+                                       imgSize: [17, 17],
+                                       anchor: [0.5, 0.5]
+                               }),
+                       });
+               } else {
+                       var src = img_path + '/marker_p_' + feature.get('type') + '.png';
+                       return new ol.style.Style({
+                               image: new ol.style.Icon({
+                                       src: src,
+                                       imgSize: [20, 34],
+                                       anchor: [0.5, 1.0]
+                               }),
+                       });
+               }
        }
 
        function style_point_function_selected(feature, resolution) {
@@ -153,6 +173,7 @@ function init_wrmap(i, jq_map) {
                return style_path_function(feature, resolution);
        };
 
+
        // popup overlay
        // -------------
        var popup_container = document.getElementById('popup');
@@ -195,12 +216,6 @@ function init_wrmap(i, jq_map) {
                value: 'sledrun'
        });
 
-       // Returns 0 to 5 for features that represent sledruns as their condition
-       var get_sledrun_condition = function(feature) {
-               if (feature.attributes.condition === undefined) return 0;
-               return feature.attributes.condition;
-       }
-
 
        var layer_point = new OpenLayers.Layer.Vector("Point", {
                styleMap: new OpenLayers.StyleMap({
@@ -351,6 +366,9 @@ function init_wrmap(i, jq_map) {
                        attributionOptions: {
                                collapsible: false
                        }
+               }),
+               interactions: ol.interaction.defaults({
+                       mouseWheelZoom: false
                })
        });
 
@@ -360,12 +378,18 @@ function init_wrmap(i, jq_map) {
                style: style_function_selected,
        });
        map.addInteraction(select_hover);
-       map.on('singleclick', function(event) {
-               popup_content.innerHTML = '<p>You clicked</p>';
-               popup_overlay.setPosition(event.coordinate);
+
+       var select_click = new ol.interaction.Select({
+               condition: ol.events.condition.click,
        });
-       select_hover.on('select', function(event) {
-               console.log(event);
+       map.addInteraction(select_click);
+       select_click.on('select', function(event) {
+               if (event.selected.length > 0) {
+                       let feature = event.selected[0];
+                       let coordinates = feature.getGeometry().getCoordinates();
+                       popup_content.innerHTML = '<p>You clicked</p>';
+                       popup_overlay.setPosition(coordinates);
+               }
        });
 
        /*