Redefine ol.Size to be Array.<number>

src/ol/control/dragboxcontrol.js

@@ -4,12 +4,12 @@ goog.require('goog.asserts');
 goog.require('goog.dom');
 goog.require('goog.dom.TagName');
 goog.require('goog.events');
+goog.require('goog.math.Size');
 goog.require('goog.style');
 goog.require('ol.Coordinate');
 goog.require('ol.MapBrowserEvent');
 goog.require('ol.MapBrowserEvent.EventType');
 goog.require('ol.Pixel');
-goog.require('ol.Size');
 goog.require('ol.control.Control');
 
 
@@ -61,7 +61,7 @@ ol.control.DragBox.prototype.setMap = function(map) {
     goog.asserts.assert(goog.isDef(this.startPixel_));
     goog.style.setPosition(this.element,
         this.startPixel_[0], this.startPixel_[1]);
-    goog.style.setBorderBoxSize(this.element, new ol.Size(0, 0));
+    goog.style.setBorderBoxSize(this.element, new goog.math.Size(0, 0));
     this.listenerKeys.push(goog.events.listen(
         map, ol.MapBrowserEvent.EventType.DRAG, this.updateBox_, false, this));
   }
@@ -80,7 +80,7 @@ ol.control.DragBox.prototype.updateBox_ = function(mapBrowserEvent) {
   goog.style.setPosition(this.element,
       Math.min(currentPixel[0], this.startPixel_[0]),
       Math.min(currentPixel[1], this.startPixel_[1]));
-  goog.style.setBorderBoxSize(this.element, new ol.Size(
+  goog.style.setBorderBoxSize(this.element, new goog.math.Size(
       Math.abs(currentPixel[0] - this.startPixel_[0]),
       Math.abs(currentPixel[1] - this.startPixel_[1])));
 };

src/ol/extent.js

@@ -211,8 +211,8 @@ ol.extent.getCenter = function(extent) {
  */
 ol.extent.getForView2DAndSize =
     function(center, resolution, rotation, size, opt_extent) {
-  var dx = resolution * size.width / 2;
+  var dx = resolution * size[0] / 2;
-  var dy = resolution * size.height / 2;
+  var dy = resolution * size[1] / 2;
   var cosRotation = Math.cos(rotation);
   var sinRotation = Math.sin(rotation);
   var xs = [-dx, -dx, dx, dx];
@@ -242,7 +242,7 @@ ol.extent.getHeight = function(extent) {
  * @return {ol.Size} Size.
  */
 ol.extent.getSize = function(extent) {
-  return new ol.Size(extent[1] - extent[0], extent[3] - extent[2]);
+  return [extent[1] - extent[0], extent[3] - extent[2]];
 };
 
 

src/ol/interaction/dragrotateandzoominteraction.js

@@ -66,8 +66,8 @@ ol.interaction.DragRotateAndZoom.prototype.handleDrag =
   var map = mapBrowserEvent.map;
   var size = map.getSize();
   var delta = new goog.math.Vec2(
-      browserEvent.offsetX - size.width / 2,
+      browserEvent.offsetX - size[0] / 2,
-      size.height / 2 - browserEvent.offsetY);
+      size[1] / 2 - browserEvent.offsetY);
   var theta = Math.atan2(delta.y, delta.x);
   var magnitude = delta.magnitude();
   // FIXME works for View2D only

src/ol/interaction/dragrotateinteraction.js

@@ -52,7 +52,7 @@ ol.interaction.DragRotate.prototype.handleDrag = function(mapBrowserEvent) {
   var size = map.getSize();
   var offset = mapBrowserEvent.getPixel();
   var theta =
-      Math.atan2(size.height / 2 - offset[1], offset[0] - size.width / 2);
+      Math.atan2(size[1] / 2 - offset[1], offset[0] - size[0] / 2);
   if (goog.isDef(this.lastAngle_)) {
     var delta = theta - this.lastAngle_;
     var view = map.getView();

src/ol/map.js

@@ -943,7 +943,7 @@ ol.Map.prototype.updateSize = function() {
   var target = this.getTarget();
   if (goog.isDef(target)) {
     var size = goog.style.getSize(target);
-    this.setSize(new ol.Size(size.width, size.height));
+    this.setSize([size.width, size.height]);
   } else {
     this.setSize(undefined);
   }

src/ol/overlay.js

@@ -279,7 +279,7 @@ ol.Overlay.prototype.updatePixelPosition_ = function() {
     if (this.rendered_.left_ !== '') {
       this.rendered_.left_ = style.left = '';
     }
-    var right = Math.round(mapSize.width - pixel[0]) + 'px';
+    var right = Math.round(mapSize[0] - pixel[0]) + 'px';
     if (this.rendered_.right_ != right) {
       this.rendered_.right_ = style.right = right;
     }
@@ -305,7 +305,7 @@ ol.Overlay.prototype.updatePixelPosition_ = function() {
     if (this.rendered_.top_ !== '') {
       this.rendered_.top_ = style.top = '';
     }
-    var bottom = Math.round(mapSize.height - pixel[1]) + 'px';
+    var bottom = Math.round(mapSize[1] - pixel[1]) + 'px';
     if (this.rendered_.bottom_ != bottom) {
       this.rendered_.bottom_ = style.bottom = bottom;
     }

src/ol/renderer/canvas/canvasimagelayerrenderer.js

@@ -104,7 +104,7 @@ ol.renderer.canvas.ImageLayer.prototype.renderFrame =
     var transform = this.transform_;
     goog.vec.Mat4.makeIdentity(transform);
     goog.vec.Mat4.translate(transform,
-        frameState.size.width / 2, frameState.size.height / 2, 0);
+        frameState.size[0] / 2, frameState.size[1] / 2, 0);
     goog.vec.Mat4.rotateZ(transform, viewRotation);
     goog.vec.Mat4.scale(
         transform,

src/ol/renderer/canvas/canvasmaprenderer.js

@@ -16,6 +16,7 @@ goog.require('ol.renderer.Map');
 goog.require('ol.renderer.canvas.ImageLayer');
 goog.require('ol.renderer.canvas.TileLayer');
 goog.require('ol.renderer.canvas.VectorLayer');
+goog.require('ol.size');
 
 
 
@@ -29,19 +30,13 @@ ol.renderer.canvas.Map = function(container, map) {
 
   goog.base(this, container, map);
 
-  /**
-   * @private
-   * @type {ol.Size}
-   */
-  this.canvasSize_ = new ol.Size(container.clientHeight, container.clientWidth);
-
   /**
    * @private
    * @type {Element}
    */
   this.canvas_ = goog.dom.createElement(goog.dom.TagName.CANVAS);
-  this.canvas_.height = this.canvasSize_.height;
+  this.canvas_.height = container.clientHeight;
-  this.canvas_.width = this.canvasSize_.width;
+  this.canvas_.width = container.clientWidth;
   this.canvas_.className = ol.css.CLASS_UNSELECTABLE;
   goog.dom.insertChildAt(container, this.canvas_, 0);
 
@@ -51,6 +46,12 @@ ol.renderer.canvas.Map = function(container, map) {
    */
   this.renderedVisible_ = true;
 
+  /**
+   * @private
+   * @type {ol.Size}
+   */
+  this.canvasSize_ = [container.clientHeight, container.clientWidth];
+
   /**
    * @private
    * @type {CanvasRenderingContext2D}
@@ -100,15 +101,15 @@ ol.renderer.canvas.Map.prototype.renderFrame = function(frameState) {
   }
 
   var size = frameState.size;
-  if (!this.canvasSize_.equals(size)) {
+  if (!ol.size.equals(this.canvasSize_, size)) {
-    this.canvas_.width = size.width;
+    this.canvas_.width = size[0];
-    this.canvas_.height = size.height;
+    this.canvas_.height = size[1];
     this.canvasSize_ = size;
   }
 
   var context = this.context_;
   context.setTransform(1, 0, 0, 1, 0, 0);
-  context.clearRect(0, 0, size.width, size.height);
+  context.clearRect(0, 0, size[0], size[1]);
 
   this.calculateMatrices2D(frameState);
 

src/ol/renderer/canvas/canvastilelayerrenderer.js

@@ -195,8 +195,8 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
   var tileRange = tileGrid.getTileRangeForExtentAndResolution(
       extent, tileResolution);
 
-  var canvasWidth = tileSize.width * tileRange.getWidth();
+  var canvasWidth = tileSize[0] * tileRange.getWidth();
-  var canvasHeight = tileSize.height * tileRange.getHeight();
+  var canvasHeight = tileSize[1] * tileRange.getHeight();
 
   var canvas, context;
   if (goog.isNull(this.canvas_)) {
@@ -209,24 +209,23 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
     canvas.height = canvasHeight;
     context = /** @type {CanvasRenderingContext2D} */ (canvas.getContext('2d'));
     this.canvas_ = canvas;
-    this.canvasSize_ = new ol.Size(canvasWidth, canvasHeight);
+    this.canvasSize_ = [canvasWidth, canvasHeight];
     this.context_ = context;
   } else {
     goog.asserts.assert(!goog.isNull(this.canvasSize_));
     goog.asserts.assert(!goog.isNull(this.context_));
     canvas = this.canvas_;
     context = this.context_;
-    if (this.canvasSize_.width < canvasWidth ||
+    if (this.canvasSize_[0] < canvasWidth ||
-        this.canvasSize_.height < canvasHeight) {
+        this.canvasSize_[1] < canvasHeight) {
       // Canvas is too small, make it bigger
       canvas.width = canvasWidth;
       canvas.height = canvasHeight;
-      this.canvasSize_.width = canvasWidth;
+      this.canvasSize_ = [canvasWidth, canvasHeight];
-      this.canvasSize_.height = canvasHeight;
       this.renderedCanvasTileRange_ = null;
     } else {
-      canvasWidth = this.canvasSize_.width;
+      canvasWidth = this.canvasSize_[0];
-      canvasHeight = this.canvasSize_.height;
+      canvasHeight = this.canvasSize_[1];
       if (z != this.renderedCanvasZ_ ||
           !this.renderedCanvasTileRange_.containsTileRange(tileRange)) {
         this.renderedCanvasTileRange_ = null;
@@ -236,8 +235,8 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
 
   var canvasTileRange, canvasTileRangeWidth, minX, minY;
   if (goog.isNull(this.renderedCanvasTileRange_)) {
-    canvasTileRangeWidth = canvasWidth / tileSize.width;
+    canvasTileRangeWidth = canvasWidth / tileSize[0];
-    var canvasTileRangeHeight = canvasHeight / tileSize.height;
+    var canvasTileRangeHeight = canvasHeight / tileSize[1];
     minX = tileRange.minX -
         Math.floor((canvasTileRangeWidth - tileRange.getWidth()) / 2);
     minY = tileRange.minY -
@@ -304,9 +303,9 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
   var i, ii;
   for (i = 0, ii = tilesToClear.length; i < ii; ++i) {
     tile = tilesToClear[i];
-    x = tileSize.width * (tile.tileCoord.x - canvasTileRange.minX);
+    x = tileSize[0] * (tile.tileCoord.x - canvasTileRange.minX);
-    y = tileSize.height * (canvasTileRange.maxY - tile.tileCoord.y);
+    y = tileSize[1] * (canvasTileRange.maxY - tile.tileCoord.y);
-    context.clearRect(x, y, tileSize.width, tileSize.height);
+    context.clearRect(x, y, tileSize[0], tileSize[1]);
   }
 
   /** @type {Array.<number>} */
@@ -330,13 +329,13 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
             (tile.tileCoord.y - canvasTileRange.minY) * canvasTileRangeWidth +
             (tile.tileCoord.x - canvasTileRange.minX);
         if (this.renderedTiles_[index] != tile) {
-          x = tileSize.width * (tile.tileCoord.x - canvasTileRange.minX);
+          x = tileSize[0] * (tile.tileCoord.x - canvasTileRange.minX);
-          y = tileSize.height * (canvasTileRange.maxY - tile.tileCoord.y);
+          y = tileSize[1] * (canvasTileRange.maxY - tile.tileCoord.y);
           tileState = tile.getState();
           if (tileState == ol.TileState.EMPTY ||
               tileState == ol.TileState.ERROR ||
               !opaque) {
-            context.clearRect(x, y, tileSize.width, tileSize.height);
+            context.clearRect(x, y, tileSize[0], tileSize[1]);
           }
           if (tileState == ol.TileState.LOADED) {
             context.drawImage(tile.getImage(), x, y);
@@ -351,8 +350,8 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
         tileExtent = tileGrid.getTileCoordExtent(tile.tileCoord, tmpExtent);
         x = (tileExtent[0] - origin[0]) / tileResolution;
         y = (origin[1] - tileExtent[3]) / tileResolution;
-        width = scale * tileSize.width;
+        width = scale * tileSize[0];
-        height = scale * tileSize.height;
+        height = scale * tileSize[1];
         tileState = tile.getState();
         if (tileState == ol.TileState.EMPTY || !opaque) {
           context.clearRect(x, y, width, height);
@@ -386,7 +385,7 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
   var transform = this.transform_;
   goog.vec.Mat4.makeIdentity(transform);
   goog.vec.Mat4.translate(transform,
-      frameState.size.width / 2, frameState.size.height / 2, 0);
+      frameState.size[0] / 2, frameState.size[1] / 2, 0);
   goog.vec.Mat4.rotateZ(transform, view2DState.rotation);
   goog.vec.Mat4.scale(
       transform,

src/ol/renderer/canvas/canvasvectorlayerrenderer.js

@@ -7,7 +7,6 @@ goog.require('goog.events.EventType');
 goog.require('goog.object');
 goog.require('goog.vec.Mat4');
 goog.require('ol.Pixel');
-goog.require('ol.Size');
 goog.require('ol.TileCache');
 goog.require('ol.TileCoord');
 goog.require('ol.ViewHint');
@@ -297,7 +296,7 @@ ol.renderer.canvas.VectorLayer.prototype.renderFrame =
     tileGrid = ol.tilegrid.createForProjection(
         view2DState.projection,
         22, // should be no harm in going big here - ideally, it would be ∞
-        new ol.Size(512, 512));
+        [512, 512]);
     this.tileGrid_ = tileGrid;
   }
 
@@ -313,8 +312,8 @@ ol.renderer.canvas.VectorLayer.prototype.renderFrame =
 
   goog.vec.Mat4.makeIdentity(transform);
   goog.vec.Mat4.translate(transform,
-      frameState.size.width / 2,
+      frameState.size[0] / 2,
-      frameState.size.height / 2,
+      frameState.size[1] / 2,
       0);
   goog.vec.Mat4.scale(transform,
       tileResolution / resolution, tileResolution / resolution, 1);
@@ -339,8 +338,8 @@ ol.renderer.canvas.VectorLayer.prototype.renderFrame =
   if (goog.isNull(this.tileArchetype_)) {
     this.tileArchetype_ = /** @type {HTMLCanvasElement} */
         (goog.dom.createElement(goog.dom.TagName.CANVAS));
-    this.tileArchetype_.width = tileSize.width;
+    this.tileArchetype_.width = tileSize[0];
-    this.tileArchetype_.height = tileSize.height;
+    this.tileArchetype_.height = tileSize[1];
   }
 
   /**
@@ -348,14 +347,13 @@ ol.renderer.canvas.VectorLayer.prototype.renderFrame =
    * and will have rendered all newly visible features.
    */
   var sketchCanvas = this.sketchCanvas_;
-  var sketchSize = new ol.Size(
+  var sketchWidth = tileSize[0] * tileRange.getWidth();
-      tileSize.width * tileRange.getWidth(),
+  var sketchHeight = tileSize[1] * tileRange.getHeight();
-      tileSize.height * tileRange.getHeight());
 
   // transform for map coords to sketch canvas pixel coords
   var sketchTransform = this.sketchTransform_;
-  var halfWidth = sketchSize.width / 2;
+  var halfWidth = sketchWidth / 2;
-  var halfHeight = sketchSize.height / 2;
+  var halfHeight = sketchHeight / 2;
   goog.vec.Mat4.makeIdentity(sketchTransform);
   goog.vec.Mat4.translate(sketchTransform,
       halfWidth,
@@ -371,16 +369,16 @@ ol.renderer.canvas.VectorLayer.prototype.renderFrame =
       0);
 
   // clear/resize sketch canvas
-  sketchCanvas.width = sketchSize.width;
+  sketchCanvas.width = sketchWidth;
-  sketchCanvas.height = sketchSize.height;
+  sketchCanvas.height = sketchHeight;
 
   var sketchCanvasRenderer = new ol.renderer.canvas.VectorRenderer(
       sketchCanvas, sketchTransform, undefined, this.requestMapRenderFrame_);
 
   // clear/resize final canvas
   var finalCanvas = this.canvas_;
-  finalCanvas.width = sketchSize.width;
+  finalCanvas.width = sketchWidth;
-  finalCanvas.height = sketchSize.height;
+  finalCanvas.height = sketchHeight;
   var finalContext = this.context_;
 
   var featuresToRender = {};
@@ -456,13 +454,13 @@ ol.renderer.canvas.VectorLayer.prototype.renderFrame =
       tile = /** @type {HTMLCanvasElement} */
           (this.tileArchetype_.cloneNode(false));
       tile.getContext('2d').drawImage(sketchCanvas,
-          (tileRange.minX - tileCoord.x) * tileSize.width,
+          (tileRange.minX - tileCoord.x) * tileSize[0],
-          (tileCoord.y - tileRange.maxY) * tileSize.height);
+          (tileCoord.y - tileRange.maxY) * tileSize[1]);
       this.tileCache_.set(key, [tile, symbolSizes, maxSymbolSize]);
     }
     finalContext.drawImage(tile,
-        tileSize.width * (tileCoord.x - tileRange.minX),
+        tileSize[0] * (tileCoord.x - tileRange.minX),
-        tileSize.height * (tileRange.maxY - tileCoord.y));
+        tileSize[1] * (tileRange.maxY - tileCoord.y));
   }
 
   this.renderedResolution_ = tileResolution;

src/ol/renderer/dom/domimagelayerrenderer.js

@@ -90,7 +90,7 @@ ol.renderer.dom.ImageLayer.prototype.renderFrame =
     var transform = goog.vec.Mat4.createNumber();
     goog.vec.Mat4.makeIdentity(transform);
     goog.vec.Mat4.translate(transform,
-        frameState.size.width / 2, frameState.size.height / 2, 0);
+        frameState.size[0] / 2, frameState.size[1] / 2, 0);
     goog.vec.Mat4.rotateZ(transform, viewRotation);
     goog.vec.Mat4.scale(
         transform,

src/ol/renderer/dom/domtilelayerrenderer.js

@@ -191,7 +191,7 @@ ol.renderer.dom.TileLayer.prototype.renderFrame =
     origin = tileLayerZ.getOrigin();
     goog.vec.Mat4.makeIdentity(transform);
     goog.vec.Mat4.translate(
-        transform, frameState.size.width / 2, frameState.size.height / 2, 0);
+        transform, frameState.size[0] / 2, frameState.size[1] / 2, 0);
     goog.vec.Mat4.rotateZ(transform, view2DState.rotation);
     goog.vec.Mat4.scale(transform, resolution / view2DState.resolution,
         resolution / view2DState.resolution, 1);
@@ -319,9 +319,9 @@ ol.renderer.dom.TileLayerZ_.prototype.addTile = function(tile) {
   style.maxWidth = 'none';
   style.position = 'absolute';
   style.left =
-      ((tileCoord.x - this.tileCoordOrigin_.x) * tileSize.width) + 'px';
+      ((tileCoord.x - this.tileCoordOrigin_.x) * tileSize[0]) + 'px';
   style.top =
-      ((this.tileCoordOrigin_.y - tileCoord.y) * tileSize.height) + 'px';
+      ((this.tileCoordOrigin_.y - tileCoord.y) * tileSize[1]) + 'px';
   if (goog.isNull(this.documentFragment_)) {
     this.documentFragment_ = document.createDocumentFragment();
   }

src/ol/renderer/layerrenderer.js

@@ -290,8 +290,8 @@ ol.renderer.Layer.prototype.createGetTileIfLoadedFunction =
 ol.renderer.Layer.prototype.snapCenterToPixel =
     function(center, resolution, size) {
   return [
-    resolution * (Math.round(center[0] / resolution) + (size.width % 2) / 2),
+    resolution * (Math.round(center[0] / resolution) + (size[0] % 2) / 2),
-    resolution * (Math.round(center[1] / resolution) + (size.height % 2) / 2)
+    resolution * (Math.round(center[1] / resolution) + (size[1] % 2) / 2)
   ];
 };
 

src/ol/renderer/maprenderer.js

@@ -49,8 +49,8 @@ ol.renderer.Map.prototype.calculateMatrices2D = function(frameState) {
 
   goog.vec.Mat4.makeIdentity(coordinateToPixelMatrix);
   goog.vec.Mat4.translate(coordinateToPixelMatrix,
-      frameState.size.width / 2,
+      frameState.size[0] / 2,
-      frameState.size.height / 2,
+      frameState.size[1] / 2,
       0);
   goog.vec.Mat4.scale(coordinateToPixelMatrix,
       1 / view2DState.resolution,

src/ol/renderer/webgl/webglmaprenderer.js

@@ -23,6 +23,7 @@ goog.require('ol.renderer.webgl.ImageLayer');
 goog.require('ol.renderer.webgl.TileLayer');
 goog.require('ol.renderer.webgl.map.shader.Color');
 goog.require('ol.renderer.webgl.map.shader.Default');
+goog.require('ol.size');
 goog.require('ol.structs.Buffer');
 goog.require('ol.structs.IntegerSet');
 goog.require('ol.structs.LRUCache');
@@ -83,7 +84,7 @@ ol.renderer.webgl.Map = function(container, map) {
    * @private
    * @type {ol.Size}
    */
-  this.canvasSize_ = new ol.Size(container.clientHeight, container.clientWidth);
+  this.canvasSize_ = [container.clientHeight, container.clientWidth];
 
   /**
    * @private
@@ -556,9 +557,9 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
   }
 
   var size = frameState.size;
-  if (!this.canvasSize_.equals(size)) {
+  if (!ol.size.equals(this.canvasSize_, size)) {
-    this.canvas_.width = size.width;
+    this.canvas_.width = size[0];
-    this.canvas_.height = size.height;
+    this.canvas_.height = size[1];
     this.canvasSize_ = size;
   }
 
@@ -567,7 +568,7 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
   gl.clearColor(0, 0, 0, 0);
   gl.clear(goog.webgl.COLOR_BUFFER_BIT);
   gl.enable(goog.webgl.BLEND);
-  gl.viewport(0, 0, size.width, size.height);
+  gl.viewport(0, 0, size[0], size[1]);
 
   this.bindBuffer(goog.webgl.ARRAY_BUFFER, this.arrayBuffer_);
 

src/ol/renderer/webgl/webgltilelayerrenderer.js

@@ -146,13 +146,13 @@ ol.renderer.webgl.TileLayer.prototype.renderFrame =
     var tileSize = tileGrid.getTileSize(z);
 
     var maxDimension = Math.max(
-        tileRangeSize.width * tileSize.width,
+        tileRangeSize[0] * tileSize[0],
-        tileRangeSize.height * tileSize.height);
+        tileRangeSize[1] * tileSize[1]);
     var framebufferDimension = ol.math.roundUpToPowerOfTwo(maxDimension);
     var framebufferExtentDimension = tileResolution * framebufferDimension;
     var origin = tileGrid.getOrigin(z);
-    var minX = origin[0] + tileRange.minX * tileSize.width * tileResolution;
+    var minX = origin[0] + tileRange.minX * tileSize[0] * tileResolution;
-    var minY = origin[1] + tileRange.minY * tileSize.height * tileResolution;
+    var minY = origin[1] + tileRange.minY * tileSize[1] * tileResolution;
     framebufferExtent = [
       minX, minX + framebufferExtentDimension,
       minY, minY + framebufferExtentDimension
@@ -292,9 +292,9 @@ ol.renderer.webgl.TileLayer.prototype.renderFrame =
       0);
   goog.vec.Mat4.rotateZ(texCoordMatrix, view2DState.rotation);
   goog.vec.Mat4.scale(texCoordMatrix,
-      frameState.size.width * view2DState.resolution /
+      frameState.size[0] * view2DState.resolution /
           (framebufferExtent[1] - framebufferExtent[0]),
-      frameState.size.height * view2DState.resolution /
+      frameState.size[1] * view2DState.resolution /
           (framebufferExtent[3] - framebufferExtent[2]),
       1);
   goog.vec.Mat4.translate(texCoordMatrix,

src/ol/size.js

@@ -1,25 +1,20 @@
 goog.provide('ol.Size');
-
+goog.provide('ol.size');
-goog.require('goog.math.Size');
-
 
 
 /**
- * @constructor
+ * An array representing a size: [width, height].
- * @extends {goog.math.Size}
+ * @typedef {Array.<number>} ol.Size
- * @param {number} width Width.
- * @param {number} height Height.
  */
-ol.Size = function(width, height) {
+ol.Size;
-  goog.base(this, width, height);
-};
-goog.inherits(ol.Size, goog.math.Size);
 
 
 /**
- * @param {ol.Size} size Size.
+ * Compares sizes for equality.
+ * @param {ol.Size} a Size.
+ * @param {ol.Size} b Size.
  * @return {boolean} Equals.
  */
-ol.Size.prototype.equals = function(size) {
+ol.size.equals = function(a, b) {
-  return this.width == size.width && this.height == size.height;
+  return a[0] == b[0] && a[1] == b[1];
 };

src/ol/source/bingmapssource.js

@@ -5,7 +5,6 @@ goog.require('goog.array');
 goog.require('goog.asserts');
 goog.require('goog.net.Jsonp');
 goog.require('ol.Attribution');
-goog.require('ol.Size');
 goog.require('ol.TileRange');
 goog.require('ol.TileUrlFunction');
 goog.require('ol.extent');
@@ -70,11 +69,10 @@ ol.source.BingMaps.prototype.handleImageryMetadataResponse =
   goog.asserts.assert(resourceSet.resources.length == 1);
   var resource = resourceSet.resources[0];
 
-  var tileSize = new ol.Size(resource.imageWidth, resource.imageHeight);
   var tileGrid = new ol.tilegrid.XYZ({
     minZoom: resource.zoomMin,
     maxZoom: resource.zoomMax,
-    tileSize: tileSize
+    tileSize: [resource.imageWidth, resource.imageHeight]
   });
   this.tileGrid = tileGrid;
 

src/ol/source/debugtilesource.js

@@ -58,20 +58,20 @@ ol.DebugTile_.prototype.getImage = function(opt_context) {
 
     var canvas = /** @type {HTMLCanvasElement} */
         (goog.dom.createElement(goog.dom.TagName.CANVAS));
-    canvas.width = tileSize.width;
+    canvas.width = tileSize[0];
-    canvas.height = tileSize.height;
+    canvas.height = tileSize[1];
 
     var context = canvas.getContext('2d');
 
     context.strokeStyle = 'black';
-    context.strokeRect(0.5, 0.5, tileSize.width + 0.5, tileSize.height + 0.5);
+    context.strokeRect(0.5, 0.5, tileSize[0] + 0.5, tileSize[1] + 0.5);
 
     context.fillStyle = 'black';
     context.textAlign = 'center';
     context.textBaseline = 'middle';
     context.font = '24px sans-serif';
     context.fillText(
-        this.tileCoord_.toString(), tileSize.width / 2, tileSize.height / 2);
+        this.tileCoord_.toString(), tileSize[0] / 2, tileSize[1] / 2);
 
     this.canvasByContext_[key] = canvas;
     return canvas;

src/ol/source/singleimagewmssource.js

@@ -2,7 +2,6 @@ goog.provide('ol.source.SingleImageWMS');
 
 goog.require('ol.Image');
 goog.require('ol.ImageUrlFunction');
-goog.require('ol.Size');
 goog.require('ol.extent');
 goog.require('ol.source.ImageSource');
 goog.require('ol.source.wms');
@@ -64,7 +63,7 @@ ol.source.SingleImageWMS.prototype.getImage =
   ol.extent.scaleFromCenter(extent, this.ratio_);
   var width = (extent[1] - extent[0]) / resolution;
   var height = (extent[3] - extent[2]) / resolution;
-  var size = new ol.Size(width, height);
+  var size = [width, height];
 
   this.image_ = this.createImage(extent, resolution, size, projection);
   return this.image_;

src/ol/source/staticimagesource.js

@@ -20,7 +20,7 @@ ol.source.StaticImage = function(options) {
 
   var imageExtent = options.imageExtent;
   var imageSize = options.imageSize;
-  var imageResolution = (imageExtent[3] - imageExtent[2]) / imageSize.height;
+  var imageResolution = (imageExtent[3] - imageExtent[2]) / imageSize[1];
   var projection = ol.proj.get(options.projection);
 
   goog.base(this, {

src/ol/source/wmssource.js

@@ -20,8 +20,8 @@ ol.source.wms.getUrl =
     'REQUEST': 'GetMap',
     'FORMAT': 'image/png',
     'TRANSPARENT': true,
-    'WIDTH': Math.round(size.width),
+    'WIDTH': Math.round(size[0]),
-    'HEIGHT': Math.round(size.height)
+    'HEIGHT': Math.round(size[1])
   };
   goog.object.extend(baseParams, params);
 

src/ol/tilegrid/tilegrid.js

@@ -87,7 +87,7 @@ ol.tilegrid.TileGrid = function(options) {
   this.tileSize_ = goog.isDef(options.tileSize) ?
       options.tileSize :
       goog.isNull(this.tileSizes_) ?
-          new ol.Size(ol.DEFAULT_TILE_SIZE, ol.DEFAULT_TILE_SIZE) : null;
+          [ol.DEFAULT_TILE_SIZE, ol.DEFAULT_TILE_SIZE] : null;
   goog.asserts.assert(
       (goog.isNull(this.tileSize_) && !goog.isNull(this.tileSizes_)) ||
       (!goog.isNull(this.tileSize_) && goog.isNull(this.tileSizes_)));
@@ -213,10 +213,10 @@ ol.tilegrid.TileGrid.prototype.getTileRangeExtent =
   var origin = this.getOrigin(z);
   var resolution = this.getResolution(z);
   var tileSize = this.getTileSize(z);
-  var minX = origin[0] + tileRange.minX * tileSize.width * resolution;
+  var minX = origin[0] + tileRange.minX * tileSize[0] * resolution;
-  var maxX = origin[0] + (tileRange.maxX + 1) * tileSize.width * resolution;
+  var maxX = origin[0] + (tileRange.maxX + 1) * tileSize[0] * resolution;
-  var minY = origin[1] + tileRange.minY * tileSize.height * resolution;
+  var minY = origin[1] + tileRange.minY * tileSize[1] * resolution;
-  var maxY = origin[1] + (tileRange.maxY + 1) * tileSize.height * resolution;
+  var maxY = origin[1] + (tileRange.maxY + 1) * tileSize[1] * resolution;
   return ol.extent.createOrUpdate(minX, maxX, minY, maxY, opt_extent);
 };
 
@@ -264,8 +264,8 @@ ol.tilegrid.TileGrid.prototype.getTileCoordCenter = function(tileCoord) {
   var resolution = this.getResolution(tileCoord.z);
   var tileSize = this.getTileSize(tileCoord.z);
   return [
-    origin[0] + (tileCoord.x + 0.5) * tileSize.width * resolution,
+    origin[0] + (tileCoord.x + 0.5) * tileSize[0] * resolution,
-    origin[1] + (tileCoord.y + 0.5) * tileSize.height * resolution
+    origin[1] + (tileCoord.y + 0.5) * tileSize[1] * resolution
   ];
 };
 
@@ -280,10 +280,10 @@ ol.tilegrid.TileGrid.prototype.getTileCoordExtent =
   var origin = this.getOrigin(tileCoord.z);
   var resolution = this.getResolution(tileCoord.z);
   var tileSize = this.getTileSize(tileCoord.z);
-  var minX = origin[0] + tileCoord.x * tileSize.width * resolution;
+  var minX = origin[0] + tileCoord.x * tileSize[0] * resolution;
-  var maxX = minX + tileSize.width * resolution;
+  var maxX = minX + tileSize[0] * resolution;
-  var minY = origin[1] + tileCoord.y * tileSize.height * resolution;
+  var minY = origin[1] + tileCoord.y * tileSize[1] * resolution;
-  var maxY = minY + tileSize.height * resolution;
+  var maxY = minY + tileSize[1] * resolution;
   return ol.extent.createOrUpdate(minX, maxX, minY, maxY, opt_extent);
 };
 
@@ -323,8 +323,8 @@ ol.tilegrid.TileGrid.prototype.getTileCoordForXYAndResolution_ = function(
   var origin = this.getOrigin(z);
   var tileSize = this.getTileSize(z);
 
-  var tileCoordX = scale * (x - origin[0]) / (resolution * tileSize.width);
+  var tileCoordX = scale * (x - origin[0]) / (resolution * tileSize[0]);
-  var tileCoordY = scale * (y - origin[1]) / (resolution * tileSize.height);
+  var tileCoordY = scale * (y - origin[1]) / (resolution * tileSize[1]);
 
   if (reverseIntersectionPolicy) {
     tileCoordX = Math.ceil(tileCoordX) - 1;
@@ -416,10 +416,10 @@ ol.tilegrid.createForProjection =
   var maxZoom = goog.isDef(opt_maxZoom) ?
       opt_maxZoom : ol.DEFAULT_MAX_ZOOM;
   var tileSize = goog.isDef(opt_tileSize) ?
-      opt_tileSize : new ol.Size(ol.DEFAULT_TILE_SIZE, ol.DEFAULT_TILE_SIZE);
+      opt_tileSize : [ol.DEFAULT_TILE_SIZE, ol.DEFAULT_TILE_SIZE];
   var resolutions = new Array(maxZoom + 1);
-  goog.asserts.assert(tileSize.width == tileSize.height);
+  goog.asserts.assert(tileSize[0] == tileSize[1]);
-  size = size / tileSize.width;
+  size = size / tileSize[0];
   for (var z = 0, zz = resolutions.length; z < zz; ++z) {
     resolutions[z] = size / Math.pow(2, z);
   }

src/ol/tilegrid/wmtstilegrid.js

@@ -2,7 +2,6 @@ goog.provide('ol.tilegrid.WMTS');
 
 goog.require('goog.array');
 goog.require('goog.asserts');
-goog.require('ol.Size');
 goog.require('ol.proj');
 goog.require('ol.tilegrid.TileGrid');
 
@@ -73,7 +72,7 @@ ol.tilegrid.WMTS.createFromCapabilitiesMatrixSet =
     matrixIds.push(elt['identifier']);
     origins.push(elt['topLeftCorner']);
     resolutions.push(elt['scaleDenominator'] * 0.28E-3 / metersPerUnit);
-    tileSizes.push(new ol.Size(elt['tileWidth'], elt['tileHeight']));
+    tileSizes.push([elt['tileWidth'], elt['tileHeight']]);
   });
 
   return new ol.tilegrid.WMTS({

src/ol/tilegrid/xyztilegrid.js

@@ -1,7 +1,6 @@
 goog.provide('ol.tilegrid.XYZ');
 
 goog.require('goog.math');
-goog.require('ol.Size');
 goog.require('ol.TileCoord');
 goog.require('ol.TileRange');
 goog.require('ol.proj');
@@ -28,7 +27,7 @@ ol.tilegrid.XYZ = function(options) {
     minZoom: options.minZoom,
     origin: [-ol.proj.EPSG3857.HALF_SIZE, ol.proj.EPSG3857.HALF_SIZE],
     resolutions: resolutions,
-    tileSize: new ol.Size(ol.DEFAULT_TILE_SIZE, ol.DEFAULT_TILE_SIZE)
+    tileSize: [ol.DEFAULT_TILE_SIZE, ol.DEFAULT_TILE_SIZE]
   });
 
 };

src/ol/tilerange.js

@@ -144,7 +144,7 @@ ol.TileRange.prototype.getHeight = function() {
  * @return {ol.Size} Size.
  */
 ol.TileRange.prototype.getSize = function() {
-  return new ol.Size(this.getWidth(), this.getHeight());
+  return [this.getWidth(), this.getHeight()];
 };
 
 

src/ol/view2d.js

@@ -175,10 +175,10 @@ ol.View2D.prototype.calculateExtent = function(size) {
   goog.asserts.assert(this.isDef());
   var center = this.getCenter();
   var resolution = this.getResolution();
-  var minX = center[0] - resolution * size.width / 2;
+  var minX = center[0] - resolution * size[0] / 2;
-  var maxX = center[0] + resolution * size.width / 2;
+  var maxX = center[0] + resolution * size[0] / 2;
-  var minY = center[1] - resolution * size.height / 2;
+  var minY = center[1] - resolution * size[1] / 2;
-  var maxY = center[1] + resolution * size.height / 2;
+  var maxY = center[1] + resolution * size[1] / 2;
   return [minX, maxX, minY, maxY];
 };
 
@@ -215,8 +215,8 @@ goog.exportProperty(
  * @return {number} Resolution.
  */
 ol.View2D.prototype.getResolutionForExtent = function(extent, size) {
-  var xResolution = (extent[1] - extent[0]) / size.width;
+  var xResolution = (extent[1] - extent[0]) / size[0];
-  var yResolution = (extent[3] - extent[2]) / size.height;
+  var yResolution = (extent[3] - extent[2]) / size[1];
   return Math.max(xResolution, yResolution);
 };
 

test/spec/ol/extent.test.js

@@ -56,7 +56,7 @@ describe('ol.extent', function() {
 
     it('works for a unit square', function() {
       var extent = ol.extent.getForView2DAndSize(
-          [0, 0], 1, 0, new ol.Size(1, 1));
+          [0, 0], 1, 0, [1, 1]);
       expect(extent[0]).to.be(-0.5);
       expect(extent[1]).to.be(0.5);
       expect(extent[2]).to.be(-0.5);
@@ -65,7 +65,7 @@ describe('ol.extent', function() {
 
     it('works for center', function() {
       var extent = ol.extent.getForView2DAndSize(
-          [5, 10], 1, 0, new ol.Size(1, 1));
+          [5, 10], 1, 0, [1, 1]);
       expect(extent[0]).to.be(4.5);
       expect(extent[1]).to.be(5.5);
       expect(extent[2]).to.be(9.5);
@@ -74,7 +74,7 @@ describe('ol.extent', function() {
 
     it('works for rotation', function() {
       var extent = ol.extent.getForView2DAndSize(
-          [0, 0], 1, Math.PI / 4, new ol.Size(1, 1));
+          [0, 0], 1, Math.PI / 4, [1, 1]);
       expect(extent[0]).to.roughlyEqual(-Math.sqrt(0.5), 1e-9);
       expect(extent[1]).to.roughlyEqual(Math.sqrt(0.5), 1e-9);
       expect(extent[2]).to.roughlyEqual(-Math.sqrt(0.5), 1e-9);
@@ -83,7 +83,7 @@ describe('ol.extent', function() {
 
     it('works for resolution', function() {
       var extent = ol.extent.getForView2DAndSize(
-          [0, 0], 2, 0, new ol.Size(1, 1));
+          [0, 0], 2, 0, [1, 1]);
       expect(extent[0]).to.be(-1);
       expect(extent[1]).to.be(1);
       expect(extent[2]).to.be(-1);
@@ -92,7 +92,7 @@ describe('ol.extent', function() {
 
     it('works for size', function() {
       var extent = ol.extent.getForView2DAndSize(
-          [0, 0], 1, 0, new ol.Size(10, 5));
+          [0, 0], 1, 0, [10, 5]);
       expect(extent[0]).to.be(-5);
       expect(extent[1]).to.be(5);
       expect(extent[2]).to.be(-2.5);
@@ -105,8 +105,7 @@ describe('ol.extent', function() {
     it('returns the expected size', function() {
       var extent = [0, 2, 1, 4];
       var size = ol.extent.getSize(extent);
-      expect(size.width).to.eql(2);
+      expect(size).to.eql([2, 3]);
-      expect(size.height).to.eql(3);
     });
   });
 
@@ -238,6 +237,5 @@ describe('ol.extent', function() {
 });
 
 
-goog.require('ol.Size');
 goog.require('ol.extent');
 goog.require('ol.proj');

test/spec/ol/source/tilesource.test.js

@@ -197,7 +197,7 @@ ol.test.source.MockTileSource = function(loaded) {
     resolutions: [360 / 256, 180 / 256, 90 / 256, 45 / 256],
     extent: extent,
     origin: [-180, -180],
-    tileSize: new ol.Size(256, 256)
+    tileSize: [256, 256]
   });
 
   goog.base(this, {
@@ -265,7 +265,6 @@ describe('ol.test.source.MockTileSource', function() {
 });
 
 goog.require('goog.object');
-goog.require('ol.Size');
 goog.require('ol.Tile');
 goog.require('ol.TileCoord');
 goog.require('ol.TileState');

test/spec/ol/source/wmssource.test.js

@@ -11,7 +11,7 @@ describe('ol.source.wms', function() {
           'foo=bar&STYLES=&CRS=EPSG%3A3857&BBOX=' +
           '-20037508.342789244%2C-20037508.342789244%2C0%2C0';
       var url = ol.source.wms.getUrl('http://wms', {'foo': 'bar'},
-          extent, new ol.Size(256, 256), epsg3857);
+          extent, [256, 256], epsg3857);
       expect(url).to.eql(expected);
     });
     it('creates expected URL respecting axis orientation', function() {
@@ -21,7 +21,7 @@ describe('ol.source.wms', function() {
           'GetMap&FORMAT=image%2Fpng&TRANSPARENT=true&WIDTH=256&HEIGHT=256&' +
           'foo=bar&STYLES=&CRS=EPSG%3A4326&BBOX=-90%2C-180%2C90%2C0';
       var url = ol.source.wms.getUrl('http://wms', {'foo': 'bar'},
-          extent, new ol.Size(256, 256), epsg4326);
+          extent, [256, 256], epsg4326);
       expect(url).to.eql(expected);
     });
   });
@@ -29,6 +29,5 @@ describe('ol.source.wms', function() {
 });
 
 
-goog.require('ol.Size');
 goog.require('ol.proj');
 goog.require('ol.source.wms');

test/spec/ol/tilegrid/tilegrid.test.js

@@ -12,7 +12,7 @@ describe('ol.tilegrid.TileGrid', function() {
     extent = [0, 100000, 0, 100000];
     origin = [0, 0];
     origins = [];
-    tileSize = new ol.Size(100, 100);
+    tileSize = [100, 100];
   });
 
   describe('create valid', function() {
@@ -201,7 +201,7 @@ describe('ol.tilegrid.TileGrid', function() {
 
       var resolutions = grid.getResolutions();
       expect(resolutions.length).to.be(ol.DEFAULT_MAX_ZOOM + 1);
-      expect(grid.getTileSize().toString()).to.be('(256 x 256)');
+      expect(grid.getTileSize()).to.eql([256, 256]);
     });
 
     it('stores the default tile grid on a projection', function() {
@@ -285,7 +285,7 @@ describe('ol.tilegrid.TileGrid', function() {
 
   describe('getTileCoordForCoordAndResolution', function() {
     it('returns the expected TileCoord', function() {
-      var tileSize = new ol.Size(256, 256);
+      var tileSize = [256, 256];
       var tileGrid = new ol.tilegrid.TileGrid({
         resolutions: [10],
         extent: extent,
@@ -633,7 +633,6 @@ describe('ol.tilegrid.TileGrid', function() {
 });
 
 goog.require('ol.Coordinate');
-goog.require('ol.Size');
 goog.require('ol.TileCoord');
 goog.require('ol.proj');
 goog.require('ol.tilegrid.TileGrid');

test/spec/ol/tilerange.test.js

@@ -102,8 +102,7 @@ describe('ol.TileRange', function() {
     it('returns the expected size', function() {
       var tileRange = new ol.TileRange(0, 2, 1, 4);
       var size = tileRange.getSize();
-      expect(size.width).to.eql(3);
+      expect(size).to.eql([3, 4]);
-      expect(size.height).to.eql(4);
     });
   });
 

test/spec/ol/tileurlfunction.test.js

@@ -91,14 +91,13 @@ describe('ol.TileUrlFunction', function() {
       expect(args[0]).to.eql('url');
       expect(args[1]).to.be(params);
       expect(args[2]).to.eql(projection.getExtent());
-      expect(args[3]).to.eql(new ol.Size(256, 256));
+      expect(args[3]).to.eql([256, 256]);
       expect(args[4]).to.eql(projection);
     });
   });
 
 });
 
-goog.require('ol.Size');
 goog.require('ol.TileCoord');
 goog.require('ol.TileUrlFunction');
 goog.require('ol.proj');