[ol.Tile] add ol.Tile.createConstructor and set width and height to the img archetype

src/ol/Tile.js

@@ -41,7 +41,7 @@ ol.Tile = function(url, bounds) {
      * @private
      * @type {HTMLImageElement}
      */
-    this.img_ = ol.Tile.createImage();
+    this.img_ = this.createImage();
     goog.events.listenOnce(this.img_, goog.events.EventType.LOAD,
                            this.handleImageLoad, false, this);
     goog.events.listenOnce(this.img_, goog.events.EventType.ERROR,
@@ -54,6 +54,14 @@ ol.Tile = function(url, bounds) {
     this.events_ = new ol.event.Events(this);
 };
 
+/**
+ * @protected
+ * @return {HTMLImageElement}
+ */
+ol.Tile.prototype.createImage = function() {
+    // overriden by subclasses
+};
+
 /**
  * Load the tile. A tile should loaded only once.
  */
@@ -131,3 +139,32 @@ ol.Tile.createImage = (function() {
         return img.cloneNode(false);
     };
 })();
+
+/**
+ * Create a tile constructor, for specific width and height values
+ * for the tiles.
+ * @param {number} width
+ * @param {number} height
+ * @return {function(new:ol.Tile, string, ol.Bounds)}
+ */
+ol.Tile.createConstructor = function(width, height) {
+    /**
+     * @constructor
+     * @extends {ol.Tile}
+     */
+    var Tile = function(url, bounds) {
+        goog.base(this, url, bounds);
+    };
+    goog.inherits(Tile, ol.Tile);
+    /** @inheritDoc */
+    Tile.prototype.createImage = (function() {
+        var img = document.createElement("img");
+        img.className = "olTile";
+        img.style.width = width + "px";
+        img.style.height = height + "px";
+        return function() {
+            return img.cloneNode(false);
+        };
+    })();
+    return Tile;
+};

src/ol/layer/TileLayer.js

@@ -1,6 +1,7 @@
 goog.provide('ol.layer.TileLayer');
 
 goog.require('ol.layer.Layer');
+goog.require('ol.Tile');
 goog.require('ol.TileCache');
 
 /**
@@ -33,6 +34,12 @@ ol.layer.TileLayer = function() {
      */
     this.tileHeight_ = 256;
 
+    /**
+     * @protected
+     * @type {function(new:ol.Tile, string, ol.Bounds)}
+     */
+    this.Tile = ol.Tile.createConstructor(this.tileWidth_, this.tileHeight_);
+
     /**
      * @protected
      * @type {number|undefined}
@@ -231,7 +238,7 @@ ol.layer.TileLayer.prototype.setResolutions = function(resolutions) {
 ol.layer.TileLayer.prototype.getTile = function(url, bounds) {
     var tile = this.cache_.get(url);
     if (!goog.isDef(tile)) {
-        tile = new ol.Tile(url, bounds);
+        tile = new this.Tile(url, bounds);
         this.cache_.set(tile.getUrl(), tile);
     }
     return tile;