Merge pull request #881 from fredj/examples_css

examples: don't inject ol.css from loader.js

.travis.yml

@@ -1,5 +1,6 @@
 before_install:
   - "sudo pip install http://closure-linter.googlecode.com/files/closure_linter-latest.tar.gz"
+  - "sudo pip install regex"
   - "git clone --depth=50 https://github.com/jsdoc3/jsdoc build/jsdoc"
   - "git clone https://code.google.com/p/glsl-unit/ build/glsl-unit"
 

bin/generate-exports.py

@@ -92,7 +92,7 @@ class Class(Exportable):
             lines.append(' */\n')
             lines.append('%s = function(options) {\n' % (self.export_name(),))
             lines.append('  /** @type {%s} */\n' % (self.object_literal.name,))
-            lines.append('  var arg;\n');
+            lines.append('  var arg = /** @type {%s} */ (options);\n' % (self.object_literal.name,));
             lines.append('  if (goog.isDefAndNotNull(options)) {\n')
             # FIXME: we modify the user's options object
             lines.append(''.join(
@@ -103,12 +103,8 @@ class Class(Exportable):
                              {'o': o, 'base': b.name, 'ctor': k.export_name(),
                               'extern': ol.extern_name()} \
                                      for o, ol, k, b in self.nested_options()))
-            lines.append('    arg = {')
+            lines.extend('\n'.join('    arg.%s = options.%s;' % (key, key) for key in sorted(self.object_literal.prop_types.keys())))
-            lines.extend(','.join('\n      %s: options.%s' % (key, key) for key in sorted(self.object_literal.prop_types.keys())))
+            lines.append('\n  }\n')
-            lines.append('\n    };\n')
-            lines.append('  } else {\n')
-            lines.append('    arg = /** @type {%s} */ (options);\n' % (self.object_literal.name,))
-            lines.append('  }\n')
             lines.append('  goog.base(this, arg);\n')
             lines.append('};\n')
             lines.append('goog.inherits(\n')

build.py

@@ -5,7 +5,7 @@ import gzip
 import json
 import os
 import os.path
-import re
+import regex as re
 import shutil
 import sys
 
@@ -72,7 +72,10 @@ if sys.platform == 'win32':
 else:
     variables.GIT = 'git'
     variables.GJSLINT = 'gjslint'
-    variables.JAVA = 'java'
+    if sys.platform == 'darwin':
+        variables.JAVA = '/Library/Internet Plug-Ins/JavaAppletPlugin.plugin/Contents/Home/bin/java'
+    else:
+        variables.JAVA = 'java'
     variables.JAR = 'jar'
     variables.JSDOC = 'jsdoc'
     variables.NODE = 'node'
@@ -142,8 +145,8 @@ SRC = [path
        if path.endswith('.js')
        if path not in SHADER_SRC]
 
-PLOVR_JAR = 'build/plovr-eba786b34df9.jar'
+PLOVR_JAR = 'build/plovr-2013-rc3.jar'
-PLOVR_JAR_MD5 = '20eac8ccc4578676511cf7ccbfc65100'
+PLOVR_JAR_MD5 = '8690b431a7c257b8849ae7d0fa979537'
 
 PROJ4JS = 'build/proj4js/lib/proj4js-combined.js'
 PROJ4JS_ZIP = 'build/proj4js-1.1.0.zip'
@@ -312,7 +315,6 @@ def examples_star_json(name, match):
                 '../externs/oli.js',
                 '../externs/proj4js.js',
                 '../externs/tilejson.js',
-                '../externs/w3c_device_sensor_event.js',
             ],
         })
         with open(t.name, 'w') as f:
@@ -569,7 +571,7 @@ virtual('plovr', PLOVR_JAR)
 @target(PLOVR_JAR, clean=False)
 def plovr_jar(t):
     t.info('downloading %r', t.name)
-    t.download('https://plovr.googlecode.com/files/' +
+    t.download('http://plovr.com/' +
                os.path.basename(PLOVR_JAR), md5=PLOVR_JAR_MD5)
     t.info('downloaded %r', t.name)
 

buildcfg/base.json

@@ -44,8 +44,7 @@
     "../externs/geojson.js",
     "../externs/oli.js",
     "../externs/proj4js.js",
-    "../externs/tilejson.js",
+    "../externs/tilejson.js"
-    "../externs/w3c_device_sensor_event.js"
   ],
 
   "level": "VERBOSE",
@@ -99,7 +98,8 @@
     "goog.debug.logRecordSerializer",
     "goog.debug.makeWhitespaceVisible",
     "goog.debug.normalizeErrorObject",
-    "goog.debug.reflect"
+    "goog.debug.reflect",
+    "goog.log"
   ]
 
 }

buildcfg/ol-all.json

@@ -9,8 +9,7 @@
     "../externs/geojson.js",
     "../externs/oli.js",
     "../externs/proj4js.js",
-    "../externs/tilejson.js",
+    "../externs/tilejson.js"
-    "../externs/w3c_device_sensor_event.js"
   ],
 
   "inherits": "base.json",

buildcfg/ol-simple.json

@@ -18,8 +18,7 @@
     "../externs/geojson.js",
     "../externs/oli.js",
     "../externs/proj4js.js",
-    "../externs/tilejson.js",
+    "../externs/tilejson.js"
-    "../externs/w3c_device_sensor_event.js"
   ],
 
   "inherits": "ol.json",

buildcfg/ol-whitespace.json

@@ -19,8 +19,7 @@
     "../externs/geojson.js",
     "../externs/oli.js",
     "../externs/proj4js.js",
-    "../externs/tilejson.js",
+    "../externs/tilejson.js"
-    "../externs/w3c_device_sensor_event.js"
   ],
 
   "inherits": "ol.json",

buildcfg/ol.json

@@ -19,8 +19,7 @@
     "../externs/geojson.js",
     "../externs/oli.js",
     "../externs/proj4js.js",
-    "../externs/tilejson.js",
+    "../externs/tilejson.js"
-    "../externs/w3c_device_sensor_event.js"
   ],
 
   "inherits": "base.json",

css/ol.css

@@ -202,3 +202,43 @@ a.ol-full-screen-true:after {
   height: 20px;
   width: 24px;
 }
+.ol-zoom-extent {
+  position: absolute;
+  background: rgba(255,255,255,0.4);
+  border-radius: 4px;
+  left: 8px;
+  padding: 2px;
+  top: 65px;
+}
+@media print {
+  .ol-zoom-extent {
+    display: none;
+  }
+}
+.ol-zoom-extent a {
+  display: block;
+  margin: 1px;
+  padding: 0;
+  color: white;
+  font-size: 16px;
+  font-family: 'Lucida Grande',Verdana,Geneva,Lucida,Arial,Helvetica,sans-serif;
+  font-weight: bold;
+  text-decoration: none;
+  text-align: center;
+  height: 22px;
+  width: 22px;
+  background-color: rgba(0, 60, 136, 0.5);
+  border-radius: 2px;
+}
+.ol-touch .ol-zoom-extent a {
+  font-size: 20px;
+  height: 30px;
+  width: 30px;
+  line-height: 26px;
+}
+.ol-zoom-extent a:hover {
+  background-color: rgba(0, 60, 136, 0.7);
+}
+.ol-zoom-extent a:after {
+    content: "E";
+}

examples/animation.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/bind-input.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/bing-maps.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/bing-maps.js

@@ -13,7 +13,7 @@ for (var i = 0; i < styles.length; ++i) {
     visible: false,
     preload: Infinity,
     source: new ol.source.BingMaps({
-      key: 'AlQLZ0-5yk301_ESrmNLma3LYxEKNSg7w-e_knuRfyYFtld-UFvXVs38NOulku3Q',
+      key: 'Ar33pRUvQOdESG8m_T15MUmNz__E1twPo42bFx9jvdDePhX0PNgAcEm44OVTS7tt',
       style: styles[i]
     })
   }));

examples/brightness-contrast.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/canvas-tiles.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/custom-controls.html

@@ -4,11 +4,12 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
     <style type="text/css">
