diff --git a/src/ol/style/circle.js b/src/ol/style/circle.js index 072472ffbd..885acfb4ac 100644 --- a/src/ol/style/circle.js +++ b/src/ol/style/circle.js @@ -89,7 +89,13 @@ ol.style.Circle = function(opt_options) { */ this.hitDetectionImageSize_ = null; - this.render_(options.atlasManager); + /** + * @private + * @type {ol.style.AtlasManager|undefined} + */ + this.atlasManager_ = options.atlasManager; + + this.render_(this.atlasManager_); /** * @type {boolean} @@ -109,6 +115,25 @@ ol.style.Circle = function(opt_options) { ol.inherits(ol.style.Circle, ol.style.Image); +/** + * Clones the style. If an atlasmanger was provided to the original style it will be used in the cloned style, too. + * @return {ol.style.Image} The cloned style. + * @api + */ +ol.style.Circle.prototype.clone = function() { + var style = new ol.style.Circle({ + fill: this.getFill() ? this.getFill().clone() : undefined, + stroke: this.getStroke() ? this.getStroke().clone() : undefined, + radius: this.getRadius(), + snapToPixel: this.getSnapToPixel(), + atlasManager: this.atlasManager_ + }); + style.setOpacity(this.getOpacity()); + style.setScale(this.getScale()); + return style; +}; + + /** * @inheritDoc */ diff --git a/src/ol/style/fill.js b/src/ol/style/fill.js index 5b503bc023..44e948d897 100644 --- a/src/ol/style/fill.js +++ b/src/ol/style/fill.js @@ -30,6 +30,19 @@ ol.style.Fill = function(opt_options) { }; +/** + * Clones the style. The color is not cloned if it is an {@link ol.ColorLike}. + * @return {ol.style.Fill} The cloned style. + * @api + */ +ol.style.Fill.prototype.clone = function() { + var color = this.getColor(); + return new ol.style.Fill({ + color: (color && color.slice) ? color.slice() : color || undefined + }); +}; + + /** * Get the fill color. * @return {ol.Color|ol.ColorLike} Color. diff --git a/src/ol/style/icon.js b/src/ol/style/icon.js index 156a470eea..a6182d7cd2 100644 --- a/src/ol/style/icon.js +++ b/src/ol/style/icon.js @@ -57,9 +57,10 @@ ol.style.Icon = function(opt_options) { options.anchorYUnits : ol.style.Icon.AnchorUnits.FRACTION; /** + * @private * @type {?string} */ - var crossOrigin = + this.crossOrigin_ = options.crossOrigin !== undefined ? options.crossOrigin : null; /** @@ -95,9 +96,10 @@ ol.style.Icon = function(opt_options) { ol.Image.State.IDLE : ol.Image.State.LOADED; /** + * @private * @type {ol.Color} */ - var color = options.color !== undefined ? ol.color.asArray(options.color) : + this.color_ = options.color !== undefined ? ol.color.asArray(options.color) : null; /** @@ -105,7 +107,7 @@ ol.style.Icon = function(opt_options) { * @type {ol.style.IconImage} */ this.iconImage_ = ol.style.IconImage.get( - image, /** @type {string} */ (src), imgSize, crossOrigin, imageState, color); + image, /** @type {string} */ (src), imgSize, this.crossOrigin_, imageState, this.color_); /** * @private @@ -171,6 +173,47 @@ ol.style.Icon = function(opt_options) { ol.inherits(ol.style.Icon, ol.style.Image); +/** + * Clones the style. + * @return {ol.style.Icon} The cloned style. + * @api + */ +ol.style.Icon.prototype.clone = function() { + var oldImage = this.getImage(1); + var newImage; + if (this.iconImage_.getImageState() === ol.Image.State.LOADED) { + if (oldImage.tagName.toUpperCase() === 'IMG') { + newImage = /** @type {Image} */ (oldImage.cloneNode(true)); + } else { + newImage = /** @type {HTMLCanvasElement} */ (document.createElement('canvas')); + var context = newImage.getContext('2d'); + newImage.width = oldImage.width; + newImage.height = oldImage.height; + context.drawImage(oldImage, 0, 0); + } + } + return new ol.style.Icon({ + anchor: this.anchor_.slice(), + anchorOrigin: this.anchorOrigin_, + anchorXUnits: this.anchorXUnits_, + anchorYUnits: this.anchorYUnits_, + crossOrigin: this.crossOrigin_, + color: (this.color_ && this.color_.slice) ? this.color_.slice() : this.color_ || undefined, + img: newImage ? newImage : undefined, + imgSize: newImage ? this.iconImage_.getSize().slice() : undefined, + src: newImage ? undefined : this.getSrc(), + offset: this.offset_.slice(), + offsetOrigin: this.offsetOrigin_, + size: this.size_ !== null ? this.size_.slice() : undefined, + opacity: this.getOpacity(), + scale: this.getScale(), + snapToPixel: this.getSnapToPixel(), + rotation: this.getRotation(), + rotateWithView: this.getRotateWithView() + }); +}; + + /** * @inheritDoc * @api diff --git a/src/ol/style/regularshape.js b/src/ol/style/regularshape.js index b96a992895..92b95c47b0 100644 --- a/src/ol/style/regularshape.js +++ b/src/ol/style/regularshape.js @@ -113,7 +113,13 @@ ol.style.RegularShape = function(options) { */ this.hitDetectionImageSize_ = null; - this.render_(options.atlasManager); + /** + * @private + * @type {ol.style.AtlasManager|undefined} + */ + this.atlasManager_ = options.atlasManager; + + this.render_(this.atlasManager_); /** * @type {boolean} @@ -139,6 +145,30 @@ ol.style.RegularShape = function(options) { ol.inherits(ol.style.RegularShape, ol.style.Image); +/** + * Clones the style. If an atlasmanger was provided to the original style it will be used in the cloned style, too. + * @return {ol.style.RegularShape} The cloned style. + * @api + */ +ol.style.RegularShape.prototype.clone = function() { + var style = new ol.style.RegularShape({ + fill: this.getFill() ? this.getFill().clone() : undefined, + points: this.getRadius2() !== this.getRadius() ? this.getPoints() / 2 : this.getPoints(), + radius: this.getRadius(), + radius2: this.getRadius2(), + angle: this.getAngle(), + snapToPixel: this.getSnapToPixel(), + stroke: this.getStroke() ? this.getStroke().clone() : undefined, + rotation: this.getRotation(), + rotateWithView: this.getRotateWithView(), + atlasManager: this.atlasManager_ + }); + style.setOpacity(this.getOpacity()); + style.setScale(this.getScale()); + return style; +}; + + /** * @inheritDoc * @api diff --git a/src/ol/style/stroke.js b/src/ol/style/stroke.js index 5ff9211ab2..f90a102452 100644 --- a/src/ol/style/stroke.js +++ b/src/ol/style/stroke.js @@ -62,6 +62,24 @@ ol.style.Stroke = function(opt_options) { }; +/** + * Clones the style. + * @return {ol.style.Stroke} The cloned style. + * @api + */ +ol.style.Stroke.prototype.clone = function() { + var color = this.getColor(); + return new ol.style.Stroke({ + color: (color && color.slice) ? color.slice() : color || undefined, + lineCap: this.getLineCap(), + lineDash: this.getLineDash() ? this.getLineDash().slice() : undefined, + lineJoin: this.getLineJoin(), + miterLimit: this.getMiterLimit(), + width: this.getWidth() + }); +}; + + /** * Get the stroke color. * @return {ol.Color|string} Color. diff --git a/src/ol/style/style.js b/src/ol/style/style.js index 17b9a43d5e..1c0406b787 100644 --- a/src/ol/style/style.js +++ b/src/ol/style/style.js @@ -71,6 +71,27 @@ ol.style.Style = function(opt_options) { }; +/** + * Clones the style. + * @return {ol.style.Style} The cloned style. + * @api + */ +ol.style.Style.prototype.clone = function() { + var geometry = this.getGeometry(); + if (geometry && geometry.clone) { + geometry = geometry.clone(); + } + return new ol.style.Style({ + geometry: geometry, + fill: this.getFill() ? this.getFill().clone() : undefined, + image: this.getImage() ? this.getImage().clone() : undefined, + stroke: this.getStroke() ? this.getStroke().clone() : undefined, + text: this.getText() ? this.getText().clone() : undefined, + zIndex: this.getZIndex() + }); +}; + + /** * Get the geometry to be rendered. * @return {string|ol.geom.Geometry|ol.StyleGeometryFunction} diff --git a/src/ol/style/text.js b/src/ol/style/text.js index 8a8e31106c..b6af84c848 100644 --- a/src/ol/style/text.js +++ b/src/ol/style/text.js @@ -95,6 +95,28 @@ ol.style.Text = function(opt_options) { ol.style.Text.DEFAULT_FILL_COLOR_ = '#333'; +/** + * Clones the style. + * @return {ol.style.Text} The cloned style. + * @api + */ +ol.style.Text.prototype.clone = function() { + return new ol.style.Text({ + font: this.getFont(), + rotation: this.getRotation(), + rotateWithView: this.getRotateWithView(), + scale: this.getScale(), + text: this.getText(), + textAlign: this.getTextAlign(), + textBaseline: this.getTextBaseline(), + fill: this.getFill() ? this.getFill().clone() : undefined, + stroke: this.getStroke() ? this.getStroke().clone() : undefined, + offsetX: this.getOffsetX(), + offsetY: this.getOffsetY() + }); +}; + + /** * Get the font name. * @return {string|undefined} Font. diff --git a/test/spec/ol/style.test.js b/test/spec/ol/style.test.js deleted file mode 100644 index 90986b8eab..0000000000 --- a/test/spec/ol/style.test.js +++ /dev/null @@ -1,97 +0,0 @@ -goog.provide('ol.test.style.Style'); - -goog.require('ol.Feature'); -goog.require('ol.geom.Point'); -goog.require('ol.style.Style'); - - -describe('ol.style.Style', function() { - - describe('#setZIndex', function() { - - it('sets the zIndex', function() { - var style = new ol.style.Style(); - - style.setZIndex(0.7); - expect(style.getZIndex()).to.be(0.7); - }); - }); - - describe('#setGeometry', function() { - var style = new ol.style.Style(); - - it('creates a geometry function from a string', function() { - var feature = new ol.Feature(); - feature.set('myGeom', new ol.geom.Point([0, 0])); - style.setGeometry('myGeom'); - expect(style.getGeometryFunction()(feature)) - .to.eql(feature.get('myGeom')); - }); - - it('creates a geometry function from a geometry', function() { - var geom = new ol.geom.Point([0, 0]); - style.setGeometry(geom); - expect(style.getGeometryFunction()()) - .to.eql(geom); - }); - - it('returns the configured geometry function', function() { - var geom = new ol.geom.Point([0, 0]); - style.setGeometry(function() { - return geom; - }); - expect(style.getGeometryFunction()()) - .to.eql(geom); - }); - }); - - describe('#getGeometry', function() { - - it('returns whatever was passed to setGeometry', function() { - var style = new ol.style.Style(); - style.setGeometry('foo'); - expect(style.getGeometry()).to.eql('foo'); - var geom = new ol.geom.Point([1, 2]); - style.setGeometry(geom); - expect(style.getGeometry()).to.eql(geom); - var fn = function() { - return geom; - }; - style.setGeometry(fn); - expect(style.getGeometry()).to.eql(fn); - style.setGeometry(null); - expect(style.getGeometry()).to.eql(null); - }); - - }); - -}); - -describe('ol.style.Style.createFunction()', function() { - var style = new ol.style.Style(); - - it('creates a style function from a single style', function() { - var styleFunction = ol.style.Style.createFunction(style); - expect(styleFunction()).to.eql([style]); - }); - - it('creates a style function from an array of styles', function() { - var styleFunction = ol.style.Style.createFunction([style]); - expect(styleFunction()).to.eql([style]); - }); - - it('passes through a function', function() { - var original = function() { - return [style]; - }; - var styleFunction = ol.style.Style.createFunction(original); - expect(styleFunction).to.be(original); - }); - - it('throws on (some) unexpected input', function() { - expect(function() { - ol.style.Style.createFunction({bogus: 'input'}); - }).to.throwException(); - }); - -}); diff --git a/test/spec/ol/style/circle.test.js b/test/spec/ol/style/circle.test.js index 63c48ee653..83ebbedbef 100644 --- a/test/spec/ol/style/circle.test.js +++ b/test/spec/ol/style/circle.test.js @@ -76,6 +76,58 @@ describe('ol.style.Circle', function() { }); }); + describe('#clone', function() { + + it('creates a new ol.style.Circle', function() { + var original = new ol.style.Circle(); + var clone = original.clone(); + expect(clone).to.be.an(ol.style.Circle); + expect(clone).to.not.be(original); + }); + + it('copies all values', function() { + var original = new ol.style.Circle({ + fill: new ol.style.Fill({ + color: '#319FD3' + }), + stroke: new ol.style.Stroke({ + color: '#319FD3' + }), + radius: 5, + snapToPixel: false + }); + original.setOpacity(0.5); + original.setScale(1.5); + var clone = original.clone(); + expect(original.getFill().getColor()).to.eql(clone.getFill().getColor()); + expect(original.getOpacity()).to.eql(clone.getOpacity()); + expect(original.getRadius()).to.eql(clone.getRadius()); + expect(original.getScale()).to.eql(clone.getScale()); + expect(original.getSnapToPixel()).to.eql(clone.getSnapToPixel()); + expect(original.getStroke().getColor()).to.eql(clone.getStroke().getColor()); + }); + + it('the clone does not reference the same objects as the original', function() { + var original = new ol.style.Circle({ + fill: new ol.style.Fill({ + color: '#319FD3' + }), + stroke: new ol.style.Stroke({ + color: '#319FD3' + }) + }); + var clone = original.clone(); + expect(original.getFill()).to.not.be(clone.getFill()); + expect(original.getStroke()).to.not.be(clone.getStroke()); + + clone.getFill().setColor('#012345'); + clone.getStroke().setColor('#012345'); + expect(original.getFill().getColor()).to.not.eql(clone.getFill().getColor()); + expect(original.getStroke().getColor()).to.not.eql(clone.getStroke().getColor()); + }); + + }); + describe('#getChecksum', function() { it('calculates the same hash code for default options', function() { diff --git a/test/spec/ol/style/fill.test.js b/test/spec/ol/style/fill.test.js new file mode 100644 index 0000000000..17f189ac2c --- /dev/null +++ b/test/spec/ol/style/fill.test.js @@ -0,0 +1,36 @@ +goog.provide('ol.test.style.Fill'); + +goog.require('ol.style.Fill'); + +describe('ol.style.Fill', function() { + + describe('#clone', function() { + + it('creates a new ol.style.Fill', function() { + var original = new ol.style.Fill(); + var clone = original.clone(); + expect(clone).to.be.an(ol.style.Fill); + expect(clone).to.not.be(original); + }); + + it('copies all values', function() { + var original = new ol.style.Fill({ + color: '#319FD3' + }); + var clone = original.clone(); + expect(original.getColor()).to.eql(clone.getColor()); + }); + + it('the clone does not reference the same objects as the original', function() { + var original = new ol.style.Fill({ + color: [63, 255, 127, 0.7] + }); + var clone = original.clone(); + expect(original.getColor()).to.not.be(clone.getColor()); + + clone.getColor()[2] = 0; + expect(original.getColor()).to.not.eql(clone.getColor()); + }); + + }); +}); diff --git a/test/spec/ol/style/icon.test.js b/test/spec/ol/style/icon.test.js index 5d3fa68cba..4b5fa357aa 100644 --- a/test/spec/ol/style/icon.test.js +++ b/test/spec/ol/style/icon.test.js @@ -38,6 +38,92 @@ describe('ol.style.Icon', function() { }); + describe('#clone', function() { + + it('creates a new ol.style.Icon', function() { + var original = new ol.style.Icon({ + src: src + }); + var clone = original.clone(); + expect(clone).to.be.an(ol.style.Icon); + expect(clone).to.not.be(original); + }); + + it('copies all values ', function() { + var canvas = document.createElement('canvas'); + var original = new ol.style.Icon({ + anchor: [1, 0], + anchorOrigin: 'bottom-right', + anchorXUnits: 'pixels', + anchorYUnits: 'pixels', + color: '#319FD3', + crossOrigin: 'Anonymous', + img: canvas, + imgSize: size, + offset: [1, 2], + offsetOrigin: 'bottom-left', + opacity: 0.5, + scale: 2, + snapToPixel: false, + rotation: 4, + size: [10, 12] + }); + + var clone = original.clone(); + expect(original.getAnchor()).to.eql(clone.getAnchor()); + expect(original.anchorOrigin_).to.eql(clone.anchorOrigin_); + expect(original.anchorXUnits_).to.eql(clone.anchorXUnits_); + expect(original.anchorYUnits_).to.eql(clone.anchorYUnits_); + expect(original.crossOrigin_).to.eql(clone.crossOrigin_); + expect(original.color_).to.eql(clone.color_); + expect(original.getImage(1).src).to.eql(clone.getImage(1).src); + expect(original.getImage(1).toDataURL()).to.eql(original.getImage(1).toDataURL()); + expect(original.offset_).to.eql(clone.offset_); + expect(original.offsetOrigin_).to.eql(clone.offsetOrigin_); + expect(original.getSize()).to.eql(clone.getSize()); + expect(original.getSrc()).not.to.eql(clone.getSrc()); + expect(original.getOpacity()).to.eql(clone.getOpacity()); + expect(original.getRotation()).to.eql(clone.getRotation()); + expect(original.getRotateWithView()).to.eql(clone.getRotateWithView()); + expect(original.getSnapToPixel()).to.eql(clone.getSnapToPixel()); + + var original2 = new ol.style.Icon({ + src: src + }); + var clone2 = original2.clone(); + expect(original2.getSrc()).to.be(clone2.getSrc()); + }); + + it('the clone does not reference the same objects as the original', function() { + var canvas = document.createElement('canvas'); + var original = new ol.style.Icon({ + anchor: [1, 0], + color: [1, 2, 3, 0.4], + img: canvas, + imgSize: size, + offset: [1, 2], + size: [10, 12] + }); + var clone = original.clone(); + expect(original.getAnchor()).not.to.be(clone.getAnchor()); + expect(original.getImage(1)).not.to.be(clone.getImage(1)); + expect(original.offset_).not.to.be(clone.offset_); + expect(original.color_).not.to.be(clone.color_); + expect(original.getSize()).not.to.be(clone.getSize()); + + clone.anchor_[0] = 0; + clone.getImage(1).width = 50; + clone.offset_[0] = 0; + clone.color_[0] = 0; + clone.size_[0] = 5; + expect(original.anchor_).not.to.eql(clone.anchor_); + expect(original.getImage(1).width).not.to.eql(clone.getImage(1).width); + expect(original.offset_).not.to.eql(clone.offset_); + expect(original.color_).not.to.eql(clone.color_); + expect(original.size_).not.to.eql(clone.size_); + }); + }); + describe('#getAnchor', function() { var fractionAnchor = [0.25, 0.25]; diff --git a/test/spec/ol/style/regularshape.test.js b/test/spec/ol/style/regularshape.test.js index 2f53c24201..2a10c4242c 100644 --- a/test/spec/ol/style/regularshape.test.js +++ b/test/spec/ol/style/regularshape.test.js @@ -119,6 +119,69 @@ describe('ol.style.RegularShape', function() { }); }); + describe('#clone', function() { + + it('creates a new ol.style.RegularShape', function() { + var original = new ol.style.RegularShape({ + points: 5 + }); + var clone = original.clone(); + expect(clone).to.be.an(ol.style.RegularShape); + expect(clone).to.not.be(original); + }); + + it('copies all values', function() { + var original = new ol.style.RegularShape({ + fill: new ol.style.Fill({ + color: '#319FD3' + }), + points: 5, + radius: 4, + radius2: 6, + angle: 1, + snapToPixel: false, + stroke: new ol.style.Stroke({ + color: '#319FD3' + }), + rotation: 2, + rotateWithView: true + }); + original.setOpacity(0.5); + original.setScale(1.5); + var clone = original.clone(); + expect(original.getAngle()).to.eql(clone.getAngle()); + expect(original.getFill().getColor()).to.eql(clone.getFill().getColor()); + expect(original.getOpacity()).to.eql(clone.getOpacity()); + expect(original.getPoints()).to.eql(clone.getPoints()); + expect(original.getRadius()).to.eql(clone.getRadius()); + expect(original.getRadius2()).to.eql(clone.getRadius2()); + expect(original.getRotation()).to.eql(clone.getRotation()); + expect(original.getRotateWithView()).to.eql(clone.getRotateWithView()); + expect(original.getScale()).to.eql(clone.getScale()); + expect(original.getSnapToPixel()).to.eql(clone.getSnapToPixel()); + expect(original.getStroke().getColor()).to.eql(clone.getStroke().getColor()); + }); + + it('the clone does not reference the same objects as the original', function() { + var original = new ol.style.RegularShape({ + fill: new ol.style.Fill({ + color: '#319FD3' + }), + stroke: new ol.style.Stroke({ + color: '#319FD3' + }) + }); + var clone = original.clone(); + expect(original.getFill()).to.not.be(clone.getFill()); + expect(original.getStroke()).to.not.be(clone.getStroke()); + + clone.getFill().setColor('#012345'); + clone.getStroke().setColor('#012345'); + expect(original.getFill().getColor()).to.not.eql(clone.getFill().getColor()); + expect(original.getStroke().getColor()).to.not.eql(clone.getStroke().getColor()); + }); + }); + describe('#getChecksum', function() { diff --git a/test/spec/ol/style/stroke.test.js b/test/spec/ol/style/stroke.test.js new file mode 100644 index 0000000000..352b9e6954 --- /dev/null +++ b/test/spec/ol/style/stroke.test.js @@ -0,0 +1,50 @@ +goog.provide('ol.test.style.Stroke'); + +goog.require('ol.style.Stroke'); + +describe('ol.style.Stroke', function() { + + describe('#clone', function() { + + it('creates a new ol.style.Stroke', function() { + var original = new ol.style.Stroke(); + var clone = original.clone(); + expect(clone).to.be.an(ol.style.Stroke); + expect(clone).to.not.be(original); + }); + + it('copies all values', function() { + var original = new ol.style.Stroke({ + color: '#319FD3', + lineCap: 'square', + lineJoin: 'miter', + lineDash: [1, 2, 3], + miterLimit: 20, + width: 5 + }); + var clone = original.clone(); + expect(original.getColor()).to.eql(clone.getColor()); + expect(original.getLineCap()).to.eql(clone.getLineCap()); + expect(original.getLineJoin()).to.eql(clone.getLineJoin()); + expect(original.getLineDash()).to.eql(clone.getLineDash()); + expect(original.getMiterLimit()).to.eql(clone.getMiterLimit()); + expect(original.getWidth()).to.eql(clone.getWidth()); + }); + + it('the clone does not reference the same objects as the original', function() { + var original = new ol.style.Stroke({ + color: [1, 2, 3, 0.4], + lineDash: [1, 2, 3] + }); + var clone = original.clone(); + expect(original.getColor()).to.not.be(clone.getColor()); + expect(original.getLineDash()).to.not.be(clone.getLineDash()); + + clone.getColor()[0] = 0; + clone.getLineDash()[0] = 0; + expect(original.getColor()).to.not.eql(clone.getColor()); + expect(original.getLineDash()).to.not.eql(clone.getLineDash()); + }); + }); + +}); diff --git a/test/spec/ol/style/style.test.js b/test/spec/ol/style/style.test.js new file mode 100644 index 0000000000..7b265e2777 --- /dev/null +++ b/test/spec/ol/style/style.test.js @@ -0,0 +1,172 @@ +goog.provide('ol.test.style.Style'); + +goog.require('ol.Feature'); +goog.require('ol.geom.Point'); +goog.require('ol.style.Style'); +goog.require('ol.style.Fill'); +goog.require('ol.style.Circle'); +goog.require('ol.style.Stroke'); +goog.require('ol.style.Text'); + + +describe('ol.style.Style', function() { + + describe('#clone', function() { + + it('creates a new ol.style.Style', function() { + var original = new ol.style.Style(); + var clone = original.clone(); + expect(clone).to.be.an(ol.style.Style); + expect(clone).to.not.be(original); + }); + + it('copies all values', function() { + var original = new ol.style.Style({ + geometry: new ol.geom.Point([0,0,0]), + fill: new ol.style.Fill({ + color: '#319FD3' + }), + image: new ol.style.Circle({ + radius: 5 + }), + stroke: new ol.style.Stroke({ + color: '#319FD3' + }), + text: new ol.style.Text({ + text: 'test' + }), + zIndex: 2 + }); + var clone = original.clone(); + expect(original.getGeometry().getCoordinates()).to.eql(clone.getGeometry().getCoordinates()); + expect(original.getFill().getColor()).to.eql(clone.getFill().getColor()); + expect(original.getImage().getRadius()).to.eql(clone.getImage().getRadius()); + expect(original.getStroke().getColor()).to.eql(clone.getStroke().getColor()); + expect(original.getText().getText()).to.eql(clone.getText().getText()); + expect(original.getZIndex()).to.eql(clone.getZIndex()); + }); + + it('the clone does not reference the same objects as the original', function() { + var original = new ol.style.Style({ + geometry: new ol.geom .Point([0,0,0]), + fill: new ol.style.Fill({ + color: '#319FD3' + }), + image: new ol.style.Circle({ + radius: 5 + }), + stroke: new ol.style.Stroke({ + color: '#319FD3' + }), + text: new ol.style.Text({ + text: 'test' + }) + }); + var clone = original.clone(); + expect(original.getGeometry()).not.to.be(clone.getGeometry()); + expect(original.getFill()).not.to.be(clone.getFill()); + expect(original.getImage()).not.to.be(clone.getImage()); + expect(original.getStroke()).not.to.be(clone.getStroke()); + expect(original.getText()).not.to.be(clone.getText()); + + clone.getGeometry().setCoordinates([1,1,1]); + clone.getFill().setColor('#012345'); + clone.getImage().setScale(2); + clone.getStroke().setColor('#012345'); + clone.getText().setText('other'); + expect(original.getGeometry().getCoordinates()).not.to.eql(clone.getGeometry().getCoordinates()); + expect(original.getFill().getColor()).not.to.eql(clone.getFill().getColor()); + expect(original.getImage().getScale()).not.to.eql(clone.getImage().getScale()); + expect(original.getStroke().getColor()).not.to.eql(clone.getStroke().getColor()); + expect(original.getText().getText()).not.to.eql(clone.getText().getText()); + }); + }); + + describe('#setZIndex', function() { + + it('sets the zIndex', function() { + var style = new ol.style.Style(); + + style.setZIndex(0.7); + expect(style.getZIndex()).to.be(0.7); + }); + }); + + describe('#setGeometry', function() { + var style = new ol.style.Style(); + + it('creates a geometry function from a string', function() { + var feature = new ol.Feature(); + feature.set('myGeom', new ol.geom.Point([0, 0])); + style.setGeometry('myGeom'); + expect(style.getGeometryFunction()(feature)) + .to.eql(feature.get('myGeom')); + }); + + it('creates a geometry function from a geometry', function() { + var geom = new ol.geom.Point([0, 0]); + style.setGeometry(geom); + expect(style.getGeometryFunction()()) + .to.eql(geom); + }); + + it('returns the configured geometry function', function() { + var geom = new ol.geom.Point([0, 0]); + style.setGeometry(function() { + return geom; + }); + expect(style.getGeometryFunction()()) + .to.eql(geom); + }); + }); + + describe('#getGeometry', function() { + + it('returns whatever was passed to setGeometry', function() { + var style = new ol.style.Style(); + style.setGeometry('foo'); + expect(style.getGeometry()).to.eql('foo'); + var geom = new ol.geom.Point([1, 2]); + style.setGeometry(geom); + expect(style.getGeometry()).to.eql(geom); + var fn = function() { + return geom; + }; + style.setGeometry(fn); + expect(style.getGeometry()).to.eql(fn); + style.setGeometry(null); + expect(style.getGeometry()).to.eql(null); + }); + + }); + +}); + +describe('ol.style.Style.createFunction()', function() { + var style = new ol.style.Style(); + + it('creates a style function from a single style', function() { + var styleFunction = ol.style.Style.createFunction(style); + expect(styleFunction()).to.eql([style]); + }); + + it('creates a style function from an array of styles', function() { + var styleFunction = ol.style.Style.createFunction([style]); + expect(styleFunction()).to.eql([style]); + }); + + it('passes through a function', function() { + var original = function() { + return [style]; + }; + var styleFunction = ol.style.Style.createFunction(original); + expect(styleFunction).to.be(original); + }); + + it('throws on (some) unexpected input', function() { + expect(function() { + ol.style.Style.createFunction({bogus: 'input'}); + }).to.throwException(); + }); + +}); diff --git a/test/spec/ol/style/text.test.js b/test/spec/ol/style/text.test.js index fb281cb92f..2897f1fc5a 100644 --- a/test/spec/ol/style/text.test.js +++ b/test/spec/ol/style/text.test.js @@ -28,4 +28,66 @@ describe('ol.style.Text', function() { }); + describe('#clone', function() { + + it('creates a new ol.style.Text', function() { + var original = new ol.style.Text(); + var clone = original.clone(); + expect(clone).to.be.an(ol.style.Text); + expect(clone).to.not.be(original); + }); + + it('copies all values', function() { + var original = new ol.style.Text({ + font: '12px serif', + offsetX: 4, + offsetY: 10, + scale: 2, + rotateWithView: true, + rotation: 1.5, + text: 'test', + textAlign: 'center', + textBaseline: 'top', + fill: new ol.style.Fill({ + color: '#319FD3' + }), + stroke: new ol.style.Stroke({ + color: '#319FD3' + }) + }); + var clone = original.clone(); + expect(original.getFont()).to.eql(clone.getFont()); + expect(original.getOffsetX()).to.eql(clone.getOffsetX()); + expect(original.getOffsetY()).to.eql(clone.getOffsetY()); + expect(original.getScale()).to.eql(clone.getScale()); + expect(original.getRotateWithView()).to.eql(clone.getRotateWithView()); + expect(original.getRotation()).to.eql(clone.getRotation()); + expect(original.getText()).to.eql(clone.getText()); + expect(original.getTextAlign()).to.eql(clone.getTextAlign()); + expect(original.getTextBaseline()).to.eql(clone.getTextBaseline()); + expect(original.getStroke().getColor()).to.eql(clone.getStroke().getColor()); + expect(original.getFill().getColor()).to.eql(clone.getFill().getColor()); + }); + + it('the clone does not reference the same objects as the original', function() { + var original = new ol.style.Text({ + fill: new ol.style.Fill({ + color: '#319FD3' + }), + stroke: new ol.style.Stroke({ + color: '#319FD3' + }) + }); + var clone = original.clone(); + expect(original.getFill()).to.not.be(clone.getFill()); + expect(original.getStroke()).to.not.be(clone.getStroke()); + + clone.getFill().setColor('#012345'); + clone.getStroke().setColor('#012345'); + expect(original.getFill().getColor()).to.not.eql(clone.getFill().getColor()); + expect(original.getStroke().getColor()).to.not.eql(clone.getStroke().getColor()); + }); + + }); + });