Merge pull request #482 from twpayne/control-clean-ups

Control clean-ups

build.py

@@ -109,6 +109,7 @@ EXAMPLES_SRC = [path
                 if not path.startswith('examples/font-awesome')
                 if path != 'examples/Jugl.js'
                 if path != 'examples/jquery.min.js'
+                if path != 'examples/loader.js'
                 if path != 'examples/example-list.js']
 
 EXAMPLES_JSON = ['build/' + example.replace('.html', '.json')

src/ol/control/attributioncontrol.js

@@ -5,15 +5,13 @@ goog.provide('ol.control.Attribution');
 goog.require('goog.array');
 goog.require('goog.dom');
 goog.require('goog.dom.TagName');
-goog.require('goog.events');
 goog.require('goog.object');
 goog.require('goog.style');
 goog.require('ol.Attribution');
 goog.require('ol.FrameState');
-goog.require('ol.MapEvent');
-goog.require('ol.MapEventType');
 goog.require('ol.TileRange');
 goog.require('ol.control.Control');
+goog.require('ol.css');
 goog.require('ol.source.Source');
 
 
@@ -34,7 +32,7 @@ ol.control.Attribution = function(opt_options) {
   this.ulElement_ = goog.dom.createElement(goog.dom.TagName.UL);
 
   var element = goog.dom.createDom(goog.dom.TagName.DIV, {
-    'class': 'ol-attribution ' + ol.CSS_CLASS_UNSELECTABLE
+    'class': 'ol-attribution ' + ol.css.CLASS_UNSELECTABLE
   }, this.ulElement_);
 
   goog.base(this, {
@@ -61,12 +59,6 @@ ol.control.Attribution = function(opt_options) {
    */
   this.attributionElementRenderedVisible_ = {};
 
-  /**
-   * @private
-   * @type {?number}
-   */
-  this.postrenderListenKey_ = null;
-
 };
 goog.inherits(ol.control.Attribution, ol.control.Control);
 
@@ -107,29 +99,13 @@ ol.control.Attribution.prototype.getTileSourceAttributions =
 
 
 /**
- * @param {ol.MapEvent} mapEvent Map event.
+ * @inheritDoc
  */
 ol.control.Attribution.prototype.handleMapPostrender = function(mapEvent) {
   this.updateElement_(mapEvent.frameState);
 };
 
 
-/**
- * @inheritDoc
- */
-ol.control.Attribution.prototype.setMap = function(map) {
-  if (!goog.isNull(this.postrenderListenKey_)) {
-    goog.events.unlistenByKey(this.postrenderListenKey_);
-    this.postrenderListenKey_ = null;
-  }
-  goog.base(this, 'setMap', map);
-  if (!goog.isNull(map)) {
-    this.postrenderListenKey_ = goog.events.listen(
-        map, ol.MapEventType.POSTRENDER, this.handleMapPostrender, false, this);
-  }
-};
-
-
 /**
  * @private
  * @param {?ol.FrameState} frameState Frame state.

src/ol/control/control.js

@@ -2,6 +2,9 @@ goog.provide('ol.control.Control');
 goog.provide('ol.control.ControlOptions');
 
 goog.require('goog.Disposable');
+goog.require('goog.events');
+goog.require('ol.MapEvent');
+goog.require('ol.MapEventType');
 
 
 /**
@@ -44,6 +47,12 @@ ol.control.Control = function(controlOptions) {
    */
   this.map_ = null;
 
+  /**
+   * @protected
+   * @type {!Array.<?number>}
+   */
+  this.listenerKeys = [];
+
   if (goog.isDef(controlOptions.map)) {
     this.setMap(controlOptions.map);
   }
@@ -69,6 +78,12 @@ ol.control.Control.prototype.getMap = function() {
 };
 
 
+/**
+ * @param {ol.MapEvent} mapEvent Map event.
+ */
+ol.control.Control.prototype.handleMapPostrender = goog.nullFunction;
+
+
 /**
  * Removes the control from its current map and attaches it to the new map.
  * Subtypes might also wish set up event handlers to get notified about changes
@@ -80,10 +95,18 @@ ol.control.Control.prototype.setMap = function(map) {
   if (!goog.isNull(this.map_)) {
     goog.dom.removeNode(this.element);
   }
+  if (!goog.array.isEmpty(this.listenerKeys)) {
+    goog.array.forEach(this.listenerKeys, goog.events.unlistenByKey);
+    this.listenerKeys.length = 0;
+  }
   this.map_ = map;
   if (!goog.isNull(this.map_)) {
     var target = goog.isDef(this.target_) ?
         this.target_ : map.getOverlayContainer();
     goog.dom.appendChild(target, this.element);
+    if (this.handleMapPostrender !== goog.nullFunction) {
+      this.listenerKeys.push(goog.events.listen(map,
+          ol.MapEventType.POSTRENDER, this.handleMapPostrender, false, this));
+    }
   }
 };

src/ol/control/dragboxcontrol.js

@@ -42,12 +42,6 @@ ol.control.DragBox = function(dragBoxOptions) {
    */
   this.startCoordinate_ = dragBoxOptions.startCoordinate;
 
-  /**
-   * @private
-   * @type {?number}
-   */
-  this.dragListenKey_ = null;
-
   goog.base(this, {
     element: element,
     map: dragBoxOptions.map
@@ -61,19 +55,15 @@ goog.inherits(ol.control.DragBox, ol.control.Control);
  * @inheritDoc
  */
 ol.control.DragBox.prototype.setMap = function(map) {
-  if (!goog.isNull(this.dragListenKey_)) {
+  goog.base(this, 'setMap', map);
-    goog.events.unlistenByKey(this.dragListenKey_);
-    this.dragListenKey_ = null;
-  }
   if (!goog.isNull(map)) {
     this.startPixel_ = map.getPixelFromCoordinate(this.startCoordinate_);
     goog.asserts.assert(goog.isDef(this.startPixel_));
     goog.style.setPosition(this.element, this.startPixel_);
     goog.style.setBorderBoxSize(this.element, new ol.Size(0, 0));
-    this.dragListenKey_ = goog.events.listen(
+    this.listenerKeys.push(goog.events.listen(
-        map, ol.MapBrowserEvent.EventType.DRAG, this.updateBox_, false, this);
+        map, ol.MapBrowserEvent.EventType.DRAG, this.updateBox_, false, this));
   }
-  goog.base(this, 'setMap', map);
 };
 
 

src/ol/control/logocontrol.js

@@ -2,13 +2,11 @@ goog.provide('ol.control.Logo');
 
 goog.require('goog.dom');
 goog.require('goog.dom.TagName');
-goog.require('goog.events');
 goog.require('goog.object');
 goog.require('goog.style');
 goog.require('ol.FrameState');
-goog.require('ol.MapEvent');
-goog.require('ol.MapEventType');
 goog.require('ol.control.Control');
+goog.require('ol.css');
 
 
 
@@ -28,7 +26,7 @@ ol.control.Logo = function(opt_options) {
   this.ulElement_ = goog.dom.createElement(goog.dom.TagName.UL);
 
   var element = goog.dom.createDom(goog.dom.TagName.DIV, {
-    'class': 'ol-logo ' + ol.CSS_CLASS_UNSELECTABLE
+    'class': 'ol-logo ' + ol.css.CLASS_UNSELECTABLE
   }, this.ulElement_);
 
   goog.base(this, {
@@ -49,12 +47,6 @@ ol.control.Logo = function(opt_options) {
    */
   this.logoElements_ = {};
 
-  /**
-   * @private
-   * @type {?number}
-   */
-  this.postrenderListenKey_ = null;
-
 };
 goog.inherits(ol.control.Logo, ol.control.Control);
 
@@ -67,22 +59,6 @@ ol.control.Logo.prototype.handleMapPostrender = function(mapEvent) {
 };
 
 
-/**
- * @inheritDoc
- */
-ol.control.Logo.prototype.setMap = function(map) {
-  if (!goog.isNull(this.postrenderListenKey_)) {
-    goog.events.unlistenByKey(this.postrenderListenKey_);
-    this.postrenderListenKey_ = null;
-  }
-  goog.base(this, 'setMap', map);
-  if (!goog.isNull(map)) {
-    this.postrenderListenKey_ = goog.events.listen(
-        map, ol.MapEventType.POSTRENDER, this.handleMapPostrender, false, this);
-  }
-};
-
-
 /**
  * @param {?ol.FrameState} frameState Frame state.
  * @private

src/ol/control/mousepositioncontrol.js

@@ -9,8 +9,6 @@ goog.require('goog.events');
 goog.require('goog.events.EventType');
 goog.require('goog.style');
 goog.require('ol.CoordinateFormatType');
-goog.require('ol.MapEvent');
-goog.require('ol.MapEventType');
 goog.require('ol.Pixel');
 goog.require('ol.Projection');
 goog.require('ol.TransformFunction');
@@ -87,19 +85,12 @@ ol.control.MousePosition = function(opt_options) {
    */
   this.lastMouseMovePixel_ = null;
 
-  /**
-   * @private
-   * @type {Array.<?number>}
-   */
-  this.listenerKeys_ = null;
-
 };
 goog.inherits(ol.control.MousePosition, ol.control.Control);
 
 
 /**
- * @param {ol.MapEvent} mapEvent Map event.
+ * @inheritDoc
- * @protected
  */
 ol.control.MousePosition.prototype.handleMapPostrender = function(mapEvent) {
   var frameState = mapEvent.frameState;
@@ -140,21 +131,15 @@ ol.control.MousePosition.prototype.handleMouseOut = function(browserEvent) {
  * @inheritDoc
  */
 ol.control.MousePosition.prototype.setMap = function(map) {
-  if (!goog.isNull(this.listenerKeys_)) {
-    goog.array.forEach(this.listenerKeys_, goog.events.unlistenByKey);
-    this.listenerKeys_ = null;
-  }
   goog.base(this, 'setMap', map);
   if (!goog.isNull(map)) {
     var viewport = map.getViewport();
-    this.listenerKeys_ = [
+    this.listenerKeys.push(
-      goog.events.listen(viewport, goog.events.EventType.MOUSEMOVE,
+        goog.events.listen(viewport, goog.events.EventType.MOUSEMOVE,
-          this.handleMouseMove, false, this),
+            this.handleMouseMove, false, this),
-      goog.events.listen(viewport, goog.events.EventType.MOUSEOUT,
+        goog.events.listen(viewport, goog.events.EventType.MOUSEOUT,
-          this.handleMouseOut, false, this),
+            this.handleMouseOut, false, this)
-      goog.events.listen(map, ol.MapEventType.POSTRENDER,
+    );
-          this.handleMapPostrender, false, this)
-    ];
   }
 };
 

src/ol/control/scalelinecontrol.js

@@ -3,13 +3,11 @@ goog.provide('ol.control.ScaleLineUnits');
 
 goog.require('goog.dom');
 goog.require('goog.style');
-goog.require('ol');
 goog.require('ol.FrameState');
-goog.require('ol.MapEvent');
-goog.require('ol.MapEventType');
 goog.require('ol.ProjectionUnits');
 goog.require('ol.TransformFunction');
 goog.require('ol.control.Control');
+goog.require('ol.css');
 goog.require('ol.projection');
 goog.require('ol.sphere.NORMAL');
 
@@ -49,7 +47,7 @@ ol.control.ScaleLine = function(opt_options) {
    * @type {Element}
    */
   this.element_ = goog.dom.createDom(goog.dom.TagName.DIV, {
-    'class': 'ol-scale-line ' + ol.CSS_CLASS_UNSELECTABLE
+    'class': 'ol-scale-line ' + ol.css.CLASS_UNSELECTABLE
   }, this.innerElement_);
 
   /**
@@ -65,12 +63,6 @@ ol.control.ScaleLine = function(opt_options) {
   this.units_ = goog.isDef(options.units) ?
       options.units : ol.control.ScaleLineUnits.METRIC;
 
-  /**
-   * @private
-   * @type {Array.<?number>}
-   */
-  this.listenerKeys_ = null;
-
   /**
    * @private
    * @type {boolean}
@@ -112,30 +104,11 @@ goog.inherits(ol.control.ScaleLine, ol.control.Control);
 ol.control.ScaleLine.LEADING_DIGITS = [1, 2, 5];
 
 
-/**
- * @param {ol.MapEvent} mapEvent Map event.
- */
-ol.control.ScaleLine.prototype.handleMapPostrender = function(mapEvent) {
-  var frameState = mapEvent.frameState;
-  this.updateElement_(mapEvent.frameState);
-};
-
-
 /**
  * @inheritDoc
  */
-ol.control.ScaleLine.prototype.setMap = function(map) {
+ol.control.ScaleLine.prototype.handleMapPostrender = function(mapEvent) {
-  if (!goog.isNull(this.listenerKeys_)) {
+  this.updateElement_(mapEvent.frameState);
-    goog.array.forEach(this.listenerKeys_, goog.events.unlistenByKey);
-    this.listenerKeys_ = null;
-  }
-  goog.base(this, 'setMap', map);
-  if (!goog.isNull(map)) {
-    this.listenerKeys_ = [
-      goog.events.listen(map, ol.MapEventType.POSTRENDER,
-          this.handleMapPostrender, false, this)
-    ];
-  }
 };
 
 

src/ol/control/zoomcontrol.js

@@ -6,8 +6,8 @@ goog.require('goog.dom');
 goog.require('goog.dom.TagName');
 goog.require('goog.events');
 goog.require('goog.events.EventType');
-goog.require('ol');
 goog.require('ol.control.Control');
+goog.require('ol.css');
 
 
 /**
@@ -44,7 +44,7 @@ ol.control.Zoom = function(opt_options) {
     goog.events.EventType.CLICK
   ], this.handleOut_, false, this);
 
-  var cssClasses = 'ol-zoom ' + ol.CSS_CLASS_UNSELECTABLE;
+  var cssClasses = 'ol-zoom ' + ol.css.CLASS_UNSELECTABLE;
   var element = goog.dom.createDom(goog.dom.TagName.DIV, cssClasses, inElement,
       outElement);
 

src/ol/control/zoomslidercontrol.js

@@ -10,9 +10,8 @@ goog.require('goog.dom.TagName');
 goog.require('goog.events');
 goog.require('goog.fx.Dragger');
 goog.require('goog.style');
-goog.require('ol');
-goog.require('ol.MapEventType');
 goog.require('ol.control.Control');
+goog.require('ol.css');
 
 
 
@@ -74,12 +73,6 @@ ol.control.ZoomSlider = function(zoomSliderOptions) {
    */
   this.direction_ = ol.control.ZoomSlider.direction.VERTICAL;
 
-  /**
-   * @private
-   * @type {Array.<?number>}
-   */
-  this.mapListenerKeys_ = null;
-
   /**
    * @private
    * @type {Array.<?number>}
@@ -157,31 +150,11 @@ ol.control.ZoomSlider.DEFAULT_MAX_RESOLUTION = 156543.0339;
 ol.control.ZoomSlider.prototype.setMap = function(map) {
   goog.base(this, 'setMap', map);
   this.currentResolution_ = map.getView().getResolution();
-  this.initMapEventListeners_();
   this.initSlider_();
   this.positionThumbForResolution_(this.currentResolution_);
 };
 
 
-/**
- * Initializes the event listeners for map events.
- *
- * @private
- */
-ol.control.ZoomSlider.prototype.initMapEventListeners_ = function() {
-  if (!goog.isNull(this.mapListenerKeys_)) {
-    goog.array.forEach(this.mapListenerKeys_, goog.events.unlistenByKey);
-    this.mapListenerKeys_ = null;
-  }
-  if (!goog.isNull(this.getMap())) {
-    this.mapListenerKeys_ = [
-      goog.events.listen(this.getMap(), ol.MapEventType.POSTRENDER,
-          this.handleMapPostRender_, undefined, this)
-    ];
-  }
-};
-
-
 /**
  * Initializes the slider element. This will determine and set this controls
  * direction_ and also constrain the dragging of the thumb to always be within
@@ -217,11 +190,10 @@ ol.control.ZoomSlider.prototype.initSlider_ = function() {
 
 
 /**
- * @param {ol.MapEvent} mapEvtObj The ol.MapEvent object.
+ * @inheritDoc
- * @private
  */
-ol.control.ZoomSlider.prototype.handleMapPostRender_ = function(mapEvtObj) {
+ol.control.ZoomSlider.prototype.handleMapPostrender = function(mapEvent) {
-  var res = mapEvtObj.frameState.view2DState.resolution;
+  var res = mapEvent.frameState.view2DState.resolution;
   if (res !== this.currentResolution_) {
     this.currentResolution_ = res;
     this.positionThumbForResolution_(res);
@@ -363,9 +335,9 @@ ol.control.ZoomSlider.prototype.createDraggable_ = function(elem) {
 ol.control.ZoomSlider.prototype.createDom_ = function(opt_elem) {
   var elem,
       sliderCssCls = ol.control.ZoomSlider.CSS_CLASS_CONTAINER + ' ' +
-          ol.CSS_CLASS_UNSELECTABLE,
+          ol.css.CLASS_UNSELECTABLE,
       thumbCssCls = ol.control.ZoomSlider.CSS_CLASS_THUMB + ' ' +
-          ol.CSS_CLASS_UNSELECTABLE;
+          ol.css.CLASS_UNSELECTABLE;
 
   elem = goog.dom.createDom(goog.dom.TagName.DIV, sliderCssCls,
       goog.dom.createDom(goog.dom.TagName.DIV, thumbCssCls));

src/ol/css.js

@@ -0,0 +1,9 @@
+goog.provide('ol.css');
+
+
+/**
+ * The CSS class that we'll give the DOM elements to have them unselectable.
+ *
+ * @const {string}
+ */
+ol.css.CLASS_UNSELECTABLE = 'ol-unselectable';

src/ol/ol.js

@@ -7,11 +7,3 @@ if (goog.DEBUG) {
   var logger = goog.debug.Logger.getLogger('ol');
   logger.setLevel(goog.debug.Logger.Level.FINEST);
 }
-
-
-/**
- * The CSS class that we'll give the DOM elements to have them unselectable.
- *
- * @const {string}
- */
-ol.CSS_CLASS_UNSELECTABLE = 'ol-unselectable';

src/ol/renderer/canvas/canvasmaprenderer.js

@@ -6,8 +6,8 @@ goog.require('goog.array');
 goog.require('goog.dom');
 goog.require('goog.style');
 goog.require('goog.vec.Mat4');
-goog.require('ol');
 goog.require('ol.Size');
+goog.require('ol.css');
 goog.require('ol.layer.ImageLayer');
 goog.require('ol.layer.TileLayer');
 goog.require('ol.layer.Vector');
@@ -41,7 +41,7 @@ ol.renderer.canvas.Map = function(container, map) {
   this.canvas_ = goog.dom.createElement(goog.dom.TagName.CANVAS);
   this.canvas_.height = this.canvasSize_.height;
   this.canvas_.width = this.canvasSize_.width;
-  this.canvas_.className = ol.CSS_CLASS_UNSELECTABLE;
+  this.canvas_.className = ol.css.CLASS_UNSELECTABLE;
   goog.dom.insertChildAt(container, this.canvas_, 0);
 
   /**

src/ol/renderer/dom/dommaprenderer.js

@@ -5,7 +5,7 @@ goog.require('goog.asserts');
 goog.require('goog.dom');
 goog.require('goog.dom.TagName');
 goog.require('goog.style');
-goog.require('ol');
+goog.require('ol.css');
 goog.require('ol.layer.ImageLayer');
 goog.require('ol.layer.TileLayer');
 goog.require('ol.renderer.Map');
@@ -29,7 +29,7 @@ ol.renderer.dom.Map = function(container, map) {
    * @private
    */
   this.layersPane_ = goog.dom.createElement(goog.dom.TagName.DIV);
-  this.layersPane_.className = 'ol-layers ' + ol.CSS_CLASS_UNSELECTABLE;
+  this.layersPane_.className = 'ol-layers ' + ol.css.CLASS_UNSELECTABLE;
   var style = this.layersPane_.style;
   style.position = 'absolute';
   style.width = '100%';

src/ol/renderer/webgl/webglmaprenderer.js

@@ -10,10 +10,10 @@ goog.require('goog.events');
 goog.require('goog.events.Event');
 goog.require('goog.style');
 goog.require('goog.webgl');
-goog.require('ol');
 goog.require('ol.FrameState');
 goog.require('ol.Size');
 goog.require('ol.Tile');
+goog.require('ol.css');
 goog.require('ol.layer.ImageLayer');
 goog.require('ol.layer.TileLayer');
 goog.require('ol.renderer.Map');
@@ -75,7 +75,7 @@ ol.renderer.webgl.Map = function(container, map) {
   this.canvas_ = goog.dom.createElement(goog.dom.TagName.CANVAS);
   this.canvas_.height = container.clientHeight;
   this.canvas_.width = container.clientWidth;
-  this.canvas_.className = ol.CSS_CLASS_UNSELECTABLE;
+  this.canvas_.className = ol.css.CLASS_UNSELECTABLE;
   goog.dom.insertChildAt(container, this.canvas_, 0);
 
   /**