Manual class transform

src/ol/AssertionError.js

@@ -11,8 +11,9 @@ import {VERSION, inherits} from './util.js';
  * @extends {Error}
  * @param {number} code Error code.
  */
-const AssertionError = function(code) {
+class AssertionError {
 
+  constructor(code) {
     const path = VERSION.split('-')[0];
 
     /**
@@ -33,7 +34,9 @@ const AssertionError = function(code) {
 
     this.name = 'AssertionError';
 
-};
+  }
+
+}
 
 inherits(AssertionError, Error);
 

src/ol/Collection.js

@@ -27,8 +27,9 @@ const Property = {
  * @param {module:ol/CollectionEventType} type Type.
  * @param {*=} opt_element Element.
  */
-export const CollectionEvent = function(type, opt_element) {
+export class CollectionEvent {
 
+  constructor(type, opt_element) {
     Event.call(this, type);
 
     /**
@@ -38,7 +39,9 @@ export const CollectionEvent = function(type, opt_element) {
      */
     this.element = opt_element;
 
-};
+  }
+
+}
 
 inherits(CollectionEvent, Event);
 

src/ol/MapBrowserPointerEvent.js

@@ -14,8 +14,9 @@ import MapBrowserEvent from './MapBrowserEvent.js';
  * @param {boolean=} opt_dragging Is the map currently being dragged?
  * @param {?module:ol/PluggableMap~FrameState=} opt_frameState Frame state.
  */
-const MapBrowserPointerEvent = function(type, map, pointerEvent, opt_dragging,
+class MapBrowserPointerEvent {
-  opt_frameState) {
+
+  constructor(type, map, pointerEvent, opt_dragging, opt_frameState) {
 
     MapBrowserEvent.call(this, type, map, pointerEvent.originalEvent, opt_dragging,
       opt_frameState);
@@ -26,7 +27,10 @@ const MapBrowserPointerEvent = function(type, map, pointerEvent, opt_dragging,
      */
     this.pointerEvent = pointerEvent;
 
-};
+  }
+
+}
 
 inherits(MapBrowserPointerEvent, MapBrowserEvent);
+
 export default MapBrowserPointerEvent;

src/ol/MapEvent.js

@@ -15,7 +15,9 @@ import Event from './events/Event.js';
  * @param {module:ol/PluggableMap} map Map.
  * @param {?module:ol/PluggableMap~FrameState=} opt_frameState Frame state.
  */
-const MapEvent = function(type, map, opt_frameState) {
+class MapEvent {
+
+  constructor(type, map, opt_frameState) {
 
     Event.call(this, type);
 
@@ -33,7 +35,10 @@ const MapEvent = function(type, map, opt_frameState) {
      */
     this.frameState = opt_frameState !== undefined ? opt_frameState : null;
 
-};
+  }
+
+}
 
 inherits(MapEvent, Event);
+
 export default MapEvent;

src/ol/Object.js

@@ -19,7 +19,9 @@ import {assign} from './obj.js';
  * @extends {module:ol/events/Event}
  * @constructor
  */
-const ObjectEvent = function(type, key, oldValue) {
+class ObjectEvent {
+
+  constructor(type, key, oldValue) {
     Event.call(this, type);
 
     /**
@@ -37,7 +39,10 @@ const ObjectEvent = function(type, key, oldValue) {
      */
     this.oldValue = oldValue;
 
-};
+  }
+
+}
+
 inherits(ObjectEvent, Event);
 
 

src/ol/Tile.js

@@ -51,7 +51,8 @@ import EventType from './events/EventType.js';
  * @param {module:ol/TileState} state State.
  * @param {module:ol/Tile~Options=} opt_options Tile options.
  */
-const Tile = function(tileCoord, state, opt_options) {
+class Tile {
+  constructor(tileCoord, state, opt_options) {
     EventTarget.call(this);
 
     const options = opt_options ? opt_options : {};
@@ -96,33 +97,29 @@ const Tile = function(tileCoord, state, opt_options) {
      */
     this.transitionStarts_ = {};
 
-};
+  }
 
-inherits(Tile, EventTarget);
+  /**
-
-
-/**
    * @protected
    */
-Tile.prototype.changed = function() {
+  changed() {
     this.dispatchEvent(EventType.CHANGE);
-};
+  }
 
-
+  /**
-/**
    * @return {string} Key.
    */
-Tile.prototype.getKey = function() {
+  getKey() {
     return this.key + '/' + this.tileCoord;
-};
+  }
 
-/**
+  /**
    * Get the interim tile most suitable for rendering using the chain of interim
    * tiles. This corresponds to the  most recent tile that has been loaded, if no
    * such tile exists, the original tile is returned.
    * @return {!module:ol/Tile} Best tile for rendering.
    */
-Tile.prototype.getInterimTile = function() {
+  getInterimTile() {
     if (!this.interimTile) {
       //empty chain
       return this;
@@ -142,13 +139,13 @@ Tile.prototype.getInterimTile = function() {
 
     // we can not find a better tile
     return this;
-};
+  }
 
-/**
+  /**
    * Goes through the chain of interim tiles and discards sections of the chain
    * that are no longer relevant.
    */
-Tile.prototype.refreshInterimChain = function() {
+  refreshInterimChain() {
     if (!this.interimTile) {
       return;
     }
@@ -176,49 +173,48 @@ Tile.prototype.refreshInterimChain = function() {
       }
       tile = prev.interimTile;
     } while (tile);
-};
+  }
 
-/**
+  /**
    * Get the tile coordinate for this tile.
    * @return {module:ol/tilecoord~TileCoord} The tile coordinate.
    * @api
    */
-Tile.prototype.getTileCoord = function() {
+  getTileCoord() {
     return this.tileCoord;
-};
+  }
 
-
+  /**
-/**
    * @return {module:ol/TileState} State.
    */
-Tile.prototype.getState = function() {
+  getState() {
     return this.state;
-};
+  }
 
-/**
+  /**
    * @param {module:ol/TileState} state State.
    */
-Tile.prototype.setState = function(state) {
+  setState(state) {
     this.state = state;
     this.changed();
-};
+  }
 
-/**
+  /**
    * Load the image or retry if loading previously failed.
    * Loading is taken care of by the tile queue, and calling this method is
    * only needed for preloading or for reloading in case of an error.
    * @abstract
    * @api
    */
-Tile.prototype.load = function() {};
+  load() {}
 
-/**
+  /**
    * Get the alpha value for rendering.
    * @param {number} id An id for the renderer.
    * @param {number} time The render frame time.
    * @return {number} A number between 0 and 1.
    */
-Tile.prototype.getAlpha = function(id, time) {
+  getAlpha(id, time) {
     if (!this.transition_) {
       return 1;
     }
@@ -236,29 +232,34 @@ Tile.prototype.getAlpha = function(id, time) {
       return 1;
     }
     return easeIn(delta / this.transition_);
-};
+  }
 
-/**
+  /**
    * Determine if a tile is in an alpha transition.  A tile is considered in
    * transition if tile.getAlpha() has not yet been called or has been called
    * and returned 1.
    * @param {number} id An id for the renderer.
    * @return {boolean} The tile is in transition.
    */
-Tile.prototype.inTransition = function(id) {
+  inTransition(id) {
     if (!this.transition_) {
       return false;
     }
     return this.transitionStarts_[id] !== -1;
-};
+  }
 
-/**
+  /**
    * Mark a transition as complete.
    * @param {number} id An id for the renderer.
    */
-Tile.prototype.endTransition = function(id) {
+  endTransition(id) {
     if (this.transition_) {
       this.transitionStarts_[id] = -1;
     }
-};
+  }
+}
+
+inherits(Tile, EventTarget);
+
+
 export default Tile;

src/ol/TileCache.js

@@ -11,19 +11,17 @@ import {fromKey, getKey} from './tilecoord.js';
  * @param {number=} opt_highWaterMark High water mark.
  * @struct
  */
-const TileCache = function(opt_highWaterMark) {
+class TileCache {
+  constructor(opt_highWaterMark) {
 
     LRUCache.call(this, opt_highWaterMark);
 
-};
+  }
 
-inherits(TileCache, LRUCache);
+  /**
-
-
-/**
    * @param {!Object.<string, module:ol/TileRange>} usedTiles Used tiles.
    */
-TileCache.prototype.expireCache = function(usedTiles) {
+  expireCache(usedTiles) {
     while (this.canExpireCache()) {
       const tile = this.peekLast();
       const zKey = tile.tileCoord[0].toString();
@@ -33,13 +31,12 @@ TileCache.prototype.expireCache = function(usedTiles) {
         this.pop().dispose();
       }
     }
-};
+  }
 
-
+  /**
-/**
    * Prune all tiles from the cache that don't have the same z as the newest tile.
    */
-TileCache.prototype.pruneExceptNewestZ = function() {
+  pruneExceptNewestZ() {
     if (this.getCount() === 0) {
       return;
     }
@@ -52,5 +49,10 @@ TileCache.prototype.pruneExceptNewestZ = function() {
         tile.dispose();
       }
     }, this);
-};
+  }
+}
+
+inherits(TileCache, LRUCache);
+
+
 export default TileCache;

src/ol/TileQueue.js

@@ -22,7 +22,8 @@ import PriorityQueue from './structs/PriorityQueue.js';
  *     Function called on each tile change event.
  * @struct
  */
-const TileQueue = function(tilePriorityFunction, tileChangeCallback) {
+class TileQueue {
+  constructor(tilePriorityFunction, tileChangeCallback) {
 
     PriorityQueue.call(
       this,
@@ -59,37 +60,32 @@ const TileQueue = function(tilePriorityFunction, tileChangeCallback) {
      */
     this.tilesLoadingKeys_ = {};
 
-};
+  }
 
-inherits(TileQueue, PriorityQueue);
+  /**
-
-
-/**
    * @inheritDoc
    */
-TileQueue.prototype.enqueue = function(element) {
+  enqueue(element) {
     const added = PriorityQueue.prototype.enqueue.call(this, element);
     if (added) {
       const tile = element[0];
       listen(tile, EventType.CHANGE, this.handleTileChange, this);
     }
     return added;
-};
+  }
 
-
+  /**
-/**
    * @return {number} Number of tiles loading.
    */
-TileQueue.prototype.getTilesLoading = function() {
+  getTilesLoading() {
     return this.tilesLoading_;
-};
+  }
 
-
+  /**
-/**
    * @param {module:ol/events/Event} event Event.
    * @protected
    */
-TileQueue.prototype.handleTileChange = function(event) {
+  handleTileChange(event) {
     const tile = /** @type {module:ol/Tile} */ (event.target);
     const state = tile.getState();
     if (state === TileState.LOADED || state === TileState.ERROR ||
@@ -102,14 +98,13 @@ TileQueue.prototype.handleTileChange = function(event) {
       }
       this.tileChangeCallback_();
     }
-};
+  }
 
-
+  /**
-/**
    * @param {number} maxTotalLoading Maximum number tiles to load simultaneously.
    * @param {number} maxNewLoads Maximum number of new tiles to load.
    */
-TileQueue.prototype.loadMoreTiles = function(maxTotalLoading, maxNewLoads) {
+  loadMoreTiles(maxTotalLoading, maxNewLoads) {
     let newLoads = 0;
     let abortedTiles = false;
     let state, tile, tileKey;
@@ -132,5 +127,10 @@ TileQueue.prototype.loadMoreTiles = function(maxTotalLoading, maxNewLoads) {
       // a small, saturated tile cache.
       this.tileChangeCallback_();
     }
-};
+  }
+}
+
+inherits(TileQueue, PriorityQueue);
+
+
 export default TileQueue;

src/ol/TileRange.js

@@ -12,7 +12,8 @@
  * @param {number} maxY Maximum Y.
  * @struct
  */
-const TileRange = function(minX, maxX, minY, maxY) {
+class TileRange {
+ constructor(minX, maxX, minY, maxY) {
 
    /**
     * @type {number}
@@ -34,7 +35,93 @@ const TileRange = function(minX, maxX, minY, maxY) {
     */
    this.maxY = maxY;
 
-};
+ }
+
+ /**
+  * @param {module:ol/tilecoord~TileCoord} tileCoord Tile coordinate.
+  * @return {boolean} Contains tile coordinate.
+  */
+ contains(tileCoord) {
+   return this.containsXY(tileCoord[1], tileCoord[2]);
+ }
+
+ /**
+  * @param {module:ol/TileRange} tileRange Tile range.
+  * @return {boolean} Contains.
+  */
+ containsTileRange(tileRange) {
+   return this.minX <= tileRange.minX && tileRange.maxX <= this.maxX &&
+       this.minY <= tileRange.minY && tileRange.maxY <= this.maxY;
+ }
+
+ /**
+  * @param {number} x Tile coordinate x.
+  * @param {number} y Tile coordinate y.
+  * @return {boolean} Contains coordinate.
+  */
+ containsXY(x, y) {
+   return this.minX <= x && x <= this.maxX && this.minY <= y && y <= this.maxY;
+ }
+
+ /**
+  * @param {module:ol/TileRange} tileRange Tile range.
+  * @return {boolean} Equals.
+  */
+ equals(tileRange) {
+   return this.minX == tileRange.minX && this.minY == tileRange.minY &&
+       this.maxX == tileRange.maxX && this.maxY == tileRange.maxY;
+ }
+
+ /**
+  * @param {module:ol/TileRange} tileRange Tile range.
+  */
+ extend(tileRange) {
+   if (tileRange.minX < this.minX) {
+     this.minX = tileRange.minX;
+   }
+   if (tileRange.maxX > this.maxX) {
+     this.maxX = tileRange.maxX;
+   }
+   if (tileRange.minY < this.minY) {
+     this.minY = tileRange.minY;
+   }
+   if (tileRange.maxY > this.maxY) {
+     this.maxY = tileRange.maxY;
+   }
+ }
+
+ /**
+  * @return {number} Height.
+  */
+ getHeight() {
+   return this.maxY - this.minY + 1;
+ }
+
+ /**
+  * @return {module:ol/size~Size} Size.
+  */
+ getSize() {
+   return [this.getWidth(), this.getHeight()];
+ }
+
+ /**
+  * @return {number} Width.
+  */
+ getWidth() {
+   return this.maxX - this.minX + 1;
+ }
+
+ /**
+  * @param {module:ol/TileRange} tileRange Tile range.
+  * @return {boolean} Intersects.
+  */
+ intersects(tileRange) {
+   return this.minX <= tileRange.maxX &&
+       this.maxX >= tileRange.minX &&
+       this.minY <= tileRange.maxY &&
+       this.maxY >= tileRange.minY;
+ }
+}
 
 
 /**
@@ -58,96 +145,4 @@ export function createOrUpdate(minX, maxX, minY, maxY, tileRange) {
 }
 
 
-/**
- * @param {module:ol/tilecoord~TileCoord} tileCoord Tile coordinate.
- * @return {boolean} Contains tile coordinate.
- */
-TileRange.prototype.contains = function(tileCoord) {
-  return this.containsXY(tileCoord[1], tileCoord[2]);
-};
-
-
-/**
- * @param {module:ol/TileRange} tileRange Tile range.
- * @return {boolean} Contains.
- */
-TileRange.prototype.containsTileRange = function(tileRange) {
-  return this.minX <= tileRange.minX && tileRange.maxX <= this.maxX &&
-      this.minY <= tileRange.minY && tileRange.maxY <= this.maxY;
-};
-
-
-/**
- * @param {number} x Tile coordinate x.
- * @param {number} y Tile coordinate y.
- * @return {boolean} Contains coordinate.
- */
-TileRange.prototype.containsXY = function(x, y) {
-  return this.minX <= x && x <= this.maxX && this.minY <= y && y <= this.maxY;
-};
-
-
-/**
- * @param {module:ol/TileRange} tileRange Tile range.
- * @return {boolean} Equals.
- */
-TileRange.prototype.equals = function(tileRange) {
-  return this.minX == tileRange.minX && this.minY == tileRange.minY &&
-      this.maxX == tileRange.maxX && this.maxY == tileRange.maxY;
-};
-
-
-/**
- * @param {module:ol/TileRange} tileRange Tile range.
- */
-TileRange.prototype.extend = function(tileRange) {
-  if (tileRange.minX < this.minX) {
-    this.minX = tileRange.minX;
-  }
-  if (tileRange.maxX > this.maxX) {
-    this.maxX = tileRange.maxX;
-  }
-  if (tileRange.minY < this.minY) {
-    this.minY = tileRange.minY;
-  }
-  if (tileRange.maxY > this.maxY) {
-    this.maxY = tileRange.maxY;
-  }
-};
-
-
-/**
- * @return {number} Height.
- */
-TileRange.prototype.getHeight = function() {
-  return this.maxY - this.minY + 1;
-};
-
-
-/**
- * @return {module:ol/size~Size} Size.
- */
-TileRange.prototype.getSize = function() {
-  return [this.getWidth(), this.getHeight()];
-};
-
-
-/**
- * @return {number} Width.
- */
-TileRange.prototype.getWidth = function() {
-  return this.maxX - this.minX + 1;
-};
-
-
-/**
- * @param {module:ol/TileRange} tileRange Tile range.
- * @return {boolean} Intersects.
- */
-TileRange.prototype.intersects = function(tileRange) {
-  return this.minX <= tileRange.maxX &&
-      this.maxX >= tileRange.minX &&
-      this.minY <= tileRange.maxY &&
-      this.maxY >= tileRange.minY;
-};
 export default TileRange;

src/ol/VectorImageTile.js

@@ -43,9 +43,24 @@ import {UNDEFINED} from './functions.js';
  *     Function to call when a source tile's state changes.
  * @param {number} zoom Integer zoom to render the tile for.
  */
-const VectorImageTile = function(tileCoord, state, sourceRevision, format,
+class VectorImageTile {
-  tileLoadFunction, urlTileCoord, tileUrlFunction, sourceTileGrid, tileGrid,
+  constructor(
-  sourceTiles, pixelRatio, projection, tileClass, handleTileChange, zoom) {
+    tileCoord,
+    state,
+    sourceRevision,
+    format,
+    tileLoadFunction,
+    urlTileCoord,
+    tileUrlFunction,
+    sourceTileGrid,
+    tileGrid,
+    sourceTiles,
+    pixelRatio,
+    projection,
+    tileClass,
+    handleTileChange,
+    zoom
+  ) {
 
     Tile.call(this, tileCoord, state, {transition: 0});
 
@@ -157,15 +172,12 @@ const VectorImageTile = function(tileCoord, state, sourceRevision, format,
       }
     }
 
-};
+  }
 
-inherits(VectorImageTile, Tile);
+  /**
-
-
-/**
    * @inheritDoc
    */
-VectorImageTile.prototype.disposeInternal = function() {
+  disposeInternal() {
     this.state = TileState.ABORT;
     this.changed();
     if (this.interimTile) {
@@ -188,38 +200,35 @@ VectorImageTile.prototype.disposeInternal = function() {
     this.sourceTileListenerKeys_.forEach(unlistenByKey);
     this.sourceTileListenerKeys_.length = 0;
     Tile.prototype.disposeInternal.call(this);
-};
+  }
 
-
+  /**
-/**
    * @param {module:ol/layer/Layer} layer Layer.
    * @return {CanvasRenderingContext2D} The rendering context.
    */
-VectorImageTile.prototype.getContext = function(layer) {
+  getContext(layer) {
     const key = getUid(layer).toString();
     if (!(key in this.context_)) {
       this.context_[key] = createCanvasContext2D();
     }
     return this.context_[key];
-};
+  }
 
-
+  /**
-/**
    * Get the Canvas for this tile.
    * @param {module:ol/layer/Layer} layer Layer.
    * @return {HTMLCanvasElement} Canvas.
    */
-VectorImageTile.prototype.getImage = function(layer) {
+  getImage(layer) {
     return this.getReplayState(layer).renderedTileRevision == -1 ?
       null : this.getContext(layer).canvas;
-};
+  }
 
-
+  /**
-/**
    * @param {module:ol/layer/Layer} layer Layer.
    * @return {module:ol/VectorImageTile~ReplayState} The replay state.
    */
-VectorImageTile.prototype.getReplayState = function(layer) {
+  getReplayState(layer) {
     const key = getUid(layer).toString();
     if (!(key in this.replayState_)) {
       this.replayState_[key] = {
@@ -230,30 +239,27 @@ VectorImageTile.prototype.getReplayState = function(layer) {
       };
     }
     return this.replayState_[key];
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    */
-VectorImageTile.prototype.getKey = function() {
+  getKey() {
     return this.tileKeys.join('/') + '-' + this.sourceRevision_;
-};
+  }
 
-
+  /**
-/**
    * @param {string} tileKey Key (tileCoord) of the source tile.
    * @return {module:ol/VectorTile} Source tile.
    */
-VectorImageTile.prototype.getTile = function(tileKey) {
+  getTile(tileKey) {
     return this.sourceTiles_[tileKey];
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    */
-VectorImageTile.prototype.load = function() {
+  load() {
     // Source tiles with LOADED state - we just count them because once they are
     // loaded, we're no longer listening to state changes.
     let leftToLoad = 0;
@@ -296,13 +302,12 @@ VectorImageTile.prototype.load = function() {
     if (leftToLoad - Object.keys(errorSourceTiles).length == 0) {
       setTimeout(this.finishLoading_.bind(this), 0);
     }
-};
+  }
 
-
+  /**
-/**
    * @private
    */
-VectorImageTile.prototype.finishLoading_ = function() {
+  finishLoading_() {
     let loaded = this.tileKeys.length;
     let empty = 0;
     for (let i = loaded - 1; i >= 0; --i) {
@@ -321,7 +326,11 @@ VectorImageTile.prototype.finishLoading_ = function() {
     } else {
       this.setState(empty == this.tileKeys.length ? TileState.EMPTY : TileState.ERROR);
     }
-};
+  }
+}
+
+inherits(VectorImageTile, Tile);
+
 
 export default VectorImageTile;
 

src/ol/VectorTile.js

@@ -21,7 +21,8 @@ import TileState from './TileState.js';
  * @param {module:ol/Tile~LoadFunction} tileLoadFunction Tile load function.
  * @param {module:ol/Tile~Options=} opt_options Tile options.
  */
-const VectorTile = function(tileCoord, state, src, format, tileLoadFunction, opt_options) {
+class VectorTile {
+ constructor(tileCoord, state, src, format, tileLoadFunction, opt_options) {
 
    Tile.call(this, tileCoord, state, opt_options);
 
@@ -79,123 +80,104 @@ const VectorTile = function(tileCoord, state, src, format, tileLoadFunction, opt
     */
    this.url_ = src;
 
-};
+ }
 
-inherits(VectorTile, Tile);
+ /**
-
-/**
- * @const
- * @type {module:ol/extent~Extent}
- */
-const DEFAULT_EXTENT = [0, 0, 4096, 4096];
-
-
-/**
   * @inheritDoc
   */
-VectorTile.prototype.disposeInternal = function() {
+ disposeInternal() {
    this.features_ = null;
    this.replayGroups_ = {};
    this.state = TileState.ABORT;
    this.changed();
    Tile.prototype.disposeInternal.call(this);
-};
+ }
 
-
+ /**
-/**
   * Gets the extent of the vector tile.
   * @return {module:ol/extent~Extent} The extent.
   * @api
   */
-VectorTile.prototype.getExtent = function() {
+ getExtent() {
    return this.extent_ || DEFAULT_EXTENT;
-};
+ }
 
-
+ /**
-/**
   * Get the feature format assigned for reading this tile's features.
   * @return {module:ol/format/Feature} Feature format.
   * @api
   */
-VectorTile.prototype.getFormat = function() {
+ getFormat() {
    return this.format_;
-};
+ }
 
-
+ /**
-/**
   * Get the features for this tile. Geometries will be in the projection returned
   * by {@link module:ol/VectorTile~VectorTile#getProjection}.
   * @return {Array.<module:ol/Feature|module:ol/render/Feature>} Features.
   * @api
   */
-VectorTile.prototype.getFeatures = function() {
+ getFeatures() {
    return this.features_;
-};
+ }
 
-
+ /**
-/**
   * @inheritDoc
   */
-VectorTile.prototype.getKey = function() {
+ getKey() {
    return this.url_;
-};
+ }
 
-
+ /**
-/**
   * Get the feature projection of features returned by
   * {@link module:ol/VectorTile~VectorTile#getFeatures}.
   * @return {module:ol/proj/Projection} Feature projection.
   * @api
   */
-VectorTile.prototype.getProjection = function() {
+ getProjection() {
    return this.projection_;
-};
+ }
 
-
+ /**
-/**
   * @param {module:ol/layer/Layer} layer Layer.
   * @param {string} key Key.
   * @return {module:ol/render/ReplayGroup} Replay group.
   */
-VectorTile.prototype.getReplayGroup = function(layer, key) {
+ getReplayGroup(layer, key) {
    return this.replayGroups_[getUid(layer) + ',' + key];
-};
+ }
 
-
+ /**
-/**
   * @inheritDoc
   */
-VectorTile.prototype.load = function() {
+ load() {
    if (this.state == TileState.IDLE) {
      this.setState(TileState.LOADING);
      this.tileLoadFunction_(this, this.url_);
      this.loader_(null, NaN, null);
    }
-};
+ }
 
-
+ /**
-/**
   * Handler for successful tile load.
   * @param {Array.<module:ol/Feature>} features The loaded features.
   * @param {module:ol/proj/Projection} dataProjection Data projection.
   * @param {module:ol/extent~Extent} extent Extent.
   */
-VectorTile.prototype.onLoad = function(features, dataProjection, extent) {
+ onLoad(features, dataProjection, extent) {
    this.setProjection(dataProjection);
    this.setFeatures(features);
    this.setExtent(extent);
-};
+ }
 
-
+ /**
-/**
   * Handler for tile load errors.
   */
-VectorTile.prototype.onError = function() {
+ onError() {
    this.setState(TileState.ERROR);
-};
+ }
 
-
+ /**
-/**
   * Function for use in an {@link module:ol/source/VectorTile~VectorTile}'s
   * `tileLoadFunction`. Sets the extent of the vector tile. This is only required
   * for tiles in projections with `tile-pixels` as units. The extent should be
@@ -207,52 +189,58 @@ VectorTile.prototype.onError = function() {
   * @param {module:ol/extent~Extent} extent The extent.
   * @api
   */
-VectorTile.prototype.setExtent = function(extent) {
+ setExtent(extent) {
    this.extent_ = extent;
-};
+ }
 
-
+ /**
-/**
   * Function for use in an {@link module:ol/source/VectorTile~VectorTile}'s `tileLoadFunction`.
   * Sets the features for the tile.
   * @param {Array.<module:ol/Feature>} features Features.
   * @api
   */
-VectorTile.prototype.setFeatures = function(features) {
+ setFeatures(features) {
    this.features_ = features;
    this.setState(TileState.LOADED);
-};
+ }
 
-
+ /**
-/**
   * Function for use in an {@link module:ol/source/VectorTile~VectorTile}'s `tileLoadFunction`.
   * Sets the projection of the features that were added with
   * {@link module:ol/VectorTile~VectorTile#setFeatures}.
   * @param {module:ol/proj/Projection} projection Feature projection.
   * @api
   */
-VectorTile.prototype.setProjection = function(projection) {
+ setProjection(projection) {
    this.projection_ = projection;
-};
+ }
 
-
+ /**
-/**
   * @param {module:ol/layer/Layer} layer Layer.
   * @param {string} key Key.
   * @param {module:ol/render/ReplayGroup} replayGroup Replay group.
   */
-VectorTile.prototype.setReplayGroup = function(layer, key, replayGroup) {
+ setReplayGroup(layer, key, replayGroup) {
    this.replayGroups_[getUid(layer) + ',' + key] = replayGroup;
-};
+ }
 
-
+ /**
-/**
   * Set the feature loader for reading this tile's features.
   * @param {module:ol/featureloader~FeatureLoader} loader Feature loader.
   * @api
   */
-VectorTile.prototype.setLoader = function(loader) {
+ setLoader(loader) {
    this.loader_ = loader;
-};
+ }
+}
+
+inherits(VectorTile, Tile);
+
+/**
+ * @const
+ * @type {module:ol/extent~Extent}
+ */
+const DEFAULT_EXTENT = [0, 0, 4096, 4096];
+
 
 export default VectorTile;

src/ol/View.js

@@ -229,7 +229,8 @@ const DEFAULT_MIN_ZOOM = 0;
  * @param {module:ol/View~ViewOptions=} opt_options View options.
  * @api
  */
-const View = function(opt_options) {
+class View {
+  constructor(opt_options) {
     BaseObject.call(this);
 
     const options = assign({}, opt_options);
@@ -262,16 +263,13 @@ const View = function(opt_options) {
     this.projection_ = createProjection(options.projection, 'EPSG:3857');
 
     this.applyOptions_(options);
-};
+  }
 
-inherits(View, BaseObject);
+  /**
-
-
-/**
    * Set up the view with the given options.
    * @param {module:ol/View~ViewOptions} options View options.
    */
-View.prototype.applyOptions_ = function(options) {
+  applyOptions_(options) {
 
     /**
      * @type {Object.<string, *>}
@@ -347,9 +345,9 @@ View.prototype.applyOptions_ = function(options) {
      */
     this.options_ = options;
 
-};
+  }
 
-/**
+  /**
    * Get an updated version of the view options used to construct the view.  The
    * current resolution (or zoom), center, and rotation are applied to any stored
    * options.  The provided options can be used to apply new min/max zoom or
@@ -357,7 +355,7 @@ View.prototype.applyOptions_ = function(options) {
    * @param {module:ol/View~ViewOptions} newOptions New options to be applied.
    * @return {module:ol/View~ViewOptions} New options updated with the current view state.
    */
-View.prototype.getUpdatedOptions_ = function(newOptions) {
+  getUpdatedOptions_(newOptions) {
     const options = assign({}, this.options_);
 
     // preserve resolution (or zoom)
@@ -374,10 +372,9 @@ View.prototype.getUpdatedOptions_ = function(newOptions) {
     options.rotation = this.getRotation();
 
     return assign({}, options, newOptions);
-};
+  }
 
-
+  /**
-/**
    * Animate the view.  The view's center, zoom (or resolution), and rotation
    * can be animated for smooth transitions between view states.  For example,
    * to animate the view to a new zoom level:
@@ -410,7 +407,7 @@ View.prototype.getUpdatedOptions_ = function(newOptions) {
    *     the animation completed without being cancelled.
    * @api
    */
-View.prototype.animate = function(var_args) {
+  animate(var_args) {
     let animationCount = arguments.length;
     let callback;
     if (animationCount > 1 && typeof arguments[animationCount - 1] === 'function') {
@@ -490,34 +487,31 @@ View.prototype.animate = function(var_args) {
     this.animations_.push(series);
     this.setHint(ViewHint.ANIMATING, 1);
     this.updateAnimations_();
-};
+  }
 
-
+  /**
-/**
    * Determine if the view is being animated.
    * @return {boolean} The view is being animated.
    * @api
    */
-View.prototype.getAnimating = function() {
+  getAnimating() {
     return this.hints_[ViewHint.ANIMATING] > 0;
-};
+  }
 
-
+  /**
-/**
    * Determine if the user is interacting with the view, such as panning or zooming.
    * @return {boolean} The view is being interacted with.
    * @api
    */
-View.prototype.getInteracting = function() {
+  getInteracting() {
     return this.hints_[ViewHint.INTERACTING] > 0;
-};
+  }
 
-
+  /**
-/**
    * Cancel any ongoing animations.
    * @api
    */
-View.prototype.cancelAnimations = function() {
+  cancelAnimations() {
     this.setHint(ViewHint.ANIMATING, -this.hints_[ViewHint.ANIMATING]);
     for (let i = 0, ii = this.animations_.length; i < ii; ++i) {
       const series = this.animations_[i];
@@ -526,12 +520,12 @@ View.prototype.cancelAnimations = function() {
       }
     }
     this.animations_.length = 0;
-};
+  }
 
-/**
+  /**
    * Update all animations.
    */
-View.prototype.updateAnimations_ = function() {
+  updateAnimations_() {
     if (this.updateAnimationKey_ !== undefined) {
       cancelAnimationFrame(this.updateAnimationKey_);
       this.updateAnimationKey_ = undefined;
@@ -608,14 +602,14 @@ View.prototype.updateAnimations_ = function() {
     if (more && this.updateAnimationKey_ === undefined) {
       this.updateAnimationKey_ = requestAnimationFrame(this.updateAnimations_);
     }
-};
+  }
 
-/**
+  /**
    * @param {number} rotation Target rotation.
    * @param {module:ol/coordinate~Coordinate} anchor Rotation anchor.
    * @return {module:ol/coordinate~Coordinate|undefined} Center for rotation and anchor.
    */
-View.prototype.calculateCenterRotate = function(rotation, anchor) {
+  calculateCenterRotate(rotation, anchor) {
     let center;
     const currentCenter = this.getCenter();
     if (currentCenter !== undefined) {
@@ -624,15 +618,14 @@ View.prototype.calculateCenterRotate = function(rotation, anchor) {
       addCoordinate(center, anchor);
     }
     return center;
-};
+  }
 
-
+  /**
-/**
    * @param {number} resolution Target resolution.
    * @param {module:ol/coordinate~Coordinate} anchor Zoom anchor.
    * @return {module:ol/coordinate~Coordinate|undefined} Center for resolution and anchor.
    */
-View.prototype.calculateCenterZoom = function(resolution, anchor) {
+  calculateCenterZoom(resolution, anchor) {
     let center;
     const currentCenter = this.getCenter();
     const currentResolution = this.getResolution();
@@ -642,14 +635,13 @@ View.prototype.calculateCenterZoom = function(resolution, anchor) {
       center = [x, y];
     }
     return center;
-};
+  }
 
-
+  /**
-/**
    * @private
    * @return {module:ol/size~Size} Viewport size or `[100, 100]` when no viewport is found.
    */
-View.prototype.getSizeFromViewport_ = function() {
+  getSizeFromViewport_() {
     const size = [100, 100];
     const selector = '.ol-viewport[data-view="' + getUid(this) + '"]';
     const element = document.querySelector(selector);
@@ -659,21 +651,19 @@ View.prototype.getSizeFromViewport_ = function() {
       size[1] = parseInt(metrics.height, 10);
     }
     return size;
-};
+  }
 
-
+  /**
-/**
    * Get the constrained center of this view.
    * @param {module:ol/coordinate~Coordinate|undefined} center Center.
    * @return {module:ol/coordinate~Coordinate|undefined} Constrained center.
    * @api
    */
-View.prototype.constrainCenter = function(center) {
+  constrainCenter(center) {
     return this.constraints_.center(center);
-};
+  }
 
-
+  /**
-/**
    * Get the constrained resolution of this view.
    * @param {number|undefined} resolution Resolution.
    * @param {number=} opt_delta Delta. Default is `0`.
@@ -681,52 +671,48 @@ View.prototype.constrainCenter = function(center) {
    * @return {number|undefined} Constrained resolution.
    * @api
    */
-View.prototype.constrainResolution = function(resolution, opt_delta, opt_direction) {
+  constrainResolution(resolution, opt_delta, opt_direction) {
     const delta = opt_delta || 0;
     const direction = opt_direction || 0;
     return this.constraints_.resolution(resolution, delta, direction);
-};
+  }
 
-
+  /**
-/**
    * Get the constrained rotation of this view.
    * @param {number|undefined} rotation Rotation.
    * @param {number=} opt_delta Delta. Default is `0`.
    * @return {number|undefined} Constrained rotation.
    * @api
    */
-View.prototype.constrainRotation = function(rotation, opt_delta) {
+  constrainRotation(rotation, opt_delta) {
     const delta = opt_delta || 0;
     return this.constraints_.rotation(rotation, delta);
-};
+  }
 
-
+  /**
-/**
    * Get the view center.
    * @return {module:ol/coordinate~Coordinate|undefined} The center of the view.
    * @observable
    * @api
    */
-View.prototype.getCenter = function() {
+  getCenter() {
     return (
       /** @type {module:ol/coordinate~Coordinate|undefined} */ (this.get(ViewProperty.CENTER))
     );
-};
+  }
 
-
+  /**
-/**
    * @return {module:ol/View~Constraints} Constraints.
    */
-View.prototype.getConstraints = function() {
+  getConstraints() {
     return this.constraints_;
-};
+  }
 
-
+  /**
-/**
    * @param {Array.<number>=} opt_hints Destination array.
    * @return {Array.<number>} Hint.
    */
-View.prototype.getHints = function(opt_hints) {
+  getHints(opt_hints) {
     if (opt_hints !== undefined) {
       opt_hints[0] = this.hints_[0];
       opt_hints[1] = this.hints_[1];
@@ -734,10 +720,9 @@ View.prototype.getHints = function(opt_hints) {
     } else {
       return this.hints_.slice();
     }
-};
+  }
 
-
+  /**
-/**
    * Calculate the extent for the current view state and the passed size.
    * The size is the pixel dimensions of the box into which the calculated extent
    * should fit. In most cases you want to get the extent of the entire map,
@@ -747,7 +732,7 @@ View.prototype.getHints = function(opt_hints) {
    * @return {module:ol/extent~Extent} Extent.
    * @api
    */
-View.prototype.calculateExtent = function(opt_size) {
+  calculateExtent(opt_size) {
     const size = opt_size || this.getSizeFromViewport_();
     const center = /** @type {!module:ol/coordinate~Coordinate} */ (this.getCenter());
     assert(center, 1); // The view center is not defined
@@ -757,102 +742,92 @@ View.prototype.calculateExtent = function(opt_size) {
     assert(rotation !== undefined, 3); // The view rotation is not defined
 
     return getForViewAndSize(center, resolution, rotation, size);
-};
+  }
 
-
+  /**
-/**
    * Get the maximum resolution of the view.
    * @return {number} The maximum resolution of the view.
    * @api
    */
-View.prototype.getMaxResolution = function() {
+  getMaxResolution() {
     return this.maxResolution_;
-};
+  }
 
-
+  /**
-/**
    * Get the minimum resolution of the view.
    * @return {number} The minimum resolution of the view.
    * @api
    */
-View.prototype.getMinResolution = function() {
+  getMinResolution() {
     return this.minResolution_;
-};
+  }
 
-
+  /**
-/**
    * Get the maximum zoom level for the view.
    * @return {number} The maximum zoom level.
    * @api
    */
-View.prototype.getMaxZoom = function() {
+  getMaxZoom() {
     return /** @type {number} */ (this.getZoomForResolution(this.minResolution_));
-};
+  }
 
-
+  /**
-/**
    * Set a new maximum zoom level for the view.
    * @param {number} zoom The maximum zoom level.
    * @api
    */
-View.prototype.setMaxZoom = function(zoom) {
+  setMaxZoom(zoom) {
     this.applyOptions_(this.getUpdatedOptions_({maxZoom: zoom}));
-};
+  }
 
-
+  /**
-/**
    * Get the minimum zoom level for the view.
    * @return {number} The minimum zoom level.
    * @api
    */
-View.prototype.getMinZoom = function() {
+  getMinZoom() {
     return /** @type {number} */ (this.getZoomForResolution(this.maxResolution_));
-};
+  }
 
-
+  /**
-/**
    * Set a new minimum zoom level for the view.
    * @param {number} zoom The minimum zoom level.
    * @api
    */
-View.prototype.setMinZoom = function(zoom) {
+  setMinZoom(zoom) {
     this.applyOptions_(this.getUpdatedOptions_({minZoom: zoom}));
-};
+  }
 
-
+  /**
-/**
    * Get the view projection.
    * @return {module:ol/proj/Projection} The projection of the view.
    * @api
    */
-View.prototype.getProjection = function() {
+  getProjection() {
     return this.projection_;
-};
+  }
 
-
+  /**
-/**
    * Get the view resolution.
    * @return {number|undefined} The resolution of the view.
    * @observable
    * @api
    */
-View.prototype.getResolution = function() {
+  getResolution() {
     return /** @type {number|undefined} */ (this.get(ViewProperty.RESOLUTION));
-};
+  }
 
-
+  /**
-/**
    * Get the resolutions for the view. This returns the array of resolutions
    * passed to the constructor of the View, or undefined if none were given.
    * @return {Array.<number>|undefined} The resolutions of the view.
    * @api
    */
-View.prototype.getResolutions = function() {
+  getResolutions() {
     return this.resolutions_;
-};
+  }
 
-
+  /**
-/**
    * Get the resolution for a provided extent (in map units) and size (in pixels).
    * @param {module:ol/extent~Extent} extent Extent.
    * @param {module:ol/size~Size=} opt_size Box pixel size.
@@ -860,21 +835,20 @@ View.prototype.getResolutions = function() {
    *     the given size.
    * @api
    */
-View.prototype.getResolutionForExtent = function(extent, opt_size) {
+  getResolutionForExtent(extent, opt_size) {
     const size = opt_size || this.getSizeFromViewport_();
     const xResolution = getWidth(extent) / size[0];
     const yResolution = getHeight(extent) / size[1];
     return Math.max(xResolution, yResolution);
-};
+  }
 
-
+  /**
-/**
    * Return a function that returns a value between 0 and 1 for a
    * resolution. Exponential scaling is assumed.
    * @param {number=} opt_power Power.
    * @return {function(number): number} Resolution for value function.
    */
-View.prototype.getResolutionForValueFunction = function(opt_power) {
+  getResolutionForValueFunction(opt_power) {
     const power = opt_power || 2;
     const maxResolution = this.maxResolution_;
     const minResolution = this.minResolution_;
@@ -888,27 +862,25 @@ View.prototype.getResolutionForValueFunction = function(opt_power) {
         const resolution = maxResolution / Math.pow(power, value * max);
         return resolution;
       });
-};
+  }
 
-
+  /**
-/**
    * Get the view rotation.
    * @return {number} The rotation of the view in radians.
    * @observable
    * @api
    */
-View.prototype.getRotation = function() {
+  getRotation() {
     return /** @type {number} */ (this.get(ViewProperty.ROTATION));
-};
+  }
 
-
+  /**
-/**
    * Return a function that returns a resolution for a value between
    * 0 and 1. Exponential scaling is assumed.
    * @param {number=} opt_power Power.
    * @return {function(number): number} Value for resolution function.
    */
-View.prototype.getValueForResolutionFunction = function(opt_power) {
+  getValueForResolutionFunction(opt_power) {
     const power = opt_power || 2;
     const maxResolution = this.maxResolution_;
     const minResolution = this.minResolution_;
@@ -922,13 +894,12 @@ View.prototype.getValueForResolutionFunction = function(opt_power) {
         const value = (Math.log(maxResolution / resolution) / Math.log(power)) / max;
         return value;
       });
-};
+  }
 
-
+  /**
-/**
    * @return {module:ol/View~State} View state.
    */
-View.prototype.getState = function() {
+  getState() {
     const center = /** @type {module:ol/coordinate~Coordinate} */ (this.getCenter());
     const projection = this.getProjection();
     const resolution = /** @type {number} */ (this.getResolution());
@@ -942,33 +913,31 @@ View.prototype.getState = function() {
         zoom: this.getZoom()
       })
     );
-};
+  }
 
-
+  /**
-/**
    * Get the current zoom level.  If you configured your view with a resolutions
    * array (this is rare), this method may return non-integer zoom levels (so
    * the zoom level is not safe to use as an index into a resolutions array).
    * @return {number|undefined} Zoom.
    * @api
    */
-View.prototype.getZoom = function() {
+  getZoom() {
     let zoom;
     const resolution = this.getResolution();
     if (resolution !== undefined) {
       zoom = this.getZoomForResolution(resolution);
     }
     return zoom;
-};
+  }
 
-
+  /**
-/**
    * Get the zoom level for a resolution.
    * @param {number} resolution The resolution.
    * @return {number|undefined} The zoom level for the provided resolution.
    * @api
    */
-View.prototype.getZoomForResolution = function(resolution) {
+  getZoomForResolution(resolution) {
     let offset = this.minZoom_ || 0;
     let max, zoomFactor;
     if (this.resolutions_) {
@@ -985,22 +954,20 @@ View.prototype.getZoomForResolution = function(resolution) {
       zoomFactor = this.zoomFactor_;
     }
     return offset + Math.log(max / resolution) / Math.log(zoomFactor);
-};
+  }
 
-
+  /**
-/**
    * Get the resolution for a zoom level.
    * @param {number} zoom Zoom level.
    * @return {number} The view resolution for the provided zoom level.
    * @api
    */
-View.prototype.getResolutionForZoom = function(zoom) {
+  getResolutionForZoom(zoom) {
     return /** @type {number} */ (this.constrainResolution(
       this.maxResolution_, zoom - this.minZoom_, 0));
-};
+  }
 
-
+  /**
-/**
    * Fit the given geometry or extent based on the given map size and border.
    * The size is pixel dimensions of the box to fit the extent into.
    * In most cases you will want to use the map size, that is `map.getSize()`.
@@ -1010,7 +977,7 @@ View.prototype.getResolutionForZoom = function(zoom) {
    * @param {module:ol/View~FitOptions=} opt_options Options.
    * @api
    */
-View.prototype.fit = function(geometryOrExtent, opt_options) {
+  fit(geometryOrExtent, opt_options) {
     const options = opt_options || {};
     let size = options.size;
     if (!size) {
@@ -1103,17 +1070,16 @@ View.prototype.fit = function(geometryOrExtent, opt_options) {
       this.setCenter(center);
       setTimeout(callback.bind(undefined, true), 0);
     }
-};
+  }
 
-
+  /**
-/**
    * Center on coordinate and view position.
    * @param {module:ol/coordinate~Coordinate} coordinate Coordinate.
    * @param {module:ol/size~Size} size Box pixel size.
    * @param {module:ol~Pixel} position Position on the view to center on.
    * @api
    */
-View.prototype.centerOn = function(coordinate, size, position) {
+  centerOn(coordinate, size, position) {
     // calculate rotated position
     const rotation = this.getRotation();
     const cosAngle = Math.cos(-rotation);
@@ -1130,94 +1096,90 @@ View.prototype.centerOn = function(coordinate, size, position) {
     const centerY = rotY * cosAngle + rotX * sinAngle;
 
     this.setCenter([centerX, centerY]);
-};
+  }
 
-
+  /**
-/**
    * @return {boolean} Is defined.
    */
-View.prototype.isDef = function() {
+  isDef() {
     return !!this.getCenter() && this.getResolution() !== undefined;
-};
+  }
 
-
+  /**
-/**
    * Rotate the view around a given coordinate.
    * @param {number} rotation New rotation value for the view.
    * @param {module:ol/coordinate~Coordinate=} opt_anchor The rotation center.
    * @api
    */
-View.prototype.rotate = function(rotation, opt_anchor) {
+  rotate(rotation, opt_anchor) {
     if (opt_anchor !== undefined) {
       const center = this.calculateCenterRotate(rotation, opt_anchor);
       this.setCenter(center);
     }
     this.setRotation(rotation);
-};
+  }
 
-
+  /**
-/**
    * Set the center of the current view.
    * @param {module:ol/coordinate~Coordinate|undefined} center The center of the view.
    * @observable
    * @api
    */
-View.prototype.setCenter = function(center) {
+  setCenter(center) {
     this.set(ViewProperty.CENTER, center);
     if (this.getAnimating()) {
       this.cancelAnimations();
     }
-};
+  }
 
-
+  /**
-/**
    * @param {module:ol/ViewHint} hint Hint.
    * @param {number} delta Delta.
    * @return {number} New value.
    */
-View.prototype.setHint = function(hint, delta) {
+  setHint(hint, delta) {
     this.hints_[hint] += delta;
     this.changed();
     return this.hints_[hint];
-};
+  }
 
-
+  /**
-/**
    * Set the resolution for this view.
    * @param {number|undefined} resolution The resolution of the view.
    * @observable
    * @api
    */
-View.prototype.setResolution = function(resolution) {
+  setResolution(resolution) {
     this.set(ViewProperty.RESOLUTION, resolution);
     if (this.getAnimating()) {
       this.cancelAnimations();
     }
-};
+  }
 
-
+  /**
-/**
    * Set the rotation for this view.
    * @param {number} rotation The rotation of the view in radians.
    * @observable
    * @api
    */
-View.prototype.setRotation = function(rotation) {
+  setRotation(rotation) {
     this.set(ViewProperty.ROTATION, rotation);
     if (this.getAnimating()) {
       this.cancelAnimations();
     }
-};
+  }
 
-
+  /**
-/**
    * Zoom to a specific zoom level.
    * @param {number} zoom Zoom level.
    * @api
    */
-View.prototype.setZoom = function(zoom) {
+  setZoom(zoom) {
     this.setResolution(this.getResolutionForZoom(zoom));
-};
+  }
+}
+
+inherits(View, BaseObject);
 
 
 /**

src/ol/WebGLMap.js

@@ -66,7 +66,8 @@ import WebGLVectorLayerRenderer from './renderer/webgl/VectorLayer.js';
  * @fires module:ol/render/Event~RenderEvent#precompose
  * @api
  */
-const WebGLMap = function(options) {
+class WebGLMap {
+  constructor(options) {
     options = assign({}, options);
     if (!options.controls) {
       options.controls = defaultControls();
@@ -76,12 +77,9 @@ const WebGLMap = function(options) {
     }
 
     PluggableMap.call(this, options);
-};
+  }
 
-inherits(WebGLMap, PluggableMap);
+  createRenderer() {
-
-
-WebGLMap.prototype.createRenderer = function() {
     const renderer = new WebGLMapRenderer(this);
     renderer.registerLayerRenderers([
       WebGLImageLayerRenderer,
@@ -89,6 +87,10 @@ WebGLMap.prototype.createRenderer = function() {
       WebGLVectorLayerRenderer
     ]);
     return renderer;
-};
+  }
+}
+
+inherits(WebGLMap, PluggableMap);
+
 
 export default WebGLMap;

src/ol/events/Event.js

@@ -1,6 +1,7 @@
 /**
  * @module ol/events/Event
  */
+
 /**
  * @classdesc
  * Stripped down implementation of the W3C DOM Level 2 Event interface.
@@ -14,7 +15,9 @@
  * @constructor
  * @param {string} type Type.
  */
-const Event = function(type) {
+class Event {
+
+  constructor(type) {
 
     /**
      * @type {boolean}
@@ -34,25 +37,27 @@ const Event = function(type) {
      * @api
      */
     this.target = null;
-
+  }
-};
-
-
-/**
- * Stop event propagation.
- * @function
- * @api
- */
-Event.prototype.preventDefault =
 
   /**
    * Stop event propagation.
    * @function
    * @api
    */
-  Event.prototype.stopPropagation = function() {
+  preventDefault() {
     this.propagationStopped = true;
-  };
+  }
+
+  /**
+   * Stop event propagation.
+   * @function
+   * @api
+   */
+  stopPropagation() {
+    this.propagationStopped = true;
+  }
+
+}
 
 
 /**

src/ol/format/filter/And.js

@@ -13,10 +13,14 @@ import LogicalNary from '../filter/LogicalNary.js';
  * @param {...module:ol/format/filter/Filter} conditions Conditions.
  * @extends {module:ol/format/filter/LogicalNary}
  */
-const And = function(conditions) {
+class And {
+
+  constructor(conditions) {
     const params = ['And'].concat(Array.prototype.slice.call(arguments));
     LogicalNary.apply(this, params);
-};
+  }
+
+}
 
 inherits(And, LogicalNary);
 

src/ol/format/filter/Bbox.js

@@ -17,7 +17,9 @@ import Filter from '../filter/Filter.js';
  * @extends {module:ol/format/filter/Filter}
  * @api
  */
-const Bbox = function(geometryName, extent, opt_srsName) {
+class Bbox {
+
+  constructor(geometryName, extent, opt_srsName) {
 
     Filter.call(this, 'BBOX');
 
@@ -35,7 +37,9 @@ const Bbox = function(geometryName, extent, opt_srsName) {
      * @type {string|undefined}
      */
     this.srsName = opt_srsName;
-};
+  }
+
+}
 
 inherits(Bbox, Filter);
 

src/ol/format/filter/Comparison.js

@@ -15,7 +15,9 @@ import Filter from '../filter/Filter.js';
  * @param {!string} propertyName Name of the context property to compare.
  * @extends {module:ol/format/filter/Filter}
  */
-const Comparison = function(tagName, propertyName) {
+class Comparison {
+
+  constructor(tagName, propertyName) {
 
     Filter.call(this, tagName);
 
@@ -23,7 +25,9 @@ const Comparison = function(tagName, propertyName) {
      * @type {!string}
      */
     this.propertyName = propertyName;
-};
+  }
+
+}
 
 inherits(Comparison, Filter);
 

src/ol/format/filter/ComparisonBinary.js

@@ -17,7 +17,9 @@ import Comparison from '../filter/Comparison.js';
  * @param {boolean=} opt_matchCase Case-sensitive?
  * @extends {module:ol/format/filter/Comparison}
  */
-const ComparisonBinary = function(tagName, propertyName, expression, opt_matchCase) {
+class ComparisonBinary {
+
+  constructor(tagName, propertyName, expression, opt_matchCase) {
 
     Comparison.call(this, tagName, propertyName);
 
@@ -30,7 +32,10 @@ const ComparisonBinary = function(tagName, propertyName, expression, opt_matchCa
      * @type {boolean|undefined}
      */
     this.matchCase = opt_matchCase;
-};
+  }
+
+}
 
 inherits(ComparisonBinary, Comparison);
+
 export default ComparisonBinary;

src/ol/format/filter/Contains.js

@@ -17,11 +17,16 @@ import Spatial from '../filter/Spatial.js';
  * @extends {module:ol/format/filter/Spatial}
  * @api
  */
-const Contains = function(geometryName, geometry, opt_srsName) {
+class Contains {
+
+  constructor(geometryName, geometry, opt_srsName) {
 
     Spatial.call(this, 'Contains', geometryName, geometry, opt_srsName);
 
-};
+  }
+
+}
 
 inherits(Contains, Spatial);
+
 export default Contains;

src/ol/format/filter/During.js

@@ -15,7 +15,9 @@ import Comparison from '../filter/Comparison.js';
  * @extends {module:ol/format/filter/Comparison}
  * @api
  */
-const During = function(propertyName, begin, end) {
+class During {
+
+  constructor(propertyName, begin, end) {
     Comparison.call(this, 'During', propertyName);
 
     /**
@@ -27,7 +29,10 @@ const During = function(propertyName, begin, end) {
      * @type {!string}
      */
     this.end = end;
-};
+  }
+
+}
 
 inherits(During, Comparison);
+
 export default During;

src/ol/format/filter/EqualTo.js

@@ -15,9 +15,14 @@ import ComparisonBinary from '../filter/ComparisonBinary.js';
  * @extends {module:ol/format/filter/ComparisonBinary}
  * @api
  */
-const EqualTo = function(propertyName, expression, opt_matchCase) {
+class EqualTo {
+
+  constructor(propertyName, expression, opt_matchCase) {
     ComparisonBinary.call(this, 'PropertyIsEqualTo', propertyName, expression, opt_matchCase);
-};
+  }
+
+}
 
 inherits(EqualTo, ComparisonBinary);
+
 export default EqualTo;

src/ol/format/filter/GreaterThan.js

@@ -14,9 +14,14 @@ import ComparisonBinary from '../filter/ComparisonBinary.js';
  * @extends {module:ol/format/filter/ComparisonBinary}
  * @api
  */
-const GreaterThan = function(propertyName, expression) {
+class GreaterThan {
+
+  constructor(propertyName, expression) {
     ComparisonBinary.call(this, 'PropertyIsGreaterThan', propertyName, expression);
-};
+  }
+
+}
 
 inherits(GreaterThan, ComparisonBinary);
+
 export default GreaterThan;

src/ol/format/filter/GreaterThanOrEqualTo.js

@@ -14,9 +14,14 @@ import ComparisonBinary from '../filter/ComparisonBinary.js';
  * @extends {module:ol/format/filter/ComparisonBinary}
  * @api
  */
-const GreaterThanOrEqualTo = function(propertyName, expression) {
+class GreaterThanOrEqualTo {
+
+  constructor(propertyName, expression) {
     ComparisonBinary.call(this, 'PropertyIsGreaterThanOrEqualTo', propertyName, expression);
-};
+  }
+
+}
 
 inherits(GreaterThanOrEqualTo, ComparisonBinary);
+
 export default GreaterThanOrEqualTo;

src/ol/format/filter/Intersects.js

@@ -17,11 +17,15 @@ import Spatial from '../filter/Spatial.js';
  * @extends {module:ol/format/filter/Spatial}
  * @api
  */
-const Intersects = function(geometryName, geometry, opt_srsName) {
+class Intersects {
+
+  constructor(geometryName, geometry, opt_srsName) {
 
     Spatial.call(this, 'Intersects', geometryName, geometry, opt_srsName);
+  }
 
-};
+}
 
 inherits(Intersects, Spatial);
+
 export default Intersects;

src/ol/format/filter/IsBetween.js

@@ -15,7 +15,9 @@ import Comparison from '../filter/Comparison.js';
  * @extends {module:ol/format/filter/Comparison}
  * @api
  */
-const IsBetween = function(propertyName, lowerBoundary, upperBoundary) {
+class IsBetween {
+
+  constructor(propertyName, lowerBoundary, upperBoundary) {
     Comparison.call(this, 'PropertyIsBetween', propertyName);
 
     /**
@@ -27,7 +29,10 @@ const IsBetween = function(propertyName, lowerBoundary, upperBoundary) {
      * @type {!number}
      */
     this.upperBoundary = upperBoundary;
-};
+
+  }
+}
 
 inherits(IsBetween, Comparison);
+
 export default IsBetween;

src/ol/format/filter/IsLike.js

@@ -21,7 +21,9 @@ import Comparison from '../filter/Comparison.js';
  * @extends {module:ol/format/filter/Comparison}
  * @api
  */
-const IsLike = function(propertyName, pattern, opt_wildCard, opt_singleChar, opt_escapeChar, opt_matchCase) {
+class IsLike {
+
+  constructor(propertyName, pattern, opt_wildCard, opt_singleChar, opt_escapeChar, opt_matchCase) {
     Comparison.call(this, 'PropertyIsLike', propertyName);
 
     /**
@@ -48,7 +50,10 @@ const IsLike = function(propertyName, pattern, opt_wildCard, opt_singleChar, opt
      * @type {boolean|undefined}
      */
     this.matchCase = opt_matchCase;
-};
+
+  }
+}
 
 inherits(IsLike, Comparison);
+
 export default IsLike;

src/ol/format/filter/IsNull.js

@@ -13,9 +13,15 @@ import Comparison from '../filter/Comparison.js';
  * @extends {module:ol/format/filter/Comparison}
  * @api
  */
-const IsNull = function(propertyName) {
+class IsNull {
+
+  constructor(propertyName) {
     Comparison.call(this, 'PropertyIsNull', propertyName);
-};
+  }
+
+}
+
 
 inherits(IsNull, Comparison);
+
 export default IsNull;

src/ol/format/filter/LessThan.js

@@ -14,9 +14,14 @@ import ComparisonBinary from '../filter/ComparisonBinary.js';
  * @extends {module:ol/format/filter/ComparisonBinary}
  * @api
  */
-const LessThan = function(propertyName, expression) {
+class LessThan {
+
+  constructor(propertyName, expression) {
     ComparisonBinary.call(this, 'PropertyIsLessThan', propertyName, expression);
-};
+  }
+
+}
 
 inherits(LessThan, ComparisonBinary);
+
 export default LessThan;

src/ol/format/filter/LessThanOrEqualTo.js

@@ -14,9 +14,14 @@ import ComparisonBinary from '../filter/ComparisonBinary.js';
  * @extends {module:ol/format/filter/ComparisonBinary}
  * @api
  */
-const LessThanOrEqualTo = function(propertyName, expression) {
+class LessThanOrEqualTo {
+
+  constructor(propertyName, expression) {
     ComparisonBinary.call(this, 'PropertyIsLessThanOrEqualTo', propertyName, expression);
-};
+  }
+
+}
 
 inherits(LessThanOrEqualTo, ComparisonBinary);
+
 export default LessThanOrEqualTo;

src/ol/format/filter/LogicalNary.js

@@ -16,7 +16,9 @@ import Filter from '../filter/Filter.js';
  * @param {...module:ol/format/filter/Filter} conditions Conditions.
  * @extends {module:ol/format/filter/Filter}
  */
-const LogicalNary = function(tagName, conditions) {
+class LogicalNary {
+
+  constructor(tagName, conditions) {
 
     Filter.call(this, tagName);
 
@@ -25,7 +27,10 @@ const LogicalNary = function(tagName, conditions) {
      */
     this.conditions = Array.prototype.slice.call(arguments, 1);
     assert(this.conditions.length >= 2, 57); // At least 2 conditions are required.
-};
+  }
+
+}
 
 inherits(LogicalNary, Filter);
+
 export default LogicalNary;

src/ol/format/filter/Not.js

@@ -13,7 +13,9 @@ import Filter from '../filter/Filter.js';
  * @extends {module:ol/format/filter/Filter}
  * @api
  */
-const Not = function(condition) {
+class Not {
+
+  constructor(condition) {
 
     Filter.call(this, 'Not');
 
@@ -21,7 +23,10 @@ const Not = function(condition) {
      * @type {!module:ol/format/filter/Filter}
      */
     this.condition = condition;
-};
+
+  }
+
+}
 
 inherits(Not, Filter);
 export default Not;

src/ol/format/filter/NotEqualTo.js

@@ -15,9 +15,14 @@ import ComparisonBinary from '../filter/ComparisonBinary.js';
  * @extends {module:ol/format/filter/ComparisonBinary}
  * @api
  */
-const NotEqualTo = function(propertyName, expression, opt_matchCase) {
+class NotEqualTo {
+
+  constructor(propertyName, expression, opt_matchCase) {
     ComparisonBinary.call(this, 'PropertyIsNotEqualTo', propertyName, expression, opt_matchCase);
-};
+  }
+
+}
 
 inherits(NotEqualTo, ComparisonBinary);
+
 export default NotEqualTo;

src/ol/format/filter/Or.js

@@ -13,10 +13,15 @@ import LogicalNary from '../filter/LogicalNary.js';
  * @extends {module:ol/format/filter/LogicalNary}
  * @api
  */
-const Or = function(conditions) {
+class Or {
+
+  constructor(conditions) {
     const params = ['Or'].concat(Array.prototype.slice.call(arguments));
     LogicalNary.apply(this, params);
-};
+  }
+
+}
 
 inherits(Or, LogicalNary);
+
 export default Or;

src/ol/format/filter/Spatial.js

@@ -19,7 +19,9 @@ import Filter from '../filter/Filter.js';
  *    set on geometries when this is not provided.
  * @extends {module:ol/format/filter/Filter}
  */
-const Spatial = function(tagName, geometryName, geometry, opt_srsName) {
+class Spatial {
+
+  constructor(tagName, geometryName, geometry, opt_srsName) {
 
     Filter.call(this, tagName);
 
@@ -37,7 +39,9 @@ const Spatial = function(tagName, geometryName, geometry, opt_srsName) {
      * @type {string|undefined}
      */
     this.srsName = opt_srsName;
-};
+  }
+
+}
 
 inherits(Spatial, Filter);
 

src/ol/format/filter/Within.js

@@ -17,11 +17,14 @@ import Spatial from '../filter/Spatial.js';
  * @extends {module:ol/format/filter/Spatial}
  * @api
  */
-const Within = function(geometryName, geometry, opt_srsName) {
+class Within {
 
+  constructor(geometryName, geometry, opt_srsName) {
     Spatial.call(this, 'Within', geometryName, geometry, opt_srsName);
+  }
 
-};
+}
 
 inherits(Within, Spatial);
+
 export default Within;

src/ol/interaction/DoubleClickZoom.js

@@ -22,7 +22,9 @@ import Interaction, {zoomByDelta} from '../interaction/Interaction.js';
  * @param {module:ol/interaction/DoubleClickZoom~Options=} opt_options Options.
  * @api
  */
-const DoubleClickZoom = function(opt_options) {
+class DoubleClickZoom {
+
+  constructor(opt_options) {
 
     const options = opt_options ? opt_options : {};
 
@@ -42,7 +44,9 @@ const DoubleClickZoom = function(opt_options) {
      */
     this.duration_ = options.duration !== undefined ? options.duration : 250;
 
-};
+  }
+
+}
 
 inherits(DoubleClickZoom, Interaction);
 

src/ol/interaction/DragAndDrop.js

@@ -50,7 +50,9 @@ const DragAndDropEventType = {
  * @param {Array.<module:ol/Feature>=} opt_features Features.
  * @param {module:ol/proj/Projection=} opt_projection Projection.
  */
-const DragAndDropEvent = function(type, file, opt_features, opt_projection) {
+class DragAndDropEvent {
+
+  constructor(type, file, opt_features, opt_projection) {
 
     Event.call(this, type);
 
@@ -75,7 +77,10 @@ const DragAndDropEvent = function(type, file, opt_features, opt_projection) {
      */
     this.projection = opt_projection;
 
-};
+  }
+
+}
+
 inherits(DragAndDropEvent, Event);
 
 

src/ol/interaction/DragBox.js

@@ -70,7 +70,9 @@ const DragBoxEventType = {
  * @extends {module:ol/events/Event}
  * @constructor
  */
-const DragBoxEvent = function(type, coordinate, mapBrowserEvent) {
+class DragBoxEvent {
+
+  constructor(type, coordinate, mapBrowserEvent) {
     Event.call(this, type);
 
     /**
@@ -88,7 +90,9 @@ const DragBoxEvent = function(type, coordinate, mapBrowserEvent) {
      */
     this.mapBrowserEvent = mapBrowserEvent;
 
-};
+  }
+
+}
 
 inherits(DragBoxEvent, Event);
 

src/ol/interaction/DragPan.js

@@ -28,7 +28,8 @@ import PointerInteraction, {centroid as centroidFromPointers} from '../interacti
  * @param {module:ol/interaction/DragPan~Options=} opt_options Options.
  * @api
  */
-const DragPan = function(opt_options) {
+class DragPan {
+  constructor(opt_options) {
 
     PointerInteraction.call(this, {
       handleDownEvent: handleDownEvent,
@@ -66,7 +67,9 @@ const DragPan = function(opt_options) {
      */
     this.noKinetic_ = false;
 
-};
+  }
+
+}
 
 inherits(DragPan, PointerInteraction);
 

src/ol/interaction/DragRotate.js

@@ -33,7 +33,9 @@ import PointerInteraction from '../interaction/Pointer.js';
  * @param {module:ol/interaction/DragRotate~Options=} opt_options Options.
  * @api
  */
-const DragRotate = function(opt_options) {
+class DragRotate {
+
+  constructor(opt_options) {
 
     const options = opt_options ? opt_options : {};
 
@@ -60,7 +62,10 @@ const DragRotate = function(opt_options) {
      * @type {number}
      */
     this.duration_ = options.duration !== undefined ? options.duration : 250;
-};
+
+  }
+
+}
 
 inherits(DragRotate, PointerInteraction);
 

src/ol/interaction/DragRotateAndZoom.js

@@ -34,7 +34,9 @@ import PointerInteraction from '../interaction/Pointer.js';
  * @param {module:ol/interaction/DragRotateAndZoom~Options=} opt_options Options.
  * @api
  */
-const DragRotateAndZoom = function(opt_options) {
+class DragRotateAndZoom {
+
+  constructor(opt_options) {
 
     const options = opt_options ? opt_options : {};
 
@@ -74,7 +76,9 @@ const DragRotateAndZoom = function(opt_options) {
      */
     this.duration_ = options.duration !== undefined ? options.duration : 400;
 
-};
+  }
+
+}
 
 inherits(DragRotateAndZoom, PointerInteraction);
 

src/ol/interaction/Draw.js

@@ -134,7 +134,9 @@ const DrawEventType = {
  * @param {module:ol/interaction/Draw~DrawEventType} type Type.
  * @param {module:ol/Feature} feature The feature drawn.
  */
-const DrawEvent = function(type, feature) {
+class DrawEvent {
+
+  constructor(type, feature) {
 
     Event.call(this, type);
 
@@ -145,7 +147,9 @@ const DrawEvent = function(type, feature) {
      */
     this.feature = feature;
 
-};
+  }
+
+}
 
 inherits(DrawEvent, Event);
 

src/ol/interaction/Extent.js

@@ -56,7 +56,9 @@ const ExtentEventType = {
  * @param {module:ol/extent~Extent} extent the new extent
  * @extends {module:ol/events/Event}
  */
-const ExtentInteractionEvent = function(extent) {
+class ExtentInteractionEvent {
+
+  constructor(extent) {
     Event.call(this, ExtentEventType.EXTENTCHANGED);
 
     /**
@@ -65,8 +67,10 @@ const ExtentInteractionEvent = function(extent) {
      * @api
      */
     this.extent = extent;
+  }
+
+}
 
-};
 inherits(ExtentInteractionEvent, Event);
 
 

src/ol/interaction/KeyboardPan.js

@@ -39,7 +39,9 @@ import Interaction, {pan} from '../interaction/Interaction.js';
  * @param {module:ol/interaction/KeyboardPan~Options=} opt_options Options.
  * @api
  */
-const KeyboardPan = function(opt_options) {
+class KeyboardPan {
+
+  constructor(opt_options) {
 
     Interaction.call(this, {
       handleEvent: handleEvent
@@ -77,7 +79,9 @@ const KeyboardPan = function(opt_options) {
     this.pixelDelta_ = options.pixelDelta !== undefined ?
       options.pixelDelta : 128;
 
-};
+  }
+
+}
 
 inherits(KeyboardPan, Interaction);
 

src/ol/interaction/KeyboardZoom.js

@@ -35,7 +35,9 @@ import Interaction, {zoomByDelta} from '../interaction/Interaction.js';
  * @extends {module:ol/interaction/Interaction}
  * @api
  */
-const KeyboardZoom = function(opt_options) {
+class KeyboardZoom {
+
+  constructor(opt_options) {
 
     Interaction.call(this, {
       handleEvent: handleEvent
@@ -61,7 +63,9 @@ const KeyboardZoom = function(opt_options) {
      */
     this.duration_ = options.duration !== undefined ? options.duration : 100;
 
-};
+  }
+
+}
 
 inherits(KeyboardZoom, Interaction);
 

src/ol/interaction/Modify.js

@@ -99,7 +99,9 @@ const ModifyEventType = {
  * @param {module:ol/MapBrowserPointerEvent} mapBrowserPointerEvent
  * Associated {@link module:ol/MapBrowserPointerEvent}.
  */
-export const ModifyEvent = function(type, features, mapBrowserPointerEvent) {
+export class ModifyEvent {
+
+  constructor(type, features, mapBrowserPointerEvent) {
 
     Event.call(this, type);
 
@@ -116,7 +118,10 @@ export const ModifyEvent = function(type, features, mapBrowserPointerEvent) {
      * @api
      */
     this.mapBrowserEvent = mapBrowserPointerEvent;
-};
+
+  }
+
+}
 
 inherits(ModifyEvent, Event);
 

src/ol/interaction/PinchRotate.js

@@ -27,7 +27,9 @@ import {disable} from '../rotationconstraint.js';
  * @param {module:ol/interaction/PinchRotate~Options=} opt_options Options.
  * @api
  */
-const PinchRotate = function(opt_options) {
+class PinchRotate {
+
+  constructor(opt_options) {
 
     PointerInteraction.call(this, {
       handleDownEvent: handleDownEvent,
@@ -73,7 +75,9 @@ const PinchRotate = function(opt_options) {
      */
     this.duration_ = options.duration !== undefined ? options.duration : 250;
 
-};
+  }
+
+}
 
 inherits(PinchRotate, PointerInteraction);
 

src/ol/interaction/PinchZoom.js

@@ -26,7 +26,9 @@ import PointerInteraction, {centroid as centroidFromPointers} from '../interacti
  * @param {module:ol/interaction/PinchZoom~Options=} opt_options Options.
  * @api
  */
-const PinchZoom = function(opt_options) {
+class PinchZoom {
+
+  constructor(opt_options) {
 
     PointerInteraction.call(this, {
       handleDownEvent: handleDownEvent,
@@ -66,7 +68,9 @@ const PinchZoom = function(opt_options) {
      */
     this.lastScaleDelta_ = 1;
 
-};
+  }
+
+}
 
 inherits(PinchZoom, PointerInteraction);
 

src/ol/interaction/Select.js

@@ -110,7 +110,9 @@ const SelectEventType = {
  * @extends {module:ol/events/Event}
  * @constructor
  */
-const SelectEvent = function(type, selected, deselected, mapBrowserEvent) {
+class SelectEvent {
+
+  constructor(type, selected, deselected, mapBrowserEvent) {
     Event.call(this, type);
 
     /**
@@ -133,7 +135,10 @@ const SelectEvent = function(type, selected, deselected, mapBrowserEvent) {
      * @api
      */
     this.mapBrowserEvent = mapBrowserEvent;
-};
+
+  }
+
+}
 
 inherits(SelectEvent, Event);
 

src/ol/interaction/Translate.js

@@ -63,7 +63,9 @@ const TranslateEventType = {
  * @param {module:ol/Collection.<module:ol/Feature>} features The features translated.
  * @param {module:ol/coordinate~Coordinate} coordinate The event coordinate.
  */
-export const TranslateEvent = function(type, features, coordinate) {
+export class TranslateEvent {
+
+  constructor(type, features, coordinate) {
 
     Event.call(this, type);
 
@@ -81,7 +83,10 @@ export const TranslateEvent = function(type, features, coordinate) {
      * @api
      */
     this.coordinate = coordinate;
-};
+
+  }
+
+}
 
 inherits(TranslateEvent, Event);
 

src/ol/layer/Image.js

@@ -40,7 +40,9 @@ import Layer from '../layer/Layer.js';
  * @param {module:ol/layer/Image~Options=} opt_options Layer options.
  * @api
  */
-const ImageLayer = function(opt_options) {
+class ImageLayer {
+
+  constructor(opt_options) {
     const options = opt_options ? opt_options : {};
     Layer.call(this,  /** @type {module:ol/layer/Layer~Options} */ (options));
 
@@ -51,7 +53,9 @@ const ImageLayer = function(opt_options) {
      */
     this.type = LayerType.IMAGE;
 
-};
+  }
+
+}
 
 inherits(ImageLayer, Layer);
 

src/ol/proj/epsg3857.js

@@ -48,7 +48,9 @@ export const WORLD_EXTENT = [-180, -85, 180, 85];
  * @extends {module:ol/proj/Projection}
  * @param {string} code Code.
  */
-function EPSG3857Projection(code) {
+class EPSG3857Projection {
+
+  constructor(code) {
     Projection.call(this, {
       code: code,
       units: Units.METERS,
@@ -59,7 +61,11 @@ function EPSG3857Projection(code) {
         return resolution / cosh(point[1] / RADIUS);
       }
     });
+
+  }
+
 }
+
 inherits(EPSG3857Projection, Projection);
 
 

src/ol/proj/epsg4326.js

@@ -44,7 +44,9 @@ export const METERS_PER_UNIT = Math.PI * RADIUS / 180;
  * @param {string} code Code.
  * @param {string=} opt_axisOrientation Axis orientation.
  */
-function EPSG4326Projection(code, opt_axisOrientation) {
+class EPSG4326Projection {
+
+  constructor(code, opt_axisOrientation) {
     Projection.call(this, {
       code: code,
       units: Units.DEGREES,
@@ -54,7 +56,11 @@ function EPSG4326Projection(code, opt_axisOrientation) {
       metersPerUnit: METERS_PER_UNIT,
       worldExtent: EXTENT
     });
+
+  }
+
 }
+
 inherits(EPSG4326Projection, Projection);
 
 

src/ol/render/Event.js

@@ -13,9 +13,9 @@ import Event from '../events/Event.js';
  * @param {?CanvasRenderingContext2D=} opt_context Context.
  * @param {?module:ol/webgl/Context=} opt_glContext WebGL Context.
  */
-const RenderEvent = function(
+class RenderEvent {
-  type, opt_vectorContext, opt_frameState, opt_context,
+
-  opt_glContext) {
+  constructor(type, opt_vectorContext, opt_frameState, opt_context, opt_glContext) {
 
     Event.call(this, type);
 
@@ -49,7 +49,9 @@ const RenderEvent = function(
      */
     this.glContext = opt_glContext;
 
-};
+  }
+
+}
 
 inherits(RenderEvent, Event);
 export default RenderEvent;

src/ol/render/webgl/circlereplay/defaultshader/Locations.js

@@ -12,7 +12,9 @@ import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
  * @param {WebGLProgram} program Program.
  * @struct
  */
-const Locations = function(gl, program) {
+class Locations {
+
+  constructor(gl, program) {
 
     /**
     * @type {WebGLUniformLocation}
@@ -85,6 +87,9 @@ const Locations = function(gl, program) {
     */
     this.a_radius = gl.getAttribLocation(
       program, DEBUG_WEBGL ? 'a_radius' : 'g');
-};
+
+  }
+
+}
 
 export default Locations;

src/ol/render/webgl/linestringreplay/defaultshader/Locations.js

@@ -12,7 +12,9 @@ import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
  * @param {WebGLProgram} program Program.
  * @struct
  */
-const Locations = function(gl, program) {
+class Locations {
+
+  constructor(gl, program) {
 
     /**
     * @type {WebGLUniformLocation}
@@ -91,6 +93,9 @@ const Locations = function(gl, program) {
     */
     this.a_direction = gl.getAttribLocation(
       program, DEBUG_WEBGL ? 'a_direction' : 'g');
-};
+
+  }
+
+}
 
 export default Locations;

src/ol/render/webgl/polygonreplay/defaultshader/Locations.js

@@ -12,7 +12,9 @@ import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
  * @param {WebGLProgram} program Program.
  * @struct
  */
-const Locations = function(gl, program) {
+class Locations {
+
+  constructor(gl, program) {
 
     /**
     * @type {WebGLUniformLocation}
@@ -49,6 +51,9 @@ const Locations = function(gl, program) {
     */
     this.a_position = gl.getAttribLocation(
       program, DEBUG_WEBGL ? 'a_position' : 'a');
-};
+
+  }
+
+}
 
 export default Locations;

src/ol/render/webgl/texturereplay/defaultshader/Locations.js

@@ -12,7 +12,9 @@ import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
  * @param {WebGLProgram} program Program.
  * @struct
  */
-const Locations = function(gl, program) {
+class Locations {
+
+  constructor(gl, program) {
 
     /**
     * @type {WebGLUniformLocation}
@@ -73,6 +75,9 @@ const Locations = function(gl, program) {
     */
     this.a_rotateWithView = gl.getAttribLocation(
       program, DEBUG_WEBGL ? 'a_rotateWithView' : 'g');
-};
+
+  }
+
+}
 
 export default Locations;

src/ol/renderer/webgl/defaultmapshader/Locations.js

@@ -4,7 +4,7 @@
 // This file is automatically generated, do not edit
 // Run `make shaders` to generate, and commit the result.
 
-import {DEBUG as DEBUG_WEBGL} from '../../../webgl.js';
+import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
 
 /**
  * @constructor
@@ -12,7 +12,9 @@ import {DEBUG as DEBUG_WEBGL} from '../../../webgl.js';
  * @param {WebGLProgram} program Program.
  * @struct
  */
-const Locations = function(gl, program) {
+class Locations {
+
+  constructor(gl, program) {
 
     /**
     * @type {WebGLUniformLocation}
@@ -49,6 +51,9 @@ const Locations = function(gl, program) {
     */
     this.a_texCoord = gl.getAttribLocation(
       program, DEBUG_WEBGL ? 'a_texCoord' : 'c');
-};
+
+  }
+
+}
 
 export default Locations;

src/ol/renderer/webgl/tilelayershader/Locations.js

@@ -4,7 +4,7 @@
 // This file is automatically generated, do not edit
 // Run `make shaders` to generate, and commit the result.
 
-import {DEBUG as DEBUG_WEBGL} from '../../../webgl.js';
+import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
 
 /**
  * @constructor
@@ -12,7 +12,9 @@ import {DEBUG as DEBUG_WEBGL} from '../../../webgl.js';
  * @param {WebGLProgram} program Program.
  * @struct
  */
-const Locations = function(gl, program) {
+class Locations {
+
+  constructor(gl, program) {
 
     /**
     * @type {WebGLUniformLocation}
@@ -37,6 +39,9 @@ const Locations = function(gl, program) {
     */
     this.a_texCoord = gl.getAttribLocation(
       program, DEBUG_WEBGL ? 'a_texCoord' : 'c');
-};
+
+  }
+
+}
 
 export default Locations;

src/ol/source/Image.js

@@ -51,7 +51,9 @@ const ImageSourceEventType = {
  * @param {string} type Type.
  * @param {module:ol/Image} image The image.
  */
-const ImageSourceEvent = function(type, image) {
+class ImageSourceEvent {
+
+  constructor(type, image) {
 
     Event.call(this, type);
 
@@ -62,7 +64,10 @@ const ImageSourceEvent = function(type, image) {
      */
     this.image = image;
 
-};
+  }
+
+}
+
 inherits(ImageSourceEvent, Event);
 
 

src/ol/source/OSM.js

@@ -50,7 +50,9 @@ export const ATTRIBUTION = '© ' +
  * @param {module:ol/source/OSM~Options=} [opt_options] Open Street Map options.
  * @api
  */
-const OSM = function(opt_options) {
+class OSM {
+
+  constructor(opt_options) {
 
     const options = opt_options || {};
 
@@ -79,7 +81,9 @@ const OSM = function(opt_options) {
       wrapX: options.wrapX
     });
 
-};
+  }
+
+}
 
 inherits(OSM, XYZ);
 

src/ol/source/Raster.js

@@ -83,7 +83,9 @@ const RasterOperationType = {
  * @param {module:ol/PluggableMap~FrameState} frameState The frame state.
  * @param {Object} data An object made available to operations.
  */
-const RasterSourceEvent = function(type, frameState, data) {
+class RasterSourceEvent {
+
+  constructor(type, frameState, data) {
     Event.call(this, type);
 
     /**
@@ -108,7 +110,10 @@ const RasterSourceEvent = function(type, frameState, data) {
      */
     this.data = data;
 
-};
+  }
+
+}
+
 inherits(RasterSourceEvent, Event);
 
 /**

src/ol/source/Stamen.js

@@ -118,7 +118,9 @@ const ProviderConfig = {
  * @param {module:ol/source/Stamen~Options=} options Stamen options.
  * @api
  */
-const Stamen = function(options) {
+class Stamen {
+
+  constructor(options) {
     const i = options.layer.indexOf('-');
     const provider = i == -1 ? options.layer : options.layer.slice(0, i);
     const providerConfig = ProviderConfig[provider];
@@ -141,7 +143,10 @@ const Stamen = function(options) {
       url: url,
       wrapX: options.wrapX
     });
-};
+
+  }
+
+}
 
 inherits(Stamen, XYZ);
 

src/ol/source/Tile.js

@@ -318,7 +318,9 @@ TileSource.prototype.useTile = UNDEFINED;
  * @param {string} type Type.
  * @param {module:ol/Tile} tile The tile.
  */
-export const TileSourceEvent = function(type, tile) {
+export class TileSourceEvent {
+
+  constructor(type, tile) {
 
     Event.call(this, type);
 
@@ -329,7 +331,10 @@ export const TileSourceEvent = function(type, tile) {
      */
     this.tile = tile;
 
-};
+  }
+
+}
+
 inherits(TileSourceEvent, Event);
 
 export default TileSource;

src/ol/source/UTFGrid.js

@@ -27,7 +27,9 @@ import {createXYZ, extentFromProjection} from '../tilegrid.js';
  * @param {boolean} preemptive Load the tile when visible (before it's needed).
  * @param {boolean} jsonp Load the tile as a script.
  */
-export const CustomTile = function(tileCoord, state, src, extent, preemptive, jsonp) {
+export class CustomTile {
+
+  constructor(tileCoord, state, src, extent, preemptive, jsonp) {
 
     Tile.call(this, tileCoord, state);
 
@@ -74,7 +76,10 @@ export const CustomTile = function(tileCoord, state, src, extent, preemptive, js
      */
     this.jsonp_ = jsonp;
 
-};
+  }
+
+}
+
 inherits(CustomTile, Tile);
 
 
@@ -275,7 +280,9 @@ CustomTile.prototype.load = function() {
  * @param {module:ol/source/UTFGrid~Options=} options Source options.
  * @api
  */
-const UTFGrid = function(options) {
+class UTFGrid {
+
+  constructor(options) {
     TileSource.call(this, {
       projection: getProjection('EPSG:3857'),
       state: SourceState.LOADING
@@ -322,7 +329,10 @@ const UTFGrid = function(options) {
     } else {
       assert(false, 51); // Either `url` or `tileJSON` options must be provided
     }
-};
+
+  }
+
+}
 
 inherits(UTFGrid, TileSource);
 

src/ol/source/Vector.js

@@ -41,7 +41,9 @@ import RBush from '../structs/RBush.js';
  * @param {string} type Type.
  * @param {module:ol/Feature=} opt_feature Feature.
  */
-export const VectorSourceEvent = function(type, opt_feature) {
+export class VectorSourceEvent {
+
+  constructor(type, opt_feature) {
 
     Event.call(this, type);
 
@@ -52,7 +54,10 @@ export const VectorSourceEvent = function(type, opt_feature) {
      */
     this.feature = opt_feature;
 
-};
+  }
+
+}
+
 inherits(VectorSourceEvent, Event);
 
 
@@ -158,7 +163,9 @@ inherits(VectorSourceEvent, Event);
  * @param {module:ol/source/Vector~Options=} opt_options Vector source options.
  * @api
  */
-const VectorSource = function(opt_options) {
+class VectorSource {
+
+  constructor(opt_options) {
 
     const options = opt_options || {};
 
@@ -271,7 +278,9 @@ const VectorSource = function(opt_options) {
       this.bindFeaturesCollection_(collection);
     }
 
-};
+  }
+
+}
 
 inherits(VectorSource, Source);
 

src/ol/source/VectorTile.js

@@ -74,7 +74,9 @@ import {createXYZ, extentFromProjection, createForProjection} from '../tilegrid.
  * @param {module:ol/source/VectorTile~Options=} options Vector tile options.
  * @api
  */
-const VectorTile = function(options) {
+class VectorTile {
+
+  constructor(options) {
     const projection = options.projection || 'EPSG:3857';
 
     const extent = options.extent || extentFromProjection(projection);
@@ -133,7 +135,9 @@ const VectorTile = function(options) {
      */
     this.tileGrids_ = {};
 
-};
+  }
+
+}
 
 inherits(VectorTile, UrlTile);
 

src/ol/source/WMTS.js

@@ -65,7 +65,9 @@ import {appendParams} from '../uri.js';
  * @param {module:ol/source/WMTS~Options=} options WMTS options.
  * @api
  */
-const WMTS = function(options) {
+class WMTS {
+
+  constructor(options) {
 
     // TODO: add support for TileMatrixLimits
 
@@ -215,7 +217,9 @@ const WMTS = function(options) {
 
     this.setKey(this.getKeyForDimensions_());
 
-};
+  }
+
+}
 
 inherits(WMTS, TileImage);
 

src/ol/source/XYZ.js

@@ -66,7 +66,9 @@ import {createXYZ, extentFromProjection} from '../tilegrid.js';
  * @param {module:ol/source/XYZ~Options=} opt_options XYZ options.
  * @api
  */
-const XYZ = function(opt_options) {
+class XYZ {
+
+  constructor(opt_options) {
     const options = opt_options || {};
     const projection = options.projection !== undefined ?
       options.projection : 'EPSG:3857';
@@ -96,7 +98,10 @@ const XYZ = function(opt_options) {
       transition: options.transition
     });
 
-};
+  }
+
+}
 
 inherits(XYZ, TileImage);
+
 export default XYZ;

src/ol/source/Zoomify.js

@@ -34,8 +34,9 @@ const TierSizeCalculation = {
  * @param {module:ol/Tile~LoadFunction} tileLoadFunction Tile load function.
  * @param {module:ol/Tile~Options=} opt_options Tile options.
  */
-export const CustomTile = function(
+export class CustomTile {
-  tileGrid, tileCoord, state, src, crossOrigin, tileLoadFunction, opt_options) {
+
+  constructor(tileGrid, tileCoord, state, src, crossOrigin, tileLoadFunction, opt_options) {
 
     ImageTile.call(this, tileCoord, state, src, crossOrigin, tileLoadFunction, opt_options);
 
@@ -50,7 +51,11 @@ export const CustomTile = function(
      * @type {module:ol/size~Size}
      */
     this.tileSize_ = toSize(tileGrid.getTileSize(tileCoord[0]));
-};
+
+  }
+
+}
+
 inherits(CustomTile, ImageTile);
 
 
@@ -124,7 +129,9 @@ CustomTile.prototype.getImage = function() {
  * @param {module:ol/source/Zoomify~Options=} opt_options Options.
  * @api
  */
-const Zoomify = function(opt_options) {
+class Zoomify {
+
+  constructor(opt_options) {
 
     const options = opt_options || {};
 
@@ -250,9 +257,10 @@ const Zoomify = function(opt_options) {
       transition: options.transition
     });
 
-};
+  }
+
+}
 
 inherits(Zoomify, TileImage);
 
-
 export default Zoomify;

src/ol/structs/LRUCache.js

@@ -27,7 +27,9 @@ import EventType from '../events/EventType.js';
  * @template T
  * @param {number=} opt_highWaterMark High water mark.
  */
-const LRUCache = function(opt_highWaterMark) {
+class LRUCache {
+
+  constructor(opt_highWaterMark) {
 
     EventTarget.call(this);
 
@@ -60,41 +62,39 @@ const LRUCache = function(opt_highWaterMark) {
      */
     this.newest_ = null;
 
-};
+  }
-
-inherits(LRUCache, EventTarget);
 
 
-/**
+  /**
    * @return {boolean} Can expire cache.
    */
-LRUCache.prototype.canExpireCache = function() {
+  canExpireCache() {
     return this.getCount() > this.highWaterMark;
-};
+  }
 
 
-/**
+  /**
    * FIXME empty description for jsdoc
    */
-LRUCache.prototype.clear = function() {
+  clear() {
     this.count_ = 0;
     this.entries_ = {};
     this.oldest_ = null;
     this.newest_ = null;
     this.dispatchEvent(EventType.CLEAR);
-};
+  }
 
 
-/**
+  /**
    * @param {string} key Key.
    * @return {boolean} Contains key.
    */
-LRUCache.prototype.containsKey = function(key) {
+  containsKey(key) {
     return this.entries_.hasOwnProperty(key);
-};
+  }
 
 
-/**
+  /**
    * @param {function(this: S, T, string, module:ol/structs/LRUCache): ?} f The function
    *     to call for every entry from the oldest to the newer. This function takes
    *     3 arguments (the entry value, the entry key and the LRUCache object).
@@ -102,20 +102,20 @@ LRUCache.prototype.containsKey = function(key) {
    * @param {S=} opt_this The object to use as `this` in `f`.
    * @template S
    */
-LRUCache.prototype.forEach = function(f, opt_this) {
+  forEach(f, opt_this) {
     let entry = this.oldest_;
     while (entry) {
       f.call(opt_this, entry.value_, entry.key_, this);
       entry = entry.newer;
     }
-};
+  }
 
 
-/**
+  /**
    * @param {string} key Key.
    * @return {T} Value.
    */
-LRUCache.prototype.get = function(key) {
+  get(key) {
     const entry = this.entries_[key];
     assert(entry !== undefined,
       15); // Tried to get a value for a key that does not exist in the cache
@@ -133,15 +133,15 @@ LRUCache.prototype.get = function(key) {
     this.newest_.newer = entry;
     this.newest_ = entry;
     return entry.value_;
-};
+  }
 
 
-/**
+  /**
    * Remove an entry from the cache.
    * @param {string} key The entry key.
    * @return {T} The removed entry.
    */
-LRUCache.prototype.remove = function(key) {
+  remove(key) {
     const entry = this.entries_[key];
     assert(entry !== undefined, 15); // Tried to get a value for a key that does not exist in the cache
     if (entry === this.newest_) {
@@ -161,21 +161,21 @@ LRUCache.prototype.remove = function(key) {
     delete this.entries_[key];
     --this.count_;
     return entry.value_;
-};
+  }
 
 
-/**
+  /**
    * @return {number} Count.
    */
-LRUCache.prototype.getCount = function() {
+  getCount() {
     return this.count_;
-};
+  }
 
 
-/**
+  /**
    * @return {Array.<string>} Keys.
    */
-LRUCache.prototype.getKeys = function() {
+  getKeys() {
     const keys = new Array(this.count_);
     let i = 0;
     let entry;
@@ -183,13 +183,13 @@ LRUCache.prototype.getKeys = function() {
       keys[i++] = entry.key_;
     }
     return keys;
-};
+  }
 
 
-/**
+  /**
    * @return {Array.<T>} Values.
    */
-LRUCache.prototype.getValues = function() {
+  getValues() {
     const values = new Array(this.count_);
     let i = 0;
     let entry;
@@ -197,38 +197,38 @@ LRUCache.prototype.getValues = function() {
       values[i++] = entry.value_;
     }
     return values;
-};
+  }
 
 
-/**
+  /**
    * @return {T} Last value.
    */
-LRUCache.prototype.peekLast = function() {
+  peekLast() {
     return this.oldest_.value_;
-};
+  }
 
 
-/**
+  /**
    * @return {string} Last key.
    */
-LRUCache.prototype.peekLastKey = function() {
+  peekLastKey() {
     return this.oldest_.key_;
-};
+  }
 
 
-/**
+  /**
    * Get the key of the newest item in the cache.  Throws if the cache is empty.
    * @return {string} The newest key.
    */
-LRUCache.prototype.peekFirstKey = function() {
+  peekFirstKey() {
     return this.newest_.key_;
-};
+  }
 
 
-/**
+  /**
    * @return {T} value Value.
    */
-LRUCache.prototype.pop = function() {
+  pop() {
     const entry = this.oldest_;
     delete this.entries_[entry.key_];
     if (entry.newer) {
@@ -240,24 +240,24 @@ LRUCache.prototype.pop = function() {
     }
     --this.count_;
     return entry.value_;
-};
+  }
 
 
-/**
+  /**
    * @param {string} key Key.
    * @param {T} value Value.
    */
-LRUCache.prototype.replace = function(key, value) {
+  replace(key, value) {
     this.get(key);  // update `newest_`
     this.entries_[key].value_ = value;
-};
+  }
 
 
-/**
+  /**
    * @param {string} key Key.
    * @param {T} value Value.
    */
-LRUCache.prototype.set = function(key, value) {
+  set(key, value) {
     assert(!(key in this.entries_),
       16); // Tried to set a value for a key that is used already
     const entry = /** @type {module:ol/structs/LRUCache~Entry} */ ({
@@ -274,25 +274,30 @@ LRUCache.prototype.set = function(key, value) {
     this.newest_ = entry;
     this.entries_[key] = entry;
     ++this.count_;
-};
+  }
 
 
-/**
+  /**
    * Set a maximum number of entries for the cache.
    * @param {number} size Cache size.
    * @api
    */
-LRUCache.prototype.setSize = function(size) {
+  setSize(size) {
     this.highWaterMark = size;
-};
+  }
 
 
-/**
+  /**
    * Prune the cache.
    */
-LRUCache.prototype.prune = function() {
+  prune() {
     while (this.canExpireCache()) {
       this.pop();
     }
-};
+  }
+
+}
+
+inherits(LRUCache, EventTarget);
+
 export default LRUCache;

src/ol/structs/LinkedList.js

@@ -19,7 +19,9 @@
  * @param {boolean=} opt_circular The last item is connected to the first one,
  * and the first item to the last one. Default is true.
  */
-const LinkedList = function(opt_circular) {
+class LinkedList {
+
+  constructor(opt_circular) {
 
     /**
      * @private
@@ -50,14 +52,15 @@ const LinkedList = function(opt_circular) {
      * @type {number}
      */
     this.length_ = 0;
-};
 
-/**
+  }
+
+  /**
    * Inserts an item into the linked list right after the current one.
    *
    * @param {?} data Item data.
    */
-LinkedList.prototype.insertItem = function(data) {
+  insertItem(data) {
 
     /** @type {module:ol/structs/LinkedList~Item} */
     const item = {
@@ -92,13 +95,13 @@ LinkedList.prototype.insertItem = function(data) {
     }
     this.head_ = item;
     this.length_++;
-};
+  }
 
-/**
+  /**
    * Removes the current item from the list. Sets the cursor to the next item,
    * if possible.
    */
-LinkedList.prototype.removeItem = function() {
+  removeItem() {
     const head = this.head_;
     if (head) {
       const next = head.next;
@@ -122,112 +125,112 @@ LinkedList.prototype.removeItem = function() {
       }
       this.length_--;
     }
-};
+  }
 
-/**
+  /**
    * Sets the cursor to the first item, and returns the associated data.
    *
    * @return {?} Item data.
    */
-LinkedList.prototype.firstItem = function() {
+  firstItem() {
     this.head_ = this.first_;
     if (this.head_) {
       return this.head_.data;
     }
     return undefined;
-};
+  }
 
-/**
+  /**
-* Sets the cursor to the last item, and returns the associated data.
+  * Sets the cursor to the last item, and returns the associated data.
-*
+  *
-* @return {?} Item data.
+  * @return {?} Item data.
-*/
+  */
-LinkedList.prototype.lastItem = function() {
+  lastItem() {
     this.head_ = this.last_;
     if (this.head_) {
       return this.head_.data;
     }
     return undefined;
-};
+  }
 
-/**
+  /**
    * Sets the cursor to the next item, and returns the associated data.
    *
    * @return {?} Item data.
    */
-LinkedList.prototype.nextItem = function() {
+  nextItem() {
     if (this.head_ && this.head_.next) {
       this.head_ = this.head_.next;
       return this.head_.data;
     }
     return undefined;
-};
+  }
 
-/**
+  /**
    * Returns the next item's data without moving the cursor.
    *
    * @return {?} Item data.
    */
-LinkedList.prototype.getNextItem = function() {
+  getNextItem() {
     if (this.head_ && this.head_.next) {
       return this.head_.next.data;
     }
     return undefined;
-};
+  }
 
-/**
+  /**
    * Sets the cursor to the previous item, and returns the associated data.
    *
    * @return {?} Item data.
    */
-LinkedList.prototype.prevItem = function() {
+  prevItem() {
     if (this.head_ && this.head_.prev) {
       this.head_ = this.head_.prev;
       return this.head_.data;
     }
     return undefined;
-};
+  }
 
-/**
+  /**
    * Returns the previous item's data without moving the cursor.
    *
    * @return {?} Item data.
    */
-LinkedList.prototype.getPrevItem = function() {
+  getPrevItem() {
     if (this.head_ && this.head_.prev) {
       return this.head_.prev.data;
     }
     return undefined;
-};
+  }
 
-/**
+  /**
    * Returns the current item's data.
    *
    * @return {?} Item data.
    */
-LinkedList.prototype.getCurrItem = function() {
+  getCurrItem() {
     if (this.head_) {
       return this.head_.data;
     }
     return undefined;
-};
+  }
 
-/**
+  /**
    * Sets the first item of the list. This only works for circular lists, and sets
    * the last item accordingly.
    */
-LinkedList.prototype.setFirstItem = function() {
+  setFirstItem() {
     if (this.circular_ && this.head_) {
       this.first_ = this.head_;
       this.last_ = this.head_.prev;
     }
-};
+  }
 
-/**
+  /**
    * Concatenates two lists.
    * @param {module:ol/structs/LinkedList} list List to merge into the current list.
    */
-LinkedList.prototype.concat = function(list) {
+  concat(list) {
     if (list.head_) {
       if (this.head_) {
         const end = this.head_.next;
@@ -247,14 +250,18 @@ LinkedList.prototype.concat = function(list) {
       list.last_ = undefined;
       list.length_ = 0;
     }
-};
+  }
 
-/**
+  /**
    * Returns the current length of the list.
    *
    * @return {number} Length.
    */
-LinkedList.prototype.getLength = function() {
+  getLength() {
     return this.length_;
-};
+  }
+
+}
+
+
 export default LinkedList;

src/ol/structs/PriorityQueue.js

@@ -4,6 +4,13 @@
 import {assert} from '../asserts.js';
 import {clear} from '../obj.js';
 
+
+/**
+ * @type {number}
+ */
+export const DROP = Infinity;
+
+
 /**
  * Priority queue.
  *
@@ -19,7 +26,9 @@ import {clear} from '../obj.js';
  * @struct
  * @template T
  */
-const PriorityQueue = function(priorityFunction, keyFunction) {
+class PriorityQueue {
+
+  constructor(priorityFunction, keyFunction) {
 
     /**
      * @type {function(T): number}
@@ -51,30 +60,23 @@ const PriorityQueue = function(priorityFunction, keyFunction) {
      */
     this.queuedElements_ = {};
 
-};
+  }
 
-
+  /**
-/**
- * @type {number}
- */
-export const DROP = Infinity;
-
-
-/**
    * FIXME empty description for jsdoc
    */
-PriorityQueue.prototype.clear = function() {
+  clear() {
     this.elements_.length = 0;
     this.priorities_.length = 0;
     clear(this.queuedElements_);
-};
+  }
 
 
-/**
+  /**
    * Remove and return the highest-priority element. O(log N).
    * @return {T} Element.
    */
-PriorityQueue.prototype.dequeue = function() {
+  dequeue() {
     const elements = this.elements_;
     const priorities = this.priorities_;
     const element = elements[0];
@@ -89,15 +91,15 @@ PriorityQueue.prototype.dequeue = function() {
     const elementKey = this.keyFunction_(element);
     delete this.queuedElements_[elementKey];
     return element;
-};
+  }
 
 
-/**
+  /**
    * Enqueue an element. O(log N).
    * @param {T} element Element.
    * @return {boolean} The element was added to the queue.
    */
-PriorityQueue.prototype.enqueue = function(element) {
+  enqueue(element) {
     assert(!(this.keyFunction_(element) in this.queuedElements_),
       31); // Tried to enqueue an `element` that was already added to the queue
     const priority = this.priorityFunction_(element);
@@ -109,93 +111,93 @@ PriorityQueue.prototype.enqueue = function(element) {
       return true;
     }
     return false;
-};
+  }
 
 
-/**
+  /**
    * @return {number} Count.
    */
-PriorityQueue.prototype.getCount = function() {
+  getCount() {
     return this.elements_.length;
-};
+  }
 
 
-/**
+  /**
    * Gets the index of the left child of the node at the given index.
    * @param {number} index The index of the node to get the left child for.
    * @return {number} The index of the left child.
    * @private
    */
-PriorityQueue.prototype.getLeftChildIndex_ = function(index) {
+  getLeftChildIndex_(index) {
     return index * 2 + 1;
-};
+  }
 
 
-/**
+  /**
    * Gets the index of the right child of the node at the given index.
    * @param {number} index The index of the node to get the right child for.
    * @return {number} The index of the right child.
    * @private
    */
-PriorityQueue.prototype.getRightChildIndex_ = function(index) {
+  getRightChildIndex_(index) {
     return index * 2 + 2;
-};
+  }
 
 
-/**
+  /**
    * Gets the index of the parent of the node at the given index.
    * @param {number} index The index of the node to get the parent for.
    * @return {number} The index of the parent.
    * @private
    */
-PriorityQueue.prototype.getParentIndex_ = function(index) {
+  getParentIndex_(index) {
     return (index - 1) >> 1;
-};
+  }
 
 
-/**
+  /**
    * Make this a heap. O(N).
    * @private
    */
-PriorityQueue.prototype.heapify_ = function() {
+  heapify_() {
     let i;
     for (i = (this.elements_.length >> 1) - 1; i >= 0; i--) {
       this.siftUp_(i);
     }
-};
+  }
 
 
-/**
+  /**
    * @return {boolean} Is empty.
    */
-PriorityQueue.prototype.isEmpty = function() {
+  isEmpty() {
     return this.elements_.length === 0;
-};
+  }
 
 
-/**
+  /**
    * @param {string} key Key.
    * @return {boolean} Is key queued.
    */
-PriorityQueue.prototype.isKeyQueued = function(key) {
+  isKeyQueued(key) {
     return key in this.queuedElements_;
-};
+  }
 
 
-/**
+  /**
    * @param {T} element Element.
    * @return {boolean} Is queued.
    */
-PriorityQueue.prototype.isQueued = function(element) {
+  isQueued(element) {
     return this.isKeyQueued(this.keyFunction_(element));
-};
+  }
 
 
-/**
+  /**
    * @param {number} index The index of the node to move down.
    * @private
    */
-PriorityQueue.prototype.siftUp_ = function(index) {
+  siftUp_(index) {
     const elements = this.elements_;
     const priorities = this.priorities_;
     const count = elements.length;
@@ -219,15 +221,15 @@ PriorityQueue.prototype.siftUp_ = function(index) {
     elements[index] = element;
     priorities[index] = priority;
     this.siftDown_(startIndex, index);
-};
+  }
 
 
-/**
+  /**
    * @param {number} startIndex The index of the root.
    * @param {number} index The index of the node to move up.
    * @private
    */
-PriorityQueue.prototype.siftDown_ = function(startIndex, index) {
+  siftDown_(startIndex, index) {
     const elements = this.elements_;
     const priorities = this.priorities_;
     const element = elements[index];
@@ -245,13 +247,13 @@ PriorityQueue.prototype.siftDown_ = function(startIndex, index) {
     }
     elements[index] = element;
     priorities[index] = priority;
-};
+  }
 
 
-/**
+  /**
    * FIXME empty description for jsdoc
    */
-PriorityQueue.prototype.reprioritize = function() {
+  reprioritize() {
     const priorityFunction = this.priorityFunction_;
     const elements = this.elements_;
     const priorities = this.priorities_;
@@ -271,5 +273,9 @@ PriorityQueue.prototype.reprioritize = function() {
     elements.length = index;
     priorities.length = index;
     this.heapify_();
-};
+  }
+
+}
+
+
 export default PriorityQueue;

src/ol/structs/RBush.js

@@ -24,7 +24,9 @@ import {isEmpty} from '../obj.js';
  * @struct
  * @template T
  */
-const RBush = function(opt_maxEntries) {
+class RBush {
+
+  constructor(opt_maxEntries) {
 
     /**
      * @private
@@ -39,15 +41,14 @@ const RBush = function(opt_maxEntries) {
      */
     this.items_ = {};
 
-};
+  }
 
-
+  /**
-/**
    * Insert a value into the RBush.
    * @param {module:ol/extent~Extent} extent Extent.
    * @param {T} value Value.
    */
-RBush.prototype.insert = function(extent, value) {
+  insert(extent, value) {
     /** @type {module:ol/structs/RBush~Entry} */
     const item = {
       minX: extent[0],
@@ -59,15 +60,15 @@ RBush.prototype.insert = function(extent, value) {
 
     this.rbush_.insert(item);
     this.items_[getUid(value)] = item;
-};
+  }
 
 
-/**
+  /**
    * Bulk-insert values into the RBush.
    * @param {Array.<module:ol/extent~Extent>} extents Extents.
    * @param {Array.<T>} values Values.
    */
-RBush.prototype.load = function(extents, values) {
+  load(extents, values) {
     const items = new Array(values.length);
     for (let i = 0, l = values.length; i < l; i++) {
       const extent = extents[i];
@@ -85,15 +86,15 @@ RBush.prototype.load = function(extents, values) {
       this.items_[getUid(value)] = item;
     }
     this.rbush_.load(items);
-};
+  }
 
 
-/**
+  /**
    * Remove a value from the RBush.
    * @param {T} value Value.
    * @return {boolean} Removed.
    */
-RBush.prototype.remove = function(value) {
+  remove(value) {
     const uid = getUid(value);
 
     // get the object in which the value was wrapped when adding to the
@@ -101,42 +102,42 @@ RBush.prototype.remove = function(value) {
     const item = this.items_[uid];
     delete this.items_[uid];
     return this.rbush_.remove(item) !== null;
-};
+  }
 
 
-/**
+  /**
    * Update the extent of a value in the RBush.
    * @param {module:ol/extent~Extent} extent Extent.
    * @param {T} value Value.
    */
-RBush.prototype.update = function(extent, value) {
+  update(extent, value) {
     const item = this.items_[getUid(value)];
     const bbox = [item.minX, item.minY, item.maxX, item.maxY];
     if (!equals(bbox, extent)) {
       this.remove(value);
       this.insert(extent, value);
     }
-};
+  }
 
 
-/**
+  /**
    * Return all values in the RBush.
    * @return {Array.<T>} All.
    */
-RBush.prototype.getAll = function() {
+  getAll() {
     const items = this.rbush_.all();
     return items.map(function(item) {
       return item.value;
     });
-};
+  }
 
 
-/**
+  /**
    * Return all values in the given extent.
    * @param {module:ol/extent~Extent} extent Extent.
    * @return {Array.<T>} All in extent.
    */
-RBush.prototype.getInExtent = function(extent) {
+  getInExtent(extent) {
     /** @type {module:ol/structs/RBush~Entry} */
     const bbox = {
       minX: extent[0],
@@ -148,10 +149,10 @@ RBush.prototype.getInExtent = function(extent) {
     return items.map(function(item) {
       return item.value;
     });
-};
+  }
 
 
-/**
+  /**
    * Calls a callback function with each value in the tree.
    * If the callback returns a truthy value, this value is returned without
    * checking the rest of the tree.
@@ -160,12 +161,12 @@ RBush.prototype.getInExtent = function(extent) {
    * @return {*} Callback return value.
    * @template S
    */
-RBush.prototype.forEach = function(callback, opt_this) {
+  forEach(callback, opt_this) {
     return this.forEach_(this.getAll(), callback, opt_this);
-};
+  }
 
 
-/**
+  /**
    * Calls a callback function with each value in the provided extent.
    * @param {module:ol/extent~Extent} extent Extent.
    * @param {function(this: S, T): *} callback Callback.
@@ -173,12 +174,12 @@ RBush.prototype.forEach = function(callback, opt_this) {
    * @return {*} Callback return value.
    * @template S
    */
-RBush.prototype.forEachInExtent = function(extent, callback, opt_this) {
+  forEachInExtent(extent, callback, opt_this) {
     return this.forEach_(this.getInExtent(extent), callback, opt_this);
-};
+  }
 
 
-/**
+  /**
    * @param {Array.<T>} values Values.
    * @param {function(this: S, T): *} callback Callback.
    * @param {S=} opt_this The object to use as `this` in `callback`.
@@ -186,7 +187,7 @@ RBush.prototype.forEachInExtent = function(extent, callback, opt_this) {
    * @return {*} Callback return value.
    * @template S
    */
-RBush.prototype.forEach_ = function(values, callback, opt_this) {
+  forEach_(values, callback, opt_this) {
     let result;
     for (let i = 0, l = values.length; i < l; i++) {
       result = callback.call(opt_this, values[i]);
@@ -195,44 +196,48 @@ RBush.prototype.forEach_ = function(values, callback, opt_this) {
       }
     }
     return result;
-};
+  }
 
 
-/**
+  /**
    * @return {boolean} Is empty.
    */
-RBush.prototype.isEmpty = function() {
+  isEmpty() {
     return isEmpty(this.items_);
-};
+  }
 
 
-/**
+  /**
    * Remove all values from the RBush.
    */
-RBush.prototype.clear = function() {
+  clear() {
     this.rbush_.clear();
     this.items_ = {};
-};
+  }
 
 
-/**
+  /**
    * @param {module:ol/extent~Extent=} opt_extent Extent.
    * @return {module:ol/extent~Extent} Extent.
    */
-RBush.prototype.getExtent = function(opt_extent) {
+  getExtent(opt_extent) {
     // FIXME add getExtent() to rbush
     const data = this.rbush_.data;
     return createOrUpdate(data.minX, data.minY, data.maxX, data.maxY, opt_extent);
-};
+  }
 
 
-/**
+  /**
    * @param {module:ol/structs/RBush} rbush R-Tree.
    */
-RBush.prototype.concat = function(rbush) {
+  concat(rbush) {
     this.rbush_.load(rbush.rbush_.all());
     for (const i in rbush.items_) {
       this.items_[i | 0] = rbush.items_[i | 0];
     }
-};
+  }
+
+}
+
+
 export default RBush;

src/ol/style/Atlas.js

@@ -38,7 +38,8 @@ import {createCanvasContext2D} from '../dom.js';
  *    edges overlap when being rendered). To avoid this we add a
  *    padding around each image.
  */
-const Atlas = function(size, space) {
+class Atlas {
+  constructor(size, space) {
 
     /**
      * @private
@@ -69,19 +70,17 @@ const Atlas = function(size, space) {
      * @type {HTMLCanvasElement}
      */
     this.canvas_ = this.context_.canvas;
-};
+  }
 
-
+  /**
-/**
    * @param {string} id The identifier of the entry to check.
    * @return {?module:ol/style/Atlas~AtlasInfo} The atlas info.
    */
-Atlas.prototype.get = function(id) {
+  get(id) {
     return this.entries_[id] || null;
-};
+  }
 
-
+  /**
-/**
    * @param {string} id The identifier of the entry to add.
    * @param {number} width The width.
    * @param {number} height The height.
@@ -91,7 +90,7 @@ Atlas.prototype.get = function(id) {
    *    `renderCallback`.
    * @return {?module:ol/style/Atlas~AtlasInfo} The position and atlas image for the entry.
    */
-Atlas.prototype.add = function(id, width, height, renderCallback, opt_this) {
+  add(id, width, height, renderCallback, opt_this) {
     for (let i = 0, ii = this.emptyBlocks_.length; i < ii; ++i) {
       const block = this.emptyBlocks_[i];
       if (block.width >= width + this.space_ &&
@@ -117,17 +116,16 @@ Atlas.prototype.add = function(id, width, height, renderCallback, opt_this) {
 
     // there is no space for the new entry in this atlas
     return null;
-};
+  }
 
-
+  /**
-/**
    * @private
    * @param {number} index The index of the block.
    * @param {module:ol/style/Atlas~AtlasBlock} block The block to split.
    * @param {number} width The width of the entry to insert.
    * @param {number} height The height of the entry to insert.
    */
-Atlas.prototype.split_ = function(index, block, width, height) {
+  split_(index, block, width, height) {
     const deltaWidth = block.width - width;
     const deltaHeight = block.height - height;
 
@@ -173,10 +171,9 @@ Atlas.prototype.split_ = function(index, block, width, height) {
       };
       this.updateBlocks_(index, newBlock1, newBlock2);
     }
-};
+  }
 
-
+  /**
-/**
    * Remove the old block and insert new blocks at the same array position.
    * The new blocks are inserted at the same position, so that splitted
    * blocks (that are potentially smaller) are filled first.
@@ -185,7 +182,7 @@ Atlas.prototype.split_ = function(index, block, width, height) {
    * @param {module:ol/style/Atlas~AtlasBlock} newBlock1 The 1st block to add.
    * @param {module:ol/style/Atlas~AtlasBlock} newBlock2 The 2nd block to add.
    */
-Atlas.prototype.updateBlocks_ = function(index, newBlock1, newBlock2) {
+  updateBlocks_(index, newBlock1, newBlock2) {
     const args = [index, 1];
     if (newBlock1.width > 0 && newBlock1.height > 0) {
       args.push(newBlock1);
@@ -194,5 +191,7 @@ Atlas.prototype.updateBlocks_ = function(index, newBlock1, newBlock2) {
       args.push(newBlock2);
     }
     this.emptyBlocks_.splice.apply(this.emptyBlocks_, args);
-};
+  }
+}
+
 export default Atlas;

src/ol/style/AtlasManager.js

@@ -58,7 +58,8 @@ const MAX_ATLAS_SIZE = -1;
  * @api
  * @param {module:ol/style/AtlasManager~Options=} opt_options Options.
  */
-const AtlasManager = function(opt_options) {
+class AtlasManager {
+  constructor(opt_options) {
 
     const options = opt_options || {};
 
@@ -105,15 +106,14 @@ const AtlasManager = function(opt_options) {
      * @type {Array.<module:ol/style/Atlas>}
      */
     this.hitAtlases_ = [new Atlas(this.currentHitSize_, this.space_)];
-};
+  }
 
-
+  /**
-/**
    * @param {string} id The identifier of the entry to check.
    * @return {?module:ol/style/AtlasManager~AtlasManagerInfo} The position and atlas image for the
    *    entry, or `null` if the entry is not part of the atlas manager.
    */
-AtlasManager.prototype.getInfo = function(id) {
+  getInfo(id) {
     /** @type {?module:ol/style/Atlas~AtlasInfo} */
     const info = this.getInfo_(this.atlases_, id);
 
@@ -123,17 +123,16 @@ AtlasManager.prototype.getInfo = function(id) {
     const hitInfo = /** @type {module:ol/style/Atlas~AtlasInfo} */ (this.getInfo_(this.hitAtlases_, id));
 
     return this.mergeInfos_(info, hitInfo);
-};
+  }
 
-
+  /**
-/**
    * @private
    * @param {Array.<module:ol/style/Atlas>} atlases The atlases to search.
    * @param {string} id The identifier of the entry to check.
    * @return {?module:ol/style/Atlas~AtlasInfo} The position and atlas image for the entry,
    *    or `null` if the entry is not part of the atlases.
    */
-AtlasManager.prototype.getInfo_ = function(atlases, id) {
+  getInfo_(atlases, id) {
     for (let i = 0, ii = atlases.length; i < ii; ++i) {
       const atlas = atlases[i];
       const info = atlas.get(id);
@@ -142,10 +141,9 @@ AtlasManager.prototype.getInfo_ = function(atlases, id) {
       }
     }
     return null;
-};
+  }
 
-
+  /**
-/**
    * @private
    * @param {module:ol/style/Atlas~AtlasInfo} info The info for the real image.
    * @param {module:ol/style/Atlas~AtlasInfo} hitInfo The info for the hit-detection
@@ -153,7 +151,7 @@ AtlasManager.prototype.getInfo_ = function(atlases, id) {
    * @return {?module:ol/style/AtlasManager~AtlasManagerInfo} The position and atlas image for the
    *    entry, or `null` if the entry is not part of the atlases.
    */
-AtlasManager.prototype.mergeInfos_ = function(info, hitInfo) {
+  mergeInfos_(info, hitInfo) {
     return (
       /** @type {module:ol/style/AtlasManager~AtlasManagerInfo} */ ({
         offsetX: info.offsetX,
@@ -162,10 +160,9 @@ AtlasManager.prototype.mergeInfos_ = function(info, hitInfo) {
         hitImage: hitInfo.image
       })
     );
-};
+  }
 
-
+  /**
-/**
    * Add an image to the atlas manager.
    *
    * If an entry for the given id already exists, the entry will
@@ -187,8 +184,7 @@ AtlasManager.prototype.mergeInfos_ = function(info, hitInfo) {
    * @return {?module:ol/style/AtlasManager~AtlasManagerInfo}  The position and atlas image for the
    *    entry, or `null` if the image is too big.
    */
-AtlasManager.prototype.add = function(id, width, height,
+  add(id, width, height, renderCallback, opt_renderHitCallback, opt_this) {
-  renderCallback, opt_renderHitCallback, opt_this) {
     if (width + this.space_ > this.maxSize_ ||
         height + this.space_ > this.maxSize_) {
       return null;
@@ -210,10 +206,9 @@ AtlasManager.prototype.add = function(id, width, height,
       id, width, height, renderHitCallback, opt_this));
 
     return this.mergeInfos_(info, hitInfo);
-};
+  }
 
-
+  /**
-/**
    * @private
    * @param {boolean} isHitAtlas If the hit-detection atlases are used.
    * @param {string} id The identifier of the entry to add.
@@ -226,7 +221,7 @@ AtlasManager.prototype.add = function(id, width, height,
    * @return {?module:ol/style/Atlas~AtlasInfo}  The position and atlas image for the entry,
    *    or `null` if the image is too big.
    */
-AtlasManager.prototype.add_ = function(isHitAtlas, id, width, height, renderCallback, opt_this) {
+  add_(isHitAtlas, id, width, height, renderCallback, opt_this) {
     const atlases = (isHitAtlas) ? this.hitAtlases_ : this.atlases_;
     let atlas, info, i, ii;
     for (i = 0, ii = atlases.length; i < ii; ++i) {
@@ -252,5 +247,7 @@ AtlasManager.prototype.add_ = function(isHitAtlas, id, width, height, renderCall
       }
     }
     return null;
-};
+  }
+}
+
 export default AtlasManager;

src/ol/style/Circle.js

@@ -29,7 +29,8 @@ import RegularShape from '../style/RegularShape.js';
  * @extends {module:ol/style/RegularShape}
  * @api
  */
-const CircleStyle = function(opt_options) {
+class CircleStyle {
+ constructor(opt_options) {
 
    const options = opt_options || {};
 
@@ -42,18 +43,15 @@ const CircleStyle = function(opt_options) {
      atlasManager: options.atlasManager
    });
 
-};
+ }
 
-inherits(CircleStyle, RegularShape);
+ /**
-
-
-/**
   * Clones the style.  If an atlasmanager was provided to the original style it will be used in the cloned style, too.
   * @return {module:ol/style/Circle} The cloned style.
   * @override
   * @api
   */
-CircleStyle.prototype.clone = function() {
+ clone() {
    const style = new CircleStyle({
      fill: this.getFill() ? this.getFill().clone() : undefined,
      stroke: this.getStroke() ? this.getStroke().clone() : undefined,
@@ -64,17 +62,21 @@ CircleStyle.prototype.clone = function() {
    style.setOpacity(this.getOpacity());
    style.setScale(this.getScale());
    return style;
-};
+ }
 
-
+ /**
-/**
   * Set the circle radius.
   *
   * @param {number} radius Circle radius.
   * @api
   */
-CircleStyle.prototype.setRadius = function(radius) {
+ setRadius(radius) {
    this.radius_ = radius;
    this.render_(this.atlasManager_);
-};
+ }
+}
+
+inherits(CircleStyle, RegularShape);
+
+
 export default CircleStyle;

src/ol/style/Fill.js

@@ -21,7 +21,8 @@ import {asString} from '../color.js';
  * @param {module:ol/style/Fill~Options=} opt_options Options.
  * @api
  */
-const Fill = function(opt_options) {
+class Fill {
+  constructor(opt_options) {
 
     const options = opt_options || {};
 
@@ -36,48 +37,44 @@ const Fill = function(opt_options) {
      * @type {string|undefined}
      */
     this.checksum_ = undefined;
-};
+  }
 
-
+  /**
-/**
    * Clones the style. The color is not cloned if it is an {@link module:ol/colorlike~ColorLike}.
    * @return {module:ol/style/Fill} The cloned style.
    * @api
    */
-Fill.prototype.clone = function() {
+  clone() {
     const color = this.getColor();
     return new Fill({
       color: (color && color.slice) ? color.slice() : color || undefined
     });
-};
+  }
 
-
+  /**
-/**
    * Get the fill color.
    * @return {module:ol/color~Color|module:ol/colorlike~ColorLike} Color.
    * @api
    */
-Fill.prototype.getColor = function() {
+  getColor() {
     return this.color_;
-};
+  }
 
-
+  /**
-/**
    * Set the color.
    *
    * @param {module:ol/color~Color|module:ol/colorlike~ColorLike} color Color.
    * @api
    */
-Fill.prototype.setColor = function(color) {
+  setColor(color) {
     this.color_ = color;
     this.checksum_ = undefined;
-};
+  }
 
-
+  /**
-/**
    * @return {string} The checksum.
    */
-Fill.prototype.getChecksum = function() {
+  getChecksum() {
     if (this.checksum_ === undefined) {
       if (
         this.color_ instanceof CanvasPattern ||
@@ -90,5 +87,7 @@ Fill.prototype.getChecksum = function() {
     }
 
     return this.checksum_;
-};
+  }
+}
+
 export default Fill;

src/ol/style/Icon.js

@@ -61,7 +61,8 @@ import ImageStyle from '../style/Image.js';
  * @extends {module:ol/style/Image}
  * @api
  */
-const Icon = function(opt_options) {
+class Icon {
+  constructor(opt_options) {
 
     const options = opt_options || {};
 
@@ -210,17 +211,14 @@ const Icon = function(opt_options) {
       rotateWithView: rotateWithView
     });
 
-};
+  }
 
-inherits(Icon, ImageStyle);
+  /**
-
-
-/**
    * Clones the style. The underlying Image/HTMLCanvasElement is not cloned.
    * @return {module:ol/style/Icon} The cloned style.
    * @api
    */
-Icon.prototype.clone = function() {
+  clone() {
     return new Icon({
       anchor: this.anchor_.slice(),
       anchorOrigin: this.anchorOrigin_,
@@ -238,14 +236,13 @@ Icon.prototype.clone = function() {
       rotation: this.getRotation(),
       rotateWithView: this.getRotateWithView()
     });
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    * @api
    */
-Icon.prototype.getAnchor = function() {
+  getAnchor() {
     if (this.normalizedAnchor_) {
       return this.normalizedAnchor_;
     }
@@ -283,80 +280,73 @@ Icon.prototype.getAnchor = function() {
     }
     this.normalizedAnchor_ = anchor;
     return this.normalizedAnchor_;
-};
+  }
 
-/**
+  /**
    * Set the anchor point. The anchor determines the center point for the
    * symbolizer.
    *
    * @param {Array.<number>} anchor Anchor.
    * @api
    */
-Icon.prototype.setAnchor = function(anchor) {
+  setAnchor(anchor) {
     this.anchor_ = anchor;
     this.normalizedAnchor_ = null;
-};
+  }
 
-
+  /**
-/**
    * Get the icon color.
    * @return {module:ol/color~Color} Color.
    * @api
    */
-Icon.prototype.getColor = function() {
+  getColor() {
     return this.color_;
-};
+  }
 
-
+  /**
-/**
    * Get the image icon.
    * @param {number} pixelRatio Pixel ratio.
    * @return {HTMLImageElement|HTMLCanvasElement} Image or Canvas element.
    * @override
    * @api
    */
-Icon.prototype.getImage = function(pixelRatio) {
+  getImage(pixelRatio) {
     return this.iconImage_.getImage(pixelRatio);
-};
+  }
 
-
+  /**
-/**
    * @override
    */
-Icon.prototype.getImageSize = function() {
+  getImageSize() {
     return this.iconImage_.getSize();
-};
+  }
 
-
+  /**
-/**
    * @override
    */
-Icon.prototype.getHitDetectionImageSize = function() {
+  getHitDetectionImageSize() {
     return this.getImageSize();
-};
+  }
 
-
+  /**
-/**
    * @override
    */
-Icon.prototype.getImageState = function() {
+  getImageState() {
     return this.iconImage_.getImageState();
-};
+  }
 
-
+  /**
-/**
    * @override
    */
-Icon.prototype.getHitDetectionImage = function(pixelRatio) {
+  getHitDetectionImage(pixelRatio) {
     return this.iconImage_.getHitDetectionImage(pixelRatio);
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    * @api
    */
-Icon.prototype.getOrigin = function() {
+  getOrigin() {
     if (this.origin_) {
       return this.origin_;
     }
@@ -380,38 +370,34 @@ Icon.prototype.getOrigin = function() {
     }
     this.origin_ = offset;
     return this.origin_;
-};
+  }
 
-
+  /**
-/**
    * Get the image URL.
    * @return {string|undefined} Image src.
    * @api
    */
-Icon.prototype.getSrc = function() {
+  getSrc() {
     return this.iconImage_.getSrc();
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    * @api
    */
-Icon.prototype.getSize = function() {
+  getSize() {
     return !this.size_ ? this.iconImage_.getSize() : this.size_;
-};
+  }
 
-
+  /**
-/**
    * @override
    */
-Icon.prototype.listenImageChange = function(listener, thisArg) {
+  listenImageChange(listener, thisArg) {
     return listen(this.iconImage_, EventType.CHANGE,
       listener, thisArg);
-};
+  }
 
-
+  /**
-/**
    * Load not yet loaded URI.
    * When rendering a feature with an icon style, the vector renderer will
    * automatically call this method. However, you might want to call this
@@ -419,16 +405,20 @@ Icon.prototype.listenImageChange = function(listener, thisArg) {
    * @override
    * @api
    */
-Icon.prototype.load = function() {
+  load() {
     this.iconImage_.load();
-};
+  }
 
-
+  /**
-/**
    * @override
    */
-Icon.prototype.unlistenImageChange = function(listener, thisArg) {
+  unlistenImageChange(listener, thisArg) {
     unlisten(this.iconImage_, EventType.CHANGE,
       listener, thisArg);
-};
+  }
+}
+
+inherits(Icon, ImageStyle);
+
+
 export default Icon;

src/ol/style/IconImage.js

@@ -19,7 +19,8 @@ import {shared as iconImageCache} from '../style/IconImageCache.js';
  * @param {module:ol/color~Color} color Color.
  * @extends {module:ol/events/EventTarget}
  */
-const IconImage = function(image, src, size, crossOrigin, imageState, color) {
+class IconImage {
+  constructor(image, src, size, crossOrigin, imageState, color) {
 
     EventTarget.call(this);
 
@@ -86,7 +87,159 @@ const IconImage = function(image, src, size, crossOrigin, imageState, color) {
       this.determineTainting_();
     }
 
-};
+  }
+
+  /**
+   * @private
+   */
+  determineTainting_() {
+    const context = createCanvasContext2D(1, 1);
+    try {
+      context.drawImage(this.image_, 0, 0);
+      context.getImageData(0, 0, 1, 1);
+    } catch (e) {
+      this.tainting_ = true;
+    }
+  }
+
+  /**
+   * @private
+   */
+  dispatchChangeEvent_() {
+    this.dispatchEvent(EventType.CHANGE);
+  }
+
+  /**
+   * @private
+   */
+  handleImageError_() {
+    this.imageState_ = ImageState.ERROR;
+    this.unlistenImage_();
+    this.dispatchChangeEvent_();
+  }
+
+  /**
+   * @private
+   */
+  handleImageLoad_() {
+    this.imageState_ = ImageState.LOADED;
+    if (this.size_) {
+      this.image_.width = this.size_[0];
+      this.image_.height = this.size_[1];
+    }
+    this.size_ = [this.image_.width, this.image_.height];
+    this.unlistenImage_();
+    this.determineTainting_();
+    this.replaceColor_();
+    this.dispatchChangeEvent_();
+  }
+
+  /**
+   * @param {number} pixelRatio Pixel ratio.
+   * @return {HTMLImageElement|HTMLCanvasElement} Image or Canvas element.
+   */
+  getImage(pixelRatio) {
+    return this.canvas_ ? this.canvas_ : this.image_;
+  }
+
+  /**
+   * @return {module:ol/ImageState} Image state.
+   */
+  getImageState() {
+    return this.imageState_;
+  }
+
+  /**
+   * @param {number} pixelRatio Pixel ratio.
+   * @return {HTMLImageElement|HTMLCanvasElement} Image element.
+   */
+  getHitDetectionImage(pixelRatio) {
+    if (!this.hitDetectionImage_) {
+      if (this.tainting_) {
+        const width = this.size_[0];
+        const height = this.size_[1];
+        const context = createCanvasContext2D(width, height);
+        context.fillRect(0, 0, width, height);
+        this.hitDetectionImage_ = context.canvas;
+      } else {
+        this.hitDetectionImage_ = this.image_;
+      }
+    }
+    return this.hitDetectionImage_;
+  }
+
+  /**
+   * @return {module:ol/size~Size} Image size.
+   */
+  getSize() {
+    return this.size_;
+  }
+
+  /**
+   * @return {string|undefined} Image src.
+   */
+  getSrc() {
+    return this.src_;
+  }
+
+  /**
+   * Load not yet loaded URI.
+   */
+  load() {
+    if (this.imageState_ == ImageState.IDLE) {
+      this.imageState_ = ImageState.LOADING;
+      this.imageListenerKeys_ = [
+        listenOnce(this.image_, EventType.ERROR,
+          this.handleImageError_, this),
+        listenOnce(this.image_, EventType.LOAD,
+          this.handleImageLoad_, this)
+      ];
+      try {
+        this.image_.src = this.src_;
+      } catch (e) {
+        this.handleImageError_();
+      }
+    }
+  }
+
+  /**
+   * @private
+   */
+  replaceColor_() {
+    if (this.tainting_ || this.color_ === null) {
+      return;
+    }
+
+    this.canvas_.width = this.image_.width;
+    this.canvas_.height = this.image_.height;
+
+    const ctx = this.canvas_.getContext('2d');
+    ctx.drawImage(this.image_, 0, 0);
+
+    const imgData = ctx.getImageData(0, 0, this.image_.width, this.image_.height);
+    const data = imgData.data;
+    const r = this.color_[0] / 255.0;
+    const g = this.color_[1] / 255.0;
+    const b = this.color_[2] / 255.0;
+
+    for (let i = 0, ii = data.length; i < ii; i += 4) {
+      data[i] *= r;
+      data[i + 1] *= g;
+      data[i + 2] *= b;
+    }
+    ctx.putImageData(imgData, 0, 0);
+  }
+
+  /**
+   * Discards event handlers which listen for load completion or errors.
+   *
+   * @private
+   */
+  unlistenImage_() {
+    this.imageListenerKeys_.forEach(unlistenByKey);
+    this.imageListenerKeys_ = null;
+  }
+}
 
 inherits(IconImage, EventTarget);
 
@@ -110,165 +263,4 @@ export function get(image, src, size, crossOrigin, imageState, color) {
 }
 
 
-/**
- * @private
- */
-IconImage.prototype.determineTainting_ = function() {
-  const context = createCanvasContext2D(1, 1);
-  try {
-    context.drawImage(this.image_, 0, 0);
-    context.getImageData(0, 0, 1, 1);
-  } catch (e) {
-    this.tainting_ = true;
-  }
-};
-
-
-/**
- * @private
- */
-IconImage.prototype.dispatchChangeEvent_ = function() {
-  this.dispatchEvent(EventType.CHANGE);
-};
-
-
-/**
- * @private
- */
-IconImage.prototype.handleImageError_ = function() {
-  this.imageState_ = ImageState.ERROR;
-  this.unlistenImage_();
-  this.dispatchChangeEvent_();
-};
-
-
-/**
- * @private
- */
-IconImage.prototype.handleImageLoad_ = function() {
-  this.imageState_ = ImageState.LOADED;
-  if (this.size_) {
-    this.image_.width = this.size_[0];
-    this.image_.height = this.size_[1];
-  }
-  this.size_ = [this.image_.width, this.image_.height];
-  this.unlistenImage_();
-  this.determineTainting_();
-  this.replaceColor_();
-  this.dispatchChangeEvent_();
-};
-
-
-/**
- * @param {number} pixelRatio Pixel ratio.
- * @return {HTMLImageElement|HTMLCanvasElement} Image or Canvas element.
- */
-IconImage.prototype.getImage = function(pixelRatio) {
-  return this.canvas_ ? this.canvas_ : this.image_;
-};
-
-
-/**
- * @return {module:ol/ImageState} Image state.
- */
-IconImage.prototype.getImageState = function() {
-  return this.imageState_;
-};
-
-
-/**
- * @param {number} pixelRatio Pixel ratio.
- * @return {HTMLImageElement|HTMLCanvasElement} Image element.
- */
-IconImage.prototype.getHitDetectionImage = function(pixelRatio) {
-  if (!this.hitDetectionImage_) {
-    if (this.tainting_) {
-      const width = this.size_[0];
-      const height = this.size_[1];
-      const context = createCanvasContext2D(width, height);
-      context.fillRect(0, 0, width, height);
-      this.hitDetectionImage_ = context.canvas;
-    } else {
-      this.hitDetectionImage_ = this.image_;
-    }
-  }
-  return this.hitDetectionImage_;
-};
-
-
-/**
- * @return {module:ol/size~Size} Image size.
- */
-IconImage.prototype.getSize = function() {
-  return this.size_;
-};
-
-
-/**
- * @return {string|undefined} Image src.
- */
-IconImage.prototype.getSrc = function() {
-  return this.src_;
-};
-
-
-/**
- * Load not yet loaded URI.
- */
-IconImage.prototype.load = function() {
-  if (this.imageState_ == ImageState.IDLE) {
-    this.imageState_ = ImageState.LOADING;
-    this.imageListenerKeys_ = [
-      listenOnce(this.image_, EventType.ERROR,
-        this.handleImageError_, this),
-      listenOnce(this.image_, EventType.LOAD,
-        this.handleImageLoad_, this)
-    ];
-    try {
-      this.image_.src = this.src_;
-    } catch (e) {
-      this.handleImageError_();
-    }
-  }
-};
-
-
-/**
- * @private
- */
-IconImage.prototype.replaceColor_ = function() {
-  if (this.tainting_ || this.color_ === null) {
-    return;
-  }
-
-  this.canvas_.width = this.image_.width;
-  this.canvas_.height = this.image_.height;
-
-  const ctx = this.canvas_.getContext('2d');
-  ctx.drawImage(this.image_, 0, 0);
-
-  const imgData = ctx.getImageData(0, 0, this.image_.width, this.image_.height);
-  const data = imgData.data;
-  const r = this.color_[0] / 255.0;
-  const g = this.color_[1] / 255.0;
-  const b = this.color_[2] / 255.0;
-
-  for (let i = 0, ii = data.length; i < ii; i += 4) {
-    data[i] *= r;
-    data[i + 1] *= g;
-    data[i + 2] *= b;
-  }
-  ctx.putImageData(imgData, 0, 0);
-};
-
-
-/**
- * Discards event handlers which listen for load completion or errors.
- *
- * @private
- */
-IconImage.prototype.unlistenImage_ = function() {
-  this.imageListenerKeys_.forEach(unlistenByKey);
-  this.imageListenerKeys_ = null;
-};
 export default IconImage;

src/ol/style/IconImageCache.js

@@ -7,7 +7,8 @@ import {asString} from '../color.js';
  * Singleton class. Available through {@link module:ol/style/IconImageCache~shared}.
  * @constructor
  */
-const IconImageCache = function() {
+class IconImageCache {
+ constructor() {
 
    /**
     * @type {!Object.<string, module:ol/style/IconImage>}
@@ -26,7 +27,67 @@ const IconImageCache = function() {
     * @private
     */
    this.maxCacheSize_ = 32;
-};
+ }
+
+ /**
+  * FIXME empty description for jsdoc
+  */
+ clear() {
+   this.cache_ = {};
+   this.cacheSize_ = 0;
+ }
+
+ /**
+  * FIXME empty description for jsdoc
+  */
+ expire() {
+   if (this.cacheSize_ > this.maxCacheSize_) {
+     let i = 0;
+     for (const key in this.cache_) {
+       const iconImage = this.cache_[key];
+       if ((i++ & 3) === 0 && !iconImage.hasListener()) {
+         delete this.cache_[key];
+         --this.cacheSize_;
+       }
+     }
+   }
+ }
+
+ /**
+  * @param {string} src Src.
+  * @param {?string} crossOrigin Cross origin.
+  * @param {module:ol/color~Color} color Color.
+  * @return {module:ol/style/IconImage} Icon image.
+  */
+ get(src, crossOrigin, color) {
+   const key = getKey(src, crossOrigin, color);
+   return key in this.cache_ ? this.cache_[key] : null;
+ }
+
+ /**
+  * @param {string} src Src.
+  * @param {?string} crossOrigin Cross origin.
+  * @param {module:ol/color~Color} color Color.
+  * @param {module:ol/style/IconImage} iconImage Icon image.
+  */
+ set(src, crossOrigin, color, iconImage) {
+   const key = getKey(src, crossOrigin, color);
+   this.cache_[key] = iconImage;
+   ++this.cacheSize_;
+ }
+
+ /**
+  * Set the cache size of the icon cache. Default is `32`. Change this value when
+  * your map uses more than 32 different icon images and you are not caching icon
+  * styles on the application level.
+  * @param {number} maxCacheSize Cache max size.
+  * @api
+  */
+ setSize(maxCacheSize) {
+   this.maxCacheSize_ = maxCacheSize;
+   this.expire();
+ }
+}
 
 
 /**
@@ -41,68 +102,6 @@ function getKey(src, crossOrigin, color) {
 }
 
 
-/**
- * FIXME empty description for jsdoc
- */
-IconImageCache.prototype.clear = function() {
-  this.cache_ = {};
-  this.cacheSize_ = 0;
-};
-
-
-/**
- * FIXME empty description for jsdoc
- */
-IconImageCache.prototype.expire = function() {
-  if (this.cacheSize_ > this.maxCacheSize_) {
-    let i = 0;
-    for (const key in this.cache_) {
-      const iconImage = this.cache_[key];
-      if ((i++ & 3) === 0 && !iconImage.hasListener()) {
-        delete this.cache_[key];
-        --this.cacheSize_;
-      }
-    }
-  }
-};
-
-
-/**
- * @param {string} src Src.
- * @param {?string} crossOrigin Cross origin.
- * @param {module:ol/color~Color} color Color.
- * @return {module:ol/style/IconImage} Icon image.
- */
-IconImageCache.prototype.get = function(src, crossOrigin, color) {
-  const key = getKey(src, crossOrigin, color);
-  return key in this.cache_ ? this.cache_[key] : null;
-};
-
-
-/**
- * @param {string} src Src.
- * @param {?string} crossOrigin Cross origin.
- * @param {module:ol/color~Color} color Color.
- * @param {module:ol/style/IconImage} iconImage Icon image.
- */
-IconImageCache.prototype.set = function(src, crossOrigin, color, iconImage) {
-  const key = getKey(src, crossOrigin, color);
-  this.cache_[key] = iconImage;
-  ++this.cacheSize_;
-};
-
-
-/**
- * Set the cache size of the icon cache. Default is `32`. Change this value when
- * your map uses more than 32 different icon images and you are not caching icon
- * styles on the application level.
- * @param {number} maxCacheSize Cache max size.
- * @api
- */
-IconImageCache.prototype.setSize = function(maxCacheSize) {
-  this.maxCacheSize_ = maxCacheSize;
-  this.expire();
-};
 export default IconImageCache;
 
 

src/ol/style/Image.js

@@ -24,7 +24,8 @@
  * @param {module:ol/style/Image~Options} options Options.
  * @api
  */
-const ImageStyle = function(options) {
+class ImageStyle {
+ constructor(options) {
 
    /**
     * @private
@@ -56,199 +57,180 @@ const ImageStyle = function(options) {
     */
    this.snapToPixel_ = options.snapToPixel;
 
-};
+ }
 
-
+ /**
-/**
   * Get the symbolizer opacity.
   * @return {number} Opacity.
   * @api
   */
-ImageStyle.prototype.getOpacity = function() {
+ getOpacity() {
    return this.opacity_;
-};
+ }
 
-
+ /**
-/**
   * Determine whether the symbolizer rotates with the map.
   * @return {boolean} Rotate with map.
   * @api
   */
-ImageStyle.prototype.getRotateWithView = function() {
+ getRotateWithView() {
    return this.rotateWithView_;
-};
+ }
 
-
+ /**
-/**
   * Get the symoblizer rotation.
   * @return {number} Rotation.
   * @api
   */
-ImageStyle.prototype.getRotation = function() {
+ getRotation() {
    return this.rotation_;
-};
+ }
 
-
+ /**
-/**
   * Get the symbolizer scale.
   * @return {number} Scale.
   * @api
   */
-ImageStyle.prototype.getScale = function() {
+ getScale() {
    return this.scale_;
-};
+ }
 
-
+ /**
-/**
   * Determine whether the symbolizer should be snapped to a pixel.
   * @return {boolean} The symbolizer should snap to a pixel.
   * @api
   */
-ImageStyle.prototype.getSnapToPixel = function() {
+ getSnapToPixel() {
    return this.snapToPixel_;
-};
+ }
 
-
+ /**
-/**
   * Get the anchor point in pixels. The anchor determines the center point for the
   * symbolizer.
   * @abstract
   * @return {Array.<number>} Anchor.
   */
-ImageStyle.prototype.getAnchor = function() {};
+ getAnchor() {}
 
-
+ /**
-/**
   * Get the image element for the symbolizer.
   * @abstract
   * @param {number} pixelRatio Pixel ratio.
   * @return {HTMLCanvasElement|HTMLVideoElement|HTMLImageElement} Image element.
   */
-ImageStyle.prototype.getImage = function(pixelRatio) {};
+ getImage(pixelRatio) {}
 
-
+ /**
-/**
   * @abstract
   * @param {number} pixelRatio Pixel ratio.
   * @return {HTMLCanvasElement|HTMLVideoElement|HTMLImageElement} Image element.
   */
-ImageStyle.prototype.getHitDetectionImage = function(pixelRatio) {};
+ getHitDetectionImage(pixelRatio) {}
 
-
+ /**
-/**
   * @abstract
   * @return {module:ol/ImageState} Image state.
   */
-ImageStyle.prototype.getImageState = function() {};
+ getImageState() {}
 
-
+ /**
-/**
   * @abstract
   * @return {module:ol/size~Size} Image size.
   */
-ImageStyle.prototype.getImageSize = function() {};
+ getImageSize() {}
 
-
+ /**
-/**
   * @abstract
   * @return {module:ol/size~Size} Size of the hit-detection image.
   */
-ImageStyle.prototype.getHitDetectionImageSize = function() {};
+ getHitDetectionImageSize() {}
 
-
+ /**
-/**
   * Get the origin of the symbolizer.
   * @abstract
   * @return {Array.<number>} Origin.
   */
-ImageStyle.prototype.getOrigin = function() {};
+ getOrigin() {}
 
-
+ /**
-/**
   * Get the size of the symbolizer (in pixels).
   * @abstract
   * @return {module:ol/size~Size} Size.
   */
-ImageStyle.prototype.getSize = function() {};
+ getSize() {}
 
-
+ /**
-/**
   * Set the opacity.
   *
   * @param {number} opacity Opacity.
   * @api
   */
-ImageStyle.prototype.setOpacity = function(opacity) {
+ setOpacity(opacity) {
    this.opacity_ = opacity;
-};
+ }
 
-
+ /**
-/**
   * Set whether to rotate the style with the view.
   *
   * @param {boolean} rotateWithView Rotate with map.
   * @api
   */
-ImageStyle.prototype.setRotateWithView = function(rotateWithView) {
+ setRotateWithView(rotateWithView) {
    this.rotateWithView_ = rotateWithView;
-};
+ }
 
-
+ /**
-/**
   * Set the rotation.
   *
   * @param {number} rotation Rotation.
   * @api
   */
-ImageStyle.prototype.setRotation = function(rotation) {
+ setRotation(rotation) {
    this.rotation_ = rotation;
-};
+ }
 
-
+ /**
-/**
   * Set the scale.
   *
   * @param {number} scale Scale.
   * @api
   */
-ImageStyle.prototype.setScale = function(scale) {
+ setScale(scale) {
    this.scale_ = scale;
-};
+ }
 
-
+ /**
-/**
   * Set whether to snap the image to the closest pixel.
   *
   * @param {boolean} snapToPixel Snap to pixel?
   * @api
   */
-ImageStyle.prototype.setSnapToPixel = function(snapToPixel) {
+ setSnapToPixel(snapToPixel) {
    this.snapToPixel_ = snapToPixel;
-};
+ }
 
-
+ /**
-/**
   * @abstract
   * @param {function(this: T, module:ol/events/Event)} listener Listener function.
   * @param {T} thisArg Value to use as `this` when executing `listener`.
   * @return {module:ol/events~EventsKey|undefined} Listener key.
   * @template T
   */
-ImageStyle.prototype.listenImageChange = function(listener, thisArg) {};
+ listenImageChange(listener, thisArg) {}
 
-
+ /**
-/**
   * Load not yet loaded URI.
   * @abstract
   */
-ImageStyle.prototype.load = function() {};
+ load() {}
 
-
+ /**
-/**
   * @abstract
   * @param {function(this: T, module:ol/events/Event)} listener Listener function.
   * @param {T} thisArg Value to use as `this` when executing `listener`.
   * @template T
   */
-ImageStyle.prototype.unlistenImageChange = function(listener, thisArg) {};
+ unlistenImageChange(listener, thisArg) {}
+}
+
 export default ImageStyle;

src/ol/style/RegularShape.js

@@ -57,7 +57,8 @@ import ImageStyle from '../style/Image.js';
  * @extends {module:ol/style/Image}
  * @api
  */
-const RegularShape = function(options) {
+class RegularShape {
+  constructor(options) {
     /**
      * @private
      * @type {Array.<string>}
@@ -170,17 +171,14 @@ const RegularShape = function(options) {
       scale: 1,
       snapToPixel: snapToPixel
     });
-};
+  }
 
-inherits(RegularShape, ImageStyle);
+  /**
-
-
-/**
    * Clones the style. If an atlasmanager was provided to the original style it will be used in the cloned style, too.
    * @return {module:ol/style/RegularShape} The cloned style.
    * @api
    */
-RegularShape.prototype.clone = function() {
+  clone() {
     const style = new RegularShape({
       fill: this.getFill() ? this.getFill().clone() : undefined,
       points: this.getPoints(),
@@ -196,160 +194,142 @@ RegularShape.prototype.clone = function() {
     style.setOpacity(this.getOpacity());
     style.setScale(this.getScale());
     return style;
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    * @api
    */
-RegularShape.prototype.getAnchor = function() {
+  getAnchor() {
     return this.anchor_;
-};
+  }
 
-
+  /**
-/**
    * Get the angle used in generating the shape.
    * @return {number} Shape's rotation in radians.
    * @api
    */
-RegularShape.prototype.getAngle = function() {
+  getAngle() {
     return this.angle_;
-};
+  }
 
-
+  /**
-/**
    * Get the fill style for the shape.
    * @return {module:ol/style/Fill} Fill style.
    * @api
    */
-RegularShape.prototype.getFill = function() {
+  getFill() {
     return this.fill_;
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    */
-RegularShape.prototype.getHitDetectionImage = function(pixelRatio) {
+  getHitDetectionImage(pixelRatio) {
     return this.hitDetectionCanvas_;
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    * @api
    */
-RegularShape.prototype.getImage = function(pixelRatio) {
+  getImage(pixelRatio) {
     return this.canvas_;
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    */
-RegularShape.prototype.getImageSize = function() {
+  getImageSize() {
     return this.imageSize_;
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    */
-RegularShape.prototype.getHitDetectionImageSize = function() {
+  getHitDetectionImageSize() {
     return this.hitDetectionImageSize_;
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    */
-RegularShape.prototype.getImageState = function() {
+  getImageState() {
     return ImageState.LOADED;
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    * @api
    */
-RegularShape.prototype.getOrigin = function() {
+  getOrigin() {
     return this.origin_;
-};
+  }
 
-
+  /**
-/**
    * Get the number of points for generating the shape.
    * @return {number} Number of points for stars and regular polygons.
    * @api
    */
-RegularShape.prototype.getPoints = function() {
+  getPoints() {
     return this.points_;
-};
+  }
 
-
+  /**
-/**
    * Get the (primary) radius for the shape.
    * @return {number} Radius.
    * @api
    */
-RegularShape.prototype.getRadius = function() {
+  getRadius() {
     return this.radius_;
-};
+  }
 
-
+  /**
-/**
    * Get the secondary radius for the shape.
    * @return {number|undefined} Radius2.
    * @api
    */
-RegularShape.prototype.getRadius2 = function() {
+  getRadius2() {
     return this.radius2_;
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    * @api
    */
-RegularShape.prototype.getSize = function() {
+  getSize() {
     return this.size_;
-};
+  }
 
-
+  /**
-/**
    * Get the stroke style for the shape.
    * @return {module:ol/style/Stroke} Stroke style.
    * @api
    */
-RegularShape.prototype.getStroke = function() {
+  getStroke() {
     return this.stroke_;
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    */
-RegularShape.prototype.listenImageChange = function(listener, thisArg) {};
+  listenImageChange(listener, thisArg) {}
 
-
+  /**
-/**
    * @inheritDoc
    */
-RegularShape.prototype.load = function() {};
+  load() {}
 
-
+  /**
-/**
    * @inheritDoc
    */
-RegularShape.prototype.unlistenImageChange = function(listener, thisArg) {};
+  unlistenImageChange(listener, thisArg) {}
 
-
+  /**
-/**
    * @protected
    * @param {module:ol/style/AtlasManager|undefined} atlasManager An atlas manager.
    */
-RegularShape.prototype.render_ = function(atlasManager) {
+  render_(atlasManager) {
     let imageSize;
     let lineCap = '';
     let lineJoin = '';
@@ -449,17 +429,16 @@ RegularShape.prototype.render_ = function(atlasManager) {
     this.anchor_ = [size / 2, size / 2];
     this.size_ = [size, size];
     this.imageSize_ = [imageSize, imageSize];
-};
+  }
 
-
+  /**
-/**
    * @private
    * @param {module:ol/style/RegularShape~RenderOptions} renderOptions Render options.
    * @param {CanvasRenderingContext2D} context The rendering context.
    * @param {number} x The origin for the symbol (x).
    * @param {number} y The origin for the symbol (y).
    */
-RegularShape.prototype.draw_ = function(renderOptions, context, x, y) {
+  draw_(renderOptions, context, x, y) {
     let i, angle0, radiusC;
     // reset transform
     context.setTransform(1, 0, 0, 1, 0, 0);
@@ -510,14 +489,13 @@ RegularShape.prototype.draw_ = function(renderOptions, context, x, y) {
       context.stroke();
     }
     context.closePath();
-};
+  }
 
-
+  /**
-/**
    * @private
    * @param {module:ol/style/RegularShape~RenderOptions} renderOptions Render options.
    */
-RegularShape.prototype.createHitDetectionCanvas_ = function(renderOptions) {
+  createHitDetectionCanvas_(renderOptions) {
     this.hitDetectionImageSize_ = [renderOptions.size, renderOptions.size];
     if (this.fill_) {
       this.hitDetectionCanvas_ = this.canvas_;
@@ -530,17 +508,16 @@ RegularShape.prototype.createHitDetectionCanvas_ = function(renderOptions) {
     this.hitDetectionCanvas_ = context.canvas;
 
     this.drawHitDetectionCanvas_(renderOptions, context, 0, 0);
-};
+  }
 
-
+  /**
-/**
    * @private
    * @param {module:ol/style/RegularShape~RenderOptions} renderOptions Render options.
    * @param {CanvasRenderingContext2D} context The context.
    * @param {number} x The origin for the symbol (x).
    * @param {number} y The origin for the symbol (y).
    */
-RegularShape.prototype.drawHitDetectionCanvas_ = function(renderOptions, context, x, y) {
+  drawHitDetectionCanvas_(renderOptions, context, x, y) {
     // reset transform
     context.setTransform(1, 0, 0, 1, 0, 0);
 
@@ -581,13 +558,12 @@ RegularShape.prototype.drawHitDetectionCanvas_ = function(renderOptions, context
       context.stroke();
     }
     context.closePath();
-};
+  }
 
-
+  /**
-/**
    * @return {string} The checksum.
    */
-RegularShape.prototype.getChecksum = function() {
+  getChecksum() {
     const strokeChecksum = this.stroke_ ?
       this.stroke_.getChecksum() : '-';
     const fillChecksum = this.fill_ ?
@@ -612,5 +588,10 @@ RegularShape.prototype.getChecksum = function() {
     }
 
     return this.checksums_[0];
-};
+  }
+}
+
+inherits(RegularShape, ImageStyle);
+
+
 export default RegularShape;

src/ol/style/Stroke.js

@@ -31,7 +31,8 @@ import {getUid} from '../util.js';
  * @param {module:ol/style/Stroke~Options=} opt_options Options.
  * @api
  */
-const Stroke = function(opt_options) {
+class Stroke {
+  constructor(opt_options) {
 
     const options = opt_options || {};
 
@@ -82,15 +83,14 @@ const Stroke = function(opt_options) {
      * @type {string|undefined}
      */
     this.checksum_ = undefined;
-};
+  }
 
-
+  /**
-/**
    * Clones the style.
    * @return {module:ol/style/Stroke} The cloned style.
    * @api
    */
-Stroke.prototype.clone = function() {
+  clone() {
     const color = this.getColor();
     return new Stroke({
       color: (color && color.slice) ? color.slice() : color || undefined,
@@ -101,104 +101,94 @@ Stroke.prototype.clone = function() {
       miterLimit: this.getMiterLimit(),
       width: this.getWidth()
     });
-};
+  }
 
-
+  /**
-/**
    * Get the stroke color.
    * @return {module:ol/color~Color|module:ol/colorlike~ColorLike} Color.
    * @api
    */
-Stroke.prototype.getColor = function() {
+  getColor() {
     return this.color_;
-};
+  }
 
-
+  /**
-/**
    * Get the line cap type for the stroke.
    * @return {string|undefined} Line cap.
    * @api
    */
-Stroke.prototype.getLineCap = function() {
+  getLineCap() {
     return this.lineCap_;
-};
+  }
 
-
+  /**
-/**
    * Get the line dash style for the stroke.
    * @return {Array.<number>} Line dash.
    * @api
    */
-Stroke.prototype.getLineDash = function() {
+  getLineDash() {
     return this.lineDash_;
-};
+  }
 
-
+  /**
-/**
    * Get the line dash offset for the stroke.
    * @return {number|undefined} Line dash offset.
    * @api
    */
-Stroke.prototype.getLineDashOffset = function() {
+  getLineDashOffset() {
     return this.lineDashOffset_;
-};
+  }
 
-
+  /**
-/**
    * Get the line join type for the stroke.
    * @return {string|undefined} Line join.
    * @api
    */
-Stroke.prototype.getLineJoin = function() {
+  getLineJoin() {
     return this.lineJoin_;
-};
+  }
 
-
+  /**
-/**
    * Get the miter limit for the stroke.
    * @return {number|undefined} Miter limit.
    * @api
    */
-Stroke.prototype.getMiterLimit = function() {
+  getMiterLimit() {
     return this.miterLimit_;
-};
+  }
 
-
+  /**
-/**
    * Get the stroke width.
    * @return {number|undefined} Width.
    * @api
    */
-Stroke.prototype.getWidth = function() {
+  getWidth() {
     return this.width_;
-};
+  }
 
-
+  /**
-/**
    * Set the color.
    *
    * @param {module:ol/color~Color|module:ol/colorlike~ColorLike} color Color.
    * @api
    */
-Stroke.prototype.setColor = function(color) {
+  setColor(color) {
     this.color_ = color;
     this.checksum_ = undefined;
-};
+  }
 
-
+  /**
-/**
    * Set the line cap.
    *
    * @param {string|undefined} lineCap Line cap.
    * @api
    */
-Stroke.prototype.setLineCap = function(lineCap) {
+  setLineCap(lineCap) {
     this.lineCap_ = lineCap;
     this.checksum_ = undefined;
-};
+  }
 
-
+  /**
-/**
    * Set the line dash.
    *
    * Please note that Internet Explorer 10 and lower [do not support][mdn] the
@@ -210,64 +200,59 @@ Stroke.prototype.setLineCap = function(lineCap) {
    * @param {Array.<number>} lineDash Line dash.
    * @api
    */
-Stroke.prototype.setLineDash = function(lineDash) {
+  setLineDash(lineDash) {
     this.lineDash_ = lineDash;
     this.checksum_ = undefined;
-};
+  }
 
-
+  /**
-/**
    * Set the line dash offset.
    *
    * @param {number|undefined} lineDashOffset Line dash offset.
    * @api
    */
-Stroke.prototype.setLineDashOffset = function(lineDashOffset) {
+  setLineDashOffset(lineDashOffset) {
     this.lineDashOffset_ = lineDashOffset;
     this.checksum_ = undefined;
-};
+  }
 
-
+  /**
-/**
    * Set the line join.
    *
    * @param {string|undefined} lineJoin Line join.
    * @api
    */
-Stroke.prototype.setLineJoin = function(lineJoin) {
+  setLineJoin(lineJoin) {
     this.lineJoin_ = lineJoin;
     this.checksum_ = undefined;
-};
+  }
 
-
+  /**
-/**
    * Set the miter limit.
    *
    * @param {number|undefined} miterLimit Miter limit.
    * @api
    */
-Stroke.prototype.setMiterLimit = function(miterLimit) {
+  setMiterLimit(miterLimit) {
     this.miterLimit_ = miterLimit;
     this.checksum_ = undefined;
-};
+  }
 
-
+  /**
-/**
    * Set the width.
    *
    * @param {number|undefined} width Width.
    * @api
    */
-Stroke.prototype.setWidth = function(width) {
+  setWidth(width) {
     this.width_ = width;
     this.checksum_ = undefined;
-};
+  }
 
-
+  /**
-/**
    * @return {string} The checksum.
    */
-Stroke.prototype.getChecksum = function() {
+  getChecksum() {
     if (this.checksum_ === undefined) {
       this.checksum_ = 's';
       if (this.color_) {
@@ -295,5 +280,7 @@ Stroke.prototype.getChecksum = function() {
     }
 
     return this.checksum_;
-};
+  }
+}
+
 export default Stroke;

src/ol/style/Style.js

@@ -149,7 +149,8 @@ import Stroke from '../style/Stroke.js';
  * @param {module:ol/style/Style~Options=} opt_options Style options.
  * @api
  */
-const Style = function(opt_options) {
+class Style {
+  constructor(opt_options) {
 
     const options = opt_options || {};
 
@@ -205,15 +206,14 @@ const Style = function(opt_options) {
      */
     this.zIndex_ = options.zIndex;
 
-};
+  }
 
-
+  /**
-/**
    * Clones the style.
    * @return {module:ol/style/Style} The cloned style.
    * @api
    */
-Style.prototype.clone = function() {
+  clone() {
     let geometry = this.getGeometry();
     if (geometry && geometry.clone) {
       geometry = geometry.clone();
@@ -226,145 +226,131 @@ Style.prototype.clone = function() {
       text: this.getText() ? this.getText().clone() : undefined,
       zIndex: this.getZIndex()
     });
-};
+  }
 
-
+  /**
-/**
    * Get the custom renderer function that was configured with
    * {@link #setRenderer} or the `renderer` constructor option.
    * @return {module:ol/style/Style~RenderFunction|null} Custom renderer function.
    * @api
    */
-Style.prototype.getRenderer = function() {
+  getRenderer() {
     return this.renderer_;
-};
+  }
 
-
+  /**
-/**
    * Sets a custom renderer function for this style. When set, `fill`, `stroke`
    * and `image` options of the style will be ignored.
    * @param {module:ol/style/Style~RenderFunction|null} renderer Custom renderer function.
    * @api
    */
-Style.prototype.setRenderer = function(renderer) {
+  setRenderer(renderer) {
     this.renderer_ = renderer;
-};
+  }
 
-
+  /**
-/**
    * Get the geometry to be rendered.
    * @return {string|module:ol/geom/Geometry|module:ol/style/Style~GeometryFunction}
    * Feature property or geometry or function that returns the geometry that will
    * be rendered with this style.
    * @api
    */
-Style.prototype.getGeometry = function() {
+  getGeometry() {
     return this.geometry_;
-};
+  }
 
-
+  /**
-/**
    * Get the function used to generate a geometry for rendering.
    * @return {!module:ol/style/Style~GeometryFunction} Function that is called with a feature
    * and returns the geometry to render instead of the feature's geometry.
    * @api
    */
-Style.prototype.getGeometryFunction = function() {
+  getGeometryFunction() {
     return this.geometryFunction_;
-};
+  }
 
-
+  /**
-/**
    * Get the fill style.
    * @return {module:ol/style/Fill} Fill style.
    * @api
    */
-Style.prototype.getFill = function() {
+  getFill() {
     return this.fill_;
-};
+  }
 
-
+  /**
-/**
    * Set the fill style.
    * @param {module:ol/style/Fill} fill Fill style.
    * @api
    */
-Style.prototype.setFill = function(fill) {
+  setFill(fill) {
     this.fill_ = fill;
-};
+  }
 
-
+  /**
-/**
    * Get the image style.
    * @return {module:ol/style/Image} Image style.
    * @api
    */
-Style.prototype.getImage = function() {
+  getImage() {
     return this.image_;
-};
+  }
 
-
+  /**
-/**
    * Set the image style.
    * @param {module:ol/style/Image} image Image style.
    * @api
    */
-Style.prototype.setImage = function(image) {
+  setImage(image) {
     this.image_ = image;
-};
+  }
 
-
+  /**
-/**
    * Get the stroke style.
    * @return {module:ol/style/Stroke} Stroke style.
    * @api
    */
-Style.prototype.getStroke = function() {
+  getStroke() {
     return this.stroke_;
-};
+  }
 
-
+  /**
-/**
    * Set the stroke style.
    * @param {module:ol/style/Stroke} stroke Stroke style.
    * @api
    */
-Style.prototype.setStroke = function(stroke) {
+  setStroke(stroke) {
     this.stroke_ = stroke;
-};
+  }
 
-
+  /**
-/**
    * Get the text style.
    * @return {module:ol/style/Text} Text style.
    * @api
    */
-Style.prototype.getText = function() {
+  getText() {
     return this.text_;
-};
+  }
 
-
+  /**
-/**
    * Set the text style.
    * @param {module:ol/style/Text} text Text style.
    * @api
    */
-Style.prototype.setText = function(text) {
+  setText(text) {
     this.text_ = text;
-};
+  }
 
-
+  /**
-/**
    * Get the z-index for the style.
    * @return {number|undefined} ZIndex.
    * @api
    */
-Style.prototype.getZIndex = function() {
+  getZIndex() {
     return this.zIndex_;
-};
+  }
 
-
+  /**
-/**
    * Set a geometry that is rendered instead of the feature's geometry.
    *
    * @param {string|module:ol/geom/Geometry|module:ol/style/Style~GeometryFunction} geometry
@@ -372,7 +358,7 @@ Style.prototype.getZIndex = function() {
    *     for this style.
    * @api
    */
-Style.prototype.setGeometry = function(geometry) {
+  setGeometry(geometry) {
     if (typeof geometry === 'function') {
       this.geometryFunction_ = geometry;
     } else if (typeof geometry === 'string') {
@@ -391,18 +377,18 @@ Style.prototype.setGeometry = function(geometry) {
       };
     }
     this.geometry_ = geometry;
-};
+  }
 
-
+  /**
-/**
    * Set the z-index.
    *
    * @param {number|undefined} zIndex ZIndex.
    * @api
    */
-Style.prototype.setZIndex = function(zIndex) {
+  setZIndex(zIndex) {
     this.zIndex_ = zIndex;
-};
+  }
+}
 
 
 /**

src/ol/style/Text.js

@@ -53,7 +53,8 @@ const DEFAULT_FILL_COLOR = '#333';
  * @param {module:ol/style/Text~Options=} opt_options Options.
  * @api
  */
-const Text = function(opt_options) {
+class Text {
+ constructor(opt_options) {
 
    const options = opt_options || {};
 
@@ -159,15 +160,14 @@ const Text = function(opt_options) {
     * @type {Array.<number>}
     */
    this.padding_ = options.padding === undefined ? null : options.padding;
-};
+ }
 
-
+ /**
-/**
   * Clones the style.
   * @return {module:ol/style/Text} The cloned style.
   * @api
   */
-Text.prototype.clone = function() {
+ clone() {
    return new Text({
      font: this.getFont(),
      placement: this.getPlacement(),
@@ -186,351 +186,320 @@ Text.prototype.clone = function() {
      backgroundFill: this.getBackgroundFill() ? this.getBackgroundFill().clone() : undefined,
      backgroundStroke: this.getBackgroundStroke() ? this.getBackgroundStroke().clone() : undefined
    });
-};
+ }
 
-
+ /**
-/**
   * Get the `overflow` configuration.
   * @return {boolean} Let text overflow the length of the path they follow.
   * @api
   */
-Text.prototype.getOverflow = function() {
+ getOverflow() {
    return this.overflow_;
-};
+ }
 
-
+ /**
-/**
   * Get the font name.
   * @return {string|undefined} Font.
   * @api
   */
-Text.prototype.getFont = function() {
+ getFont() {
    return this.font_;
-};
+ }
 
-
+ /**
-/**
   * Get the maximum angle between adjacent characters.
   * @return {number} Angle in radians.
   * @api
   */
-Text.prototype.getMaxAngle = function() {
+ getMaxAngle() {
    return this.maxAngle_;
-};
+ }
 
-
+ /**
-/**
   * Get the label placement.
   * @return {module:ol/style/TextPlacement|string} Text placement.
   * @api
   */
-Text.prototype.getPlacement = function() {
+ getPlacement() {
    return this.placement_;
-};
+ }
 
-
+ /**
-/**
   * Get the x-offset for the text.
   * @return {number} Horizontal text offset.
   * @api
   */
-Text.prototype.getOffsetX = function() {
+ getOffsetX() {
    return this.offsetX_;
-};
+ }
 
-
+ /**
-/**
   * Get the y-offset for the text.
   * @return {number} Vertical text offset.
   * @api
   */
-Text.prototype.getOffsetY = function() {
+ getOffsetY() {
    return this.offsetY_;
-};
+ }
 
-
+ /**
-/**
   * Get the fill style for the text.
   * @return {module:ol/style/Fill} Fill style.
   * @api
   */
-Text.prototype.getFill = function() {
+ getFill() {
    return this.fill_;
-};
+ }
 
-
+ /**
-/**
   * Determine whether the text rotates with the map.
   * @return {boolean|undefined} Rotate with map.
   * @api
   */
-Text.prototype.getRotateWithView = function() {
+ getRotateWithView() {
    return this.rotateWithView_;
-};
+ }
 
-
+ /**
-/**
   * Get the text rotation.
   * @return {number|undefined} Rotation.
   * @api
   */
-Text.prototype.getRotation = function() {
+ getRotation() {
    return this.rotation_;
-};
+ }
 
-
+ /**
-/**
   * Get the text scale.
   * @return {number|undefined} Scale.
   * @api
   */
-Text.prototype.getScale = function() {
+ getScale() {
    return this.scale_;
-};
+ }
 
-
+ /**
-/**
   * Get the stroke style for the text.
   * @return {module:ol/style/Stroke} Stroke style.
   * @api
   */
-Text.prototype.getStroke = function() {
+ getStroke() {
    return this.stroke_;
-};
+ }
 
-
+ /**
-/**
   * Get the text to be rendered.
   * @return {string|undefined} Text.
   * @api
   */
-Text.prototype.getText = function() {
+ getText() {
    return this.text_;
-};
+ }
 
-
+ /**
-/**
   * Get the text alignment.
   * @return {string|undefined} Text align.
   * @api
   */
-Text.prototype.getTextAlign = function() {
+ getTextAlign() {
    return this.textAlign_;
-};
+ }
 
-
+ /**
-/**
   * Get the text baseline.
   * @return {string|undefined} Text baseline.
   * @api
   */
-Text.prototype.getTextBaseline = function() {
+ getTextBaseline() {
    return this.textBaseline_;
-};
+ }
 
-
+ /**
-/**
   * Get the background fill style for the text.
   * @return {module:ol/style/Fill} Fill style.
   * @api
   */
-Text.prototype.getBackgroundFill = function() {
+ getBackgroundFill() {
    return this.backgroundFill_;
-};
+ }
 
-
+ /**
-/**
   * Get the background stroke style for the text.
   * @return {module:ol/style/Stroke} Stroke style.
   * @api
   */
-Text.prototype.getBackgroundStroke = function() {
+ getBackgroundStroke() {
    return this.backgroundStroke_;
-};
+ }
 
-
+ /**
-/**
   * Get the padding for the text.
   * @return {Array.<number>} Padding.
   * @api
   */
-Text.prototype.getPadding = function() {
+ getPadding() {
    return this.padding_;
-};
+ }
 
-
+ /**
-/**
   * Set the `overflow` property.
   *
   * @param {boolean} overflow Let text overflow the path that it follows.
   * @api
   */
-Text.prototype.setOverflow = function(overflow) {
+ setOverflow(overflow) {
    this.overflow_ = overflow;
-};
+ }
 
-
+ /**
-/**
   * Set the font.
   *
   * @param {string|undefined} font Font.
   * @api
   */
-Text.prototype.setFont = function(font) {
+ setFont(font) {
    this.font_ = font;
-};
+ }
 
-
+ /**
-/**
   * Set the maximum angle between adjacent characters.
   *
   * @param {number} maxAngle Angle in radians.
   * @api
   */
-Text.prototype.setMaxAngle = function(maxAngle) {
+ setMaxAngle(maxAngle) {
    this.maxAngle_ = maxAngle;
-};
+ }
 
-
+ /**
-/**
   * Set the x offset.
   *
   * @param {number} offsetX Horizontal text offset.
   * @api
   */
-Text.prototype.setOffsetX = function(offsetX) {
+ setOffsetX(offsetX) {
    this.offsetX_ = offsetX;
-};
+ }
 
-
+ /**
-/**
   * Set the y offset.
   *
   * @param {number} offsetY Vertical text offset.
   * @api
   */
-Text.prototype.setOffsetY = function(offsetY) {
+ setOffsetY(offsetY) {
    this.offsetY_ = offsetY;
-};
+ }
 
-
+ /**
-/**
   * Set the text placement.
   *
   * @param {module:ol/style/TextPlacement|string} placement Placement.
   * @api
   */
-Text.prototype.setPlacement = function(placement) {
+ setPlacement(placement) {
    this.placement_ = placement;
-};
+ }
 
-
+ /**
-/**
   * Set the fill.
   *
   * @param {module:ol/style/Fill} fill Fill style.
   * @api
   */
-Text.prototype.setFill = function(fill) {
+ setFill(fill) {
    this.fill_ = fill;
-};
+ }
 
-
+ /**
-/**
   * Set the rotation.
   *
   * @param {number|undefined} rotation Rotation.
   * @api
   */
-Text.prototype.setRotation = function(rotation) {
+ setRotation(rotation) {
    this.rotation_ = rotation;
-};
+ }
 
-
+ /**
-/**
   * Set the scale.
   *
   * @param {number|undefined} scale Scale.
   * @api
   */
-Text.prototype.setScale = function(scale) {
+ setScale(scale) {
    this.scale_ = scale;
-};
+ }
 
-
+ /**
-/**
   * Set the stroke.
   *
   * @param {module:ol/style/Stroke} stroke Stroke style.
   * @api
   */
-Text.prototype.setStroke = function(stroke) {
+ setStroke(stroke) {
    this.stroke_ = stroke;
-};
+ }
 
-
+ /**
-/**
   * Set the text.
   *
   * @param {string|undefined} text Text.
   * @api
   */
-Text.prototype.setText = function(text) {
+ setText(text) {
    this.text_ = text;
-};
+ }
 
-
+ /**
-/**
   * Set the text alignment.
   *
   * @param {string|undefined} textAlign Text align.
   * @api
   */
-Text.prototype.setTextAlign = function(textAlign) {
+ setTextAlign(textAlign) {
    this.textAlign_ = textAlign;
-};
+ }
 
-
+ /**
-/**
   * Set the text baseline.
   *
   * @param {string|undefined} textBaseline Text baseline.
   * @api
   */
-Text.prototype.setTextBaseline = function(textBaseline) {
+ setTextBaseline(textBaseline) {
    this.textBaseline_ = textBaseline;
-};
+ }
 
-
+ /**
-/**
   * Set the background fill.
   *
   * @param {module:ol/style/Fill} fill Fill style.
   * @api
   */
-Text.prototype.setBackgroundFill = function(fill) {
+ setBackgroundFill(fill) {
    this.backgroundFill_ = fill;
-};
+ }
 
-
+ /**
-/**
   * Set the background stroke.
   *
   * @param {module:ol/style/Stroke} stroke Stroke style.
   * @api
   */
-Text.prototype.setBackgroundStroke = function(stroke) {
+ setBackgroundStroke(stroke) {
    this.backgroundStroke_ = stroke;
-};
+ }
 
-
+ /**
-/**
   * Set the padding (`[top, right, bottom, left]`).
   *
   * @param {!Array.<number>} padding Padding.
   * @api
   */
-Text.prototype.setPadding = function(padding) {
+ setPadding(padding) {
    this.padding_ = padding;
-};
+ }
+}
+
 export default Text;

src/ol/tilegrid/TileGrid.js

@@ -47,7 +47,8 @@ import {createOrUpdate as createOrUpdateTileCoord} from '../tilecoord.js';
  * @struct
  * @api
  */
-const TileGrid = function(options) {
+class TileGrid {
+  constructor(options) {
 
     /**
      * @protected
@@ -175,17 +176,9 @@ const TileGrid = function(options) {
       this.calculateTileRanges_(extent);
     }
 
-};
+  }
 
-
+  /**
-/**
- * @private
- * @type {module:ol/tilecoord~TileCoord}
- */
-const tmpTileCoord = [0, 0, 0];
-
-
-/**
    * Call a function with each tile coordinate for a given extent and zoom level.
    *
    * @param {module:ol/extent~Extent} extent Extent.
@@ -193,17 +186,16 @@ const tmpTileCoord = [0, 0, 0];
    * @param {function(module:ol/tilecoord~TileCoord)} callback Function called with each tile coordinate.
    * @api
    */
-TileGrid.prototype.forEachTileCoord = function(extent, zoom, callback) {
+  forEachTileCoord(extent, zoom, callback) {
     const tileRange = this.getTileRangeForExtentAndZ(extent, zoom);
     for (let i = tileRange.minX, ii = tileRange.maxX; i <= ii; ++i) {
       for (let j = tileRange.minY, jj = tileRange.maxY; j <= jj; ++j) {
         callback([zoom, i, j]);
       }
     }
-};
+  }
 
-
+  /**
-/**
    * @param {module:ol/tilecoord~TileCoord} tileCoord Tile coordinate.
    * @param {function(this: T, number, module:ol/TileRange): boolean} callback Callback.
    * @param {T=} opt_this The object to use as `this` in `callback`.
@@ -212,7 +204,7 @@ TileGrid.prototype.forEachTileCoord = function(extent, zoom, callback) {
    * @return {boolean} Callback succeeded.
    * @template T
    */
-TileGrid.prototype.forEachTileCoordParentTileRange = function(tileCoord, callback, opt_this, opt_tileRange, opt_extent) {
+  forEachTileCoordParentTileRange(tileCoord, callback, opt_this, opt_tileRange, opt_extent) {
     let tileRange, x, y;
     let tileCoordExtent = null;
     let z = tileCoord[0] - 1;
@@ -236,81 +228,74 @@ TileGrid.prototype.forEachTileCoordParentTileRange = function(tileCoord, callbac
       --z;
     }
     return false;
-};
+  }
 
-
+  /**
-/**
    * Get the extent for this tile grid, if it was configured.
    * @return {module:ol/extent~Extent} Extent.
    */
-TileGrid.prototype.getExtent = function() {
+  getExtent() {
     return this.extent_;
-};
+  }
 
-
+  /**
-/**
    * Get the maximum zoom level for the grid.
    * @return {number} Max zoom.
    * @api
    */
-TileGrid.prototype.getMaxZoom = function() {
+  getMaxZoom() {
     return this.maxZoom;
-};
+  }
 
-
+  /**
-/**
    * Get the minimum zoom level for the grid.
    * @return {number} Min zoom.
    * @api
    */
-TileGrid.prototype.getMinZoom = function() {
+  getMinZoom() {
     return this.minZoom;
-};
+  }
 
-
+  /**
-/**
    * Get the origin for the grid at the given zoom level.
    * @param {number} z Integer zoom level.
    * @return {module:ol/coordinate~Coordinate} Origin.
    * @api
    */
-TileGrid.prototype.getOrigin = function(z) {
+  getOrigin(z) {
     if (this.origin_) {
       return this.origin_;
     } else {
       return this.origins_[z];
     }
-};
+  }
 
-
+  /**
-/**
    * Get the resolution for the given zoom level.
    * @param {number} z Integer zoom level.
    * @return {number} Resolution.
    * @api
    */
-TileGrid.prototype.getResolution = function(z) {
+  getResolution(z) {
     return this.resolutions_[z];
-};
+  }
 
-
+  /**
-/**
    * Get the list of resolutions for the tile grid.
    * @return {Array.<number>} Resolutions.
    * @api
    */
-TileGrid.prototype.getResolutions = function() {
+  getResolutions() {
     return this.resolutions_;
-};
+  }
 
-
+  /**
-/**
    * @param {module:ol/tilecoord~TileCoord} tileCoord Tile coordinate.
    * @param {module:ol/TileRange=} opt_tileRange Temporary module:ol/TileRange object.
    * @param {module:ol/extent~Extent=} opt_extent Temporary module:ol/extent~Extent object.
    * @return {module:ol/TileRange} Tile range.
    */
-TileGrid.prototype.getTileCoordChildTileRange = function(tileCoord, opt_tileRange, opt_extent) {
+  getTileCoordChildTileRange(tileCoord, opt_tileRange, opt_extent) {
     if (tileCoord[0] < this.maxZoom) {
       if (this.zoomFactor_ === 2) {
         const minX = tileCoord[1] * 2;
@@ -322,17 +307,16 @@ TileGrid.prototype.getTileCoordChildTileRange = function(tileCoord, opt_tileRang
         tileCoordExtent, tileCoord[0] + 1, opt_tileRange);
     }
     return null;
-};
+  }
 
-
+  /**
-/**
    * Get the extent for a tile range.
    * @param {number} z Integer zoom level.
    * @param {module:ol/TileRange} tileRange Tile range.
    * @param {module:ol/extent~Extent=} opt_extent Temporary module:ol/extent~Extent object.
    * @return {module:ol/extent~Extent} Extent.
    */
-TileGrid.prototype.getTileRangeExtent = function(z, tileRange, opt_extent) {
+  getTileRangeExtent(z, tileRange, opt_extent) {
     const origin = this.getOrigin(z);
     const resolution = this.getResolution(z);
     const tileSize = toSize(this.getTileSize(z), this.tmpSize_);
@@ -341,31 +325,29 @@ TileGrid.prototype.getTileRangeExtent = function(z, tileRange, opt_extent) {
     const minY = origin[1] + tileRange.minY * tileSize[1] * resolution;
     const maxY = origin[1] + (tileRange.maxY + 1) * tileSize[1] * resolution;
     return createOrUpdate(minX, minY, maxX, maxY, opt_extent);
-};
+  }
 
-
+  /**
-/**
    * Get a tile range for the given extent and integer zoom level.
    * @param {module:ol/extent~Extent} extent Extent.
    * @param {number} z Integer zoom level.
    * @param {module:ol/TileRange=} opt_tileRange Temporary tile range object.
    * @return {module:ol/TileRange} Tile range.
    */
-TileGrid.prototype.getTileRangeForExtentAndZ = function(extent, z, opt_tileRange) {
+  getTileRangeForExtentAndZ(extent, z, opt_tileRange) {
     const tileCoord = tmpTileCoord;
     this.getTileCoordForXYAndZ_(extent[0], extent[1], z, false, tileCoord);
     const minX = tileCoord[1];
     const minY = tileCoord[2];
     this.getTileCoordForXYAndZ_(extent[2], extent[3], z, true, tileCoord);
     return createOrUpdateTileRange(minX, tileCoord[1], minY, tileCoord[2], opt_tileRange);
-};
+  }
 
-
+  /**
-/**
    * @param {module:ol/tilecoord~TileCoord} tileCoord Tile coordinate.
    * @return {module:ol/coordinate~Coordinate} Tile center.
    */
-TileGrid.prototype.getTileCoordCenter = function(tileCoord) {
+  getTileCoordCenter(tileCoord) {
     const origin = this.getOrigin(tileCoord[0]);
     const resolution = this.getResolution(tileCoord[0]);
     const tileSize = toSize(this.getTileSize(tileCoord[0]), this.tmpSize_);
@@ -373,10 +355,9 @@ TileGrid.prototype.getTileCoordCenter = function(tileCoord) {
       origin[0] + (tileCoord[1] + 0.5) * tileSize[0] * resolution,
       origin[1] + (tileCoord[2] + 0.5) * tileSize[1] * resolution
     ];
-};
+  }
 
-
+  /**
-/**
    * Get the extent of a tile coordinate.
    *
    * @param {module:ol/tilecoord~TileCoord} tileCoord Tile coordinate.
@@ -384,7 +365,7 @@ TileGrid.prototype.getTileCoordCenter = function(tileCoord) {
    * @return {module:ol/extent~Extent} Extent.
    * @api
    */
-TileGrid.prototype.getTileCoordExtent = function(tileCoord, opt_extent) {
+  getTileCoordExtent(tileCoord, opt_extent) {
     const origin = this.getOrigin(tileCoord[0]);
     const resolution = this.getResolution(tileCoord[0]);
     const tileSize = toSize(this.getTileSize(tileCoord[0]), this.tmpSize_);
@@ -393,10 +374,9 @@ TileGrid.prototype.getTileCoordExtent = function(tileCoord, opt_extent) {
     const maxX = minX + tileSize[0] * resolution;
     const maxY = minY + tileSize[1] * resolution;
     return createOrUpdate(minX, minY, maxX, maxY, opt_extent);
-};
+  }
 
-
+  /**
-/**
    * Get the tile coordinate for the given map coordinate and resolution.  This
    * method considers that coordinates that intersect tile boundaries should be
    * assigned the higher tile coordinate.
@@ -407,13 +387,12 @@ TileGrid.prototype.getTileCoordExtent = function(tileCoord, opt_extent) {
    * @return {module:ol/tilecoord~TileCoord} Tile coordinate.
    * @api
    */
-TileGrid.prototype.getTileCoordForCoordAndResolution = function(coordinate, resolution, opt_tileCoord) {
+  getTileCoordForCoordAndResolution(coordinate, resolution, opt_tileCoord) {
     return this.getTileCoordForXYAndResolution_(
       coordinate[0], coordinate[1], resolution, false, opt_tileCoord);
-};
+  }
 
-
+  /**
-/**
    * Note that this method should not be called for resolutions that correspond
    * to an integer zoom level.  Instead call the `getTileCoordForXYAndZ_` method.
    * @param {number} x X.
@@ -426,8 +405,7 @@ TileGrid.prototype.getTileCoordForCoordAndResolution = function(coordinate, reso
    * @return {module:ol/tilecoord~TileCoord} Tile coordinate.
    * @private
    */
-TileGrid.prototype.getTileCoordForXYAndResolution_ = function(
+  getTileCoordForXYAndResolution_(x, y, resolution, reverseIntersectionPolicy, opt_tileCoord) {
-  x, y, resolution, reverseIntersectionPolicy, opt_tileCoord) {
     const z = this.getZForResolution(resolution);
     const scale = resolution / this.getResolution(z);
     const origin = this.getOrigin(z);
@@ -449,10 +427,9 @@ TileGrid.prototype.getTileCoordForXYAndResolution_ = function(
     }
 
     return createOrUpdateTileCoord(z, tileCoordX, tileCoordY, opt_tileCoord);
-};
+  }
 
-
+  /**
-/**
    * Although there is repetition between this method and `getTileCoordForXYAndResolution_`,
    * they should have separate implementations.  This method is for integer zoom
    * levels.  The other method should only be called for resolutions corresponding
@@ -467,7 +444,7 @@ TileGrid.prototype.getTileCoordForXYAndResolution_ = function(
    * @return {module:ol/tilecoord~TileCoord} Tile coordinate.
    * @private
    */
-TileGrid.prototype.getTileCoordForXYAndZ_ = function(x, y, z, reverseIntersectionPolicy, opt_tileCoord) {
+  getTileCoordForXYAndZ_(x, y, z, reverseIntersectionPolicy, opt_tileCoord) {
     const origin = this.getOrigin(z);
     const resolution = this.getResolution(z);
     const tileSize = toSize(this.getTileSize(z), this.tmpSize_);
@@ -488,10 +465,9 @@ TileGrid.prototype.getTileCoordForXYAndZ_ = function(x, y, z, reverseIntersectio
     }
 
     return createOrUpdateTileCoord(z, tileCoordX, tileCoordY, opt_tileCoord);
-};
+  }
 
-
+  /**
-/**
    * Get a tile coordinate given a map coordinate and zoom level.
    * @param {module:ol/coordinate~Coordinate} coordinate Coordinate.
    * @param {number} z Zoom level.
@@ -499,22 +475,20 @@ TileGrid.prototype.getTileCoordForXYAndZ_ = function(x, y, z, reverseIntersectio
    * @return {module:ol/tilecoord~TileCoord} Tile coordinate.
    * @api
    */
-TileGrid.prototype.getTileCoordForCoordAndZ = function(coordinate, z, opt_tileCoord) {
+  getTileCoordForCoordAndZ(coordinate, z, opt_tileCoord) {
     return this.getTileCoordForXYAndZ_(
       coordinate[0], coordinate[1], z, false, opt_tileCoord);
-};
+  }
 
-
+  /**
-/**
    * @param {module:ol/tilecoord~TileCoord} tileCoord Tile coordinate.
    * @return {number} Tile resolution.
    */
-TileGrid.prototype.getTileCoordResolution = function(tileCoord) {
+  getTileCoordResolution(tileCoord) {
     return this.resolutions_[tileCoord[0]];
-};
+  }
 
-
+  /**
-/**
    * Get the tile size for a zoom level. The type of the return value matches the
    * `tileSize` or `tileSizes` that the tile grid was configured with. To always
    * get an `module:ol/size~Size`, run the result through `module:ol/size~Size.toSize()`.
@@ -522,29 +496,27 @@ TileGrid.prototype.getTileCoordResolution = function(tileCoord) {
    * @return {number|module:ol/size~Size} Tile size.
    * @api
    */
-TileGrid.prototype.getTileSize = function(z) {
+  getTileSize(z) {
     if (this.tileSize_) {
       return this.tileSize_;
     } else {
       return this.tileSizes_[z];
     }
-};
+  }
 
-
+  /**
-/**
    * @param {number} z Zoom level.
    * @return {module:ol/TileRange} Extent tile range for the specified zoom level.
    */
-TileGrid.prototype.getFullTileRange = function(z) {
+  getFullTileRange(z) {
     if (!this.fullTileRanges_) {
       return null;
     } else {
       return this.fullTileRanges_[z];
     }
-};
+  }
 
-
+  /**
-/**
    * @param {number} resolution Resolution.
    * @param {number=} opt_direction If 0, the nearest resolution will be used.
    *     If 1, the nearest lower resolution will be used. If -1, the nearest
@@ -552,22 +524,31 @@ TileGrid.prototype.getFullTileRange = function(z) {
    * @return {number} Z.
    * @api
    */
-TileGrid.prototype.getZForResolution = function(resolution, opt_direction) {
+  getZForResolution(resolution, opt_direction) {
     const z = linearFindNearest(this.resolutions_, resolution, opt_direction || 0);
     return clamp(z, this.minZoom, this.maxZoom);
-};
+  }
 
-
+  /**
-/**
    * @param {!module:ol/extent~Extent} extent Extent for this tile grid.
    * @private
    */
-TileGrid.prototype.calculateTileRanges_ = function(extent) {
+  calculateTileRanges_(extent) {
     const length = this.resolutions_.length;
     const fullTileRanges = new Array(length);
     for (let z = this.minZoom; z < length; ++z) {
       fullTileRanges[z] = this.getTileRangeForExtentAndZ(extent, z);
     }
     this.fullTileRanges_ = fullTileRanges;
-};
+  }
+}
+
+
+/**
+ * @private
+ * @type {module:ol/tilecoord~TileCoord}
+ */
+const tmpTileCoord = [0, 0, 0];
+
+
 export default TileGrid;

src/ol/tilegrid/WMTS.js

@@ -55,7 +55,8 @@ import TileGrid from '../tilegrid/TileGrid.js';
  * @struct
  * @api
  */
-const WMTSTileGrid = function(options) {
+class WMTSTileGrid {
+  constructor(options) {
     /**
      * @private
      * @type {!Array.<string>}
@@ -72,28 +73,28 @@ const WMTSTileGrid = function(options) {
       tileSizes: options.tileSizes,
       sizes: options.sizes
     });
-};
+  }
 
-inherits(WMTSTileGrid, TileGrid);
+  /**
-
-
-/**
    * @param {number} z Z.
    * @return {string} MatrixId..
    */
-WMTSTileGrid.prototype.getMatrixId = function(z) {
+  getMatrixId(z) {
     return this.matrixIds_[z];
-};
+  }
 
-
+  /**
-/**
    * Get the list of matrix identifiers.
    * @return {Array.<string>} MatrixIds.
    * @api
    */
-WMTSTileGrid.prototype.getMatrixIds = function() {
+  getMatrixIds() {
     return this.matrixIds_;
-};
+  }
+}
+
+inherits(WMTSTileGrid, TileGrid);
+
 
 export default WMTSTileGrid;
 

src/ol/webgl/Buffer.js

@@ -18,7 +18,8 @@ const BufferUsage = {
  * @param {number=} opt_usage Usage.
  * @struct
  */
-const WebGLBuffer = function(opt_arr, opt_usage) {
+class WebGLBuffer {
+ constructor(opt_arr, opt_usage) {
 
    /**
     * @private
@@ -32,22 +33,21 @@ const WebGLBuffer = function(opt_arr, opt_usage) {
     */
    this.usage_ = opt_usage !== undefined ? opt_usage : BufferUsage.STATIC_DRAW;
 
-};
+ }
 
-
+ /**
-/**
   * @return {Array.<number>} Array.
   */
-WebGLBuffer.prototype.getArray = function() {
+ getArray() {
    return this.arr_;
-};
+ }
 
-
+ /**
-/**
   * @return {number} Usage.
   */
-WebGLBuffer.prototype.getUsage = function() {
+ getUsage() {
    return this.usage_;
-};
+ }
+}
 
 export default WebGLBuffer;

src/ol/webgl/Context.js

@@ -27,7 +27,8 @@ import ContextEventType from '../webgl/ContextEventType.js';
  * @param {HTMLCanvasElement} canvas Canvas.
  * @param {WebGLRenderingContext} gl GL.
  */
-const WebGLContext = function(canvas, gl) {
+class WebGLContext {
+  constructor(canvas, gl) {
 
     /**
      * @private
@@ -98,19 +99,16 @@ const WebGLContext = function(canvas, gl) {
     listen(this.canvas_, ContextEventType.RESTORED,
       this.handleWebGLContextRestored, this);
 
-};
+  }
 
-inherits(WebGLContext, Disposable);
+  /**
-
-
-/**
    * Just bind the buffer if it's in the cache. Otherwise create
    * the WebGL buffer, bind it, populate it, and add an entry to
    * the cache.
    * @param {number} target Target.
    * @param {module:ol/webgl/Buffer} buf Buffer.
    */
-WebGLContext.prototype.bindBuffer = function(target, buf) {
+  bindBuffer(target, buf) {
     const gl = this.getGL();
     const arr = buf.getArray();
     const bufferKey = String(getUid(buf));
@@ -133,13 +131,12 @@ WebGLContext.prototype.bindBuffer = function(target, buf) {
         buffer: buffer
       };
     }
-};
+  }
 
-
+  /**
-/**
    * @param {module:ol/webgl/Buffer} buf Buffer.
    */
-WebGLContext.prototype.deleteBuffer = function(buf) {
+  deleteBuffer(buf) {
     const gl = this.getGL();
     const bufferKey = String(getUid(buf));
     const bufferCacheEntry = this.bufferCache_[bufferKey];
@@ -147,13 +144,12 @@ WebGLContext.prototype.deleteBuffer = function(buf) {
       gl.deleteBuffer(bufferCacheEntry.buffer);
     }
     delete this.bufferCache_[bufferKey];
-};
+  }
 
-
+  /**
-/**
    * @inheritDoc
    */
-WebGLContext.prototype.disposeInternal = function() {
+  disposeInternal() {
     unlistenAll(this.canvas_);
     const gl = this.getGL();
     if (!gl.isContextLost()) {
@@ -171,46 +167,42 @@ WebGLContext.prototype.disposeInternal = function() {
       gl.deleteRenderbuffer(this.hitDetectionRenderbuffer_);
       gl.deleteTexture(this.hitDetectionTexture_);
     }
-};
+  }
 
-
+  /**
-/**
    * @return {HTMLCanvasElement} Canvas.
    */
-WebGLContext.prototype.getCanvas = function() {
+  getCanvas() {
     return this.canvas_;
-};
+  }
 
-
+  /**
-/**
    * Get the WebGL rendering context
    * @return {WebGLRenderingContext} The rendering context.
    * @api
    */
-WebGLContext.prototype.getGL = function() {
+  getGL() {
     return this.gl_;
-};
+  }
 
-
+  /**
-/**
    * Get the frame buffer for hit detection.
    * @return {WebGLFramebuffer} The hit detection frame buffer.
    */
-WebGLContext.prototype.getHitDetectionFramebuffer = function() {
+  getHitDetectionFramebuffer() {
     if (!this.hitDetectionFramebuffer_) {
       this.initHitDetectionFramebuffer_();
     }
     return this.hitDetectionFramebuffer_;
-};
+  }
 
-
+  /**
-/**
    * Get shader from the cache if it's in the cache. Otherwise, create
    * the WebGL shader, compile it, and add entry to cache.
    * @param {module:ol/webgl/Shader} shaderObject Shader object.
    * @return {WebGLShader} Shader.
    */
-WebGLContext.prototype.getShader = function(shaderObject) {
+  getShader(shaderObject) {
     const shaderKey = String(getUid(shaderObject));
     if (shaderKey in this.shaderCache_) {
       return this.shaderCache_[shaderKey];
@@ -222,10 +214,9 @@ WebGLContext.prototype.getShader = function(shaderObject) {
       this.shaderCache_[shaderKey] = shader;
       return shader;
     }
-};
+  }
 
-
+  /**
-/**
    * Get the program from the cache if it's in the cache. Otherwise create
    * the WebGL program, attach the shaders to it, and add an entry to the
    * cache.
@@ -233,7 +224,7 @@ WebGLContext.prototype.getShader = function(shaderObject) {
    * @param {module:ol/webgl/Vertex} vertexShaderObject Vertex shader.
    * @return {WebGLProgram} Program.
    */
-WebGLContext.prototype.getProgram = function(fragmentShaderObject, vertexShaderObject) {
+  getProgram(fragmentShaderObject, vertexShaderObject) {
     const programKey = getUid(fragmentShaderObject) + '/' + getUid(vertexShaderObject);
     if (programKey in this.programCache_) {
       return this.programCache_[programKey];
@@ -246,13 +237,12 @@ WebGLContext.prototype.getProgram = function(fragmentShaderObject, vertexShaderO
       this.programCache_[programKey] = program;
       return program;
     }
-};
+  }
 
-
+  /**
-/**
    * FIXME empty description for jsdoc
    */
-WebGLContext.prototype.handleWebGLContextLost = function() {
+  handleWebGLContextLost() {
     clear(this.bufferCache_);
     clear(this.shaderCache_);
     clear(this.programCache_);
@@ -260,21 +250,19 @@ WebGLContext.prototype.handleWebGLContextLost = function() {
     this.hitDetectionFramebuffer_ = null;
     this.hitDetectionTexture_ = null;
     this.hitDetectionRenderbuffer_ = null;
-};
+  }
 
-
+  /**
-/**
    * FIXME empty description for jsdoc
    */
-WebGLContext.prototype.handleWebGLContextRestored = function() {
+  handleWebGLContextRestored() {
-};
+  }
 
-
+  /**
-/**
    * Creates a 1x1 pixel framebuffer for the hit-detection.
    * @private
    */
-WebGLContext.prototype.initHitDetectionFramebuffer_ = function() {
+  initHitDetectionFramebuffer_() {
     const gl = this.gl_;
     const framebuffer = gl.createFramebuffer();
     gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
@@ -295,16 +283,15 @@ WebGLContext.prototype.initHitDetectionFramebuffer_ = function() {
     this.hitDetectionFramebuffer_ = framebuffer;
     this.hitDetectionTexture_ = texture;
     this.hitDetectionRenderbuffer_ = renderbuffer;
-};
+  }
 
-
+  /**
-/**
    * Use a program.  If the program is already in use, this will return `false`.
    * @param {WebGLProgram} program Program.
    * @return {boolean} Changed.
    * @api
    */
-WebGLContext.prototype.useProgram = function(program) {
+  useProgram(program) {
     if (program == this.currentProgram_) {
       return false;
     } else {
@@ -313,7 +300,10 @@ WebGLContext.prototype.useProgram = function(program) {
       this.currentProgram_ = program;
       return true;
     }
-};
+  }
+}
+
+inherits(WebGLContext, Disposable);
 
 
 /**

src/ol/webgl/Fragment.js

@@ -11,17 +11,20 @@ import WebGLShader from '../webgl/Shader.js';
  * @param {string} source Source.
  * @struct
  */
-const WebGLFragment = function(source) {
+class WebGLFragment {
+ constructor(source) {
    WebGLShader.call(this, source);
-};
+ }
+
+ /**
+  * @inheritDoc
+  */
+ getType() {
+   return FRAGMENT_SHADER;
+ }
+}
 
 inherits(WebGLFragment, WebGLShader);
 
 
-/**
- * @inheritDoc
- */
-WebGLFragment.prototype.getType = function() {
-  return FRAGMENT_SHADER;
-};
 export default WebGLFragment;

src/ol/webgl/Shader.js

@@ -9,7 +9,8 @@ import {FALSE} from '../functions.js';
  * @param {string} source Source.
  * @struct
  */
-const WebGLShader = function(source) {
+class WebGLShader {
+ constructor(source) {
 
    /**
     * @private
@@ -17,22 +18,21 @@ const WebGLShader = function(source) {
     */
    this.source_ = source;
 
-};
+ }
 
-
+ /**
-/**
   * @abstract
   * @return {number} Type.
   */
-WebGLShader.prototype.getType = function() {};
+ getType() {}
 
-
+ /**
-/**
   * @return {string} Source.
   */
-WebGLShader.prototype.getSource = function() {
+ getSource() {
    return this.source_;
-};
+ }
+}
 
 
 /**

src/ol/webgl/Vertex.js

@@ -11,17 +11,20 @@ import WebGLShader from '../webgl/Shader.js';
  * @param {string} source Source.
  * @struct
  */
-const WebGLVertex = function(source) {
+class WebGLVertex {
+ constructor(source) {
    WebGLShader.call(this, source);
-};
+ }
+
+ /**
+  * @inheritDoc
+  */
+ getType() {
+   return VERTEX_SHADER;
+ }
+}
 
 inherits(WebGLVertex, WebGLShader);
 
 
-/**
- * @inheritDoc
- */
-WebGLVertex.prototype.getType = function() {
-  return VERTEX_SHADER;
-};
 export default WebGLVertex;

src/ol/webgl/shaderlocations.mustache

@@ -12,23 +12,28 @@ import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
  * @param {WebGLProgram} program Program.
  * @struct
  */
-const Locations = function(gl, program) {
+class Locations {
-{{#uniforms}}
+
+  constructor(gl, program) {
+  {{#uniforms}}
 
     /**
     * @type {WebGLUniformLocation}
     */
     this.{{originalName}} = gl.getUniformLocation(
       program, DEBUG_WEBGL ? '{{originalName}}' : '{{shortName}}');
-{{/uniforms}}
+  {{/uniforms}}
-{{#attributes}}
+  {{#attributes}}
 
     /**
     * @type {number}
     */
     this.{{originalName}} = gl.getAttribLocation(
       program, DEBUG_WEBGL ? '{{originalName}}' : '{{shortName}}');
-{{/attributes}}
+  {{/attributes}}
-};
+
+  }
+
+}
 
 export default Locations;