[ol.layer.WMS] add a basic tiled WMS layer implementation

src/ol.js

@@ -24,5 +24,6 @@ goog.require("ol.geom.linestring");
 goog.require("ol.geom.collection");
 goog.require('ol.layer.XYZ');
 goog.require('ol.layer.OSM');
+goog.require('ol.layer.WMS');
 goog.require('ol.renderer.TileLayerRenderer');
 goog.require('ol.renderer.WebGL');

src/ol/layer/WMS.js

@@ -0,0 +1,74 @@
+goog.provide('ol.layer.WMS');
+
+goog.require('goog.Uri');
+goog.require('ol.layer.TileLayer');
+
+/**
+ * Class for WMS layers.
+ *
+ * @export
+ * @constructor
+ * @extends {ol.layer.TileLayer}
+ * @param {string} url The WMS URL.
+ * @param {Array.<string>} layers List of layers.
+ * @param {string|undefined} format Image format (e.g. "image/jpeg")
+ */
+ol.layer.WMS = function(url, layers, format) {
+    goog.base(this);
+    this.setUrl(url);
+
+    /**
+     * @private
+     * @type {Array.<string>}
+     */
+    this.layers_ = layers;
+
+    /**
+     * @private
+     * @type {string|undefined}
+     */
+    this.format_ = format;
+};
+
+goog.inherits(ol.layer.WMS, ol.layer.TileLayer);
+
+/**
+ * @const
+ * @type {Object}
+ */
+ol.layer.WMS.prototype.DEFAULT_PARAMS = {
+    "SERVICE": "WMS",
+    "VERSION": "1.1.1",
+    "REQUEST": "GetMap",
+    "STYLES": "",
+    "FORMAT": "image/png"
+};
+
+/**
+ * @inheritDoc
+ */
+ol.layer.WMS.prototype.getTileUrl = function(x, y, z) {
+    var tileOrigin = this.getTileOrigin(),
+        tileOriginX = tileOrigin[0],
+        tileOriginY = tileOrigin[1];
+    var resolution = this.getResolutions()[z];
+    var tileWidth = this.tileWidth_ * resolution,
+        tileHeight = this.tileHeight_ * resolution;
+    var minX = tileOriginX + (x * tileWidth),
+        maxY = tileOriginY - (y * tileHeight),
+        maxX = minX + tileWidth,
+        minY = maxY - tileHeight;
+
+    var qd = new goog.Uri.QueryData();
+    qd.extend(this.DEFAULT_PARAMS);
+    qd.set('WIDTH', this.tileWidth_);
+    qd.set('HEIGHT', this.tileHeight_);
+    qd.set('BBOX', [minX, minY, maxX, maxY].join(','));
+    qd.set('LAYERS', [this.layers_].join(','));
+    // FIXME this requires a projection in the layer, which should
+    // not be required
+    qd.set('SRS', this.projection_.getCode());
+    var uri = new goog.Uri(this.getUrl());
+    uri.setQueryData(qd);
+    return uri.toString();
+};

test/ol.html

@@ -87,6 +87,7 @@
   <script type="text/javascript" src="spec/ol/geom/Collection.test.js"></script>
   <script type="text/javascript" src="spec/ol/layer/TileLayer.test.js"></script>
   <script type="text/javascript" src="spec/ol/layer/XYZ.test.js"></script>
+  <script type="text/javascript" src="spec/ol/layer/WMS.test.js"></script>
   <script type="text/javascript" src="spec/ol/Feature.test.js"></script>
   <script type="text/javascript" src="spec/ol/renderer/WebGL.test.js"></script>
   <script type="text/javascript" src="spec/ol/renderer/TileLayerRenderer.test.js"></script>

test/spec/ol/layer/WMS.test.js

@@ -0,0 +1,27 @@
+describe('ol.layer.WMS', function() {
+
+    describe('create a wms layer', function() {
+
+        it('returns an ol.layer.WMS instance', function() {
+            var layer = new ol.layer.WMS();
+            expect(layer instanceof ol.layer.WMS).toBe(true);
+        });
+
+    });
+
+    describe('get tile url', function() {
+        var layer;
+        beforeEach(function() {
+            layer = new ol.layer.WMS('/wms', ['layer1', 'layer2']);
+            layer.setResolutions([1, 0.5, 0.25]);
+            layer.setTileOrigin(-128, 128);
+            layer.setExtent(new ol.Bounds(-128, -128, 128, 128));
+            layer.setProjection(new ol.Projection('EPSG:900913'));
+        });
+        it('returns a WMS GetMap URL', function() {
+            var url = layer.getTileUrl(1, 2, 2);
+            expect(url).toEqual('/wms?SERVICE=WMS&VERSION=1.1.1&REQUEST=GetMap&STYLES&FORMAT=image%2Fpng&WIDTH=256&HEIGHT=256&BBOX=-64%2C-64%2C0%2C0&LAYERS=layer1%2Clayer2&SRS=EPSG%3A900913');
+        });
+    });
+
+});