Merge pull request #5516 from probins/goog.uri

Remove goog.Uri from KML format

README.md

@@ -14,7 +14,7 @@
 
 ## Supported Browsers
 
-OpenLayers runs on all modern browsers that support [HTML5](https://html.spec.whatwg.org/multipage/) and [ECMAScript 5](http://www.ecma-international.org/ecma-262/5.1/). This includes Chrome, Firefox, Safari and Edge. For older browsers and platforms like Internet Explorer (down to version 9) and Android 4.x, [polyfills](http://polyfill.io) for `requestAnimationFrame` and `Element.prototype.classList` are required.
+OpenLayers runs on all modern browsers that support [HTML5](https://html.spec.whatwg.org/multipage/) and [ECMAScript 5](http://www.ecma-international.org/ecma-262/5.1/). This includes Chrome, Firefox, Safari and Edge. For older browsers and platforms like Internet Explorer (down to version 9) and Android 4.x, [polyfills](http://polyfill.io) for `requestAnimationFrame` and `Element.prototype.classList` are required, and using the KML format requires a polyfill for `URL`.
 
 ## Documentation
 

changelog/upgrade-notes.md

@@ -4,6 +4,10 @@
 
 This option was previously needed to use named colors with the WebGL renderer but is no longer needed.
 
+#### KML format now uses URL()
+
+The URL constructor is supported by all modern browsers, but not by older ones, such as IE. To use the KML format in such older browsers, a URL polyfill will have to be loaded before use.
+
 ### v3.17.0
 
 #### `ol.source.MapQuest` removal

config/examples/example.html

@@ -11,7 +11,7 @@
     <link rel="stylesheet" href="./resources/layout.css" type="text/css">
     {{{ extraHead.local }}}
     {{{ css.tag }}}
-    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=fetch,requestAnimationFrame,Element.prototype.classList"></script>
+    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=fetch,requestAnimationFrame,Element.prototype.classList,URL"></script>
     <script src="./resources/zeroclipboard/ZeroClipboard.min.js"></script>
     <title>{{ title }}</title>
   </head>
@@ -74,7 +74,7 @@
     &lt;title&gt;{{ title }}&lt;/title&gt;
     &lt;link rel="stylesheet" href="http://openlayers.org/en/v{{ olVersion }}/css/ol.css" type="text/css"&gt;
     &lt;!-- The line below is only needed for old environments like Internet Explorer and Android 4.x --&gt;
-    &lt;script src="http://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList"&gt;&lt;/script&gt;
+    &lt;script src="http://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"&gt;&lt;/script&gt;
     &lt;script src="http://openlayers.org/en/v{{ olVersion }}/build/ol.js"&gt;&lt;/script&gt;{{#if extraHead.remote}}
 {{ indent extraHead.remote spaces=4 }}{{/if}}{{#if css.source}}
     &lt;style&gt;

doc/tutorials/introduction.md

@@ -26,7 +26,7 @@ Unlike in, say, Node, where a module's exports are fixed in the source, with Clo
 ## Renderers and Browser Support
 The library currently includes three renderers: Canvas, DOM, and WebGL. All three support both raster data from tile/image servers, and vector data; WebGL however only supports Point vectors and does not support labels. Clearly only those browsers that [support Canvas](http://caniuse.com/canvas) can use the Canvas renderer. Equally, the WebGL renderer can only be used on those devices and [browsers](http://caniuse.com/webgl) that support WebGL.
 
-OpenLayers runs on all modern browsers that support [HTML5](https://html.spec.whatwg.org/multipage/) and [ECMAScript 5](http://www.ecma-international.org/ecma-262/5.1/). This includes Chrome, Firefox, Safari and Edge. For older browsers and platforms like Internet Explorer (down to version 9) and Android 4.x, [polyfills](http://polyfill.io) for `requestAnimationFrame` and `Element.prototype.classList` are required.
+OpenLayers runs on all modern browsers that support [HTML5](https://html.spec.whatwg.org/multipage/) and [ECMAScript 5](http://www.ecma-international.org/ecma-262/5.1/). This includes Chrome, Firefox, Safari and Edge. For older browsers and platforms like Internet Explorer (down to version 9) and Android 4.x, [polyfills](http://polyfill.io) for `requestAnimationFrame` and `Element.prototype.classList` are required, and using the KML format requires a polyfill for `URL`.
 
 The library is intended for use on both desktop/laptop and mobile devices.
 

src/ol/format/kmlformat.js

@@ -5,7 +5,6 @@
 
 goog.provide('ol.format.KML');
 
-goog.require('goog.Uri');
 goog.require('goog.asserts');
 goog.require('goog.object');
 goog.require('ol');
@@ -44,6 +43,9 @@ goog.require('ol.xml');
  * @classdesc
  * Feature format for reading and writing data in the KML format.
  *
+ * Note that the KML format uses the URL() constructor. Older browsers such as IE
+ * which do not support this will need a URL polyfill to be loaded before use.
+ *
  * @constructor
  * @extends {ol.format.XMLFeature}
  * @param {olx.format.KMLOptions=} opt_options Options.
@@ -479,33 +481,18 @@ ol.format.KML.readFlatCoordinates_ = function(node) {
 };
 
 
-/**
- * @param {Node} node Node.
- * @private
- * @return {string|undefined} Style URL.
- */
-ol.format.KML.readStyleUrl_ = function(node) {
-  var s = ol.xml.getAllTextContent(node, false).trim();
-  if (node.baseURI) {
-    return goog.Uri.resolve(node.baseURI, s).toString();
-  } else {
-    return s;
-  }
-
-};
-
-
 /**
  * @param {Node} node Node.
  * @private
  * @return {string} URI.
  */
 ol.format.KML.readURI_ = function(node) {
-  var s = ol.xml.getAllTextContent(node, false);
+  var s = ol.xml.getAllTextContent(node, false).trim();
   if (node.baseURI) {
-    return goog.Uri.resolve(node.baseURI, s.trim()).toString();
+    var url = new URL(s, node.baseURI);
+    return url.href;
   } else {
-    return s.trim();
+    return s;
   }
 };
 
@@ -1622,7 +1609,7 @@ ol.format.KML.PAIR_PARSERS_ = ol.xml.makeStructureNS(
     ol.format.KML.NAMESPACE_URIS_, {
       'Style': ol.xml.makeObjectPropertySetter(ol.format.KML.readStyle_),
       'key': ol.xml.makeObjectPropertySetter(ol.format.XSD.readString),
-      'styleUrl': ol.xml.makeObjectPropertySetter(ol.format.KML.readStyleUrl_)
+      'styleUrl': ol.xml.makeObjectPropertySetter(ol.format.KML.readURI_)
     });
 
 
@@ -1814,7 +1801,8 @@ ol.format.KML.prototype.readSharedStyle_ = function(node, objectStack) {
     if (style) {
       var styleUri;
       if (node.baseURI) {
-        styleUri = goog.Uri.resolve(node.baseURI, '#' + id).toString();
+        var url = new URL('#' + id, node.baseURI);
+        styleUri = url.href;
       } else {
         styleUri = '#' + id;
       }
@@ -1844,7 +1832,8 @@ ol.format.KML.prototype.readSharedStyleMap_ = function(node, objectStack) {
   }
   var styleUri;
   if (node.baseURI) {
-    styleUri = goog.Uri.resolve(node.baseURI, '#' + id).toString();
+    var url = new URL('#' + id, node.baseURI);
+    styleUri = url.href;
   } else {
     styleUri = '#' + id;
   }

test/spec/ol/format/kml/networklinks.kml

@@ -0,0 +1,17 @@
+<kml xmlns="http://www.opengis.net/kml/2.2">
+  <Document>
+    <NetworkLink>
+      <name>bar</name>
+      <Link>
+        <href>/bar/bar.kml</href>
+      </Link>
+    </NetworkLink>
+  </Document>
+  <Folder>
+    <NetworkLink>
+      <Link>
+        <href>http://foo.com/foo.kml</href>
+      </Link>
+    </NetworkLink>
+  </Folder>
+</kml>

test/spec/ol/format/kmlformat.test.js

@@ -2705,6 +2705,19 @@ describe('ol.format.KML', function() {
       expect(components[1]).to.be.an(ol.geom.MultiPolygon);
     });
 
+    it('reads style and icon', function() {
+      var f = features[0];
+      var styleFunction = f.getStyleFunction();
+      expect(styleFunction).not.to.be(undefined);
+      var styleArray = styleFunction.call(f, 0);
+      expect(styleArray).to.be.an(Array);
+      var style = styleArray[0];
+      expect(style).to.be.an(ol.style.Style);
+      var imageStyle = style.getImage();
+      expect(imageStyle).to.be.an(ol.style.Icon);
+      expect(imageStyle.getSrc()).to.eql('http://maps.google.com/mapfiles/kml/shapes/star.png');
+    });
+
   });
 
   describe('#JSONExport', function() {
@@ -2830,6 +2843,29 @@ describe('ol.format.KML', function() {
 
   });
 
+  describe('#readNetworkLinksFile', function() {
+
+    var nl;
+    before(function(done) {
+      afterLoadText('spec/ol/format/kml/networklinks.kml', function(xml) {
+        try {
+          nl = format.readNetworkLinks(xml);
+        } catch (e) {
+          done(e);
+        }
+        done();
+      });
+    });
+
+    it('returns an array of network links', function() {
+      expect(nl).to.have.length(2);
+      expect(nl[0].name).to.be('bar');
+      expect(nl[0].href.replace(window.location.href, '')).to.be('/bar/bar.kml');
+      expect(nl[1].href).to.be('http://foo.com/foo.kml');
+    });
+
+  });
+
 });