-      .zoom-extent {
+      .rotate-north {
         position: absolute;
         top: 65px;
         left: 8px;
@@ -16,30 +17,23 @@
         border-radius: 4px;
         padding: 2px;
       }
-      .zoom-extent a {
+      .rotate-north a {
         display: block;
-        margin: 1px;
-        padding: 0;
         color: white;
-        font-size: 18px;
+        font-size: 16px;
         font-family: 'Lucida Grande',Verdana,Geneva,Lucida,Arial,Helvetica,sans-serif;
         font-weight: bold;
+        margin: 1px;
         text-decoration: none;
         text-align: center;
+        border-radius: 2px;
         height: 22px;
         width: 22px;
-        line-height: 19px;
         background: rgba(0,60,136,0.5);
       }
-      .zoom-extent a:hover {
+      .rotate-north a:hover {
         background: rgba(0,60,136,0.7);
       }
-      .zoom-to {
-        border-radius: 2px 2px 0 0;
-      }
-      .zoom-to:before {
-        content: "E";
-      }
     </style>
     <title>ol3 custom controls example</title>
   </head>
@@ -73,10 +67,9 @@
           <p id="shortdesc">This example shows how to create custom controls.</p>
           <div id="docs">
             <p>
-              This example creates a "zoom to extent" button.
+              This example creates a "rotate to north" button.
               See the <a href="custom-controls.js" target="_blank">custom-controls.js
               source</a> to see how this is done.
-              Per default, the zoom extent control use the map projection extent.
             </p>
           </div>
           <div id="tags">

examples/custom-controls.js

@@ -16,7 +16,7 @@ var app = window.app;
 
 
 //
-// Define zoom extent control.
+// Define rotate to north control.
 //
 
 
@@ -26,25 +26,26 @@ var app = window.app;
  * @extends {ol.control.Control}
  * @param {Object=} opt_options Control options.
  */
-app.ZoomExtentControl = function(opt_options) {
+app.RotateNorthControl = function(opt_options) {
 
   var options = opt_options || {};
-  this.extent_ = options.extent;
 
   var anchor = document.createElement('a');
-  anchor.href = '#zoom-to';
+  anchor.href = '#rotate-north';
-  anchor.className = 'zoom-to';
+  anchor.innerHTML = 'N';
 
   var this_ = this;
-  var handleZoomTo = function(e) {
+  var handleRotateNorth = function(e) {
-    this_.handleZoomTo(e);
+    // prevent #rotate-north anchor from getting appended to the url
+    e.preventDefault();
+    this_.getMap().getView().getView2D().setRotation(0);
   };
 
-  anchor.addEventListener('click', handleZoomTo, false);
+  anchor.addEventListener('click', handleRotateNorth, false);
-  anchor.addEventListener('touchstart', handleZoomTo, false);
+  anchor.addEventListener('touchstart', handleRotateNorth, false);
 
   var element = document.createElement('div');
-  element.className = 'zoom-extent ol-unselectable';
+  element.className = 'rotate-north ol-unselectable';
   element.appendChild(anchor);
 
   ol.control.Control.call(this, {
@@ -54,46 +55,17 @@ app.ZoomExtentControl = function(opt_options) {
   });
 
 };
-ol.inherits(app.ZoomExtentControl, ol.control.Control);
+ol.inherits(app.RotateNorthControl, ol.control.Control);
-
-
-/**
- * @param {Event} e Browser event.
- */
-app.ZoomExtentControl.prototype.handleZoomTo = function(e) {
-  // prevent #zoomTo anchor from getting appended to the url
-  e.preventDefault();
-
-  var map = this.getMap();
-  var view = map.getView();
-  view.fitExtent(this.extent_, map.getSize());
-};
-
-
-/**
- * Overload setMap to use the view projection's validity extent
- * if no extent was passed to the constructor.
- * @param {ol.Map} map Map.
- */
-app.ZoomExtentControl.prototype.setMap = function(map) {
-  ol.control.Control.prototype.setMap.call(this, map);
-  if (map && !this.extent_) {
-    this.extent_ = map.getView().getProjection().getExtent();
-  }
-};
 
 
 //
-// Create map, giving it a zoom extent control.
+// Create map, giving it a rotate to north control.
 //
 
 
 var map = new ol.Map({
   controls: ol.control.defaults({}, [
-    new app.ZoomExtentControl({
+    new app.RotateNorthControl()
-      extent: [813079.7791264898, 848966.9639063801,
-               5929220.284081122, 5936863.986909639]
-    })
   ]),
   layers: [
     new ol.layer.TileLayer({
@@ -104,6 +76,7 @@ var map = new ol.Map({
   target: 'map',
   view: new ol.View2D({
     center: [0, 0],
-    zoom: 2
+    zoom: 2,
+    rotation: 1
   })
 });

examples/device-orientation.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/drag-rotate-and-zoom.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/epsg-4326.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/export-map.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/full-screen-drag-rotate-and-zoom.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/full-screen-drag-rotate-and-zoom.js

@@ -19,7 +19,7 @@ var map = new ol.Map({
   layers: [
     new ol.layer.TileLayer({
       source: new ol.source.BingMaps({
-        key: 'AlQLZ0-5yk301_ESrmNLma3LYxEKNSg7w-e_knuRfyYFtld-UFvXVs38NOulku3Q',
+        key: 'Ar33pRUvQOdESG8m_T15MUmNz__E1twPo42bFx9jvdDePhX0PNgAcEm44OVTS7tt',
         style: 'Aerial'
       })
     })

examples/full-screen.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/full-screen.js

@@ -19,7 +19,7 @@ var map = new ol.Map({
   layers: [
     new ol.layer.TileLayer({
       source: new ol.source.BingMaps({
-        key: 'AlQLZ0-5yk301_ESrmNLma3LYxEKNSg7w-e_knuRfyYFtld-UFvXVs38NOulku3Q',
+        key: 'Ar33pRUvQOdESG8m_T15MUmNz__E1twPo42bFx9jvdDePhX0PNgAcEm44OVTS7tt',
         style: 'Aerial'
       })
     })

examples/geolocation.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/gml.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/gml.js

@@ -4,7 +4,6 @@ goog.require('ol.View2D');
 goog.require('ol.layer.TileLayer');
 goog.require('ol.layer.Vector');
 goog.require('ol.parser.ogc.GML_v3');
-goog.require('ol.proj');
 goog.require('ol.source.MapQuestOpenAerial');
 goog.require('ol.source.Vector');
 goog.require('ol.style.Polygon');
@@ -17,7 +16,8 @@ var raster = new ol.layer.TileLayer({
 
 var vector = new ol.layer.Vector({
   source: new ol.source.Vector({
-    projection: ol.proj.get('EPSG:4326')
+    parser: new ol.parser.ogc.GML_v3({axisOrientation: 'neu'}),
+    url: 'data/gml/topp-states-wfs.xml'
   }),
   style: new ol.style.Style({rules: [
     new ol.style.Rule({
@@ -39,22 +39,3 @@ var map = new ol.Map({
     zoom: 4
   })
 });
-
-var gml = new ol.parser.ogc.GML_v3({axisOrientation: 'neu'});
-
-var url = 'data/gml/topp-states-wfs.xml';
-var xhr = new XMLHttpRequest();
-xhr.open('GET', url, true);
-
-
-/**
- * onload handler for the XHR request.
- */
-xhr.onload = function() {
-  if (xhr.status == 200) {
-    // this is silly to have to tell the layer the destination projection
-    var projection = map.getView().getProjection();
-    vector.parseFeatures(xhr.responseText, gml, projection);
-  }
-};
-xhr.send();

examples/gpx.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/gpx.js

@@ -4,7 +4,6 @@ goog.require('ol.View2D');
 goog.require('ol.layer.TileLayer');
 goog.require('ol.layer.Vector');
 goog.require('ol.parser.GPX');
-goog.require('ol.proj');
 goog.require('ol.source.OSM');
 goog.require('ol.source.Vector');
 
@@ -14,7 +13,8 @@ var raster = new ol.layer.TileLayer({
 
 var vector = new ol.layer.Vector({
   source: new ol.source.Vector({
-    projection: ol.proj.get('EPSG:4326')
+    parser: new ol.parser.GPX(),
+    url: 'data/gpx/yahoo.xml'
   }),
   transformFeatureInfo: function(features) {
     var info = [];
@@ -44,22 +44,3 @@ map.on(['click', 'mousemove'], function(evt) {
     }
   });
 });
-
-var gpx = new ol.parser.GPX();
-
-var url = 'data/gpx/yahoo.xml';
-var xhr = new XMLHttpRequest();
-xhr.open('GET', url, true);
-
-
-/**
- * onload handler for the XHR request.
- */
-xhr.onload = function() {
-  if (xhr.status == 200) {
-    // this is silly to have to tell the layer the destination projection
-    var projection = map.getView().getProjection();
-    vector.parseFeatures(xhr.responseText, gpx, projection);
-  }
-};
-xhr.send();

examples/hue-saturation.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/hue-saturation.js

@@ -8,7 +8,7 @@ goog.require('ol.source.BingMaps');
 
 var layer = new ol.layer.TileLayer({
   source: new ol.source.BingMaps({
-    key: 'AlQLZ0-5yk301_ESrmNLma3LYxEKNSg7w-e_knuRfyYFtld-UFvXVs38NOulku3Q',
+    key: 'Ar33pRUvQOdESG8m_T15MUmNz__E1twPo42bFx9jvdDePhX0PNgAcEm44OVTS7tt',
     style: 'Aerial'
   })
 });

examples/index.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/kml-timezones.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/kml-timezones.js

@@ -5,7 +5,6 @@ goog.require('ol.expr');
 goog.require('ol.layer.TileLayer');
 goog.require('ol.layer.Vector');
 goog.require('ol.parser.KML');
-goog.require('ol.proj');
 goog.require('ol.source.Stamen');
 goog.require('ol.source.Vector');
 goog.require('ol.style.Polygon');
@@ -55,7 +54,8 @@ var style = new ol.style.Style({rules: [
 
 var vector = new ol.layer.Vector({
   source: new ol.source.Vector({
-    projection: ol.proj.get('EPSG:4326')
+    parser: new ol.parser.KML({dimension: 2}),
+    url: 'data/kml/timezones.kml'
   }),
   style: style
 });
@@ -103,21 +103,3 @@ map.on(['click', 'mousemove'], function(evt) {
     }
   });
 });
-
-var kml = new ol.parser.KML({dimension: 2});
-
-var url = 'data/kml/timezones.kml';
-var xhr = new XMLHttpRequest();
-xhr.open('GET', url, true);
-
-
-/**
- * onload handler for the XHR request.
- */
-xhr.onload = function() {
-  if (xhr.status == 200) {
-    var projection = map.getView().getProjection();
-    vector.parseFeatures(xhr.responseText, kml, projection);
-  }
-};
-xhr.send();

examples/kml.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/kml.js

@@ -4,7 +4,6 @@ goog.require('ol.View2D');
 goog.require('ol.layer.TileLayer');
 goog.require('ol.layer.Vector');
 goog.require('ol.parser.KML');
-goog.require('ol.proj');
 goog.require('ol.source.TiledWMS');
 goog.require('ol.source.Vector');
 
@@ -20,11 +19,12 @@ var raster = new ol.layer.TileLayer({
   })
 });
 
-var epsg4326 = ol.proj.get('EPSG:4326');
-
 var vector = new ol.layer.Vector({
   source: new ol.source.Vector({
-    projection: epsg4326
+    parser: new ol.parser.KML({
+      maxDepth: 1, dimension: 2, extractStyles: true, extractAttributes: true
+    }),
+    url: 'data/kml/lines.kml'
   }),
   transformFeatureInfo: function(features) {
     var info = [];
@@ -40,15 +40,12 @@ var map = new ol.Map({
   renderer: ol.RendererHint.CANVAS,
   target: 'map',
   view: new ol.View2D({
-    projection: epsg4326,
+    projection: 'EPSG:4326',
     center: [-112.169, 36.099],
     zoom: 11
   })
 });
 
-var kml = new ol.parser.KML({
-  maxDepth: 1, dimension: 2, extractStyles: true, extractAttributes: true});
-
 map.on(['click', 'mousemove'], function(evt) {
   map.getFeatureInfo({
     pixel: evt.getPixel(),
@@ -58,19 +55,3 @@ map.on(['click', 'mousemove'], function(evt) {
     }
   });
 });
-
-var url = 'data/kml/lines.kml';
-var xhr = new XMLHttpRequest();
-xhr.open('GET', url, true);
-
-
-/**
- * onload handler for the XHR request.
- */
-xhr.onload = function() {
-  if (xhr.status == 200) {
-    // this is silly to have to tell the layer the destination projection
-    vector.parseFeatures(xhr.responseText, kml, epsg4326);
-  }
-};
-xhr.send();

examples/loader.js

@@ -1,7 +1,7 @@
 
 
 /**
- * Loader to add the plovr generated script and ol.css to the document.
+ * Loader to add the plovr generated script to the document.
  *
  * The following default values may be overridden with query string
  * parameters:
@@ -59,8 +59,6 @@
     pairs.push(encodeURIComponent(key) + '=' + encodeURIComponent(params[key]));
   }
 
-  document.write('<link rel="stylesheet" href="../css/ol.css" ' +
-                 'type="text/css">');
   var url = 'http://' + host + '/compile?' + pairs.join('&');
   document.write('<script type="text/javascript" src="' + url + '"></script>');
 }());

examples/localized-openstreetmap.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/mapquest.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/mobile-full-screen.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <title>Mobile full screen example</title>
     <style type="text/css">
       html, body, .map {

examples/mobile-full-screen.js

@@ -15,7 +15,7 @@ var map = new ol.Map({
   layers: [
     new ol.layer.TileLayer({
       source: new ol.source.BingMaps({
-        key: 'AlQLZ0-5yk301_ESrmNLma3LYxEKNSg7w-e_knuRfyYFtld-UFvXVs38NOulku3Q',
+        key: 'Ar33pRUvQOdESG8m_T15MUmNz__E1twPo42bFx9jvdDePhX0PNgAcEm44OVTS7tt',
         style: 'Road'
       })
     })

examples/mouse-position.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/navigation-controls.html

@@ -0,0 +1,61 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Navigation controls example</title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./">OpenLayers 3 Examples</a>
+          <ul class="nav pull-right">
+            <li><iframe class="github-watch-button" src="http://ghbtns.com/github-btn.html?user=openlayers&repo=ol3&type=watch&count=true"
+  allowtransparency="true" frameborder="0" scrolling="0" height="20" width="90"></iframe></li>
+            <li><a href="https://twitter.com/share" class="twitter-share-button" data-count="none" data-hashtags="openlayers">&nbsp;</a></li>
+            <li><div class="g-plusone-wrapper"><div class="g-plusone" data-size="medium" data-annotation="none"></div></div></li>
+          </ul>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">Navigation controls example</h4>
+          <p id="shortdesc">Shows how to add navigation controls.</p>
+            The following navigation controls are added to the map:
+            <ul>
+              <li><code>ol.control.Zoom</code> (added by default)</li>
+              <li><code>ol.control.ZoomToExtent</code></li>
+            </ul>
+          <div id="docs">
+            <p>See the <a href="navigation-controls.js" target="_blank">navigation-controls.js source</a> to see how this is done.</p>
+          </div>
+          <div id="tags">control, navigation, extent</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="loader.js?id=navigation-controls" type="text/javascript"></script>
+    <script src="../resources/social-links.js" type="text/javascript"></script>
+
+  </body>
+</html>

examples/navigation-controls.js

@@ -0,0 +1,32 @@
+goog.require('ol.Map');
+goog.require('ol.RendererHints');
+goog.require('ol.View2D');
+goog.require('ol.control.ZoomToExtent');
+goog.require('ol.control.defaults');
+goog.require('ol.layer.TileLayer');
+goog.require('ol.source.OSM');
+
+
+var map = new ol.Map({
+  controls: ol.control.defaults({}, [
+    new ol.control.ZoomToExtent({
+      extent: [
+        813079.7791264898,
+        848966.9639063801,
+        5929220.284081122,
+        5936863.986909639
+      ]
+    })
+  ]),
+  layers: [
+    new ol.layer.TileLayer({
+      source: new ol.source.OSM()
+    })
+  ],
+  renderers: ol.RendererHints.createFromQueryData(),
+  target: 'map',
+  view: new ol.View2D({
+    center: [0, 0],
+    zoom: 2
+  })
+});

examples/overlay.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/preload.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/preload.js

@@ -10,7 +10,7 @@ var map1 = new ol.Map({
     new ol.layer.TileLayer({
       preload: Infinity,
       source: new ol.source.BingMaps({
-        key: 'AlQLZ0-5yk301_ESrmNLma3LYxEKNSg7w-e_knuRfyYFtld-UFvXVs38NOulku3Q',
+        key: 'Ar33pRUvQOdESG8m_T15MUmNz__E1twPo42bFx9jvdDePhX0PNgAcEm44OVTS7tt',
         style: 'Aerial'
       })
     })

examples/rotation.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/scale-line.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/semi-transparent-layer.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/side-by-side.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/simple.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/stamen.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/style-rules.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/style-rules.js

@@ -60,112 +60,111 @@ var style = new ol.style.Style({rules: [
 var vector = new ol.layer.Vector({
   style: style,
   source: new ol.source.Vector({
+    data: {
+      'type': 'FeatureCollection',
+      'features': [{
+        'type': 'Feature',
+        'properties': {
+          'color': '#BADA55',
+          'where': 'inner'
+        },
+        'geometry': {
+          'type': 'LineString',
+          'coordinates': [[-10000000, -10000000], [10000000, 10000000]]
+        }
+      }, {
+        'type': 'Feature',
+        'properties': {
+          'color': '#BADA55',
+          'where': 'inner'
+        },
+        'geometry': {
+          'type': 'LineString',
+          'coordinates': [[-10000000, 10000000], [10000000, -10000000]]
+        }
+      }, {
+        'type': 'Feature',
+        'properties': {
+          'color': '#013',
+          'where': 'outer'
+        },
+        'geometry': {
+          'type': 'LineString',
+          'coordinates': [[-10000000, -10000000], [-10000000, 10000000]]
+        }
+      }, {
+        'type': 'Feature',
+        'properties': {
+          'color': '#013',
+          'where': 'outer'
+        },
+        'geometry': {
+          'type': 'LineString',
+          'coordinates': [[-10000000, 10000000], [10000000, 10000000]]
+        }
+      }, {
+        'type': 'Feature',
+        'properties': {
+          'color': '#013',
+          'where': 'outer'
+        },
+        'geometry': {
+          'type': 'LineString',
+          'coordinates': [[10000000, 10000000], [10000000, -10000000]]
+        }
+      }, {
+        'type': 'Feature',
+        'properties': {
+          'color': '#013',
+          'where': 'outer'
+        },
+        'geometry': {
+          'type': 'LineString',
+          'coordinates': [[10000000, -10000000], [-10000000, -10000000]]
+        }
+      }, {
+        'type': 'Feature',
+        'properties': {
+          'label': 'South'
+        },
+        'geometry': {
+          'type': 'Point',
+          'coordinates': [0, -6000000]
+        }
+      }, {
+        'type': 'Feature',
+        'properties': {
+          'label': 'West'
+        },
+        'geometry': {
+          'type': 'Point',
+          'coordinates': [-6000000, 0]
+        }
+      }, {
+        'type': 'Feature',
+        'properties': {
+          'label': 'North'
+        },
+        'geometry': {
+          'type': 'Point',
+          'coordinates': [0, 6000000]
+        }
+      }, {
+        'type': 'Feature',
+        'properties': {
+          'label': 'East'
+        },
+        'geometry': {
+          'type': 'Point',
+          'coordinates': [6000000, 0]
+        }
+      }]
+    },
+    parser: new ol.parser.GeoJSON(),
     projection: ol.proj.get('EPSG:3857')
   })
 });
 
-vector.parseFeatures({
-  'type': 'FeatureCollection',
-  'features': [{
-    'type': 'Feature',
-    'properties': {
-      'color': '#BADA55',
-      'where': 'inner'
-    },
-    'geometry': {
-      'type': 'LineString',
-      'coordinates': [[-10000000, -10000000], [10000000, 10000000]]
-    }
-  }, {
-    'type': 'Feature',
-    'properties': {
-      'color': '#BADA55',
-      'where': 'inner'
-    },
-    'geometry': {
-      'type': 'LineString',
-      'coordinates': [[-10000000, 10000000], [10000000, -10000000]]
-    }
-  }, {
-    'type': 'Feature',
-    'properties': {
-      'color': '#013',
-      'where': 'outer'
-    },
-    'geometry': {
-      'type': 'LineString',
-      'coordinates': [[-10000000, -10000000], [-10000000, 10000000]]
-    }
-  }, {
-    'type': 'Feature',
-    'properties': {
-      'color': '#013',
-      'where': 'outer'
-    },
-    'geometry': {
-      'type': 'LineString',
-      'coordinates': [[-10000000, 10000000], [10000000, 10000000]]
-    }
-  }, {
-    'type': 'Feature',
-    'properties': {
-      'color': '#013',
-      'where': 'outer'
-    },
-    'geometry': {
-      'type': 'LineString',
-      'coordinates': [[10000000, 10000000], [10000000, -10000000]]
-    }
-  }, {
-    'type': 'Feature',
-    'properties': {
-      'color': '#013',
-      'where': 'outer'
-    },
-    'geometry': {
-      'type': 'LineString',
-      'coordinates': [[10000000, -10000000], [-10000000, -10000000]]
-    }
-  }, {
-    'type': 'Feature',
-    'properties': {
-      'label': 'South'
-    },
-    'geometry': {
-      'type': 'Point',
-      'coordinates': [0, -6000000]
-    }
-  }, {
-    'type': 'Feature',
-    'properties': {
-      'label': 'West'
-    },
-    'geometry': {
-      'type': 'Point',
-      'coordinates': [-6000000, 0]
-    }
-  }, {
-    'type': 'Feature',
-    'properties': {
-      'label': 'North'
-    },
-    'geometry': {
-      'type': 'Point',
-      'coordinates': [0, 6000000]
-    }
-  }, {
-    'type': 'Feature',
-    'properties': {
-      'label': 'East'
-    },
-    'geometry': {
-      'type': 'Point',
-      'coordinates': [6000000, 0]
-    }
-  }]
-}, new ol.parser.GeoJSON(), ol.proj.get('EPSG:3857'));
-
-
 var map = new ol.Map({
   layers: [vector],
   controls: ol.control.defaults({

examples/teleport.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/ten-thousand-points.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/tilejson.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/vector-layer.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/vector-layer.js

@@ -5,7 +5,6 @@ goog.require('ol.expr');
 goog.require('ol.layer.TileLayer');
 goog.require('ol.layer.Vector');
 goog.require('ol.parser.GeoJSON');
-goog.require('ol.proj');
 goog.require('ol.source.MapQuestOpenAerial');
 goog.require('ol.source.Vector');
 goog.require('ol.style.Polygon');
@@ -25,7 +24,8 @@ ol.expr.register('resolution', function() {
 
 var vector = new ol.layer.Vector({
   source: new ol.source.Vector({
-    projection: ol.proj.get('EPSG:4326')
+    parser: new ol.parser.GeoJSON(),
+    url: 'data/countries.geojson'
   }),
   style: new ol.style.Style({rules: [
     new ol.style.Rule({
@@ -72,22 +72,3 @@ map.on(['click', 'mousemove'], function(evt) {
     }
   });
 });
-
-
-var geojson = new ol.parser.GeoJSON();
-var url = 'data/countries.geojson';
-var xhr = new XMLHttpRequest();
-xhr.open('GET', url, true);
-
-
-/**
- * onload handler for the XHR request.
- */
-xhr.onload = function() {
-  if (xhr.status == 200) {
-    // this is silly to have to tell the layer the destination projection
-    var projection = map.getView().getProjection();
-    vector.parseFeatures(xhr.responseText, geojson, projection);
-  }
-};
-xhr.send();

examples/wms-capabilities.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/wms-custom-proj.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/wms-no-proj.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/wms-single-image-custom-proj.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/wms-single-image.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/wms-tiled.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/wmts-capabilities.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/wmts-from-capabilities.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/wmts-ign.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/wmts.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

examples/zoomslider.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">

externs/w3c_device_sensor_event.js

@@ -1,89 +0,0 @@
-/*
- * Copyright 2013 The Closure Compiler Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/**
- * @fileoverview Definitions for W3C's device orientation and device motion
- *  events specification.
- *  This file depends on w3c_event.js.
- *  The whole file has been partially type annotated.
- *  Created from http://dev.w3.org/geo/api/spec-source-orientation.
- *
- * @externs
- */
-
-/**
- * @constructor
- * @extends {Event}
- */
-function DeviceOrientationEvent() {}
-
-/** @type {?number} */
-DeviceOrientationEvent.prototype.alpha;
-
-/** @type {?number} */
-DeviceOrientationEvent.prototype.beta;
-
-/** @type {?number} */
-DeviceOrientationEvent.prototype.gamma;
-
-/** @type {boolean} */
-DeviceOrientationEvent.prototype.absolute;
-
-/**
- * @constructor
- */
-function DeviceAcceleration() {}
-
-/** @type {?number} */
-DeviceAcceleration.prototype.x;
-
-/** @type {?number} */
-DeviceAcceleration.prototype.y;
-
-/** @type {?number} */
-DeviceAcceleration.prototype.z;
-
-/**
- * @constructor
- */
-function DeviceRotationRate() {}
-
-/** @type {?number} */
-DeviceOrientationEvent.prototype.alpha;
-
-/** @type {?number} */
-DeviceOrientationEvent.prototype.beta;
-
-/** @type {?number} */
-DeviceOrientationEvent.prototype.gamma;
-
-/**
- * @constructor
- * @extends {Event}
- */
-function DeviceMotionEvent() {}
-
-/** @type {?DeviceAcceleration} */
-DeviceMotionEvent.prototype.acceleration;
-
-/** @type {?DeviceAcceleration} */
-DeviceMotionEvent.prototype.accelerationIncludingGravity;
-
-/** @type {?DeviceRotationRate} */
-DeviceMotionEvent.prototype.rotationRate;
-
-/** @type {?number} */
-DeviceMotionEvent.prototype.interval;

src/objectliterals.jsdoc

@@ -15,7 +15,7 @@
  * @property {ol.Pixel} pixel Pixel coordinate relative to the map viewport.
  * @property {Array.<ol.layer.Layer>|undefined} layers Layers to restrict the
  *     query to. All map layers will be queried if not provided.
- * @property {function(Array.<string|undefined>)} success Callback for
+ * @property {function(Array.<Array.<string|undefined>>)} success Callback for
  *     successful queries. The passed argument is the resulting feature
  *     information for each layer, with array indices being the same as in the
  *     passed `layers` array or in the layer collection as returned from
@@ -120,32 +120,32 @@
 /**
  * @typedef {Object} ol.animation.BounceOptions
  * @property {number} resolution Resolution.
- * @property {number|undefined} start Start.
+ * @property {number|undefined} start The start time of the animation. Default is immediately.
- * @property {number|undefined} duration Duration.
+ * @property {number|undefined} duration The duration of the animation in milliseconds.
  * @property {function(number):number|undefined} easing Easing function.
  */
 
 /**
  * @typedef {Object} ol.animation.PanOptions
  * @property {ol.Coordinate} source Source.
- * @property {number|undefined} start Start.
+ * @property {number|undefined} start The start time of the animation. Default is immediately.
- * @property {number|undefined} duration Duration.
+ * @property {number|undefined} duration The duration of the animation in milliseconds.
  * @property {function(number):number|undefined} easing Easing function.
  */
 
 /**
  * @typedef {Object} ol.animation.RotateOptions
  * @property {number} rotation Rotation.
- * @property {number|undefined} start Start.
+ * @property {number|undefined} start The start time of the animation. Default is immediately.
- * @property {number|undefined} duration Duration.
+ * @property {number|undefined} duration The duration of the animation in milliseconds.
  * @property {function(number):number|undefined} easing Easing function.
  */
 
 /**
  * @typedef {Object} ol.animation.ZoomOptions
  * @property {number} resolution number Resolution.
- * @property {number|undefined} start Start.
+ * @property {number|undefined} start The start time of the animation. Default is immediately.
- * @property {number|undefined} duration Duration.
+ * @property {number|undefined} duration The duration of the animation in milliseconds.
  * @property {function(number):number|undefined} easing Easing function.
  */
 
@@ -226,6 +226,15 @@
  * @property {number|undefined} minResolution Minimum resolution.
  */
 
+/**
+ * @typedef {Object} ol.control.ZoomToExtentOptions
+ * @property {string|undefined} className Class name.
+ * @property {ol.Map|undefined} map Map.
+ * @property {Element|undefined} target Target.
+ * @property {ol.Extent|undefined} extent The extent to zoom to. If
+ *     undefined the validity extent of the view projection is used.
+ */
+
 /**
  * @typedef {Object} ol.interaction.DoubleClickZoomOptions
  * @property {number|undefined} delta The zoom delta applied on each double
@@ -499,6 +508,20 @@
  *     of `url` when the WMS supports multiple urls for GetMap requests.
  */
 
+/**
+ * @typedef {Object} ol.source.VectorOptions
+ * @property {Array.<ol.Attribution>|undefined} attributions Attributions.
+ * @property {Object|string|undefined} data Data to parse.
+ * @property {ol.Extent|undefined} extent Extent.
+ * @property {string|undefined} logo Logo.
+ * @property {ol.parser.Parser} parser Parser instance to parse data
+ *     provided as `data` or fetched from `url`.
+ * @property {ol.ProjectionLike|undefined} projection Projection. EPSG:4326
+ *     is assumed if not defined. TODO: Get projection from the parser instead
+ *     of assuming EPSG:4326.
+ * @property {string|undefined} url Server url providing the vector data.
+ */
+
 /**
  * @typedef {Object} ol.source.VectorSource2Options
  * @property {Array.<ol.Attribution>|undefined} attributions Attributions.

src/ol/array.js

@@ -10,9 +10,15 @@ goog.require('goog.asserts');
  * @return {number} Index.
  */
 ol.array.binaryFindNearest = function(arr, target) {
-  var index = goog.array.binarySearch(arr, target, function(a, b) {
+  var index = goog.array.binarySearch(arr, target,
-    return b - a;
+      /**
-  });
+       * @param {number} a A.
+       * @param {number} b B.
+       * @return {number} b minus a.
+       */
+      function(a, b) {
+        return b - a;
+      });
   if (index >= 0) {
     return index;
   } else if (index == -1) {

src/ol/control/attributioncontrol.js

@@ -126,7 +126,7 @@ ol.control.Attribution.prototype.updateElement_ = function(frameState) {
 
   if (goog.isNull(frameState)) {
     if (this.renderedVisible_) {
-      goog.style.showElement(this.element, false);
+      goog.style.setElementShown(this.element, false);
       this.renderedVisible_ = false;
     }
     return;
@@ -142,14 +142,15 @@ ol.control.Attribution.prototype.updateElement_ = function(frameState) {
   for (attributionKey in this.attributionElements_) {
     if (attributionKey in visibleAttributions) {
       if (!this.attributionElementRenderedVisible_[attributionKey]) {
-        goog.style.showElement(this.attributionElements_[attributionKey], true);
+        goog.style.setElementShown(
+            this.attributionElements_[attributionKey], true);
         this.attributionElementRenderedVisible_[attributionKey] = true;
       }
       delete visibleAttributions[attributionKey];
     }
     else if (attributionKey in hiddenAttributions) {
       if (this.attributionElementRenderedVisible_[attributionKey]) {
-        goog.style.showElement(
+        goog.style.setElementShown(
             this.attributionElements_[attributionKey], false);
         delete this.attributionElementRenderedVisible_[attributionKey];
       }
@@ -173,7 +174,7 @@ ol.control.Attribution.prototype.updateElement_ = function(frameState) {
     attributionElement = goog.dom.createElement(goog.dom.TagName.LI);
     attributionElement.innerHTML =
         hiddenAttributions[attributionKey].getHTML();
-    goog.style.showElement(attributionElement, false);
+    goog.style.setElementShown(attributionElement, false);
     goog.dom.appendChild(this.ulElement_, attributionElement);
     this.attributionElements_[attributionKey] = attributionElement;
   }
@@ -181,7 +182,7 @@ ol.control.Attribution.prototype.updateElement_ = function(frameState) {
   var renderVisible =
       !goog.object.isEmpty(this.attributionElementRenderedVisible_);
   if (this.renderedVisible_ != renderVisible) {
-    goog.style.showElement(this.element, renderVisible);
+    goog.style.setElementShown(this.element, renderVisible);
     this.renderedVisible_ = renderVisible;
   }
 

src/ol/control/logocontrol.js

@@ -73,7 +73,7 @@ ol.control.Logo.prototype.updateElement_ = function(frameState) {
 
   if (goog.isNull(frameState)) {
     if (this.renderedVisible_) {
-      goog.style.showElement(this.element, false);
+      goog.style.setElementShown(this.element, false);
       this.renderedVisible_ = false;
     }
     return;
@@ -104,7 +104,7 @@ ol.control.Logo.prototype.updateElement_ = function(frameState) {
 
   var renderVisible = !goog.object.isEmpty(logos);
   if (this.renderedVisible_ != renderVisible) {
-    goog.style.showElement(this.element, renderVisible);
+    goog.style.setElementShown(this.element, renderVisible);
     this.renderedVisible_ = renderVisible;
   }
 

src/ol/control/scalelinecontrol.js

@@ -194,7 +194,7 @@ ol.control.ScaleLine.prototype.updateElement_ = function() {
 
   if (goog.isNull(view2DState)) {
     if (this.renderedVisible_) {
-      goog.style.showElement(this.element_, false);
+      goog.style.setElementShown(this.element_, false);
       this.renderedVisible_ = false;
     }
     return;
@@ -322,7 +322,7 @@ ol.control.ScaleLine.prototype.updateElement_ = function() {
   }
 
   if (!this.renderedVisible_) {
-    goog.style.showElement(this.element_, true);
+    goog.style.setElementShown(this.element_, true);
     this.renderedVisible_ = true;
   }
 

src/ol/control/zoomtoextentcontrol.exports

@@ -0,0 +1 @@
+@exportClass ol.control.ZoomToExtent ol.control.ZoomToExtentOptions

src/ol/control/zoomtoextentcontrol.js

@@ -0,0 +1,68 @@
+// FIXME works for View2D only
+
+goog.provide('ol.control.ZoomToExtent');
+
+goog.require('goog.dom');
+goog.require('goog.dom.TagName');
+goog.require('goog.events');
+goog.require('goog.events.EventType');
+goog.require('ol.control.Control');
+goog.require('ol.css');
+
+
+
+/**
+ * Create a control that adds a button, which, when pressed, changes
+ * the map view to a specific extent. To style this control use the
+ * css selector .ol-zoom-extent.
+ * @constructor
+ * @extends {ol.control.Control}
+ * @param {ol.control.ZoomToExtentOptions=} opt_options Options.
+ */
+ol.control.ZoomToExtent = function(opt_options) {
+  var options = goog.isDef(opt_options) ? opt_options : {};
+
+  /**
+   * @type {ol.Extent}
+   * @private
+   */
+  this.extent_ = goog.isDef(options.extent) ? options.extent : null;
+
+  var className = goog.isDef(options.className) ? options.className :
+      'ol-zoom-extent';
+
+  var element = goog.dom.createDom(goog.dom.TagName.DIV, {
+    'class': className + ' ' + ol.css.CLASS_UNSELECTABLE
+  });
+  var button = goog.dom.createDom(goog.dom.TagName.A, {
+    'href': '#zoomExtent'
+  });
+  goog.dom.appendChild(element, button);
+
+  goog.events.listen(element, [
+    goog.events.EventType.TOUCHEND,
+    goog.events.EventType.CLICK
+  ], this.handleZoomToExtent_, false, this);
+
+  goog.base(this, {
+    element: element,
+    map: options.map,
+    target: options.target
+  });
+};
+goog.inherits(ol.control.ZoomToExtent, ol.control.Control);
+
+
+/**
+ * @param {goog.events.BrowserEvent} browserEvent Browser event.
+ * @private
+ */
+ol.control.ZoomToExtent.prototype.handleZoomToExtent_ = function(browserEvent) {
+  // prevent #zoomExtent anchor from getting appended to the url
+  browserEvent.preventDefault();
+  var map = this.getMap();
+  var view = map.getView().getView2D();
+  var extent = goog.isNull(this.extent_) ?
+      view.getProjection().getExtent() : this.extent_;
+  view.fitExtent(extent, map.getSize());
+};

src/ol/deviceorientation.js

@@ -33,7 +33,7 @@ ol.DeviceOrientation = function(opt_options) {
 
   /**
    * @private
-   * @type {?number}
+   * @type {goog.events.Key}
    */
   this.listenerKey_ = null;
 

src/ol/extent.js

@@ -215,7 +215,9 @@ ol.extent.getForView2DAndSize =
   var dy = resolution * size[1] / 2;
   var cosRotation = Math.cos(rotation);
   var sinRotation = Math.sin(rotation);
+  /** @type {Array.<number>} */
   var xs = [-dx, -dx, dx, dx];
+  /** @type {Array.<number>} */
   var ys = [-dy, dy, -dy, dy];
   var i, x, y;
   for (i = 0; i < 4; ++i) {

src/ol/geom2/linestringcollection.js

@@ -87,7 +87,7 @@ ol.geom2.LineStringCollection.pack =
     goog.asserts.assert(unpackedLineStrings[i].length > 1);
     start = offset;
     offset = ol.geom2.packPoints(arr, offset, unpackedLineStrings[i], dim);
-    ranges[/** @type {string} */ (start)] = offset;
+    ranges[start + ''] = offset;
   }
   goog.asserts.assert(offset <= capacity);
   var buf = new ol.structs.Buffer(arr, offset);
@@ -103,7 +103,7 @@ ol.geom2.LineStringCollection.prototype.add = function(lineString) {
   var n = lineString.length * this.dim;
   var offset = this.buf.allocate(n);
   goog.asserts.assert(offset != -1);
-  this.ranges[/** @type {string} */ (offset)] = offset + n;
+  this.ranges[offset + ''] = offset + n;
   ol.geom2.packPoints(this.buf.getArray(), offset, lineString, this.dim);
   return offset;
 };
@@ -115,7 +115,7 @@ ol.geom2.LineStringCollection.prototype.add = function(lineString) {
  */
 ol.geom2.LineStringCollection.prototype.get = function(offset) {
   goog.asserts.assert(offset in this.ranges);
-  var range = this.ranges[/** @type {string} */ (offset)];
+  var range = this.ranges[offset + ''];
   return ol.geom2.unpackPoints(
       this.buf.getArray(), offset, range, this.dim);
 };
@@ -165,9 +165,9 @@ ol.geom2.LineStringCollection.prototype.getIndices = function() {
  */
 ol.geom2.LineStringCollection.prototype.remove = function(offset) {
   goog.asserts.assert(offset in this.ranges);
-  var range = this.ranges[/** @type {string} */ (offset)];
+  var range = this.ranges[offset + ''];
   this.buf.remove(range - offset, offset);
-  delete this.ranges[/** @type {string} */ (offset)];
+  delete this.ranges[offset + ''];
 };
 
 
@@ -179,7 +179,7 @@ ol.geom2.LineStringCollection.prototype.remove = function(offset) {
 ol.geom2.LineStringCollection.prototype.set = function(offset, lineString) {
   var dim = this.dim;
   goog.asserts.assert(offset in this.ranges);
-  var range = this.ranges[/** @type {string} */ (offset)];
+  var range = this.ranges[offset + ''];
   if (lineString.length * dim == range - offset) {
     ol.geom2.packPoints(this.buf.getArray(), offset, lineString, dim);
     this.buf.markDirty(range - offset, offset);

src/ol/image.js

@@ -34,6 +34,8 @@ ol.ImageState = {
  */
 ol.Image = function(extent, resolution, src, crossOrigin, attributions) {
 
+  goog.base(this);
+
   /**
    * @private
    * @type {Array.<ol.Attribution>}

src/ol/kinetic.js

@@ -108,10 +108,15 @@ ol.Kinetic.prototype.pan = function(source) {
   var initialVelocity = this.initialVelocity_;
   var minVelocity = this.minVelocity_;
   var duration = this.getDuration_();
-  var easingFunction = function(t) {
+  var easingFunction = (
-    return initialVelocity * (Math.exp((decay * t) * duration) - 1) /
+      /**
-        (minVelocity - initialVelocity);
+       * @param {number} t T.
-  };
+       * @return {number} Easing.
+       */
+      function(t) {
+        return initialVelocity * (Math.exp((decay * t) * duration) - 1) /
+            (minVelocity - initialVelocity);
+      });
   return ol.animation.pan({
     source: source,
     duration: duration,

src/ol/layer/layer.exports

@@ -0,0 +1,2 @@
+@exportSymbol ol.layer.Layer
+@exportProperty ol.layer.Layer.prototype.getSource

src/ol/layer/layer.js

@@ -54,11 +54,17 @@ ol.layer.Layer = function(options) {
   var values = goog.object.clone(options);
   delete values.source;
 
+  /** @type {number} */
   values.brightness = goog.isDef(values.brightness) ? values.brightness : 0;
+  /** @type {number} */
   values.contrast = goog.isDef(values.contrast) ? values.contrast : 1;
+  /** @type {number} */
   values.hue = goog.isDef(values.hue) ? values.hue : 0;
+  /** @type {number} */
   values.opacity = goog.isDef(values.opacity) ? values.opacity : 1;
+  /** @type {number} */
   values.saturation = goog.isDef(values.saturation) ? values.saturation : 1;
+  /** @type {boolean} */
   values.visible = goog.isDef(values.visible) ? values.visible : true;
 
   this.setValues(values);

src/ol/layer/vectorlayer.exports

@@ -1,4 +1 @@
 @exportClass ol.layer.Vector ol.layer.VectorLayerOptions
-
-@exportProperty ol.layer.Vector.prototype.addFeatures
-@exportProperty ol.layer.Vector.prototype.parseFeatures

src/ol/layer/vectorlayer.js

@@ -10,6 +10,7 @@ goog.require('ol.expr.Literal');
 goog.require('ol.expr.Logical');
 goog.require('ol.expr.LogicalOp');
 goog.require('ol.expr.functions');
+goog.require('ol.extent');
 goog.require('ol.geom.GeometryType');
 goog.require('ol.geom.SharedVertices');
 goog.require('ol.layer.Layer');
@@ -200,6 +201,34 @@ ol.layer.FeatureCache.prototype.getFeaturesByIds_ = function(ids) {
 };
 
 
+/**
+ * Remove a feature from the cache.
+ * @param {ol.Feature} feature Feature.
+ */
+ol.layer.FeatureCache.prototype.remove = function(feature) {
+  var id = goog.getUid(feature).toString(),
+      geometry = feature.getGeometry();
+
+  delete this.idLookup_[id];
+
+  // index by geometry type and bounding box
+  if (!goog.isNull(geometry)) {
+    var geometryType = geometry.getType();
+    delete this.geometryTypeIndex_[geometryType][id];
+    this.rTree_.remove(geometry.getBounds(), feature);
+  }
+};
+
+
+/**
+ * TODO: Create a VectorLayerEvent with ADD and REMOVE event types
+ * @typedef {{extent: (ol.Extent|undefined),
+ *            features: (Array.<ol.Feature>|undefined),
+ *            type: goog.events.EventType}}
+ */
+ol.layer.VectorLayerEventObject;
+
+
 
 /**
  * @constructor
@@ -262,11 +291,21 @@ goog.inherits(ol.layer.Vector, ol.layer.Layer);
  * @param {Array.<ol.Feature>} features Array of features.
  */
 ol.layer.Vector.prototype.addFeatures = function(features) {
+  var extent = ol.extent.createEmpty(),
+      feature, geometry;
   for (var i = 0, ii = features.length; i < ii; ++i) {
-    this.featureCache_.add(features[i]);
+    feature = features[i];
+    this.featureCache_.add(feature);
+    geometry = feature.getGeometry();
+    if (!goog.isNull(geometry)) {
+      ol.extent.extend(extent, geometry.getBounds());
+    }
   }
-  // TODO: events for real - listeners want features and extent here
+  this.dispatchEvent(/** @type {ol.layer.VectorLayerEventObject} */ ({
-  this.dispatchEvent(goog.events.EventType.CHANGE);
+    extent: extent,
+    features: features,
+    type: goog.events.EventType.CHANGE
+  }));
 };
 
 
@@ -279,34 +318,26 @@ ol.layer.Vector.prototype.getVectorSource = function() {
 
 
 /**
- * @param {ol.expr.Expression=} opt_expr Expression for filtering.
+ * Get all features whose bounding box intersects the provided extent. This
- * @return {Array.<ol.Feature>} Array of features.
+ * method is intended for being called by the renderer. When null is returned,
- */
+ * the renderer should not waste time rendering, and `opt_callback` is
-ol.layer.Vector.prototype.getFeatures = function(opt_expr) {
+ * usually a function that requests a renderFrame, which will be called as soon
-  return goog.object.getValues(
+ * as the data for `extent` is available.
-      this.featureCache_.getFeaturesObject(opt_expr));
-};
-
-
-/**
- * @param {ol.expr.Expression=} opt_expr Expression for filtering.
- * @return {Object.<string, ol.Feature>} Features.
- */
-ol.layer.Vector.prototype.getFeaturesObject = function(opt_expr) {
-  return this.featureCache_.getFeaturesObject(opt_expr);
-};
-
-
-/**
- * Get all features whose bounding box intersects the provided extent.
  *
  * @param {ol.Extent} extent Bounding extent.
+ * @param {ol.Projection} projection Target projection.
  * @param {ol.geom.GeometryType=} opt_type Optional geometry type.
- * @return {Object.<string, ol.Feature>} Features.
+ * @param {Function=} opt_callback Callback to call when data is parsed.
+ * @return {Object.<string, ol.Feature>} Features or null if source is loading
+ *     data for `extent`.
  */
 ol.layer.Vector.prototype.getFeaturesObjectForExtent = function(extent,
-    opt_type) {
+    projection, opt_type, opt_callback) {
-  return this.featureCache_.getFeaturesObjectForExtent(extent, opt_type);
+  var source = this.getSource();
+  return source.prepareFeatures(this, extent, projection, opt_callback) ==
+      ol.source.VectorLoadState.LOADING ?
+          null :
+          this.featureCache_.getFeaturesObjectForExtent(extent, opt_type);
 };
 
 
@@ -464,6 +495,29 @@ ol.layer.Vector.prototype.getTransformFeatureInfo = function() {
 };
 
 
+/**
+ * Remove features from the layer.
+ * @param {Array.<ol.Feature>} features Features to remove.
+ */
+ol.layer.Vector.prototype.removeFeatures = function(features) {
+  var extent = ol.extent.createEmpty(),
+      feature, geometry;
+  for (var i = 0, ii = features.length; i < ii; ++i) {
+    feature = features[i];
+    this.featureCache_.remove(feature);
+    geometry = feature.getGeometry();
+    if (!goog.isNull(geometry)) {
+      ol.extent.extend(extent, geometry.getBounds());
+    }
+  }
+  this.dispatchEvent(/** @type {ol.layer.VectorLayerEventObject} */ ({
+    extent: extent,
+    features: features,
+    type: goog.events.EventType.CHANGE
+  }));
+};
+
+
 /**
  * @param {Array.<ol.Feature>} features Features.
  * @return {string} Feature info.

src/ol/map.js

@@ -13,8 +13,6 @@ goog.require('goog.asserts');
 goog.require('goog.async.AnimationDelay');
 goog.require('goog.async.Delay');
 goog.require('goog.debug.Console');
-goog.require('goog.debug.Logger');
-goog.require('goog.debug.Logger.Level');
 goog.require('goog.dispose');
 goog.require('goog.dom');
 goog.require('goog.dom.TagName');
@@ -27,6 +25,8 @@ goog.require('goog.events.KeyHandler');
 goog.require('goog.events.KeyHandler.EventType');
 goog.require('goog.events.MouseWheelHandler');
 goog.require('goog.events.MouseWheelHandler.EventType');
+goog.require('goog.log');
+goog.require('goog.log.Level');
 goog.require('goog.object');
 goog.require('goog.style');
 goog.require('goog.vec.Mat4');
@@ -196,7 +196,7 @@ ol.Map = function(options) {
 
   /**
    * @private
-   * @type {?number}
+   * @type {goog.events.Key}
    */
   this.viewPropertyListenerKey_ = null;
 
@@ -1169,7 +1169,7 @@ ol.proj.addCommonProjections();
 if (goog.DEBUG) {
   (function() {
     goog.debug.Console.autoInstall();
-    var logger = goog.debug.Logger.getLogger('ol');
+    var logger = goog.log.getLogger('ol');
-    logger.setLevel(goog.debug.Logger.Level.FINEST);
+    logger.setLevel(goog.log.Level.FINEST);
   })();
 }

src/ol/mapbrowserevent.js

@@ -49,20 +49,6 @@ ol.MapBrowserEvent = function(type, map, browserEvent, opt_frameState) {
 goog.inherits(ol.MapBrowserEvent, ol.MapEvent);
 
 
-/**
- * IE specific events.
- * See http://msdn.microsoft.com/en-us/library/ie/hh673557(v=vs.85).aspx
- * FIXME: replace with goog.events.EventType enum once we use
- *        goog/events/eventtype.js above r2211
- * @enum {string}
- */
-ol.MapBrowserEvent.IEEventType = {
-  MSPOINTERDOWN: 'MSPointerDown',
-  MSPOINTERMOVE: 'MSPointerMove',
-  MSPOINTERUP: 'MSPointerUp'
-};
-
-
 /**
  * @return {ol.Coordinate} Coordinate.
  */
@@ -203,15 +189,15 @@ ol.MapBrowserEventHandler = function(map) {
   this.touchListenerKeys_ = [
     goog.events.listen(element, [
       goog.events.EventType.TOUCHSTART,
-      ol.MapBrowserEvent.IEEventType.MSPOINTERDOWN
+      goog.events.EventType.MSPOINTERDOWN
     ], this.handleTouchStart_, false, this),
     goog.events.listen(element, [
       goog.events.EventType.TOUCHMOVE,
-      ol.MapBrowserEvent.IEEventType.MSPOINTERMOVE
+      goog.events.EventType.MSPOINTERMOVE
     ], this.handleTouchMove_, false, this),
     goog.events.listen(element, [
       goog.events.EventType.TOUCHEND,
-      ol.MapBrowserEvent.IEEventType.MSPOINTERUP
+      goog.events.EventType.MSPOINTERUP
     ], this.handleTouchEnd_, false, this)
   ];
 

src/ol/object.exports

@@ -5,7 +5,6 @@
 @exportProperty ol.Object.prototype.on
 @exportProperty ol.Object.prototype.once
 @exportProperty ol.Object.prototype.set
-@exportProperty ol.Object.prototype.setOptions
 @exportProperty ol.Object.prototype.setValues
 @exportProperty ol.Object.prototype.un
 @exportProperty ol.Object.prototype.unByKey

src/ol/object.js

@@ -118,7 +118,7 @@ ol.Object.getGetterName = function(key) {
 
 /**
  * @param {ol.Object} obj Object.
- * @return {Object.<string, ?number>} Listeners.
+ * @return {Object.<string, goog.events.Key>} Listeners.
  */
 ol.Object.getListeners = function(obj) {
   return obj[ol.ObjectProperty.BINDINGS] ||
@@ -235,7 +235,7 @@ ol.Object.prototype.notifyInternal_ = function(key) {
  * @param {Function} listener The listener function.
  * @param {Object=} opt_scope Object is whose scope to call
  *     the listener.
- * @return {?number} Unique key for the listener.
+ * @return {goog.events.Key} Unique key for the listener.
  */
 ol.Object.prototype.on = function(type, listener, opt_scope) {
   return goog.events.listen(this, type, listener, false, opt_scope);
@@ -248,7 +248,7 @@ ol.Object.prototype.on = function(type, listener, opt_scope) {
  * @param {Function} listener The listener function.
  * @param {Object=} opt_scope Object is whose scope to call
  *     the listener.
- * @return {?number} Unique key for the listener.
+ * @return {goog.events.Key} Unique key for the listener.
  */
 ol.Object.prototype.once = function(type, listener, opt_scope) {
   return goog.events.listenOnce(this, type, listener, false, opt_scope);
@@ -281,12 +281,12 @@ ol.Object.prototype.set = function(key, value) {
 
 /**
  * Sets a collection of key-value pairs.
- * @param {Object.<string, *>} options Options.
+ * @param {Object.<string, *>} values Values.
  */
-ol.Object.prototype.setOptions = function(options) {
+ol.Object.prototype.setValues = function(values) {
   var key, value, setterName;
-  for (key in options) {
+  for (key in values) {
-    value = options[key];
+    value = values[key];
     setterName = ol.Object.getSetterName(key);
     if (this[setterName]) {
       this[setterName](value);
@@ -297,13 +297,6 @@ ol.Object.prototype.setOptions = function(options) {
 };
 
 
-/**
- * Sets a collection of key-value pairs.
- * @param {Object.<string, *>} values Values.
- */
-ol.Object.prototype.setValues = ol.Object.prototype.setOptions;
-
-
 /**
  * Removes a binding. Unbinding will set the unbound property to the current
  *     value. The object will not be notified, as the value has not changed.

src/ol/overlay.js

@@ -78,6 +78,12 @@ ol.Overlay = function(options) {
     visible: true
   };
 
+  /**
+   * @private
+   * @type {goog.events.Key}
+   */
+  this.mapPostrenderListenerKey_ = null;
+
   goog.events.listen(
       this, ol.Object.getChangeEventType(ol.OverlayProperty.ELEMENT),
       this.handleElementChanged, false, this);
@@ -280,7 +286,7 @@ ol.Overlay.prototype.updatePixelPosition_ = function() {
   var position = this.getPosition();
   if (!goog.isDef(map) || !map.isDef() || !goog.isDef(position)) {
     if (this.rendered_.visible) {
-      goog.style.showElement(this.element_, false);
+      goog.style.setElementShown(this.element_, false);
       this.rendered_.visible = false;
     }
     return;
@@ -329,7 +335,7 @@ ol.Overlay.prototype.updatePixelPosition_ = function() {
   }
 
   if (!this.rendered_.visible) {
-    goog.style.showElement(this.element_, true);
+    goog.style.setElementShown(this.element_, true);
     this.rendered_.visible = true;
   }
 

src/ol/renderer/canvas/canvasmaprenderer.js

@@ -94,7 +94,7 @@ ol.renderer.canvas.Map.prototype.renderFrame = function(frameState) {
 
   if (goog.isNull(frameState)) {
     if (this.renderedVisible_) {
-      goog.style.showElement(this.canvas_, false);
+      goog.style.setElementShown(this.canvas_, false);
       this.renderedVisible_ = false;
     }
     return;
@@ -156,7 +156,7 @@ ol.renderer.canvas.Map.prototype.renderFrame = function(frameState) {
   }
 
   if (!this.renderedVisible_) {
-    goog.style.showElement(this.canvas_, true);
+    goog.style.setElementShown(this.canvas_, true);
     this.renderedVisible_ = true;
   }
 

src/ol/renderer/canvas/canvasvectorlayerrenderer.js

@@ -86,8 +86,7 @@ ol.renderer.canvas.VectorLayer = function(mapRenderer, layer) {
    */
   this.tileCache_ = new ol.TileCache(
       ol.renderer.canvas.VectorLayer.TILECACHE_SIZE);
-  // TODO: this is far too coarse, we want extent of added features
+  goog.events.listen(layer, goog.events.EventType.CHANGE,
-  goog.events.listenOnce(layer, goog.events.EventType.CHANGE,
       this.handleLayerChange_, false, this);
 
   /**
@@ -177,10 +176,13 @@ goog.inherits(ol.renderer.canvas.VectorLayer, ol.renderer.canvas.Layer);
  * @private
  */
 ol.renderer.canvas.VectorLayer.prototype.expireTiles_ = function(opt_extent) {
+  var tileCache = this.tileCache_;
   if (goog.isDef(opt_extent)) {
-    // TODO: implement this
+    var tileRange = this.tileGrid_.getTileRangeForExtentAndZ(opt_extent, 0);
+    tileCache.pruneTileRange(tileRange);
+  } else {
+    tileCache.clear();
   }
-  this.tileCache_.clear();
 };
 
 
@@ -228,9 +230,11 @@ ol.renderer.canvas.VectorLayer.prototype.getFeatureInfoForPixel =
  * @param {function(Array.<ol.Feature>, ol.layer.Layer)} success Callback for
  *     successful queries. The passed arguments are the resulting features
  *     and the layer.
+ * @param {function()=} opt_error Callback for unsuccessful queries.
  */
 ol.renderer.canvas.VectorLayer.prototype.getFeaturesForPixel =
-    function(pixel, success) {
+    function(pixel, success, opt_error) {
+  // TODO What do we want to pass to the error callback?
   var map = this.getMap();
   var result = [];
 
@@ -247,7 +251,15 @@ ol.renderer.canvas.VectorLayer.prototype.getFeaturesForPixel =
     var locationMin = [location[0] - halfMaxWidth, location[1] - halfMaxHeight];
     var locationMax = [location[0] + halfMaxWidth, location[1] + halfMaxHeight];
     var locationBbox = ol.extent.boundingExtent([locationMin, locationMax]);
-    var candidates = layer.getFeaturesObjectForExtent(locationBbox);
+    var candidates = layer.getFeaturesObjectForExtent(locationBbox,
+        map.getView().getView2D().getProjection());
+    if (goog.isNull(candidates)) {
+      // data is not loaded
+      if (goog.isDef(opt_error)) {
+        goog.global.setTimeout(function() { opt_error(); }, 0);
+      }
+      return;
+    }
 
     var candidate, geom, type, symbolBounds, symbolSize, halfWidth, halfHeight,
         coordinates, j;
@@ -295,12 +307,11 @@ ol.renderer.canvas.VectorLayer.prototype.getFeaturesForPixel =
 
 
 /**
- * @param {goog.events.Event} event Layer change event.
+ * @param {ol.layer.VectorLayerEventObject} event Layer change event.
  * @private
  */
 ol.renderer.canvas.VectorLayer.prototype.handleLayerChange_ = function(event) {
-  // TODO: get rid of this in favor of vector specific events
+  this.expireTiles_(event.extent);
-  this.expireTiles_();
   this.requestMapRenderFrame_();
 };
 
@@ -446,6 +457,7 @@ ol.renderer.canvas.VectorLayer.prototype.renderFrame =
       dirty = false,
       i, type, tileExtent,
       groups, group, j, numGroups, featuresObject, tileHasFeatures;
+  fetchTileData:
   for (x = tileRange.minX; x <= tileRange.maxX; ++x) {
     for (y = tileRange.minY; y <= tileRange.maxY; ++y) {
       tileCoord = new ol.TileCoord(0, x, y);
@@ -464,7 +476,12 @@ ol.renderer.canvas.VectorLayer.prototype.renderFrame =
           if (!goog.isDef(featuresToRender[type])) {
             featuresToRender[type] = {};
           }
-          featuresObject = layer.getFeaturesObjectForExtent(tileExtent, type);
+          featuresObject = layer.getFeaturesObjectForExtent(tileExtent,
+              projection, type, this.requestMapRenderFrame_);
+          if (goog.isNull(featuresObject)) {
+            deferred = true;
+            break fetchTileData;
+          }
           tileHasFeatures = tileHasFeatures ||
               !goog.object.isEmpty(featuresObject);
           goog.object.extend(featuresToRender[type], featuresObject);
@@ -510,6 +527,7 @@ ol.renderer.canvas.VectorLayer.prototype.renderFrame =
       tile.getContext('2d').drawImage(sketchCanvas,
           (tileRange.minX - tileCoord.x) * tileSize[0],
           (tileCoord.y - tileRange.maxY) * tileSize[1]);
+      // TODO: Create an ol.VectorTile subclass of ol.Tile
       this.tileCache_.set(key, [tile, symbolSizes, maxSymbolSize]);
     }
     finalContext.drawImage(tile,

src/ol/renderer/dom/dommaprenderer.js

@@ -71,7 +71,7 @@ ol.renderer.dom.Map.prototype.renderFrame = function(frameState) {
 
   if (goog.isNull(frameState)) {
     if (this.renderedVisible_) {
-      goog.style.showElement(this.layersPane_, false);
+      goog.style.setElementShown(this.layersPane_, false);
       this.renderedVisible_ = false;
     }
     return;
@@ -98,7 +98,7 @@ ol.renderer.dom.Map.prototype.renderFrame = function(frameState) {
   }
 
   if (!this.renderedVisible_) {
-    goog.style.showElement(this.layersPane_, true);
+    goog.style.setElementShown(this.layersPane_, true);
     this.renderedVisible_ = true;
   }
 

src/ol/renderer/dom/domtilelayerrenderer.js

@@ -76,7 +76,7 @@ ol.renderer.dom.TileLayer.prototype.renderFrame =
 
   if (!layerState.visible) {
     if (this.renderedVisible_) {
-      goog.style.showElement(this.target, false);
+      goog.style.setElementShown(this.target, false);
       this.renderedVisible_ = false;
     }
     return;
@@ -226,7 +226,7 @@ ol.renderer.dom.TileLayer.prototype.renderFrame =
   }
 
   if (layerState.visible && !this.renderedVisible_) {
-    goog.style.showElement(this.target, true);
+    goog.style.setElementShown(this.target, true);
     this.renderedVisible_ = true;
   }
 

src/ol/renderer/maprenderer.js

@@ -101,7 +101,7 @@ ol.renderer.Map.prototype.getCanvas = goog.functions.NULL;
 /**
  * @param {ol.Pixel} pixel Pixel coordinate relative to the map viewport.
  * @param {Array.<ol.layer.Layer>} layers Layers to query.
- * @param {function(Array.<ol.Feature|string>)} success Callback for
+ * @param {function(Array.<Array.<string|undefined>>)} success Callback for
  *     successful queries. The passed argument is the resulting feature
  *     information.  Layers that are able to provide attribute data will put
  *     ol.Feature instances, other layers will put a string which can either
@@ -137,7 +137,7 @@ ol.renderer.Map.prototype.getFeatureInfoForPixel =
 /**
  * @param {ol.Pixel} pixel Pixel coordinate relative to the map viewport.
  * @param {Array.<ol.layer.Layer>} layers Layers to query.
- * @param {function(Array.<ol.Feature|string>)} success Callback for
+ * @param {function(Array.<Array.<ol.Feature|undefined>>)} success Callback for
  *     successful queries. The passed argument is the resulting feature
  *     information.  Layers that are able to provide attribute data will put
  *     ol.Feature instances, other layers will put a string which can either

src/ol/renderer/webgl/webglmaprenderer.js

@@ -4,11 +4,12 @@ goog.provide('ol.renderer.webgl.Map');
 
 goog.require('goog.array');
 goog.require('goog.asserts');
-goog.require('goog.debug.Logger');
 goog.require('goog.dom');
 goog.require('goog.dom.TagName');
 goog.require('goog.events');
 goog.require('goog.events.Event');
+goog.require('goog.log');
+goog.require('goog.log.Logger');
 goog.require('goog.object');
 goog.require('goog.style');
 goog.require('goog.webgl');
@@ -417,7 +418,7 @@ ol.renderer.webgl.Map.prototype.getProgram = function(
     if (goog.DEBUG) {
       if (!gl.getProgramParameter(program, goog.webgl.LINK_STATUS) &&
           !gl.isContextLost()) {
-        this.logger_.severe(gl.getProgramInfoLog(program));
+        goog.log.error(this.logger_, gl.getProgramInfoLog(program));
       }
     }
     goog.asserts.assert(
@@ -445,7 +446,7 @@ ol.renderer.webgl.Map.prototype.getShader = function(shaderObject) {
     if (goog.DEBUG) {
       if (!gl.getShaderParameter(shader, goog.webgl.COMPILE_STATUS) &&
           !gl.isContextLost()) {
-        this.logger_.severe(gl.getShaderInfoLog(shader));
+        goog.log.error(this.logger_, gl.getShaderInfoLog(shader));
       }
     }
     goog.asserts.assert(
@@ -519,10 +520,10 @@ ol.renderer.webgl.Map.prototype.isTileTextureLoaded = function(tile) {
 
 /**
  * @private
- * @type {goog.debug.Logger}
+ * @type {goog.log.Logger}
  */
 ol.renderer.webgl.Map.prototype.logger_ =
-    goog.debug.Logger.getLogger('ol.renderer.webgl.Map');
+    goog.log.getLogger('ol.renderer.webgl.Map');
 
 
 /**
@@ -538,7 +539,7 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
 
   if (goog.isNull(frameState)) {
     if (this.renderedVisible_) {
-      goog.style.showElement(this.canvas_, false);
+      goog.style.setElementShown(this.canvas_, false);
       this.renderedVisible_ = false;
     }
     return false;
@@ -651,7 +652,7 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
   }
 
   if (!this.renderedVisible_) {
-    goog.style.showElement(this.canvas_, true);
+    goog.style.setElementShown(this.canvas_, true);
     this.renderedVisible_ = true;
   }