Use jQuery to listen to map mousemove in examples

This commit also removes the click listener, which was used for touch devices. The click listener will be added back when the lib will correctly handle clicks on touch devices.

examples/gpx.html

@@ -47,6 +47,7 @@
 
     </div>
 
+    <script src="jquery.min.js" type="text/javascript"></script>
     <script src="loader.js?id=gpx" type="text/javascript"></script>
     <script src="../resources/example-behaviour.js" type="text/javascript"></script>
 

examples/gpx.js

@@ -28,9 +28,11 @@ var map = new ol.Map({
   })
 });
 
-map.on(['click', 'mousemove'], function(evt) {
+// FIXME support touch devices
+$(map.getViewport()).on('mousemove', function(evt) {
+  var pixel = map.getEventPixel(evt.originalEvent);
   map.getFeatures({
-    pixel: evt.getPixel(),
+    pixel: pixel,
     layers: [vector],
     success: function(featuresByLayer) {
       var features = featuresByLayer[0];

examples/kml-earthquakes.js

@@ -59,8 +59,10 @@ info.tooltip({
   animation: false,
   trigger: 'manual'
 });
-map.on(['click', 'mousemove'], function(evt) {
-  var pixel = evt.getPixel();
+
+// FIXME support touch devices
+$(map.getViewport()).on('mousemove', function(evt) {
+  var pixel = map.getEventPixel(evt.originalEvent);
   info.css({
     left: pixel[0] + 'px',
     top: (pixel[1] - 15) + 'px'

examples/kml-timezones.js

@@ -81,8 +81,10 @@ info.tooltip({
   animation: false,
   trigger: 'manual'
 });
-map.on(['click', 'mousemove'], function(evt) {
-  var pixel = evt.getPixel();
+
+// FIXME support touch devices
+$(map.getViewport()).on('mousemove', function(evt) {
+  var pixel = map.getEventPixel(evt.originalEvent);
   info.css({
     left: pixel[0] + 'px',
     top: (pixel[1] - 15) + 'px'

examples/kml.html

@@ -48,6 +48,7 @@
 
     </div>
 
+    <script src="jquery.min.js" type="text/javascript"></script>
     <script src="loader.js?id=kml" type="text/javascript"></script>
     <script src="../resources/example-behaviour.js" type="text/javascript"></script>
 

examples/kml.js

@@ -39,9 +39,11 @@ var map = new ol.Map({
   })
 });
 
-map.on(['click', 'mousemove'], function(evt) {
+// FIXME support touch devices
+$(map.getViewport()).on('mousemove', function(evt) {
+  var pixel = map.getEventPixel(evt.originalEvent);
   map.getFeatures({
-    pixel: evt.getPixel(),
+    pixel: pixel,
     layers: [vector],
     success: function(featuresByLayer) {
       var features = featuresByLayer[0];

examples/vector-layer.html

@@ -48,6 +48,7 @@
 
     </div>
 
+    <script src="jquery.min.js" type="text/javascript"></script>
     <script src="loader.js?id=vector-layer" type="text/javascript"></script>
     <script src="../resources/example-behaviour.js" type="text/javascript"></script>
 

examples/vector-layer.js

@@ -64,9 +64,11 @@ var map = new ol.Map({
   })
 });
 
-map.on(['click', 'mousemove'], function(evt) {
+// FIXME support touch devices
+$(map.getViewport()).on('mousemove', function(evt) {
+  var pixel = map.getEventPixel(evt.originalEvent);
   map.getFeatures({
-    pixel: evt.getPixel(),
+    pixel: pixel,
     layers: [vector],
     success: function(featuresByLayer) {
       var features = featuresByLayer[0];