Add click event as responsive alternative to singleclick

The singleclick event makes the application feel slow because
of the 250 ms delay that is used to rule out a dblclick.

examples/drag-and-drop-image-vector.js

@@ -149,6 +149,6 @@ $(map.getViewport()).on('mousemove', function(evt) {
   displayFeatureInfo(pixel);
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   displayFeatureInfo(evt.pixel);
 });

examples/drag-and-drop.js

@@ -146,6 +146,6 @@ $(map.getViewport()).on('mousemove', function(evt) {
   displayFeatureInfo(pixel);
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   displayFeatureInfo(evt.pixel);
 });

examples/getfeatureinfo.js

@@ -28,7 +28,7 @@ var map = new ol.Map({
   view: view
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   document.getElementById('info').innerHTML = '';
   var viewResolution = /** @type {number} */ (view.getResolution());
   var url = wmsSource.getGetFeatureInfoUrl(

examples/gpx.js

@@ -87,6 +87,6 @@ $(map.getViewport()).on('mousemove', function(evt) {
   displayFeatureInfo(pixel);
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   displayFeatureInfo(evt.pixel);
 });

examples/icon.js

@@ -64,7 +64,7 @@ var popup = new ol.Overlay({
 map.addOverlay(popup);
 
 // display popup on click
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   var feature = map.forEachFeatureAtPixel(evt.pixel,
       function(feature, layer) {
         return feature;

examples/igc.js

@@ -126,7 +126,7 @@ $(map.getViewport()).on('mousemove', function(evt) {
   displaySnap(coordinate);
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   displaySnap(evt.coordinate);
 });
 

examples/image-vector-layer.js

@@ -86,6 +86,6 @@ $(map.getViewport()).on('mousemove', function(evt) {
   displayFeatureInfo(pixel);
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   displayFeatureInfo(evt.pixel);
 });

examples/kml-earthquakes.js

@@ -89,6 +89,6 @@ $(map.getViewport()).on('mousemove', function(evt) {
   displayFeatureInfo(map.getEventPixel(evt.originalEvent));
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   displayFeatureInfo(evt.pixel);
 });

examples/kml-timezones.js

@@ -96,6 +96,6 @@ $(map.getViewport()).on('mousemove', function(evt) {
   displayFeatureInfo(map.getEventPixel(evt.originalEvent));
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   displayFeatureInfo(evt.pixel);
 });

examples/kml.js

@@ -53,6 +53,6 @@ $(map.getViewport()).on('mousemove', function(evt) {
   displayFeatureInfo(pixel);
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   displayFeatureInfo(evt.pixel);
 });

examples/overlay.js

@@ -45,7 +45,7 @@ var popup = new ol.Overlay({
 });
 map.addOverlay(popup);
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   var element = popup.getElement();
   var coordinate = evt.coordinate;
   var hdms = ol.coordinate.toStringHDMS(ol.proj.transform(

examples/popup.js

@@ -60,7 +60,7 @@ var map = new ol.Map({
 /**
  * Add a click handler to the map to render the popup.
  */
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   var coordinate = evt.coordinate;
   var hdms = ol.coordinate.toStringHDMS(ol.proj.transform(
       coordinate, 'EPSG:3857', 'EPSG:4326'));

examples/synthetic-points.js

@@ -95,7 +95,7 @@ $(map.getViewport()).on('mousemove', function(evt) {
   displaySnap(coordinate);
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   displaySnap(evt.coordinate);
 });
 

examples/vector-layer.js

@@ -123,6 +123,6 @@ $(map.getViewport()).on('mousemove', function(evt) {
   displayFeatureInfo(pixel);
 });
 
-map.on('singleclick', function(evt) {
+map.on('click', function(evt) {
   displayFeatureInfo(evt.pixel);
 });

src/ol/mapbrowserevent.js

@@ -248,11 +248,15 @@ ol.MapBrowserEventHandler.prototype.emulateClickLegacyIE_ =
  * @private
  */
 ol.MapBrowserEventHandler.prototype.emulateClick_ = function(pointerEvent) {
+  var newEvent;
+  newEvent = new ol.MapBrowserPointerEvent(
+      ol.MapBrowserEvent.EventType.CLICK, this.map_, pointerEvent);
+  this.dispatchEvent(newEvent);
   if (this.clickTimeoutId_ !== 0) {
     // double-click
     goog.global.clearTimeout(this.clickTimeoutId_);
     this.clickTimeoutId_ = 0;
-    var newEvent = new ol.MapBrowserPointerEvent(
+    newEvent = new ol.MapBrowserPointerEvent(
         ol.MapBrowserEvent.EventType.DBLCLICK, this.map_, pointerEvent);
     this.dispatchEvent(newEvent);
   } else {
@@ -470,6 +474,12 @@ ol.MapBrowserEvent.EventType = {
    * @todo stability experimental
    */
   SINGLECLICK: 'singleclick',
+  /**
+   * A click with no dragging. A double click will fire two of this.
+   * @event ol.MapBrowserEvent#click
+   * @todo stability experimental
+   */
+  CLICK: goog.events.EventType.CLICK,
   /**
    * A true double click, with no dragging.
    * @event ol.MapBrowserEvent#dblclick

test/spec/ol/mapbrowserevent.test.js

@@ -54,12 +54,13 @@ describe('ol.MapBrowserEventHandler', function() {
     });
 
     it('emulates dblclick', function() {
-      handler.emulateClick_({
+      handler.emulateClick_(new ol.pointer.PointerEvent('pointerdown',
-        type: 'mousedown',
+          new goog.events.BrowserEvent({
-        target: target,
+            type: 'mousedown',
-        clientX: 0,
+            target: target,
-        clientY: 0
+            clientX: 0,
-      });
+            clientY: 0
+          })));
       expect(singleclickSpy.called).to.not.be.ok();
       expect(dblclickSpy.called).to.not.be.ok();