3.11.0-beta.2

Update all dependencies.

.editorconfig

@@ -0,0 +1,17 @@
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+indent_size = 2
+trim_trailing_whitespace = false
+
+[Makefile]
+indent_style = tab
+indent_size = 4

.gitignore

@@ -1,7 +1,5 @@
 *.pyc
 /build/
-/examples/*.html.png
-/examples/example-list.js
-/examples/example-list.xml
 /node_modules/
 /dist/
+/coverage/

.npmignore

@@ -1,5 +1,2 @@
 *.pyc
 /build/
-/examples/*.html.png
-/examples/example-list.js
-/examples/example-list.xml

.travis.yml

@@ -1,8 +1,31 @@
+sudo: required
+dist: trusty
+
+language: node_js
+
+node_js:
+  - "4"
+
+cache:
+  directories:
+    - node_modules
+env:
+  - DISPLAY=:99.0
+
 before_install:
+  - "npm prune"
   - "sudo pip install -r requirements.txt"
-  - "npm install -g npm && npm install"
 
 before_script:
   - "rm src/ol/renderer/webgl/*shader.js"
+  - "sh -e /etc/init.d/xvfb start"
 
-script: "./build.py ci"
+script: "make ci"
+
+after_success:
+  - "make test-coverage"
+  - "cat coverage/lcov.info | ./node_modules/.bin/coveralls"
+
+branches:
+  only:
+    - master

CONTRIBUTING.md

@@ -14,13 +14,21 @@ When you want to get involved and discuss new features or changes, please use [t
 Please use the [GitHub issue tracker](https://github.com/openlayers/ol3/issues). Before creating a new issue, do a quick search to see if the problem has been reported already.
 
 
+## Getting Familiar with the Code in the Repository
+
+Look for `readme.md` files! Several directories contain a `readme.md` file that explains the contents of the directory and how to work with them.
+
+
 ## Contributing Code
 
+See [`DEVELOPING.md`](https://github.com/openlayers/ol3/blob/master/DEVELOPING.md) to learn how to get started developing.
+
 Our preferred means of receiving contributions is through [pull requests](https://help.github.com/articles/using-pull-requests). Make sure
 that your pull request follows our pull request guidelines below before submitting it.
 
 This page describes what you need to know to contribute code to ol3 as a developer.
 
+
 ## Contributor License Agreement
 
 Before accepting a contribution, we ask that you provide us a Contributor
@@ -30,168 +38,11 @@ Contributor License Agreement](https://raw.github.com/openlayers/cla/master/ccla
 making your contribution as an individual, you can submit a digital [Individual
 Contributor License Agreement](https://docs.google.com/spreadsheet/viewform?formkey=dGNNVUJEMXF2dERTU0FXM3JjNVBQblE6MQ).
 
-## Setting up development environment
-
-You will obviously start by
-[forking](https://github.com/openlayers/ol3/fork_select) the ol3 repository.
-
-### Travis CI
-
-The Travis CI hook is enabled on the Github repository. This means every pull request
-is run through a full test suite to ensure it compiles and passes the tests. Failing
-pull requests will not be merged.
-
-Although not mandatory, it is also recommended to set up Travis CI for your ol3 fork.
-For that go to your ol3 fork's Service Hooks page and set up the Travis hook.
-Then every time you push to your fork, the test suite will be run. This means
-errors can be caught before creating a pull request. For those making
-small or occasional contributions, this may be enough to check that your contributions
-are ok; in this case, you do not need to install the build tools on your local environment
-as described below.
-
-### Development dependencies
-
-The minimum requirements are:
-
-* Git
-* [Node.js](http://nodejs.org/) (0.10.x or higher)
-* Python 2.6 or 2.7 with a couple of extra modules (see below)
-* Java 7 (JRE and JDK)
-
-The executables `git`, `java`, `jar`, and `python` should be in your `PATH`.
-
-You can check your configuration by running:
-
-    $ ./build.py checkdeps
-
-To install the Node.js dependencies run
-
-    $ npm install
-
-To install the extra Python modules, run:
-
-    $ sudo pip install -r requirements.txt
-or
-
-    $ cat requirements.txt | sudo xargs easy_install
-
-depending on your OS and Python installation.
-
-## Working with the build tool
-
-As an ol3 developer you will need to use the `build.py` Python script. This is
-the script to use to run the linter, the compiler, the tests, etc.  Windows users
-can use `build.cmd` which is a thin wrapper around `build.py`.
-
-The `build.py` script is equivalent to a Makefile. It is actually based on
-[pake](https://github.com/twpayne/pake/), which is a simple implementation of
-`make` in Python.
-
-The usage of the script is:
-
-    $ ./build.py <target>
-
-where `<target>` is the name of the build target you want to execute. For
-example:
-
-    $ ./build.py test
-
-The main build targets are `serve`, `lint`, `build`, `test`, and `check`. The
-latter is a meta-target that basically runs `lint`, `build`, and `test`.
-
-The `serve` target starts a node-based web server, which we will refer to as the *dev server*. You'll need to start that server for running the examples and the tests in a browser. More information on that further down.
-
-Other targets include `apidoc` and `ci`. The latter is the target used on Travis CI. See ol3's [Travis configuration file](https://github.com/openlayers/ol3/blob/master/.travis.yml).
-
-## Running the `check` target
-
-The `check` target is to be run before pushing code to GitHub and opening pull
-requests. Branches that don't pass `check` won't pass the integration tests,
-and have therefore no chance of being merged into `master`.
-
-To run the `check` target:
-
-    $ ./build.py check
-
-If you want to run the full suite of integration tests, see "Running the integration
-tests" below.
-
-## Running examples
-
-To run the examples you first need to start the dev server:
-
-    $ ./build.py serve
-
-Then, just point your browser <http://localhost:3000/examples> in your browser. For example <http://localhost:3000/examples/side-by-side.html>.
-
-Run examples against the `ol.js` standalone build:
-
-The examples can also be run against the `ol.js` standalone lib, just like the examples
-[hosted](http://openlayers.github.com/ol3/master/examples/) on GitHub. Start by
-executing the `host-examples` build target:
-
-    $ ./build.py host-examples
-
-After running `host-examples` you can now open the examples index page in the browser, for example: <http://localhost/~elemoine/ol3/build/hosted/master/examples/>. (This assumes that the `hosted` directory is a web directory, served by Apache for example.)
-
-Append `?mode=raw` to make the example work in full debug mode. In raw mode the OpenLayers and Closure Library scripts are loaded individually by the Closure Library's `base.js` script (which the example page loads and executes before any other script).
-
-## Running tests
-
-To run the tests in a browser start the dev server (`./build.py serve`) and open <http://localhost:3000/test/index.html> in the browser.
-
-To run the tests on the console (headless testing with PhantomJS) use the `test` target:
-
-    $ ./build.py test
-
-See also the test-specific [README](../master/test/README.md).
-
-## Running the integration tests
-
-When you submit a pull request the [Travis continuous integration
-server](https://travis-ci.org/) will run a full suite of tests, including
-building all versions of the library and checking that all of the examples
-work.  You will receive an email with the results, and the status will be
-displayed in the pull request.
-
-To run the full suite of integration tests use the `ci` target:
-
-    $ ./build.py ci
-
-Running the full suite of integration tests currently takes 5-10 minutes.
-
-This makes sure that your commit won't break the build. It also runs JSDoc3 to
-make sure that there are no invalid API doc directives.
-
-## Adding examples
-
-Adding functionality often implies adding one or several examples. This
-section provides explanations related to adding examples.
-
-The examples are located in the `examples` directory. Adding a new example
-implies creating two files in this directory, an `.html` file and a `.js` file.
-See `examples/simple.html` and `examples/simple.js` for instance.
-
-The `.html` file needs to include a script tag with
-`loader.js?id=<example_name>` as its `src`. For example, if the two files for
-the example are `myexample.js` and `myexample.html` then the script tag's `src`
-should be set to `myexample`.
-
-You can use `simple.js` and `simple.html` as templates for new examples.
-
-### Use of the `goog` namespace in examples
-
-Short story: the ol3 examples should not use the `goog` namespace, except
-for `goog.require`.
-
-Longer story: we want that the ol3 examples work in multiple modes, with the
-standalone lib (which has implications of the symbols and properties we
-export), and compiled together with the ol3 library.
-
-Compiling the examples together with the library makes it mandatory to declare dependencies with `goog.require` statements.
 
 ## Pull request guidelines
 
+Before working on a pull request, create an issue explaining what you want to contribute. This ensures that your pull request won't go unnoticed, and that you are not contributing something that is not suitable for the project. Once a core developer has set the `pull request accepted` label on the issue, you can submit a pull request. The pull request description should reference the original issue.
+
 Your pull request must:
 
  * Follow OpenLayers 3's coding style.
@@ -213,7 +64,7 @@ Your pull request must:
 
 It is strongly recommended that you run
 
-    $ ./build.py check
+    $ make check
 
 before every commit.  This will catch many problems quickly, and it is much
 faster than waiting for the Travis CI integration tests to run.
@@ -233,9 +84,9 @@ Guide](http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml).
 This is checked using the [Closure
 Linter](https://developers.google.com/closure/utilities/) in strict mode.  You
 can run the linter locally on your machine before committing using the `lint`
-target to `build.py`:
+target:
 
-    $ ./build.py lint
+    $ make lint
 
 In addition to fixing problems identified by the linter, please also follow the
 style of the existing OpenLayers 3 code, which includes:
@@ -260,13 +111,21 @@ style of the existing OpenLayers 3 code, which includes:
 
  * Use uppercase for `@const` variables.
 
+### Configure your editor
+
+If possible, configure your editor to follow the coding conventions of the
+library.  A `.editorconfig` file is included at the root of the repository that
+can be used to configure whitespace and charset handling in your editor.  See
+that file for a description of the conventions.  The [EditorConfig](
+http://editorconfig.org/#download) site links to plugins for various editors.
+
 ### Pass the integration tests run automatically by the Travis CI system
 
 The integration tests contain a number of automated checks to ensure that the
 code follows the OpenLayers 3 style and does not break tests or examples.  You
 can run the integration tests locally using the `ci` target:
 
-    $ ./build.py ci
+    $ make ci
 
 
 ### Address a single issue or add a single item of functionality
@@ -322,3 +181,33 @@ Occasionally other changes to `master` might mean that your pull request cannot
 be merged automatically.  In this case you may need to rebase your branch on a
 more recent `master`, resolve any conflicts, and `git push --force` to update
 your branch so that it can be merged automatically.
+
+## Building on Windows
+
+Most developers build on Linux. Building on Windows is possible under Cygwin.
+When installing Cygwin from https://www.cygwin.com/, include the developer
+tools to get GNU make.
+
+First (before npm install), to avoid file permission problems between Windows
+and Cygwin, edit Cygwin's /etc/fstab file to disable ACLs like this
+`none /cygdrive cygdrive binary,noacl,posix=0,user 0 0`
+
+Python is normally installed with Cygwin so need not be installed separately.
+By default Cygwin will use its own version of Python rather than Window's,
+so the Python modules should be installed for Cygwin's Python.
+
+The build targets `check-deps`, `serve`, `lint`, `build`, `test`, `check` and
+`host-examples` described above should all work. `host-examples` takes quite a
+while to run. If a target does not run properly first time, try it again.
+
+Currently, Firefox fails to run http://localhost:3000/build/examples
+from make serve, but Chrome and Internet Explorer will.
+
+Microsoft Visual Studio's javascript debugger may be used to debug the
+build/hosted/your-branch/examples. It will be convenient to set
+build/hosted/your-branch/examples/index.html as the startup page.
+
+Your ol3 source tree need not be under the Cygwin root.
+if you checkout to c:/ol3 then you can build under Cygwin at /cygdrive/c/ol3 .
+However, keep the path to the ol3 files short otherwise you may see
+`ENAMETOOLONG` errors.

DEVELOPING.md

@@ -0,0 +1,155 @@
+# Developing
+
+## Setting up development environment
+
+You will obviously start by
+[forking](https://github.com/openlayers/ol3/fork) the ol3 repository.
+
+### Travis CI
+
+The Travis CI hook is enabled on the Github repository. This means every pull request
+is run through a full test suite to ensure it compiles and passes the tests. Failing
+pull requests will not be merged.
+
+Although not mandatory, it is also recommended to set up Travis CI for your ol3 fork.
+For that go to your ol3 fork's Service Hooks page and set up the Travis hook.
+Then every time you push to your fork, the test suite will be run. This means
+errors can be caught before creating a pull request. For those making
+small or occasional contributions, this may be enough to check that your contributions
+are ok; in this case, you do not need to install the build tools on your local environment
+as described below.
+
+### Development dependencies
+
+The minimum requirements are:
+
+* GNU Make
+* Git
+* [Node.js](http://nodejs.org/) (0.10.x or higher)
+* Python 2.6 or 2.7 with a couple of extra modules (see below)
+* Java 7 (JRE and JDK)
+
+The executables `git`, `node`, `python` and `java` should be in your `PATH`.
+
+You can check your configuration by running:
+
+    $ make check-deps
+
+To install the Node.js dependencies run
+
+    $ npm install
+
+To install the extra Python modules, run:
+
+    $ sudo pip install -r requirements.txt
+or
+
+    $ cat requirements.txt | sudo xargs easy_install
+
+depending on your OS and Python installation.
+
+(You can also install the Python modules in a Python virtual environment if you want to.)
+
+## Working with the build tool
+
+As an ol3 developer you will use `make` to run build targets defined in the
+`Makefile` located at the root of the repository. The `Makefile` includes
+targets for running the linter, the compiler, the tests, etc.
+
+The usage of `make` is as follows:
+
+    $ make <target>
+
+where `<target>` is the name of the build target you want to execute. For
+example:
+
+    $ make test
+
+The main build targets are `serve`, `lint`, `build`, `test`, and `check`. The
+latter is a meta-target that basically runs `lint`, `build`, and `test`.
+
+The `serve` target starts a node-based web server, which we will refer to as the *dev server*. You'll need to start that server for running the examples and the tests in a browser. More information on that further down.
+
+Other targets include `apidoc` and `ci`. The latter is the target used on Travis CI. See ol3's [Travis configuration file](https://github.com/openlayers/ol3/blob/master/.travis.yml).
+
+## Running the `check` target
+
+The `check` target is to be run before pushing code to GitHub and opening pull
+requests. Branches that don't pass `check` won't pass the integration tests,
+and have therefore no chance of being merged into `master`.
+
+To run the `check` target:
+
+    $ make check
+
+If you want to run the full suite of integration tests, see "Running the integration
+tests" below.
+
+## Running examples
+
+To run the examples you first need to start the dev server:
+
+    $ make serve
+
+Then, just point your browser <http://localhost:3000/build/examples> in your browser. For example <http://localhost:3000/build/examples/side-by-side.html>.
+
+Run examples against the `ol.js` standalone build:
+
+The examples can also be run against the `ol.js` standalone build, just like
+the examples [hosted](http://openlayers.org/en/master/examples/) on GitHub.
+Start by executing the `host-examples` build target:
+
+    $ make host-examples
+
+After running `host-examples` you can now open the examples index page in the browser: <http://localhost:3000/build/hosted/master/examples/>. (This assumes that you still have the dev server running.)
+
+Append `?mode=raw` to make the example work in full debug mode. In raw mode the OpenLayers and Closure Library scripts are loaded individually by the Closure Library's `base.js` script (which the example page loads and executes before any other script).
+
+## Running tests
+
+To run the tests in a browser start the dev server (`make serve`) and open <http://localhost:3000/test/index.html> in the browser.
+
+To run the tests on the console (headless testing with PhantomJS) use the `test` target:
+
+    $ make test
+
+See also the test-specific [README](../master/test/README.md).
+
+## Running the integration tests
+
+When you submit a pull request the [Travis continuous integration
+server](https://travis-ci.org/) will run a full suite of tests, including
+building all versions of the library and checking that all of the examples
+work.  You will receive an email with the results, and the status will be
+displayed in the pull request.
+
+To run the full suite of integration tests use the `ci` target:
+
+    $ make ci
+
+Running the full suite of integration tests currently takes 5-10 minutes.
+
+This makes sure that your commit won't break the build. It also runs JSDoc3 to
+make sure that there are no invalid API doc directives.
+
+## Adding examples
+
+Adding functionality often implies adding one or several examples. This
+section provides explanations related to adding examples.
+
+The examples are located in the `examples` directory. Adding a new example
+implies creating two or three files in this directory, an `.html` file, a `.js`
+file, and, optionally, a `.css` file.
+
+You can use `simple.js` and `simple.html` as templates for new examples.
+
+### Use of the `goog` namespace in examples
+
+Short story: the ol3 examples should not use the `goog` namespace, except
+for `goog.require`.
+
+Longer story: we want that the ol3 examples work in multiple modes, with the
+standalone lib (which has implications of the symbols and properties we
+export), and compiled together with the ol3 library.
+
+Compiling the examples together with the library makes it mandatory to declare dependencies with `goog.require` statements.

LICENSE.md

@@ -1,4 +1,4 @@
-Copyright 2005-2014 OpenLayers Contributors. All rights reserved.
+Copyright 2005-2015 OpenLayers Contributors. All rights reserved.
 
 Redistribution and use in source and binary forms, with or without modification,
 are permitted provided that the following conditions are met:

Makefile

@@ -0,0 +1,327 @@
+OS := $(shell uname)
+BRANCH := $(shell git rev-parse --abbrev-ref HEAD)
+
+SRC_GLSL := $(shell find src -type f -name '*.glsl')
+SRC_SHADER_JS := $(patsubst %.glsl,%shader.js,$(SRC_GLSL))
+SRC_JS := $(filter-out $(SRC_SHADER_JS),$(shell find src -name '*.js'))
+SRC_JSDOC = $(shell find src -type f -name '*.jsdoc')
+
+SPEC_JS := $(shell find test/spec -type f -name '*.js')
+SPEC_RENDERING_JS := $(shell find test_rendering/spec -name '*.js')
+
+EXAMPLES := $(shell find examples -type f)
+EXAMPLES_HTML := $(filter-out examples/index.html,$(shell find examples -maxdepth 1 -type f -name '*.html'))
+EXAMPLES_JS := $(patsubst %.html,%.js,$(EXAMPLES_HTML))
+
+BUILD_EXAMPLES := $(subst examples,build/examples,$(EXAMPLES)) build/examples/index.js
+
+BUILD_HOSTED := build/hosted/$(BRANCH)
+BUILD_HOSTED_EXAMPLES := $(addprefix $(BUILD_HOSTED)/,$(EXAMPLES))
+BUILD_HOSTED_EXAMPLES_JS := $(addprefix $(BUILD_HOSTED)/,$(EXAMPLES_JS))
+
+UNPHANTOMABLE_EXAMPLES = examples/shaded-relief.html examples/raster.html examples/region-growing.html examples/color-manipulation.html
+CHECK_EXAMPLE_TIMESTAMPS = $(patsubst examples/%.html,build/timestamps/check-%-timestamp,$(filter-out $(UNPHANTOMABLE_EXAMPLES),$(EXAMPLES_HTML)))
+
+TASKS_JS := $(shell find tasks -name '*.js')
+
+ifeq (CYGWIN,$(findstring CYGWIN,$(OS)))
+  CLOSURE_LIB = $(shell cygpath -u $(shell node -e 'process.stdout.write(require("closure-util").getLibraryPath())'))
+else
+  CLOSURE_LIB = $(shell node -e 'process.stdout.write(require("closure-util").getLibraryPath())')
+endif
+
+ifeq ($(OS),Darwin)
+	STAT_COMPRESSED = stat -f '  compressed: %z bytes'
+	STAT_UNCOMPRESSED = stat -f 'uncompressed: %z bytes'
+else
+	STAT_COMPRESSED = stat -c '  compressed: %s bytes'
+	STAT_UNCOMPRESSED = stat -c 'uncompressed: %s bytes'
+endif
+
+.PHONY: default
+default: help
+
+.PHONY: help
+help:
+	@echo
+	@echo "The most common targets are:"
+	@echo
+	@echo "- install                 Install node dependencies"
+	@echo "- serve                   Start dev server for running examples and tests"
+	@echo "- test                    Run unit tests in the console"
+	@echo "- check                   Perform a number of checks on the code"
+	@echo "- clean                   Remove generated files"
+	@echo "- help                    Display this help message"
+	@echo
+	@echo "Other less frequently used targets are:"
+	@echo
+	@echo "- build                   Build ol.js, ol-debug.js, ol.js.map and ol.css"
+	@echo "- lint                    Check the code with the linter"
+	@echo "- ci                      Run the full continuous integration process"
+	@echo "- apidoc                  Build the API documentation using JSDoc"
+	@echo "- cleanall                Remove all the build artefacts"
+	@echo "- check-deps              Check if the required dependencies are installed"
+	@echo
+
+.PHONY: apidoc
+apidoc: build/timestamps/jsdoc-$(BRANCH)-timestamp
+
+.PHONY: build
+build: build/ol.css build/ol.js build/ol-debug.js build/ol.js.map
+
+.PHONY: check
+check: lint build/ol.js test
+
+.PHONY: check-examples
+check-examples: $(CHECK_EXAMPLE_TIMESTAMPS)
+
+.PHONY: check-deps
+check-deps: EXECUTABLES = git node python java
+check-deps:
+	@for exe in $(EXECUTABLES) ;\
+	do \
+	    which $${exe} > /dev/null && \
+		echo "Program $${exe} OK" || \
+		echo "Program $${exe} MISSING!" ;\
+	done ;\
+
+.PHONY: ci
+ci: lint build test test-rendering compile-examples check-examples apidoc
+
+.PHONY: compile-examples
+compile-examples: build/compiled-examples/all.combined.js
+
+.PHONY: clean
+clean:
+	rm -f build/timestamps/gjslint-timestamp
+	rm -f build/timestamps/jshint-timestamp
+	rm -f build/timestamps/check-*-timestamp
+	rm -f build/ol.css
+	rm -f build/ol.js
+	rm -f build/ol.js.map
+	rm -f build/ol-debug.js
+	rm -f build/test_requires.js
+	rm -f build/test_rendering_requires.js
+	rm -rf build/examples
+	rm -rf build/compiled-examples
+	rm -rf $(BUILD_HOSTED)
+
+.PHONY: cleanall
+cleanall:
+	rm -rf build
+
+.PHONY: css
+css: build/ol.css
+
+.PHONY: examples
+examples: $(BUILD_EXAMPLES)
+
+.PHONY: install
+install: build/timestamps/node-modules-timestamp
+
+.PHONY: lint
+lint: build/timestamps/gjslint-timestamp build/timestamps/jshint-timestamp \
+      build/timestamps/check-requires-timestamp \
+      build/timestamps/check-whitespace-timestamp
+
+.PHONY: npm-install
+npm-install: build/timestamps/node-modules-timestamp
+
+.PHONY: shaders
+shaders: $(SRC_SHADER_JS)
+
+.PHONY: serve
+serve: build/test_requires.js build/test_rendering_requires.js
+	node tasks/serve.js
+
+.PHONY: test
+test: build/timestamps/node-modules-timestamp build/test_requires.js
+	node tasks/test.js
+
+.PHONY: test-coverage
+test-coverage: build/timestamps/node-modules-timestamp
+	node tasks/test-coverage.js
+
+.PHONY: test-rendering
+test-rendering: build/timestamps/node-modules-timestamp \
+                build/test_rendering_requires.js
+	@rm -rf build/slimerjs-profile
+	@mkdir -p build/slimerjs-profile
+	@cp -r test_rendering/slimerjs-profile/* build/slimerjs-profile/
+	node tasks/test-rendering.js
+
+.PHONY: host-examples
+host-examples: $(BUILD_HOSTED_EXAMPLES) \
+               $(BUILD_HOSTED)/build/ol.js \
+               $(BUILD_HOSTED)/build/ol-debug.js \
+               $(BUILD_HOSTED)/css/ol.css \
+               $(BUILD_HOSTED)/examples/loader.js \
+               $(BUILD_HOSTED)/examples/index.js \
+               $(BUILD_HOSTED)/build/ol-deps.js
+
+.PHONY: host-libraries
+host-libraries: build/timestamps/node-modules-timestamp
+	@rm -rf $(BUILD_HOSTED)/closure-library
+	@mkdir -p $(BUILD_HOSTED)/closure-library
+	@cp -r $(CLOSURE_LIB)/* $(BUILD_HOSTED)/closure-library/
+	@rm -rf $(BUILD_HOSTED)/ol/ol
+	@mkdir -p $(BUILD_HOSTED)/ol/ol
+	@cp -r src/ol/* $(BUILD_HOSTED)/ol/ol/
+	@rm -rf $(BUILD_HOSTED)/ol.ext
+	@mkdir -p $(BUILD_HOSTED)/ol.ext
+	@cp -r build/ol.ext/* $(BUILD_HOSTED)/ol.ext/
+
+$(BUILD_EXAMPLES): $(EXAMPLES) package.json
+	@mkdir -p $(@D)
+	@node tasks/build-examples.js
+
+build/timestamps/check-%-timestamp: $(BUILD_HOSTED)/examples/%.html \
+                                    $(BUILD_HOSTED)/examples/%.js \
+                                    $(filter $(BUILD_HOSTED)/examples/resources/%,$(BUILD_HOSTED_EXAMPLES)) \
+                                    $(filter $(BUILD_HOSTED)/examples/data/%,$(BUILD_HOSTED_EXAMPLES)) \
+                                    $(BUILD_HOSTED)/examples/loader.js \
+                                    $(BUILD_HOSTED)/build/ol.js \
+                                    $(BUILD_HOSTED)/css/ol.css
+	@mkdir -p $(@D)
+	./node_modules/.bin/phantomjs --ssl-protocol=any --ignore-ssl-errors=true bin/check-example.js $(addsuffix ?mode=advanced, $<)
+	@touch $@
+
+build/timestamps/check-requires-timestamp: $(SRC_JS) $(EXAMPLES_JS) \
+                                           $(SRC_SHADER_JS) $(SPEC_JS) \
+                                           $(SPEC_RENDERING_JS)
+	@mkdir -p $(@D)
+	@python bin/check-requires.py $(CLOSURE_LIB) $^
+	@touch $@
+
+build/timestamps/check-whitespace-timestamp: $(SRC_JS) $(EXAMPLES_JS) \
+                                             $(SPEC_JS) $(SPEC_RENDERING_JS) \
+                                             $(SRC_JSDOC)
+	@mkdir -p $(@D)
+	@python bin/check-whitespace.py $^
+	@touch $@
+
+build/compiled-examples/all.js: $(EXAMPLES_JS)
+	@mkdir -p $(@D)
+	@python bin/combine-examples.py $^ > $@
+
+build/compiled-examples/all.combined.js: config/examples-all.json build/compiled-examples/all.js \
+                                         $(SRC_JS) $(SRC_SHADER_JS) \
+                                         build/timestamps/node-modules-timestamp
+	@mkdir -p $(@D)
+	node tasks/build.js $< $@
+
+build/compiled-examples/%.json: config/example.json build/examples/%.js \
+                                build/timestamps/node-modules-timestamp
+	@mkdir -p $(@D)
+	@sed -e 's|{{id}}|$*|' $< > $@
+
+build/compiled-examples/%.combined.js: build/compiled-examples/%.json \
+                                       $(SRC_JS) $(SRC_SHADER_JS) \
+                                       build/timestamps/node-modules-timestamp
+	@mkdir -p $(@D)
+	node tasks/build.js $< $@
+
+build/timestamps/jsdoc-$(BRANCH)-timestamp: config/jsdoc/api/index.md \
+                                            config/jsdoc/api/conf.json $(SRC_JS) \
+                                            $(SRC_SHADER_JS) \
+                                            $(shell find config/jsdoc/api/template -type f) \
+                                            build/timestamps/node-modules-timestamp
+	@mkdir -p $(@D)
+	@rm -rf $(BUILD_HOSTED)/apidoc
+	./node_modules/.bin/jsdoc config/jsdoc/api/index.md -c config/jsdoc/api/conf.json -d $(BUILD_HOSTED)/apidoc
+	@touch $@
+
+build/timestamps/gjslint-timestamp: $(SRC_JS) $(SPEC_JS) $(SPEC_RENDERING_JS) \
+                                    $(EXAMPLES_JS)
+	@mkdir -p $(@D)
+	@echo "Running gjslint..."
+	@gjslint --jslint_error=all --custom_jsdoc_tags=event,fires,function,classdesc,api,observable --strict $?
+	@touch $@
+
+$(BUILD_HOSTED_EXAMPLES_JS): $(BUILD_HOSTED)/examples/%.js: build/examples/%.js
+	@mkdir -p $(@D)
+	@python bin/split-example.py $< $(@D)
+
+$(BUILD_HOSTED)/examples/loader.js: bin/loader_hosted_examples.js
+	@mkdir -p $(@D)
+	@cp $< $@
+
+$(BUILD_HOSTED)/examples/%: build/examples/%
+	@mkdir -p $(@D)
+	@cp $< $@
+
+$(BUILD_HOSTED)/build/ol.js: build/ol.js
+	@mkdir -p $(@D)
+	@cp $< $@
+
+$(BUILD_HOSTED)/build/ol-debug.js: build/ol-debug.js
+	@mkdir -p $(@D)
+	@cp $< $@
+
+$(BUILD_HOSTED)/css/ol.css: build/ol.css
+	@mkdir -p $(@D)
+	@cp $< $@
+
+$(BUILD_HOSTED)/build/ol-deps.js: host-libraries
+	@mkdir -p $(@D)
+	@python $(CLOSURE_LIB)/closure/bin/build/depswriter.py \
+           --root_with_prefix "src ../../../ol" \
+           --root_with_prefix "build/ol.ext ../../../ol.ext" \
+           --root $(BUILD_HOSTED)/closure-library/closure/goog \
+           --root_with_prefix "$(BUILD_HOSTED)/closure-library/third_party ../../third_party" \
+           --output_file $@
+
+build/timestamps/jshint-timestamp: $(SRC_JS) $(SPEC_JS) $(SPEC_RENDERING_JS) \
+                                   $(TASKS_JS) $(EXAMPLES_JS) \
+                                   examples/resources/common.js \
+                                   build/timestamps/node-modules-timestamp
+	@mkdir -p $(@D)
+	@echo "Running jshint..."
+	@./node_modules/.bin/jshint --verbose $?
+	@touch $@
+
+build/timestamps/node-modules-timestamp: package.json
+	@mkdir -p $(@D)
+	npm install
+	@touch $@
+
+build/ol.css: css/ol.css build/timestamps/node-modules-timestamp
+	@mkdir -p $(@D)
+	@echo "Running cleancss..."
+	@./node_modules/.bin/cleancss $< > $@
+
+build/ol.js: config/ol.json $(SRC_JS) $(SRC_SHADER_JS) \
+             build/timestamps/node-modules-timestamp
+	@mkdir -p $(@D)
+	node tasks/build.js $< $@
+	@$(STAT_UNCOMPRESSED) $@
+	@cp $@ /tmp/
+	@gzip /tmp/ol.js
+	@$(STAT_COMPRESSED) /tmp/ol.js.gz
+	@rm /tmp/ol.js.gz
+
+build/ol.js.map: config/ol.json $(SRC_JS) $(SRC_SHADER_JS) \
+                 build/timestamps/node-modules-timestamp
+	@mkdir -p $(@D)
+	node tasks/build.js $< $@
+
+build/ol-debug.js: config/ol-debug.json $(SRC_JS) $(SRC_SHADER_JS) \
+                   build/timestamps/node-modules-timestamp
+	@mkdir -p $(@D)
+	node tasks/build.js $< $@
+	@$(STAT_UNCOMPRESSED) $@
+	@cp $@ /tmp/
+	@gzip /tmp/ol-debug.js
+	@$(STAT_COMPRESSED) /tmp/ol-debug.js.gz
+	@rm /tmp/ol-debug.js.gz
+
+build/test_requires.js: $(SPEC_JS) $(SRC_JS)
+	@mkdir -p $(@D)
+	@node tasks/generate-requires.js $^ > $@
+
+build/test_rendering_requires.js: $(SPEC_RENDERING_JS)
+	@mkdir -p $(@D)
+	@node tasks/generate-requires.js $^ > $@
+
+%shader.js: %.glsl src/ol/webgl/shader.mustache bin/pyglslunit.py build/timestamps/node-modules-timestamp
+	@python bin/pyglslunit.py --input $< | ./node_modules/.bin/mustache - src/ol/webgl/shader.mustache > $@

README.md

@@ -1,11 +1,30 @@
 # OpenLayers 3
 
 [![Travis CI Status](https://secure.travis-ci.org/openlayers/ol3.svg)](http://travis-ci.org/#!/openlayers/ol3)
+[![Coverage Status](https://coveralls.io/repos/openlayers/ol3/badge.svg?branch=master)](https://coveralls.io/r/openlayers/ol3?branch=master)
 
-Welcome to [OpenLayers 3](http://openlayers.org/)!
+[OpenLayers 3](http://openlayers.org/) is a high-performance, feature-packed library for creating interactive maps on the web.
 
-## Examples
+## Getting Started
-Check out the [hosted examples](http://openlayers.org/en/master/examples/), the [workshop](http://openlayers.org/ol3-workshop/) or poke around the evolving [API docs](http://openlayers.org/en/master/apidoc/).
+
+- Download the [latest release](http://openlayers.org/download/)
+- Install with npm: `npm install openlayers`
+- Clone the repo: `git clone git@github.com:openlayers/ol3.git`
+
+## Documentation
+
+Check out the [hosted examples](http://openlayers.org/en/master/examples/), the [workshop](http://openlayers.org/workshop/) or [API docs](http://openlayers.org/en/master/apidoc/).
+
+## Bugs
+
+Please use the [GitHub issue tracker](https://github.com/openlayers/ol3/issues) for all bugs and feature requests. Before creating a new issue, do a quick search to see if the problem has been reported already.
 
 ## Contributing
+
 Please see our guide on [contributing](CONTRIBUTING.md) if you're interested in getting involved.
+
+## Community
+
+- Need help? Find it on [stackoverflow using the tag 'openlayers-3'](http://stackoverflow.com/questions/tagged/openlayers-3)
+- Follow [@openlayers](https://twitter.com/openlayers) on Twitter
+- Discuss with openlayers users on IRC in `#openlayers` at `chat.freenode`

bin/check-requires.py

@@ -0,0 +1,193 @@
+import os
+import logging
+import re
+import sys
+
+logging.basicConfig(format='%(asctime)s %(name)s: %(message)s',
+                    level=logging.INFO)
+
+logger = logging.getLogger('check-requires')
+
+
+class Node(object):
+
+    def __init__(self):
+        self.present = False
+        self.children = {}
+
+    def _build_re(self, key):
+        if key == '*':
+            assert len(self.children) == 0
+            # We want to match `.doIt` but not `.SomeClass` or `.more.stuff`
+            return '(?=\\.[a-z]\\w*\\b(?!\\.))'
+        elif len(self.children) == 1:
+            child_key, child = next(self.children.iteritems())
+            child_re = child._build_re(child_key)
+            if child_key != '*':
+                child_re = '\\.' + child_re
+            if self.present:
+                return key + '(' + child_re + ')?'
+            else:
+                return key + child_re
+        elif self.children:
+            children_re = '(?:' + '|'.join(
+                ('\\.' if k != '*' else '') + self.children[k]._build_re(k)
+                for k in sorted(self.children.keys())) + ')'
+            if self.present:
+                return key + children_re + '?'
+            else:
+                return key + children_re
+        else:
+            assert self.present
+            return key
+
+    def build_re(self, key):
+        return re.compile('\\b' + self._build_re(key) + '\\b')
+
+
+def ifind(*paths):
+    """ifind is an iterative version of os.walk, yielding all walked paths and
+    normalizing paths to use forward slashes."""
+    for path in paths:
+        for dirpath, dirnames, names in os.walk(path):
+            for name in names:
+                if os.sep == '/':
+                    yield os.path.join(dirpath, name)
+                else:
+                    yield '/'.join(dirpath.split(os.sep) + [name])
+
+
+def _strip_comments(lines):
+    # FIXME this is a horribe hack, we should use a proper JavaScript parser
+    # here
+    in_multiline_comment = False
+    lineno = 0
+    for line in lines:
+        lineno += 1
+        if in_multiline_comment:
+            index = line.find('*/')
+            if index != -1:
+                in_multiline_comment = False
+                line = line[index + 2:]
+        if not in_multiline_comment:
+            line = re.sub(r'//[^\n]*', '', line)
+            line = re.sub(r'/\*.*?\*/', '', line)
+            index = line.find('/*')
+            if index != -1:
+                yield lineno, line[:index]
+                in_multiline_comment = True
+            else:
+                yield lineno, line
+
+
+def check_requires(closure_lib, *filenames):
+    unused_count = 0
+    all_provides = set()
+
+    for filename in ifind(closure_lib):
+        if filename.endswith('.js'):
+            if not re.match(r'.*/closure/goog/', filename):
+                continue
+            # Skip goog.i18n because it contains so many modules that it causes
+            # the generated regular expression to exceed Python's limits
+            if re.match(r'.*/closure/goog/i18n/', filename):
+                continue
+            for line in open(filename, 'rU'):
+                m = re.match(r'goog.provide\(\'(.*)\'\);', line)
+                if m:
+                    all_provides.add(m.group(1))
+
+    for filename in sorted(filenames):
+        require_linenos = {}
+        uses = set()
+        lines = open(filename, 'rU').readlines()
+        for lineno, line in _strip_comments(lines):
+            m = re.match(r'goog.provide\(\'(.*)\'\);', line)
+            if m:
+                all_provides.add(m.group(1))
+                continue
+            m = re.match(r'goog.require\(\'(.*)\'\);', line)
+            if m:
+                require_linenos[m.group(1)] = lineno
+                continue
+        ignore_linenos = require_linenos.values()
+        for lineno, line in enumerate(lines):
+            if lineno in ignore_linenos:
+                continue
+            for require in require_linenos.iterkeys():
+                if require in line:
+                    uses.add(require)
+        for require in sorted(set(require_linenos.keys()) - uses):
+            logger.info('%s:%d: unused goog.require: %r' % (
+                filename, require_linenos[require], require))
+            unused_count += 1
+
+    all_provides.discard('ol')
+    all_provides.discard('ol.MapProperty')
+
+    root = Node()
+    for provide in all_provides:
+        node = root
+        for component in provide.split('.'):
+            if component not in node.children:
+                node.children[component] = Node()
+            node = node.children[component]
+        if component[0].islower():
+            # We've arrived at a namespace provide like `ol.foo`.
+            # In this case, we want to match uses like `ol.foo.doIt()` but
+            # not match things like `new ol.foo.SomeClass()`.
+            # For this purpose, we use the special wildcard key for the child.
+            node.children['*'] = Node()
+        else:
+            node.present = True
+    provide_res = [child.build_re(key)
+                   for key, child in root.children.iteritems()]
+    missing_count = 0
+    for filename in sorted(filenames):
+        provides = set()
+        requires = set()
+        uses = set()
+        uses_linenos = {}
+        for lineno, line in _strip_comments(open(filename, 'rU')):
+            m = re.match(r'goog.provide\(\'(.*)\'\);', line)
+            if m:
+                provides.add(m.group(1))
+                continue
+            m = re.match(r'goog.require\(\'(.*)\'\);', line)
+            if m:
+                requires.add(m.group(1))
+                continue
+            while True:
+                for provide_re in provide_res:
+                    m = provide_re.search(line)
+                    if m:
+                        uses.add(m.group())
+                        uses_linenos[m.group()] = lineno
+                        line = line[:m.start()] + line[m.end():]
+                        break
+                else:
+                    break
+        if filename == 'src/ol/renderer/layerrenderer.js':
+            uses.discard('ol.renderer.Map')
+        m = re.match(
+            r'src/ol/renderer/(\w+)/\1(\w*)layerrenderer\.js\Z', filename)
+        if m:
+            uses.discard('ol.renderer.Map')
+            uses.discard('ol.renderer.%s.Map' % (m.group(1),))
+        missing_requires = uses - requires - provides
+        if missing_requires:
+            for missing_require in sorted(missing_requires):
+                logger.info("%s:%d missing goog.require('%s')" %
+                            (filename, uses_linenos[missing_require],
+                             missing_require))
+                missing_count += 1
+
+    return (unused_count, missing_count)
+
+
+if __name__ == "__main__":
+    unused_count, missing_count = check_requires(*sys.argv[1:])
+    if unused_count > 0 or missing_count > 0:
+        logger.error('%d unused goog.requires, %d missing goog.requires' %
+                     (unused_count, missing_count))
+        sys.exit(1)

bin/check-whitespace.py

@@ -0,0 +1,46 @@
+import logging
+import re
+import sys
+
+logging.basicConfig(format='%(asctime)s %(name)s: %(message)s',
+                    level=logging.INFO)
+
+logger = logging.getLogger('check-whitespace')
+
+CR_RE = re.compile(r'\r')
+LEADING_WHITESPACE_RE = re.compile(r'\s+')
+TRAILING_WHITESPACE_RE = re.compile(r'\s+\n\Z')
+NO_NEWLINE_RE = re.compile(r'[^\n]\Z')
+ALL_WHITESPACE_RE = re.compile(r'\s+\Z')
+
+
+def check_whitespace(*filenames):
+    errors = 0
+    for filename in sorted(filenames):
+        whitespace = False
+        for lineno, line in enumerate(open(filename, 'rU')):
+            if lineno == 0 and LEADING_WHITESPACE_RE.match(line):
+                logger.info('%s:%d: leading whitespace', filename, lineno + 1)
+                errors += 1
+            if CR_RE.search(line):
+                logger.info('%s:%d: carriage return character in line',
+                            filename, lineno + 1)
+                errors += 1
+            if TRAILING_WHITESPACE_RE.search(line):
+                logger.info('%s:%d: trailing whitespace', filename, lineno + 1)
+                errors += 1
+            if NO_NEWLINE_RE.search(line):
+                logger.info('%s:%d: no newline at end of file', filename,
+                            lineno + 1)
+                errors += 1
+            whitespace = ALL_WHITESPACE_RE.match(line)
+        if whitespace:
+            logger.info('%s: trailing whitespace at end of file', filename)
+            errors += 1
+    return errors
+
+if __name__ == "__main__":
+    errors = check_whitespace(*sys.argv[1:])
+    if errors > 0:
+        logger.error('%d whitespace errors' % (errors,))
+        sys.exit(1)

bin/exampleparser.py

@@ -1,269 +0,0 @@
-#!/usr/bin/env python
-
-import sys
-import os
-import re
-import time
-from xml.dom.minidom import Document
-
-try:
-    import xml.etree.ElementTree as ElementTree
-except ImportError:
-    try:
-        import cElementTree as ElementTree  # NOQA
-    except ImportError:
-        try:
-            import elementtree.ElementTree as ElementTree # NOQA
-        except ImportError:
-            import lxml.etree as ElementTree  # NOQA
-
-missing_deps = False
-try:
-    import json
-except ImportError:
-    try:
-        import simplejson as json  # NOQA
-    except ImportError, E:
-        missing_deps = E
-
-try:
-    from BeautifulSoup import BeautifulSoup
-except ImportError, E:
-    missing_deps = E
-
-feedName = "example-list.xml"
-feedPath = "http://openlayers.github.io/ol3/master/examples/"
-
-
-def getListOfExamples(relPath):
-    """
-    returns list of .html filenames within a given path - excludes
-    index.html
-    """
-    examples = os.listdir(relPath)
-    examples = [example for example in examples if
-                example.endswith('.html') and example != "index.html"]
-    return examples
-
-
-def getExampleHtml(path):
-    """
-    returns html of a specific example
-    """
-    print '.',
-    f = open(path)
-    html = f.read()
-    f.close()
-    return html
-
-
-def extractById(soup, tagId, value=None):
-    """
-    returns full contents of a particular tag id
-    """
-    beautifulTag = soup.find(id=tagId)
-    if beautifulTag:
-        if beautifulTag.contents:
-            value = str(beautifulTag.renderContents()).strip()
-            value = value.replace('\t', '')
-            value = value.replace('\n', '')
-    return value
-
-
-def getRelatedClasses(html):
-    """
-    parses the html, and returns a list of all OpenLayers Classes
-    used within (ie what parts of OL the javascript uses).
-    """
-    rawstr = r'''(?P<class>ol\..*?)\('''
-    return re.findall(rawstr, html)
-
-
-def parseHtml(html, ids):
-    """
-    returns dictionary of items of interest
-    """
-    soup = BeautifulSoup(html)
-    d = {}
-    for tagId in ids:
-        d[tagId] = extractById(soup, tagId)
-    #classes should eventually be parsed from docs - not automatically created.
-    classes = getRelatedClasses(html)
-    d['classes'] = classes
-    return d
-
-
-def getGitInfo(exampleDir, exampleName):
-    orig = os.getcwd()
-    os.chdir(exampleDir)
-    h = os.popen("git log -n 1 --pretty=format:'%an|%ai' " + exampleName)
-    os.chdir(orig)
-    log = h.read()
-    h.close()
-    d = {}
-    if log:
-        parts = log.split("|")
-        d["author"] = parts[0]
-        # compensate for spaces in git log time
-        td = parts[1].split(" ")
-        td.insert(1, "T")
-        d["date"] = "".join(td)
-    else:
-        d["author"] = ""
-        d["date"] = ""
-    return d
-
-
-def createFeed(examples):
-    doc = Document()
-    atomuri = "http://www.w3.org/2005/Atom"
-    feed = doc.createElementNS(atomuri, "feed")
-    feed.setAttribute("xmlns", atomuri)
-    title = doc.createElementNS(atomuri, "title")
-    title.appendChild(doc.createTextNode("OpenLayers Examples"))
-    feed.appendChild(title)
-    link = doc.createElementNS(atomuri, "link")
-    link.setAttribute("rel", "self")
-    link.setAttribute("href", feedPath + feedName)
-
-    modtime = time.strftime("%Y-%m-%dT%I:%M:%SZ", time.gmtime())
-    id = doc.createElementNS(atomuri, "id")
-    id.appendChild(doc.createTextNode(
-        "%s%s#%s" % (feedPath, feedName, modtime)))
-    feed.appendChild(id)
-
-    updated = doc.createElementNS(atomuri, "updated")
-    updated.appendChild(doc.createTextNode(modtime))
-    feed.appendChild(updated)
-
-    examples.sort(key=lambda x: x["modified"])
-    for example in sorted(examples, key=lambda x: x["modified"], reverse=True):
-        entry = doc.createElementNS(atomuri, "entry")
-
-        title = doc.createElementNS(atomuri, "title")
-        title.appendChild(doc.createTextNode(example["title"] or
-                                             example["example"]))
-        entry.appendChild(title)
-
-        tags = doc.createElementNS(atomuri, "tags")
-        tags.appendChild(doc.createTextNode(example["tags"] or
-                                            example["example"]))
-        entry.appendChild(tags)
-
-        link = doc.createElementNS(atomuri, "link")
-        link.setAttribute("href", "%s%s" % (feedPath, example["example"]))
-        entry.appendChild(link)
-
-        summary = doc.createElementNS(atomuri, "summary")
-        summary.appendChild(doc.createTextNode(example["shortdesc"] or
-                                               example["example"]))
-        entry.appendChild(summary)
-
-        updated = doc.createElementNS(atomuri, "updated")
-        updated.appendChild(doc.createTextNode(example["modified"]))
-        entry.appendChild(updated)
-
-        author = doc.createElementNS(atomuri, "author")
-        name = doc.createElementNS(atomuri, "name")
-        name.appendChild(doc.createTextNode(example["author"]))
-        author.appendChild(name)
-        entry.appendChild(author)
-
-        id = doc.createElementNS(atomuri, "id")
-        id.appendChild(doc.createTextNode("%s%s#%s" % (feedPath,
-                                                       example["example"],
-                                                       example["modified"])))
-        entry.appendChild(id)
-
-        feed.appendChild(entry)
-
-    doc.appendChild(feed)
-    return doc
-
-
-def wordIndex(examples):
-    """
-    Create an inverted index based on words in title and shortdesc.  Keys are
-    lower cased words.  Values are dictionaries with example index keys and
-    count values.
-    """
-    index = {}
-    unword = re.compile("\\W+")
-    keys = ["shortdesc", "title", "tags"]
-    for i in range(len(examples)):
-        for key in keys:
-            text = examples[i][key]
-            if text:
-                words = unword.split(text)
-                for word in words:
-                    if word:
-                        word = word.lower()
-                        if word in index:
-                            if i in index[word]:
-                                index[word][i] += 1
-                            else:
-                                index[word][i] = 1
-                        else:
-                            index[word] = {i: 1}
-    return index
-
-if __name__ == "__main__":
-
-    if missing_deps:
-        print """This script requires json or simplejson and BeautifulSoup.
-You don't have them. \n(%s)""" % E
-        sys.exit()
-
-    if len(sys.argv) == 3:
-        inExampleDir = sys.argv[1]
-        outExampleDir = sys.argv[2]
-    else:
-        inExampleDir = "../examples"
-        outExampleDir = "../examples"
-
-    outFile = open(os.path.join(outExampleDir, "example-list.js"), "w")
-
-    print 'Reading examples from %s and writing out to %s' % (inExampleDir,
-                                                              outFile.name)
-
-    exampleList = []
-    docIds = ['title', 'shortdesc', 'tags']
-
-    examples = getListOfExamples(inExampleDir)
-
-    modtime = time.strftime("%Y-%m-%dT%I:%M:%SZ", time.gmtime())
-
-    for example in examples:
-        path = os.path.join(inExampleDir, example)
-        html = getExampleHtml(path)
-        tagvalues = parseHtml(html, docIds)
-        tagvalues['example'] = example
-        # add in author/date info
-        d = getGitInfo(inExampleDir, example)
-        tagvalues["author"] = d["author"] or "anonymous"
-        tagvalues["modified"] = d["date"] or modtime
-        tagvalues['link'] = example
-
-        exampleList.append(tagvalues)
-
-    print
-
-    exampleList.sort(key=lambda x: x['example'].lower())
-
-    index = wordIndex(exampleList)
-
-    json = json.dumps({"examples": exampleList, "index": index})
-    # Give the json a global variable we can use in our js.
-    # This should be replaced or made optional.
-    json = 'var info=' + json + ';'
-    outFile.write(json)
-    outFile.close()
-
-    outFeedPath = os.path.join(outExampleDir, feedName)
-    print "writing feed to %s " % outFeedPath
-    atom = open(outFeedPath, 'w')
-    doc = createFeed(exampleList)
-    atom.write(doc.toxml())
-    atom.close()
-
-    print 'complete'

bin/loader_hosted_examples.js

@@ -6,8 +6,8 @@
  * loads Closure Library's base.js, ol-deps.js, the example's "goog.require"
  * script, and the example's script in "development" mode.
  *
- * The ol.js and ol-deps.js scripts are built by OL3's build.py script.
+ * The ol.js and ol-deps.js scripts are built using ol3's Makefile. They are
- * They are located in the ../build/ directory, relative to this script.
+ * located in the ../build/ directory, relative to this script.
  *
  * The script must be named loader.js.
  *

bin/pyglslunit.py

@@ -1,10 +1,10 @@
 #!/usr/bin/python
 
 from optparse import OptionParser
+import json
 import re
 import sys
 
-import pystache
 
 
 ESCAPE_SEQUENCE = {
@@ -42,7 +42,6 @@ def main(argv):
     option_parser = OptionParser()
     option_parser.add_option('--input')
     option_parser.add_option('--output')
-    option_parser.add_option('--template')
     options, args = option_parser.parse_args(argv[1:])
 
     context = {}
@@ -114,7 +113,7 @@ def main(argv):
         output = open(options.output, 'wb')
     else:
         output = sys.stdout
-    output.write(pystache.render(open(options.template, 'rb').read(), context))
+    json.dump(context, output)
 
 
 if __name__ == '__main__':

bin/split-example.py

@@ -0,0 +1,39 @@
+import os
+import re
+import sys
+
+
+def split_example_file(example, dst_dir):
+    lines = open(example, 'rU').readlines()
+
+    target_lines = []
+    target_require_lines = []
+
+    found_requires = False
+    found_code = False
+    for line in lines:
+        m = re.match(r'goog.require\(\'(.*)\'\);', line)
+        if m:
+            found_requires = True
+            target_require_lines.append(line)
+        elif found_requires:
+            if found_code or line not in ('\n', '\r\n'):
+                found_code = True
+                target_lines.append(line)
+
+    target = open(
+        os.path.join(dst_dir, os.path.basename(example)), 'wb')
+    target_require = open(
+        os.path.join(dst_dir, os.path.basename(example)
+          .replace('.js', '-require.js')),
+        'wb')
+
+    target.writelines(target_lines)
+    target.close()
+
+    target_require.writelines(target_require_lines)
+    target_require.close()
+
+
+if __name__ == '__main__':
+    split_example_file(*sys.argv[1:])

build.cmd

@@ -1,2 +0,0 @@
-@echo off
-%SystemDrive%\Python27\python.exe build.py %*

build.py

@@ -1,811 +0,0 @@
-#!/usr/bin/env python
-
-from cStringIO import StringIO
-import glob
-import gzip
-import json
-import multiprocessing
-import os
-import re
-import shutil
-import sys
-
-from pake import Target
-from pake import ifind, main, output, rule, target, variables, virtual, which
-from Queue import Queue
-from threading import Thread
-
-
-class ThreadPool:
-    """A basic pool of worker threads"""
-    class Worker(Thread):
-        def __init__(self, tasks):
-            Thread.__init__(self)
-            self.tasks = tasks
-            self.daemon = True # threads will be killed on exit
-            self.start()
-
-        def run(self):
-            while True:
-                # block until a task is ready to be done
-                function, args, kargs = self.tasks.get()
-                try:
-                    function(*args, **kargs)
-                except:
-                    print("ERROR")
-                    for count, thing in enumerate(args):
-                        print '{0}. {1}'.format(count, thing)
-                    print(sys.exc_info()[0])
-                    print("ERROR")
-                    self.tasks.errors = True
-                self.tasks.task_done()
-
-    def __init__(self, num_threads = multiprocessing.cpu_count() + 1):
-        self.tasks = Queue(num_threads)
-        self.tasks.errors = False
-        # create num_threads Workers, by default the number of CPUs + 1
-        for _ in range(num_threads): self.Worker(self.tasks)
-
-    def add_task(self, function, *args, **kargs):
-        self.tasks.put((function, args, kargs))
-
-    def wait_completion(self):
-        # wait for the queue to be empty
-        self.tasks.join()
-        return self.tasks.errors
-
-
-if sys.platform == 'win32':
-
-    win = {
-        'CLEANCSS': './node_modules/.bin/cleancss',
-        'GIT': 'git.exe',
-        'GJSLINT': 'gjslint.exe',
-        'JSDOC': './node_modules/.bin/jsdoc',
-        'JSHINT': './node_modules/.bin/jshint',
-        'PYTHON': 'python.exe',
-        'PHANTOMJS': './node_modules/.bin/phantomjs'
-    }
-
-    sys_dir = os.environ.get('SYSTEMDRIVE')
-    program_files = os.environ.get('PROGRAMFILES')
-
-    if not which(win['GIT']):
-        win['GIT'] = os.path.join(program_files, 'Git', 'cmd', 'git.exe')
-    if not which(win['GIT']):
-        win['GIT'] = os.path.join(program_files, 'Git', 'bin', 'git.exe')
-
-    if not which(win['PYTHON']):
-        win['PYTHON'] = os.path.join(sys_dir, 'Python27', 'python.exe')
-
-    if not which(win['GJSLINT']):
-        win['GJSLINT'] = os.path.join(sys_dir, 'Python27', 'Scripts', 'gjslint.exe')
-
-    if not which(win['PHANTOMJS']):
-        win['PHANTOMJS'] = 'phantomjs.exe'
-    if not which(win['PHANTOMJS']):
-        win['PHANTOMJS'] = os.path.join(sys_dir, 'phantomjs-1.9.7-windows', 'phantomjs.exe')
-
-    if not which(win['JSDOC']):
-        win['JSDOC'] = os.path.join(program_files, 'jsdoc3', 'jsdoc.cmd')
-
-    for program, path in win.iteritems():
-        setattr(variables, program, path)
-
-else:
-    variables.CLEANCSS = './node_modules/.bin/cleancss'
-    variables.GIT = 'git'
-    variables.GJSLINT = 'gjslint'
-    variables.JSHINT = './node_modules/.bin/jshint'
-    variables.JSDOC = './node_modules/.bin/jsdoc'
-    variables.PYTHON = 'python'
-    variables.PHANTOMJS = './node_modules/.bin/phantomjs'
-
-variables.BRANCH = output(
-    '%(GIT)s', 'rev-parse', '--abbrev-ref', 'HEAD').strip()
-
-EXECUTABLES = [variables.CLEANCSS, variables.GIT, variables.GJSLINT,
-               variables.JSDOC, variables.JSHINT, variables.PYTHON,
-               variables.PHANTOMJS]
-
-EXAMPLES = [path
-            for path in ifind('examples')
-            if path.endswith('.html')
-            if path != 'examples/index.html']
-
-EXAMPLES_SRC = [path
-                for path in ifind('examples')
-                if path.endswith('.js')
-                if not path.endswith('.combined.js')
-                if path != 'examples/Jugl.js'
-                if path != 'examples/example-list.js']
-
-EXAMPLES_JSON = ['build/' + example.replace('.html', '.json')
-                 for example in EXAMPLES]
-
-EXAMPLES_COMBINED = ['build/' + example.replace('.html', '.combined.js')
-                     for example in EXAMPLES]
-
-GLSL_SRC = [path
-            for path in ifind('src')
-            if path.endswith('.glsl')]
-
-JSDOC_SRC = [path
-             for path in ifind('src')
-             if path.endswith('.jsdoc')]
-
-SHADER_SRC = [path.replace('.glsl', 'shader.js')
-              for path in GLSL_SRC]
-
-SPEC = [path
-        for path in ifind('test/spec')
-        if path.endswith('.js')]
-
-TASKS = [path
-         for path in ifind('tasks')
-         if path.endswith('.js')]
-
-SRC = [path
-       for path in ifind('src/ol')
-       if path.endswith('.js')
-       if path not in SHADER_SRC]
-
-NPM_INSTALL = 'build/npm-install-timestamp'
-
-def report_sizes(t):
-    stringio = StringIO()
-    gzipfile = gzip.GzipFile(t.name, 'w', 9, stringio)
-    with open(t.name, 'rb') as f:
-        shutil.copyfileobj(f, gzipfile)
-    gzipfile.close()
-    rawsize = os.stat(t.name).st_size
-    gzipsize = len(stringio.getvalue())
-    savings = '{0:.2%}'.format((rawsize - gzipsize)/float(rawsize))
-    t.info('uncompressed: %8d bytes', rawsize)
-    t.info('  compressed: %8d bytes, (saved %s)', gzipsize, savings)
-
-
-virtual('default', 'build')
-
-
-virtual('ci', 'lint', 'build', 'test',
-    'build/examples/all.combined.js', 'check-examples', 'apidoc')
-
-
-virtual('build', 'build/ol.css', 'build/ol.js', 'build/ol-debug.js',
-    'build/ol.js.map')
-
-
-virtual('check', 'lint', 'build/ol.js', 'test')
-
-
-virtual('todo', 'fixme')
-
-
-@target(NPM_INSTALL, 'package.json')
-def npm_install(t):
-    t.run('npm', 'install')
-    t.touch()
-
-
-@target('build/ol.css', 'css/ol.css', NPM_INSTALL)
-def build_ol_css(t):
-    t.output('%(CLEANCSS)s', 'css/ol.css')
-
-
-def _build_js(t):
-    t.run('node', 'tasks/build.js', 'config/ol.json', 'build/ol.js')
-
-
-@target('build/ol.js', SRC, SHADER_SRC, 'config/ol.json', NPM_INSTALL)
-def build_ol_js(t):
-    _build_js(t)
-    report_sizes(t)
-
-
-@target('build/ol.js.map', SRC, SHADER_SRC, 'config/ol.json', NPM_INSTALL)
-def build_ol_js_map(t):
-    _build_js(t)
-
-
-@target('build/ol-debug.js', SRC, SHADER_SRC, 'config/ol-debug.json',
-        NPM_INSTALL)
-def build_ol_debug_js(t):
-    t.run('node', 'tasks/build.js', 'config/ol-debug.json', 'build/ol-debug.js')
-    report_sizes(t)
-
-
-for glsl_src in GLSL_SRC:
-    def shader_src_helper(glsl_src):
-        @target(glsl_src.replace('.glsl', 'shader.js'), glsl_src,
-                'src/ol/webgl/shader.mustache', 'bin/pyglslunit.py')
-        def shader_src(t):
-            t.run('%(PYTHON)s', 'bin/pyglslunit.py',
-                  '--input', glsl_src,
-                  '--template', 'src/ol/webgl/shader.mustache',
-                  '--output', t.name)
-    shader_src_helper(glsl_src)
-
-
-@target('build/test/requireall.js', SPEC)
-def build_test_requireall_js(t):
-    requires = set()
-    for dependency in t.dependencies:
-        for line in open(dependency, 'rU'):
-            match = re.match(r'goog\.provide\(\'(.*)\'\);', line)
-            if match:
-                requires.add(match.group(1))
-    with open(t.name, 'wb') as f:
-        for require in sorted(requires):
-            f.write('goog.require(\'%s\');\n' % (require,))
-
-
-virtual('build-examples', 'examples', 'build/examples/all.combined.js',
-        EXAMPLES_COMBINED)
-
-
-virtual('examples', 'examples/example-list.xml', EXAMPLES_JSON)
-
-
-@target('examples/example-list.xml', 'examples/example-list.js')
-def examples_examples_list_xml(t):
-    t.touch()  # already generated by bin/exampleparser.py
-
-
-@target('examples/example-list.js', 'bin/exampleparser.py', EXAMPLES)
-def examples_examples_list_js(t):
-    t.run('%(PYTHON)s', 'bin/exampleparser.py', 'examples', 'examples')
-
-
-@target('build/examples/all.combined.js', 'build/examples/all.js',
-        SRC, SHADER_SRC, 'config/examples-all.json', NPM_INSTALL)
-def build_examples_all_combined_js(t):
-    t.run('node', 'tasks/build.js', 'config/examples-all.json',
-          'build/examples/all.combined.js')
-    report_sizes(t)
-
-
-@target('build/examples/all.js', EXAMPLES_SRC)
-def build_examples_all_js(t):
-    t.output('%(PYTHON)s', 'bin/combine-examples.py', t.dependencies)
-
-
-@rule(r'\Abuild/examples/(?P<id>.*).json\Z')
-def examples_star_json(name, match):
-    def action(t):
-
-        # When compiling the ol3 code and the application code together it is
-        # better to use oli.js and olx.js files as "input" files rather than
-        # "externs" files. Indeed, externs prevent renaming, which is neither
-        # necessary nor desirable in this case.
-        #
-        # oli.js and olx.js do not provide or require namespaces (using
-        # "goog.provide" or "goog.require"). For that reason, if they are
-        # specified as input files through the "src" property, then
-        # closure-util will exclude them when creating the dependencies graph.
-        # So the compile "js" property is used instead. With that property the
-        # oli.js and olx.js files are passed directly to the compiler. And by
-        # setting "manage_closure_dependencies" to "true" the compiler will not
-        # exclude them from its dependencies graph.
-
-        content = json.dumps({
-          "exports": [],
-          "src": [
-            "src/**/*.js",
-            "build/ol.ext/*.js",
-            "examples/%(id)s.js" % match.groupdict()],
-          "compile": {
-            "js": [
-              "externs/olx.js",
-              "externs/oli.js",
-            ],
-            "externs": [
-              "externs/bingmaps.js",
-              "externs/bootstrap.js",
-              "externs/closure-compiler.js",
-              "externs/example.js",
-              "externs/fastclick.js",
-              "externs/geojson.js",
-              "externs/jquery-1.9.js",
-              "externs/proj4js.js",
-              "externs/tilejson.js",
-              "externs/topojson.js",
-              "externs/vbarray.js"
-            ],
-            "define": [
-              "goog.array.ASSUME_NATIVE_FUNCTIONS=true",
-              "goog.dom.ASSUME_STANDARDS_MODE=true",
-              "goog.json.USE_NATIVE_JSON=true",
-              "goog.DEBUG=false"
-            ],
-            "jscomp_error": [
-              "accessControls",
-              "ambiguousFunctionDecl",
-              "checkDebuggerStatement",
-              "checkEventfulObjectDisposal",
-              "checkProvides",
-              "checkRegExp",
-              "checkStructDictInheritance",
-              "checkTypes",
-              "checkVars",
-              "const",
-              "constantProperty",
-              "deprecated",
-              "duplicate",
-              "duplicateMessage",
-              "es3",
-              "es5Strict",
-              "externsValidation",
-              "fileoverviewTags",
-              "globalThis",
-              "internetExplorerChecks",
-              "invalidCasts",
-              "misplacedTypeAnnotation",
-              "missingProperties",
-              "nonStandardJsDocs",
-              "strictModuleDepCheck",
-              "suspiciousCode",
-              "typeInvalidation",
-              "tweakValidation",
-              "undefinedNames",
-              "undefinedVars",
-              "uselessCode",
-              "violatedModuleDep",
-              "visibility"
-            ],
-            "jscomp_off": [
-              "unknownDefines"
-            ],
-            "extra_annotation_name": [
-              "api", "observable"
-            ],
-            "compilation_level": "ADVANCED",
-            "warning_level": "VERBOSE",
-            "output_wrapper": "(function(){%output%})();",
-            "use_types_for_optimization": True,
-            "manage_closure_dependencies": True
-          }
-        })
-        with open(t.name, 'wb') as f:
-            f.write(content)
-    return Target(name, action=action,
-                  dependencies=[__file__, NPM_INSTALL])
-
-
-@rule(r'\Abuild/examples/(?P<id>.*).combined.js\Z')
-def examples_star_combined_js(name, match):
-    def action(t):
-        config = 'build/examples/%(id)s.json' % match.groupdict()
-        t.run('node', 'tasks/build.js', config, name)
-        report_sizes(t)
-    dependencies = [SRC, SHADER_SRC,
-                    'examples/%(id)s.js' % match.groupdict(),
-                    'build/examples/%(id)s.json' % match.groupdict(),
-                    NPM_INSTALL]
-    return Target(name, action=action, dependencies=dependencies)
-
-
-@target('serve', 'examples', NPM_INSTALL)
-def serve(t):
-    t.run('node', 'tasks/serve.js')
-
-
-virtual('lint', 'build/lint-timestamp', 'build/check-requires-timestamp',
-    'build/check-whitespace-timestamp', 'jshint')
-
-
-@target('build/lint-timestamp', SRC, EXAMPLES_SRC, SPEC, precious=True)
-def build_lint_src_timestamp(t):
-    t.run('%(GJSLINT)s',
-          '--jslint_error=all',
-          '--custom_jsdoc_tags=event,fires,function,classdesc,api,observable',
-          '--strict',
-          t.newer(t.dependencies))
-    t.touch()
-
-virtual('jshint', 'build/jshint-timestamp')
-
-@target('build/jshint-timestamp', SRC, EXAMPLES_SRC, SPEC, TASKS,
-        NPM_INSTALL, precious=True)
-def build_jshint_timestamp(t):
-    t.run(variables.JSHINT, '--verbose', t.newer(t.dependencies))
-    t.touch()
-
-
-def _strip_comments(lines):
-    # FIXME this is a horribe hack, we should use a proper JavaScript parser
-    # here
-    in_multiline_comment = False
-    lineno = 0
-    for line in lines:
-        lineno += 1
-        if in_multiline_comment:
-            index = line.find('*/')
-            if index != -1:
-                in_multiline_comment = False
-                line = line[index + 2:]
-        if not in_multiline_comment:
-            line = re.sub(r'//[^\n]*', '', line)
-            line = re.sub(r'/\*.*?\*/', '', line)
-            index = line.find('/*')
-            if index != -1:
-                yield lineno, line[:index]
-                in_multiline_comment = True
-            else:
-                yield lineno, line
-
-
-@target('build/check-requires-timestamp', SRC, EXAMPLES_SRC, SHADER_SRC, SPEC)
-def build_check_requires_timestamp(t):
-    unused_count = 0
-    all_provides = set()
-    closure_lib_path = output('node', '-e',
-        'process.stdout.write(require("closure-util").getLibraryPath())')
-    for filename in ifind(closure_lib_path):
-        if filename.endswith('.js'):
-            if not re.match(r'.*/closure/goog/', filename):
-                continue
-            # Skip goog.i18n because it contains so many modules that it causes
-            # the generated regular expression to exceed Python's limits
-            if re.match(r'.*/closure/goog/i18n/', filename):
-                continue
-            for line in open(filename, 'rU'):
-                m = re.match(r'goog.provide\(\'(.*)\'\);', line)
-                if m:
-                    all_provides.add(m.group(1))
-    for filename in sorted(t.dependencies):
-        require_linenos = {}
-        uses = set()
-        lines = open(filename, 'rU').readlines()
-        for lineno, line in _strip_comments(lines):
-            m = re.match(r'goog.provide\(\'(.*)\'\);', line)
-            if m:
-                all_provides.add(m.group(1))
-                continue
-            m = re.match(r'goog.require\(\'(.*)\'\);', line)
-            if m:
-                require_linenos[m.group(1)] = lineno
-                continue
-        ignore_linenos = require_linenos.values()
-        for lineno, line in enumerate(lines):
-            if lineno in ignore_linenos:
-                continue
-            for require in require_linenos.iterkeys():
-                if require in line:
-                    uses.add(require)
-        for require in sorted(set(require_linenos.keys()) - uses):
-            t.info('%s:%d: unused goog.require: %r' % (
-                filename, require_linenos[require], require))
-            unused_count += 1
-    all_provides.discard('ol')
-    all_provides.discard('ol.MapProperty')
-
-    class Node(object):
-
-        def __init__(self):
-            self.present = False
-            self.children = {}
-
-        def _build_re(self, key):
-            if key == '*':
-                assert len(self.children) == 0
-                # We want to match `.doIt` but not `.SomeClass` or `.more.stuff`
-                return '(?=\\.[a-z]\\w*\\b(?!\\.))'
-            elif len(self.children) == 1:
-                child_key, child = next(self.children.iteritems())
-                child_re = child._build_re(child_key)
-                if child_key != '*':
-                    child_re = '\\.' + child_re
-                if self.present:
-                    return key + '(' + child_re + ')?'
-                else:
-                    return key + child_re
-            elif self.children:
-                children_re = '(?:' + '|'.join(
-                    ('\\.' if k != '*' else '') + self.children[k]._build_re(k)
-                    for k in sorted(self.children.keys())) + ')'
-                if self.present:
-                    return key + children_re + '?'
-                else:
-                    return key + children_re
-            else:
-                assert self.present
-                return key
-
-        def build_re(self, key):
-            return re.compile('\\b' + self._build_re(key) + '\\b')
-    root = Node()
-    for provide in all_provides:
-        node = root
-        for component in provide.split('.'):
-            if component not in node.children:
-                node.children[component] = Node()
-            node = node.children[component]
-        if component[0].islower():
-            # We've arrived at a namespace provide like `ol.foo`.
-            # In this case, we want to match uses like `ol.foo.doIt()` but
-            # not match things like `new ol.foo.SomeClass()`.
-            # For this purpose, we use the special wildcard key for the child.
-            node.children['*'] = Node()
-        else:
-            node.present = True
-    provide_res = [child.build_re(key)
-                   for key, child in root.children.iteritems()]
-    missing_count = 0
-    for filename in sorted(t.dependencies):
-        provides = set()
-        requires = set()
-        uses = set()
-        uses_linenos = {}
-        for lineno, line in _strip_comments(open(filename, 'rU')):
-            m = re.match(r'goog.provide\(\'(.*)\'\);', line)
-            if m:
-                provides.add(m.group(1))
-                continue
-            m = re.match(r'goog.require\(\'(.*)\'\);', line)
-            if m:
-                requires.add(m.group(1))
-                continue
-            while True:
-                for provide_re in provide_res:
-                    m = provide_re.search(line)
-                    if m:
-                        uses.add(m.group())
-                        uses_linenos[m.group()] = lineno
-                        line = line[:m.start()] + line[m.end():]
-                        break
-                else:
-                    break
-        if filename == 'src/ol/renderer/layerrenderer.js':
-            uses.discard('ol.renderer.Map')
-        m = re.match(
-            r'src/ol/renderer/(\w+)/\1(\w*)layerrenderer\.js\Z', filename)
-        if m:
-            uses.discard('ol.renderer.Map')
-            uses.discard('ol.renderer.%s.Map' % (m.group(1),))
-        missing_requires = uses - requires - provides
-        if missing_requires:
-            for missing_require in sorted(missing_requires):
-                t.info("%s:%d missing goog.require('%s')" %
-                       (filename, uses_linenos[missing_require], missing_require))
-                missing_count += 1
-    if unused_count or missing_count:
-        t.error('%d unused goog.requires, %d missing goog.requires' %
-                (unused_count, missing_count))
-    t.touch()
-
-
-@target('build/check-whitespace-timestamp', SRC, EXAMPLES_SRC,
-        SPEC, JSDOC_SRC, precious=True)
-def build_check_whitespace_timestamp(t):
-    CR_RE = re.compile(r'\r')
-    LEADING_WHITESPACE_RE = re.compile(r'\s+')
-    TRAILING_WHITESPACE_RE = re.compile(r'\s+\n\Z')
-    NO_NEWLINE_RE = re.compile(r'[^\n]\Z')
-    ALL_WHITESPACE_RE = re.compile(r'\s+\Z')
-    errors = 0
-    for filename in sorted(t.newer(t.dependencies)):
-        whitespace = False
-        for lineno, line in enumerate(open(filename, 'rU')):
-            if lineno == 0 and LEADING_WHITESPACE_RE.match(line):
-                t.info('%s:%d: leading whitespace', filename, lineno + 1)
-                errors += 1
-            if CR_RE.search(line):
-                t.info('%s:%d: carriage return character in line', filename, lineno + 1)
-                errors += 1
-            if TRAILING_WHITESPACE_RE.search(line):
-                t.info('%s:%d: trailing whitespace', filename, lineno + 1)
-                errors += 1
-            if NO_NEWLINE_RE.search(line):
-                t.info('%s:%d: no newline at end of file', filename, lineno + 1)
-                errors += 1
-            whitespace = ALL_WHITESPACE_RE.match(line)
-        if whitespace:
-            t.info('%s: trailing whitespace at end of file', filename)
-            errors += 1
-    if errors:
-        t.error('%d whitespace errors' % (errors,))
-    t.touch()
-
-
-virtual('apidoc', 'build/jsdoc-%(BRANCH)s-timestamp' % vars(variables))
-
-
-@target('build/jsdoc-%(BRANCH)s-timestamp' % vars(variables), 'host-resources',
-        SRC, SHADER_SRC, ifind('config/jsdoc/api/template'),
-        NPM_INSTALL)
-def jsdoc_BRANCH_timestamp(t):
-    t.run('%(JSDOC)s', 'config/jsdoc/api/index.md',
-          '-c', 'config/jsdoc/api/conf.json',
-          '-d', 'build/hosted/%(BRANCH)s/apidoc')
-    t.touch()
-
-
-def split_example_file(example, dst_dir):
-    lines = open(example, 'rU').readlines()
-
-    target_lines = []
-    target_require_lines = []
-
-    found_requires = False
-    found_code = False
-    for line in lines:
-        m = re.match(r'goog.require\(\'(.*)\'\);', line)
-        if m:
-            found_requires = True
-            target_require_lines.append(line)
-        elif found_requires:
-            if found_code or line not in ('\n', '\r\n'):
-                found_code = True
-                target_lines.append(line)
-
-    target = open(
-        os.path.join(dst_dir, os.path.basename(example)), 'wb')
-    target_require = open(
-        os.path.join(dst_dir, os.path.basename(example)
-          .replace('.js', '-require.js')),
-        'wb')
-
-    target.writelines(target_lines)
-    target.close()
-
-    target_require.writelines(target_require_lines)
-    target_require.close()
-
-
-@target('host-resources', phony=True)
-def host_resources(t):
-    resources_dir = 'build/hosted/%(BRANCH)s/resources'
-    t.rm_rf(resources_dir)
-    t.cp_r('resources', resources_dir)
-
-
-@target('host-examples', 'build', 'host-resources', 'examples', phony=True)
-def host_examples(t):
-    examples_dir = 'build/hosted/%(BRANCH)s/examples'
-    build_dir = 'build/hosted/%(BRANCH)s/build'
-    css_dir = 'build/hosted/%(BRANCH)s/css'
-    closure_lib_path = output('node', '-e',
-        'process.stdout.write(require("closure-util").getLibraryPath())')
-    t.rm_rf(examples_dir)
-    t.makedirs(examples_dir)
-    t.rm_rf(build_dir)
-    t.makedirs(build_dir)
-    t.rm_rf(css_dir)
-    t.makedirs(css_dir)
-    t.cp(EXAMPLES, examples_dir)
-    for example in [path.replace('.html', '.js') for path in EXAMPLES]:
-        split_example_file(example, examples_dir % vars(variables))
-    t.cp_r('examples/data', examples_dir + '/data')
-    t.cp('bin/loader_hosted_examples.js', examples_dir + '/loader.js')
-    t.cp('build/ol.js', 'build/ol-debug.js', build_dir)
-    t.cp('build/ol.css', css_dir)
-    t.cp('examples/index.html', 'examples/example-list.js',
-         'examples/example-list.xml', 'examples/Jugl.js', examples_dir)
-    t.rm_rf('build/hosted/%(BRANCH)s/closure-library')
-    t.cp_r(closure_lib_path, 'build/hosted/%(BRANCH)s/closure-library')
-    t.rm_rf('build/hosted/%(BRANCH)s/ol')
-    t.makedirs('build/hosted/%(BRANCH)s/ol')
-    t.cp_r('src/ol', 'build/hosted/%(BRANCH)s/ol/ol')
-    t.rm_rf('build/hosted/%(BRANCH)s/ol.ext')
-    t.cp_r('build/ol.ext', 'build/hosted/%(BRANCH)s/ol.ext')
-    t.run('%(PYTHON)s', closure_lib_path + '/closure/bin/build/depswriter.py',
-          '--root_with_prefix', 'src ../../../ol',
-          '--root_with_prefix', 'build/ol.ext ../../../ol.ext',
-          '--root', 'build/hosted/%(BRANCH)s/closure-library/closure/goog',
-          '--root_with_prefix', 'build/hosted/%(BRANCH)s/closure-library/'
-          'third_party ../../third_party',
-          '--output_file', 'build/hosted/%(BRANCH)s/build/ol-deps.js')
-
-
-@target('check-examples', 'host-examples', phony=True)
-def check_examples(t):
-    examples = ['build/hosted/%(BRANCH)s/' + e
-                for e in EXAMPLES
-                if not open(e.replace('.html', '.js'), 'rU').readline().startswith('// NOCOMPILE')]
-    all_examples = [e + '?mode=advanced' for e in examples]
-    # Run the examples checks in a pool of threads
-    pool = ThreadPool()
-    for example in all_examples:
-        pool.add_task(t.run, '%(PHANTOMJS)s', 'bin/check-example.js', example)
-    errors = pool.wait_completion()
-    if errors:
-        sys.exit(1)
-
-
-@target('test', NPM_INSTALL, phony=True)
-def test(t):
-    t.run('node', 'tasks/test.js')
-
-
-@target('fixme', phony=True)
-def find_fixme(t):
-    regex = re.compile('FIXME|TODO')
-    matches = dict()
-    totalcount = 0
-    for filename in SRC:
-        f = open(filename, 'r')
-        for lineno, line in enumerate(f):
-            if regex.search(line):
-                if (filename not in matches):
-                    matches[filename] = list()
-                matches[filename].append('#%-10d %s' % (
-                    lineno + 1, line.strip()))
-                totalcount += 1
-        f.close()
-
-    for filename in matches:
-        num_matches = len(matches[filename])
-        noun = 'matches' if num_matches > 1 else 'match'
-        print '  %s has %d %s:' % (filename, num_matches, noun)
-        for match in matches[filename]:
-            print '    %s' % (match,)
-        print
-    print 'A total of %d TODO/FIXME(s) were found' % (totalcount,)
-
-
-@target('reallyclean')
-def reallyclean(t):
-    """Removes untracked files and folders from previous builds."""
-    # -X => only clean up files that are usually ignored e.g.
-    #       through .gitignore
-    # -d => also consider directories for deletion
-    # -f => if git configuration variable clean.requireForce != false,
-    #       git clean will refuse to run unless given -f or -n.
-    t.run('%(GIT)s', 'clean', '-X', '-d', '-f', '.')
-
-
-@target('checkdeps')
-def check_dependencies(t):
-    for exe in EXECUTABLES:
-        status = 'present' if which(exe) else 'MISSING'
-        print 'Program "%s" seems to be %s.' % (exe, status)
-    print 'For certain targets all above programs need to be present.'
-
-
-@target('help')
-def display_help(t):
-    print '''
-build.py - The OpenLayers 3 build script.
-
-Usage:
-  ./build.py [options] [target]                         (on Unix-based machines)
-  <python-executable.exe> build.py [options] [target]   (on Windows machines)
-
-There is one option:
-  -c               - Cleans up the repository from previous builds.
-
-The most common targets are:
-  serve            - Serves files, on port 3000.
-  lint             - Runs gjslint on all sourcefiles to enforce specific syntax.
-  build            - Builds singlefile versions of OpenLayers JavaScript and
-                     CSS. This is also the default build target which runs when
-                     no target is specified.
-  test             - Runs the testsuite and displays the results.
-  check            - Runs the lint-target, builds some OpenLayers files, and
-                     then runs test. Many developers call this target often
-                     while working on the code.
-  help             - Shows this help.
-
-Other less frequently used targets are:
-  apidoc           - Builds the API-Documentation using JSDoc3.
-  ci               - Builds all examples in various modes and usually takes a
-                     long time to finish. This target calls the following
-                     targets: lint, build, build-all, test, build-examples,
-                     check-examples and apidoc. This is the target run on
-                     Travis CI.
-  reallyclean      - Remove untracked files from the repository.
-  checkdeps        - Checks whether all required development software is
-                     installed on your machine.
-  fixme            - Will print a list of parts of the code that are marked
-                     with either TODO or FIXME.
-  todo             - This is an alias for the fixme-target (see above).
-
-If no target is given, the build-target will be executed.
-
-The above list is not complete, please see the source code for not-mentioned
-and only seldom called targets.
-    '''
-
-if __name__ == '__main__':
-    main()

changelog/upgrade-notes.md

@@ -1,5 +1,346 @@
 ## Upgrade notes
 
+### v3.11.0
+
+#### `ol.format.KML` changes
+
+KML icons are scaled 50% so that the rendering better matches Google Earth rendering.
+
+If a KML placemark has a name and is a point, an `ol.style.Text` is created with the name displayed to the right of the icon (if there is an icon).
+This can be controlled with the showPointNames option which defaults to true.
+
+To disable rendering of the point names for placemarks, use the option:
+new ol.format.KML({ showPointNames: false });
+
+
+#### `ol.interaction.DragBox` and `ol.interaction.DragZoom` changes
+
+Styling is no longer done with `ol.Style`, but with pure CSS. The `style` constructor option is no longer required, and no longer available. Instead, there is a `className` option for the CSS selector. The default for `ol.interaction.DragBox` is `ol-dragbox`, and `ol.interaction.DragZoom` uses `ol-dragzoom`. If you previously had
+```js
+new ol.interaction.DragZoom({
+  style: new ol.style.Style({
+    stroke: new ol.style.Stroke({
+      color: 'red',
+      width: 3
+    }),
+    fill: new ol.style.Fill({
+      color: [255, 255, 255, 0.4]
+    })
+  })
+});
+```
+you'll now just need
+```js
+new ol.interaction.DragZoom();
+```
+but with additional css:
+```css
+.ol-dragzoom {
+  border-color: red;
+  border-width: 3px;
+  background-color: rgba(255,255,255,0.4);
+}
+```
+
+#### Removal of `ol.source.TileVector`
+
+With the introduction of true vector tile support, `ol.source.TileVector` becomes obsolete. Change your code to use `ol.layer.VectorTile` and `ol.source.VectorTile` instead of `ol.layer.Vector` and `ol.source.TileVector`.
+
+### v3.10.0
+
+#### `ol.layer.Layer` changes
+
+The experimental `setHue`, `setContrast`, `setBrightness`, `setSaturation`, and the corresponding getter methods have been removed.  These properties only worked with the WebGL renderer.  If are interested in applying color transforms, look for the `postcompose` event in the API docs.  In addition, the `ol.source.Raster` source provides a way to create new raster data based on arbitrary transforms run on any number of input sources.
+
+### v3.9.0
+
+#### `ol.style.Circle` changes
+
+The experimental `getAnchor`, `getOrigin`, and `getSize` methods have been removed.  The anchor and origin of a circle symbolizer are not modifiable, so these properties should not need to be accessed.  The radius and stroke width can be used to calculate the rendered size of a circle symbolizer if needed:
+
+```js
+// calculate rendered size of a circle symbolizer
+var width = 2 * circle.getRadius();
+if (circle.getStroke()) {
+  width += circle.getStroke().getWidth() + 1;
+}
+```
+
+### v3.8.0
+
+There should be nothing special required when upgrading from v3.7.0 to v3.8.0.
+
+### v3.7.0
+
+#### Removal of `ol.FeatureOverlay`
+
+Instead of an `ol.FeatureOverlay`, we now use an `ol.layer.Vector` with an
+`ol.source.Vector`. If you previously had:
+```js
+var featureOverlay = new ol.FeatureOverlay({
+  map: map,
+  style: overlayStyle
+});
+featureOverlay.addFeature(feature);
+featureOverlay.removeFeature(feature);
+var collection = featureOverlay.getFeatures();
+```
+you will have to change this to:
+```js
+var collection = new ol.Collection();
+var featureOverlay = new ol.layer.Vector({
+  map: map,
+  source: new ol.source.Vector({
+    features: collection,
+    useSpatialIndex: false // optional, might improve performance
+  }),
+  style: overlayStyle,
+  updateWhileAnimating: true, // optional, for instant visual feedback
+  updateWhileInteracting: true // optional, for instant visual feedback
+});
+featureOverlay.getSource().addFeature(feature);
+featureOverlay.getSource().removeFeature(feature);
+```
+
+With the removal of `ol.FeatureOverlay`, `zIndex` symbolizer properties of overlays are no longer stacked per map, but per layer/overlay. If you previously had multiple feature overlays where you controlled the rendering order of features by using `zIndex` symbolizer properties, you can now achieve the same rendering order only if all overlay features are on the same layer.
+
+Note that `ol.FeatureOverlay#getFeatures()` returned an `{ol.Collection.<ol.Feature>}`, whereas `ol.source.Vector#getFeatures()` returns an `{Array.<ol.Feature>}`.
+
+#### `ol.TileCoord` changes
+
+Until now, the API exposed two different types of `ol.TileCoord` tile coordinates: internal ones that increase left to right and upward, and transformed ones that may increase downward, as defined by a transform function on the tile grid. With this change, the API now only exposes tile coordinates that increase left to right and upward.
+
+Previously, tile grids created by OpenLayers either had their origin at the top-left or at the bottom-left corner of the extent. To make it easier for application developers to transform tile coordinates to the common XYZ tiling scheme, all tile grids that OpenLayers creates internally have their origin now at the top-left corner of the extent.
+
+This change affects applications that configure a custom `tileUrlFunction` for an `ol.source.Tile`. Previously, the `tileUrlFunction` was called with rather unpredictable tile coordinates, depending on whether a tile coordinate transform took place before calling the `tileUrlFunction`. Now it is always called with OpenLayers tile coordinates. To transform these into the common XYZ tiling scheme, a custom `tileUrlFunction` has to change the `y` value (tile row) of the `ol.TileCoord`:
+```js
+function tileUrlFunction = function(tileCoord, pixelRatio, projection) {
+  var urlTemplate = '{z}/{x}/{y}';
+  return urlTemplate
+      .replace('{z}', tileCoord[0].toString())
+      .replace('{x}', tileCoord[1].toString())
+      .replace('{y}', (-tileCoord[2] - 1).toString());
+}
+```
+
+The `ol.tilegrid.TileGrid#createTileCoordTransform()` function which could be used to get the tile grid's tile coordinate transform function has been removed. This function was confusing and should no longer be needed now that application developers get tile coordinates in a known layout.
+
+The code snippets below show how your application code needs to be changed:
+
+Old application code (with `ol.tilegrid.TileGrid#createTileCoordTransform()`):
+```js
+var transform = source.getTileGrid().createTileCoordTransform();
+var tileUrlFunction = function(tileCoord, pixelRatio, projection) {
+  tileCoord = transform(tileCoord, projection);
+  return 'http://mytiles.com/' +
+      tileCoord[0] + '/' + tileCoord[1] + '/' + tileCoord[2] + '.png';
+};
+```
+Old application code (with custom `y` transform):
+```js
+var tileUrlFunction = function(tileCoord, pixelRatio, projection) {
+  var z = tileCoord[0];
+  var yFromBottom = tileCoord[2];
+  var resolution = tileGrid.getResolution(z);
+  var tileHeight = ol.size.toSize(tileSize)[1];
+  var matrixHeight =
+      Math.floor(ol.extent.getHeight(extent) / tileHeight / resolution);
+  return 'http://mytiles.com/' +
+      tileCoord[0] + '/' + tileCoord[1] + '/' +
+      (matrixHeight - yFromBottom - 1) + '.png';
+
+};
+```
+New application code (simple -y - 1 transform):
+```js
+var tileUrlFunction = function(tileCoord, pixelRatio, projection) {
+  return 'http://mytiles.com/' +
+      tileCoord[0] + '/' + tileCoord[1] + '/' + (-tileCoord[2] - 1) + '.png';
+};
+```
+
+#### Removal of `ol.tilegrid.Zoomify`
+
+The replacement of `ol.tilegrid.Zoomify` is a plain `ol.tilegrid.TileGrid`, configured with `extent`, `origin` and `resolutions`. If the `size` passed to the `ol.source.Zoomify` source is `[width, height]`, then the extent for the tile grid will be `[0, -height, width, 0]`, and the origin will be `[0, 0]`.
+
+#### Replace `ol.View.fitExtent()` and `ol.View.fitGeometry()` with `ol.View.fit()`
+* This combines two previously distinct functions into one more flexible call which takes either a geometry or an extent.
+* Rename all calls to `fitExtent` and `fitGeometry` to `fit`.
+
+#### Change to `ol.interaction.Modify`
+
+When single clicking a line or boundary within the `pixelTolerance`, a vertex is now created.
+
+### v3.6.0
+
+#### `ol.interaction.Draw` changes
+
+* The `minPointsPerRing` config option has been renamed to `minPoints`. It is now also available for linestring drawing, not only for polygons.
+* The `ol.DrawEvent` and `ol.DrawEventType` types were renamed to `ol.interaction.DrawEvent` and `ol.interaction.DrawEventType`. This has an impact on your code only if your code is compiled together with ol3.
+
+#### `ol.tilegrid` changes
+
+* The `ol.tilegrid.XYZ` constructor has been replaced by a static `ol.tilegrid.createXYZ()` function. The `ol.tilegrid.createXYZ()` function takes the same arguments as the previous `ol.tilegrid.XYZ` constructor, but returns an `ol.tilegrid.TileGrid` instance.
+* The internal tile coordinate scheme for XYZ sources has been changed. Previously, the `y` of tile coordinates was transformed to the coordinates used by sources by calculating `-y-1`. Now, it is transformed by calculating `height-y-1`, where height is the number of rows of the tile grid at the zoom level of the tile coordinate.
+* The `widths` constructor option of `ol.tilegrid.TileGrid` and subclasses is no longer available, and it is no longer necessary to get proper wrapping at the 180° meridian. However, for `ol.tilegrid.WMTS`, there is a new option `sizes`, where each entry is an `ol.Size` with the `width` ('TileMatrixWidth' in WMTS capabilities) as first and the `height` ('TileMatrixHeight') as second entry of the array. For other tile grids, users can
+now specify an `extent` instead of `widths`. These settings are used to restrict the range of tiles that sources will request.
+* For `ol.source.TileWMS`, the default value of `warpX` used to be `undefined`, meaning that WMS requests with out-of-extent tile BBOXes would be sent. Now `wrapX` can only be `true` or `false`, and the new default is `true`. No application code changes should be required, but the resulting WMS requests for out-of-extent tiles will no longer use out-of-extent BBOXes, but ones that are shifted to real-world coordinates.
+
+### v3.5.0
+
+#### `ol.Object` and `bindTo`
+
+* The following experimental methods have been removed from `ol.Object`: `bindTo`, `unbind`, and `unbindAll`.  If you want to get notification about `ol.Object` property changes, you can listen for the `'propertychange'` event (e.g. `object.on('propertychange', listener)`).  Two-way binding can be set up at the application level using property change listeners.  See [#3472](https://github.com/openlayers/ol3/pull/3472) for details on the change.
+
+* The experimental `ol.dom.Input` component has been removed.  If you need to synchronize the state of a dom Input element with an `ol.Object`, this can be accomplished using listeners for change events.  For example, you might bind the state of a checkbox type input with a layer's visibility like this:
+
+  ```js
+  var layer = new ol.layer.Tile();
+  var checkbox = document.querySelector('#checkbox');
+
+  checkbox.addEventListener('change', function() {
+    var checked = this.checked;
+    if (checked !== layer.getVisible()) {
+      layer.setVisible(checked);
+    }
+  });
+
+  layer.on('change:visible', function() {
+    var visible = this.getVisible();
+    if (visible !== checkbox.checked) {
+      checkbox.checked = visible;
+    }
+  });
+  ```
+
+#### New Vector API
+
+* The following experimental vector classes have been removed: `ol.source.GeoJSON`, `ol.source.GML`, `ol.source.GPX`, `ol.source.IGC`, `ol.source.KML`, `ol.source.OSMXML`, and `ol.source.TopoJSON`. You now will use `ol.source.Vector` instead.
+
+  For example, if you used `ol.source.GeoJSON` as follows:
+
+  ```js
+  var source = new ol.source.GeoJSON({
+    url: 'features.json',
+    projection: 'EPSG:3857'
+  });
+  ```
+
+  you will need to change your code to:
+
+  ```js
+  var source = new ol.source.Vector({
+    url: 'features.json',
+    format: new ol.format.GeoJSON()
+  });
+  ```
+
+  See http://openlayers.org/en/master/examples/vector-layer.html for a real example.
+
+  Note that you no longer need to set a `projection` on the source!
+
+  Previously the vector data was loaded at source construction time, and, if the data projection and the source projection were not the same, the vector data was transformed to the source projection before being inserted (as features) into the source.
+
+  The vector data is now loaded at render time, when the view projection is known. And the vector data is transformed to the view projection if the data projection and the source projection are not the same.
+
+  If you still want to "eagerly" load the source you will use something like this:
+
+  ```js
+  var source = new ol.source.Vector();
+  $.ajax('features.json').then(function(response) {
+    var geojsonFormat = new ol.format.GeoJSON();
+    var features = geojsonFormat.readFeatures(response,
+        {featureProjection: 'EPSG:3857'});
+    source.addFeatures(features);
+  });
+  ```
+
+  The above code uses jQuery to send an Ajax request, but you can obviously use any Ajax library.
+
+  See http://openlayers.org/en/master/examples/igc.html for a real example.
+
+* Note about KML
+
+  If you used `ol.source.KML`'s `extractStyles` or `defaultStyle` options, you will now have to set these options on `ol.format.KML` instead. For example, if you used:
+
+  ```js
+  var source = new ol.source.KML({
+    url: 'features.kml',
+    extractStyles: false,
+    projection: 'EPSG:3857'
+  });
+  ```
+
+  you will now use:
+
+  ```js
+  var source = new ol.source.Vector({
+    url: 'features.kml',
+    format: new ol.format.KML({
+      extractStyles: false
+    })
+  });
+  ```
+
+* The `ol.source.ServerVector` class has been removed. If you used it, for example as follows:
+
+  ```js
+  var source = new ol.source.ServerVector({
+    format: new ol.format.GeoJSON(),
+    loader: function(extent, resolution, projection) {
+      var url = …;
+      $.ajax(url).then(function(response) {
+        source.addFeatures(source.readFeatures(response));
+      });
+    },
+    strategy: ol.loadingstrategy.bbox,
+    projection: 'EPSG:3857'
+  });
+  ```
+
+  you will need to change your code to:
+
+  ```js
+  var source = new ol.source.Vector({
+    loader: function(extent, resolution, projection) {
+      var url = …;
+      $.ajax(url).then(function(response) {
+        var format = new ol.format.GeoJSON();
+        var features = format.readFeatures(response,
+            {featureProjection: projection});
+        source.addFeatures(features);
+      });
+    },
+    strategy: ol.loadingstrategy.bbox
+  });
+  ```
+
+  See http://openlayers.org/en/master/examples/vector-osm.html for a real example.
+
+* The experimental `ol.loadingstrategy.createTile` function has been renamed to `ol.loadingstrategy.tile`. The signature of the function hasn't changed. See http://openlayers.org/en/master/examples/vector-osm.html for an example.
+
+#### Change to `ol.style.Icon`
+
+* When manually loading an image for `ol.style.Icon`, the image size should now be set
+with the `imgSize` option and not with `size`. `size` is supposed to be used for the
+size of a sub-rectangle in an image sprite.
+
+#### Support for non-square tiles
+
+The return value of `ol.tilegrid.TileGrid#getTileSize()` will now be an `ol.Size` array instead of a number if non-square tiles (i.e. an `ol.Size` array instead of a number as `tilsSize`) are used. To always get an `ol.Size`, the new `ol.size.toSize()` was added.
+
+#### Change to `ol.interaction.Draw`
+
+When finishing a draw, the `drawend` event is now dispatched before the feature is inserted to either the source or the collection. This change allows application code to finish setting up the feature.
+
+#### Misc.
+
+If you compile your application together with the library and use the `ol.feature.FeatureStyleFunction` type annotation (this should be extremely rare), the type is now named `ol.FeatureStyleFunction`.
+
+### v3.4.0
+
+There should be nothing special required when upgrading from v3.3.0 to v3.4.0.
+
 ### v3.3.0
 
 * The `ol.events.condition.mouseMove` function was replaced by `ol.events.condition.pointerMove` (see [#3281](https://github.com/openlayers/ol3/pull/3281)). For example, if you use `ol.events.condition.mouseMove` as the condition in a `Select` interaction then you now need to use `ol.events.condition.pointerMove`:

changelog/v3.1.0.md

@@ -112,7 +112,7 @@ The 3.1.0 release maintains a backwards-compatible API with the 3.0.0 release, s
  * [#2781](https://github.com/openlayers/ol3/pull/2781) - Use a standard title attribute for the control buttons ([@fredj](https://github.com/fredj))
  * [#2852](https://github.com/openlayers/ol3/pull/2852) - Add missing space between class names ([@fredj](https://github.com/fredj))
  * [#2891](https://github.com/openlayers/ol3/pull/2891) - Introduce a load function for image sources ([@ahocevar](https://github.com/ahocevar))
- * [#2885](https://github.com/openlayers/ol3/pull/2885) - Add wrapX option to TileJSON source ([@elemoine](https://github.com/elemoine))
+ * [#2885](https://github.com/openlayers/ol3/pull/2885) - Add wrapX option to TileJSON source ([@elemoine](https://github.com/elemoine))
  * [#2890](https://github.com/openlayers/ol3/pull/2890) - Use correct layer property names ([@elemoine](https://github.com/elemoine))
  * [#2887](https://github.com/openlayers/ol3/pull/2887) - Explicitly pass coordinate dimension before transforming. ([@tschaub](https://github.com/tschaub))
  * [#2886](https://github.com/openlayers/ol3/pull/2886) - Use ternary notation ([@elemoine](https://github.com/elemoine))

changelog/v3.10.0.md

@@ -0,0 +1,93 @@
+# v3.10.0
+
+
+## Summary
+
+The v3.10.0 release includes features and fixes from 66 pull requests since the v3.9.0 release. New features and improvements include:
+
+* Full touch gesture support for the Microsoft Edge browser.
+* Improved API docs - required constructor options are now marked as such.
+* Text styles (vector labels) now work with defaults instead of failing when only a label text is set.
+* Write support for GML3 features with multiple geometries
+
+See the complete list below for details. And see the following notes to know how to upgrade from v3.9.0 to v3.10.0.
+
+
+## Upgrade notes
+
+#### `ol.layer.Layer` changes
+
+The experimental `setHue`, `setContrast`, `setBrightness`, `setSaturation`, and the corresponding getter methods have been removed.  These properties only worked with the WebGL renderer.  If you are interested in applying color transforms, look for the `postcompose` event in the API docs.  In addition, the `ol.source.Raster` source provides a way to create new raster data based on arbitrary transforms run on any number of input sources.
+
+#### Removal of legacy Internet Explorer support
+
+If you are building an appliction that supports Internet Explorer 8 or older, you'll need to use ES5 shims to make OpenLayers work. As before, support for such old browsers is very basic, and we recommend to not support them.
+
+
+## New features and fixes
+
+ * [#4237](https://github.com/openlayers/ol3/pull/4237) - #3328: GML3 - Writing features with multiple geometries ([@awaterme](https://github.com/awaterme))
+ * [#4218](https://github.com/openlayers/ol3/pull/4218) - Add 'getLayer()' method to 'ol.interaction.Select' ([@jonataswalker](https://github.com/jonataswalker))
+ * [#4036](https://github.com/openlayers/ol3/pull/4036) - Fix modify interaction event order ([@alvinlindstam](https://github.com/alvinlindstam))
+ * [#4036](https://github.com/openlayers/ol3/pull/4036) - Fix modify interaction event order ([@alvinlindstam](https://github.com/alvinlindstam))
+ * [#4116](https://github.com/openlayers/ol3/pull/4116) - Make ol.control.OverviewMap's view configurable ([@ahocevar](https://github.com/ahocevar))
+ * [#4234](https://github.com/openlayers/ol3/pull/4234) - Support OGC WKT proj4 def.units and def.to_meter ([@tbarsballe](https://github.com/tbarsballe))
+ * [#4224](https://github.com/openlayers/ol3/pull/4224) - Don't transform the angle into degrees to rotate the element ([@fredj](https://github.com/fredj))
+ * [#4231](https://github.com/openlayers/ol3/pull/4231) - Revert "Merge pull request #4217 from ThomasG77/clipboardjs-replacement" ([@ahocevar](https://github.com/ahocevar))
+ * [#4217](https://github.com/openlayers/ol3/pull/4217) - Replace ZeroClipboard with Clipboard.js to remove flash dependency ([@ThomasG77](https://github.com/ThomasG77))
+ * [#4223](https://github.com/openlayers/ol3/pull/4223) - Remove goog.fx.easing ([@fredj](https://github.com/fredj))
+ * [#4222](https://github.com/openlayers/ol3/pull/4222) - Remove unnecessary cast ([@fredj](https://github.com/fredj))
+ * [#4209](https://github.com/openlayers/ol3/pull/4209) - Remove goog.string.remove ([@gberaudo](https://github.com/gberaudo))
+ * [#4207](https://github.com/openlayers/ol3/pull/4207) - Remove goog.string.startsWith ([@gberaudo](https://github.com/gberaudo))
+ * [#4208](https://github.com/openlayers/ol3/pull/4208) - Remove goog.string.trim() ([@gberaudo](https://github.com/gberaudo))
+ * [#4216](https://github.com/openlayers/ol3/pull/4216) - Fix canvas replay which broke with 31a68e2 ([@ahocevar](https://github.com/ahocevar))
+ * [#4202](https://github.com/openlayers/ol3/pull/4202) - Remove use of goog.dom.appendChild ([@fredj](https://github.com/fredj))
+ * [#4205](https://github.com/openlayers/ol3/pull/4205) - Minor cleanup ([@fredj](https://github.com/fredj))
+ * [#4203](https://github.com/openlayers/ol3/pull/4203) - Cosmetic changes to example html / css ([@marcjansen](https://github.com/marcjansen))
+ * [#4184](https://github.com/openlayers/ol3/pull/4184) - Adjust iframe's position of GetFeatureInfo examples ([@jonataswalker](https://github.com/jonataswalker))
+ * [#4192](https://github.com/openlayers/ol3/pull/4192) - Remove use of goog.isNull in favor of simple truthy checks ([@marcjansen](https://github.com/marcjansen))
+ * [#4187](https://github.com/openlayers/ol3/pull/4187) - Fix {-y} template calculation for custom (TMS) tile grids ([@ahocevar](https://github.com/ahocevar))
+ * [#4176](https://github.com/openlayers/ol3/pull/4176) - Remove use of goog.isDefAndNotNull().
+ ([@tschaub](https://github.com/tschaub))
+ * [#4200](https://github.com/openlayers/ol3/pull/4200) - Do not use goog.object.get ([@marcjansen](https://github.com/marcjansen))
+ * [#4198](https://github.com/openlayers/ol3/pull/4198) - Improve 

ol.control.Rotate.prototype.resetNorth_ performance ([@denilsonsa](https://github.com/denilsonsa))
+ * [#4197](https://github.com/openlayers/ol3/pull/4197) - Remove blur action on MOUSEOUT on Zoom Out button ([@denilsonsa](https://github.com/denilsonsa))
+ * [#4195](https://github.com/openlayers/ol3/pull/4195) - #4171: Prefer current layout as default on MultiLineString.setLineStrings() ([@awaterme](https://github.com/awaterme))
+ * [#4172](https://github.com/openlayers/ol3/pull/4172) - #4171: Prefer current layout as default on Multipolygon.setPolygons() ([@awaterme](https://github.com/awaterme))
+ * [#4190](https://github.com/openlayers/ol3/pull/4190) - Remove use of goog.functions.constant ([@marcjansen](https://github.com/marcjansen))
+ * [#4188](https://github.com/openlayers/ol3/pull/4188) - Remove use of goog.object.getKeys ([@fredj](https://github.com/fredj))
+ * [#4189](https://github.com/openlayers/ol3/pull/4189) - Replace goog.nullFunction with ol.nullFunction ([@marcjansen](https://github.com/marcjansen))
+ * [#4165](https://github.com/openlayers/ol3/pull/4165) - Use ECMAScript 5.1 Array functions instead of goog.array ([@fredj](https://github.com/fredj))
+ * [#4181](https://github.com/openlayers/ol3/pull/4181) - Remove use of goog.array.contains ([@fredj](https://github.com/fredj))
+ * [#4162](https://github.com/openlayers/ol3/pull/4162) - Remove ol.LEGACY_IE_SUPPORT ([@fredj](https://github.com/fredj))
+ * [#4174](https://github.com/openlayers/ol3/pull/4174) - Remove hue, saturation, contrast, and brightness as layer properties. ([@tschaub](https://github.com/tschaub))
+ * [#4183](https://github.com/openlayers/ol3/pull/4183) - Remove @api on getHitDetectionFramebuffer ([@elemoine](https://github.com/elemoine))
+ * [#4179](https://github.com/openlayers/ol3/pull/4179) - Use Date.now() instead of goog.now() ([@marcjansen](https://github.com/marcjansen))
+ * [#4175](https://github.com/openlayers/ol3/pull/4175) - Remove use of goog.math.clamp(). ([@tschaub](https://github.com/tschaub))
+ * [#4173](https://github.com/openlayers/ol3/pull/4173) - Only animate when resolution is about to be changed ([@ahocevar](https://github.com/ahocevar))
+ * [#4129](https://github.com/openlayers/ol3/pull/4129) - Remove use of goog.isDef. ([@openlayers](https://github.com/openlayers))
+ * [#4168](https://github.com/openlayers/ol3/pull/4168) - Tile preload example wording (fixes #4147) ([@wlerner](https://github.com/wlerner))
+ * [#4167](https://github.com/openlayers/ol3/pull/4167) - Remove externs in externs/closure-compiler.js ([@fredj](https://github.com/fredj))
+ * [#4166](https://github.com/openlayers/ol3/pull/4166) - Use version 20150920 of Closure Compiler ([@elemoine](https://github.com/elemoine))
+ * [#4159](https://github.com/openlayers/ol3/pull/4159) - Remove use of goog.object.containsKey ([@fredj](https://github.com/fredj))
+ * [#4157](https://github.com/openlayers/ol3/pull/4157) - Fix typo in doc ([@elemoine](https://github.com/elemoine))
+ * [#4138](https://github.com/openlayers/ol3/pull/4138) - Enhanced documentation for ol.style.Text ([@ekargee](https://github.com/ekargee))
+ * [#4151](https://github.com/openlayers/ol3/pull/4151) - Remove bogus assertion ([@elemoine](https://github.com/elemoine))
+ * [#4110](https://github.com/openlayers/ol3/pull/4110) - Minor cleanups ([@fredj](https://github.com/fredj))
+ * [#4156](https://github.com/openlayers/ol3/pull/4156) - Rename drag-features example to custom-interactions ([@elemoine](https://github.com/elemoine))
+ * [#4150](https://github.com/openlayers/ol3/pull/4150) - Remove use of goog.object.remove ([@fredj](https://github.com/fredj))
+ * [#4145](https://github.com/openlayers/ol3/pull/4145) - API method for simplifying geometries. ([@tschaub](https://github.com/tschaub))
+ * [#4153](https://github.com/openlayers/ol3/pull/4153) - Add a "features" option to ol.interaction.Select ([@elemoine](https://github.com/elemoine))
+ * [#4144](https://github.com/openlayers/ol3/pull/4144) - Set context.fillStyle to a string ([@elemoine](https://github.com/elemoine))
+ * [#4149](https://github.com/openlayers/ol3/pull/4149) - Remove use of goog.array.isEmpty ([@fredj](https://github.com/fredj))
+ * [#4139](https://github.com/openlayers/ol3/pull/4139) - Add turf.js and JSTS example ([@tsauerwein](https://github.com/tsauerwein))
+ * [#4136](https://github.com/openlayers/ol3/pull/4136) - Fix the 'click-to-fork' link in contributer notes ([@marcjansen](https://github.com/marcjansen))
+ * [#4132](https://github.com/openlayers/ol3/pull/4132) - Update quickstart tutorial ([@tsauerwein](https://github.com/tsauerwein))
+ * [#4111](https://github.com/openlayers/ol3/pull/4111) - Use a blackish default for filling texts ([@marcjansen](https://github.com/marcjansen))
+ * [#4120](https://github.com/openlayers/ol3/pull/4120) - Remove invalid link to featureOverlay in API doc ([@kalbermattenm](https://github.com/kalbermattenm))
+ * [#4117](https://github.com/openlayers/ol3/pull/4117) - forEachFeatureAtPixel shouldn't fail if layer has no source ([@pgiraud](https://github.com/pgiraud))
+ * [#4106](https://github.com/openlayers/ol3/pull/4106) - Focus to search field on page load ([@elemoine](https://github.com/elemoine))
+ * [#4079](https://github.com/openlayers/ol3/pull/4079) - Automatically mark required options in API-docs ([@marcjansen](https://github.com/marcjansen))
+ * [#4108](https://github.com/openlayers/ol3/pull/4108) - Add missing CSSProperties.prototype.touchAction extern ([@fredj](https://github.com/fredj))
+ * [#4107](https://github.com/openlayers/ol3/pull/4107) - Prevent page zoom on IE Edge ([@fredj](https://github.com/fredj))
+ * [#3969](https://github.com/openlayers/ol3/pull/3969) - Add an option to use the mouse's location as an anchor when zooming ([@samuellapointe](https://github.com/samuellapointe))

changelog/v3.10.1.md

@@ -0,0 +1,7 @@
+# v3.10.1
+
+## Summary
+
+This is a patch release that fixes a regression causing text styles with a fill but no stroke to not be rendered.
+
+ * [#4242](https://github.com/openlayers/ol3/pull/4242) - Fix a drawText regression introduced with 31a68e2 ([@marcjansen](https://github.com/marcjansen))

changelog/v3.2.0.md

@@ -2,7 +2,7 @@
 
 ## Summary
 
-The 3.1.0 release includes 70 merged pull requests since 3.1.0.  Of note, the KML format [now parses `NetworkingLink` tags](https://github.com/openlayers/ol3/pull/3171).  The [measure example](http://openlayers.org/en/v3.2.0/examples/measure.html) was [reworked](https://github.com/openlayers/ol3/pull/3206) to display measurements and help messages while drawing.  A WMTS GetCapabilities format was [added](https://github.com/openlayers/ol3/pull/3026).  The WebGL renderer [now supports feature hit detection](https://github.com/openlayers/ol3/pull/3065) (on point features).  And you can now [detect](https://github.com/openlayers/ol3/pull/3172) features/colored pixels on image and tile layers!  See the full list of [changes](#changes) below.
+The 3.1.0 release includes 70 merged pull requests since 3.1.0.  Of note, the KML format [now parses `NetworkingLink` tags](https://github.com/openlayers/ol3/pull/3171).  The [measure example](http://openlayers.org/en/v3.2.0/examples/measure.html) was [reworked](https://github.com/openlayers/ol3/pull/3206) to display measurements and help messages while drawing.  A WMTS GetCapabilities format was [added](https://github.com/openlayers/ol3/pull/3026).  The WebGL renderer [now supports feature hit detection](https://github.com/openlayers/ol3/pull/3065) (on point features).  And you can now [detect](https://github.com/openlayers/ol3/pull/3172) features/colored pixels on image and tile layers!  See the full list of [changes](#changes) below.
 
 ## Upgrade notes
 

changelog/v3.5.0.md

@@ -0,0 +1,289 @@
+# v3.5.0
+
+## Summary
+
+The 3.5.0 release includes features and fixes from a whopping 129 pull requests since 3.4.0.  This release removes a number of "experimental" features from the API, so take a close look at the notes below when upgrading.
+
+## Upgrade notes
+
+### `ol.Object` and `bindTo`
+
+* The following experimental methods have been removed from `ol.Object`: `bindTo`, `unbind`, and `unbindAll`.  If you want to get notification about `ol.Object` property changes, you can listen for the `'propertychange'` event (e.g. `object.on('propertychange', listener)`).  Two-way binding can be set up at the application level using property change listeners.  See [#3472](https://github.com/openlayers/ol3/pull/3472) for details on the change.
+
+* The experimental `ol.dom.Input` component has been removed.  If you need to synchronize the state of a dom Input element with an `ol.Object`, this can be accomplished using listeners for change events.  For example, you might bind the state of a checkbox type input with a layer's visibility like this:
+
+  ```js
+  var layer = new ol.layer.Tile();
+  var checkbox = document.querySelector('#checkbox');
+
+  checkbox.addEventListener('change', function() {
+    var checked = this.checked;
+    if (checked !== layer.getVisible()) {
+      layer.setVisible(checked);
+    }
+  });
+
+  layer.on('change:visible', function() {
+    var visible = this.getVisible();
+    if (visible !== checkbox.checked) {
+      checkbox.checked = visible;
+    }
+  });
+  ```
+
+### New Vector API
+
+* The following experimental vector classes have been removed: `ol.source.GeoJSON`, `ol.source.GML`, `ol.source.GPX`, `ol.source.IGC`, `ol.source.KML`, `ol.source.OSMXML`, and `ol.source.TopoJSON`. You now will use `ol.source.Vector` instead.
+
+  For example, if you used `ol.source.GeoJSON` as follows:
+
+  ```js
+  var source = new ol.source.GeoJSON({
+    url: 'features.json',
+    projection: 'EPSG:3857'
+  });
+  ```
+
+  you will need to change your code to:
+
+  ```js
+  var source = new ol.source.Vector({
+    url: 'features.json',
+    format: new ol.format.GeoJSON()
+  });
+  ```
+
+  See http://openlayers.org/en/master/examples/vector-layer.html for a real example.
+
+  Note that you no longer need to set a `projection` on the source!
+
+  Previously the vector data was loaded at source construction time, and, if the data projection and the source projection were not the same, the vector data was transformed to the source projection before being inserted (as features) into the source.
+
+  The vector data is now loaded at render time, when the view projection is known. And the vector data is transformed to the view projection if the data projection and the source projection are not the same.
+
+  If you still want to "eagerly" load the source you will use something like this:
+
+  ```js
+  var source = new ol.source.Vector();
+  $.ajax('features.json').then(function(response) {
+    var geojsonFormat = new ol.format.GeoJSON();
+    var features = geojsonFormat.readFeatures(response,
+        {featureProjection: 'EPSG:3857'});
+    source.addFeatures(features);
+  });
+  ```
+
+  The above code uses jQuery to send an Ajax request, but you can obviously use any Ajax library.
+
+  See http://openlayers.org/en/master/examples/igc.html for a real example.
+
+* Note about KML
+
+  If you used `ol.source.KML`'s `extractStyles` or `defaultStyle` options, you will now have to set these options on `ol.format.KML` instead. For example, if you used:
+
+  ```js
+  var source = new ol.source.KML({
+    url: 'features.kml',
+    extractStyles: false,
+    projection: 'EPSG:3857'
+  });
+  ```
+
+  you will now use:
+
+  ```js
+  var source = new ol.source.Vector({
+    url: 'features.kml',
+    format: new ol.format.KML({
+      extractStyles: false
+    })
+  });
+  ```
+
+* The `ol.source.ServerVector` class has been removed. If you used it, for example as follows:
+
+  ```js
+  var source = new ol.source.ServerVector({
+    format: new ol.format.GeoJSON(),
+    loader: function(extent, resolution, projection) {
+      var url = …;
+      $.ajax(url).then(function(response) {
+        source.addFeatures(source.readFeatures(response));
+      });
+    },
+    strategy: ol.loadingstrategy.bbox,
+    projection: 'EPSG:3857'
+  });
+  ```
+
+  you will need to change your code to:
+
+  ```js
+  var source = new ol.source.Vector({
+    loader: function(extent, resolution, projection) {
+      var url = …;
+      $.ajax(url).then(function(response) {
+        var format = new ol.format.GeoJSON();
+        var features = format.readFeatures(response,
+            {featureProjection: projection});
+        source.addFeatures(features);
+      });
+    },
+    strategy: ol.loadingstrategy.bbox
+  });
+  ```
+
+  See http://openlayers.org/en/master/examples/vector-osm.html for a real example.
+
+* The experimental `ol.loadingstrategy.createTile` function has been renamed to `ol.loadingstrategy.tile`. The signature of the function hasn't changed. See http://openlayers.org/en/master/examples/vector-osm.html for an example.
+
+### Change to `ol.style.Icon`
+
+* When manually loading an image for `ol.style.Icon`, the image size should now be set
+with the `imgSize` option and not with `size`. `size` is supposed to be used for the
+size of a sub-rectangle in an image sprite.
+
+### Support for non-square tiles
+
+The return value of `ol.tilegrid.TileGrid#getTileSize()` will now be an `ol.Size` array instead of a number if non-square tiles (i.e. an `ol.Size` array instead of a number as `tilsSize`) are used. To always get an `ol.Size`, the new `ol.size.toSize()` was added.
+
+### Change to `ol.interaction.Draw`
+
+When finishing a draw, the `drawend` event is now dispatched before the feature is inserted to either the source or the collection. This change allows application code to finish setting up the feature.
+
+### Misc.
+
+If you compile your application together with the library and use the `ol.feature.FeatureStyleFunction` type annotation (this should be extremely rare), the type is now named `ol.FeatureStyleFunction`.
+
+## New features and fixes
+
+ * [#3646](https://github.com/openlayers/ol3/pull/3646) - Use graceful-fs in place of fs ([@elemoine](https://github.com/elemoine))
+ * [#3645](https://github.com/openlayers/ol3/pull/3645) - Fix test-coverage.js script ([@elemoine](https://github.com/elemoine))
+ * [#3640](https://github.com/openlayers/ol3/pull/3640) - Make make fail on requires and whitespace errors ([@elemoine](https://github.com/elemoine))
+ * [#3644](https://github.com/openlayers/ol3/pull/3644) - added altclick select to selectfeatures example ([@t27](https://github.com/t27))
+ * [#3612](https://github.com/openlayers/ol3/pull/3612) - Add ol.source.WMTS#getUrls and getRequestEncoding ([@elemoine](https://github.com/elemoine))
+ * [#3616](https://github.com/openlayers/ol3/pull/3616) - Add support for freehand drawing to the Draw interaction ([@ahocevar](https://github.com/ahocevar))
+ * [#3634](https://github.com/openlayers/ol3/pull/3634) - Remove unused local variable ([@fredj](https://github.com/fredj))
+ * [#3629](https://github.com/openlayers/ol3/pull/3629) - Problems with XYZ coordinates in snap interaction ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3633](https://github.com/openlayers/ol3/pull/3633) - Add a Makefile section to .editorconfig ([@elemoine](https://github.com/elemoine))
+ * [#3632](https://github.com/openlayers/ol3/pull/3632) - Make host-examples target copy index.js ([@elemoine](https://github.com/elemoine))
+ * [#3631](https://github.com/openlayers/ol3/pull/3631) - Restore Modify interaction constructor test ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3630](https://github.com/openlayers/ol3/pull/3630) - Initial tests for Modify interaction vertex creation ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3527](https://github.com/openlayers/ol3/pull/3527) - Replace pake with make? ([@elemoine](https://github.com/elemoine))
+ * [#3624](https://github.com/openlayers/ol3/pull/3624) - Add a one sentence summary for several exportable symbols ([@marcjansen](https://github.com/marcjansen))
+ * [#3623](https://github.com/openlayers/ol3/pull/3623) - ol3 overwrites WMS format_options instead of extending them. ([@bartvde](https://github.com/bartvde))
+ * [#3621](https://github.com/openlayers/ol3/pull/3621) - Fix typo in documentation comment ([@openlayers](https://github.com/openlayers))
+ * [#3614](https://github.com/openlayers/ol3/pull/3614) - GML2 parser does not parse all features ([@bartvde](https://github.com/bartvde))
+ * [#3619](https://github.com/openlayers/ol3/pull/3619) - Add a one sentence summary for ol.geom.* exportable symbols ([@marcjansen](https://github.com/marcjansen))
+ * [#3618](https://github.com/openlayers/ol3/pull/3618) - Replace non-breaking space (U+00A0) with regular space (U+0020). ([@tschaub](https://github.com/tschaub))
+ * [#3617](https://github.com/openlayers/ol3/pull/3617) - Add ol.size.hasArea. ([@tschaub](https://github.com/tschaub))
+ * [#3597](https://github.com/openlayers/ol3/pull/3597) - Remove dead link in api doc ([@fredj](https://github.com/fredj))
+ * [#3613](https://github.com/openlayers/ol3/pull/3613) - Add a one sentence summary for ol.interaction* exportable symbols ([@marcjansen](https://github.com/marcjansen))
+ * [#3611](https://github.com/openlayers/ol3/pull/3611) - Improve error handling in Esri JSON format ([@bartvde](https://github.com/bartvde))
+ * [#3560](https://github.com/openlayers/ol3/pull/3560) - Add an example showing how to create a permalink ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3571](https://github.com/openlayers/ol3/pull/3571) - Add wrapX support for vector layers (canvas renderer only) ([@ahocevar](https://github.com/ahocevar))
+ * [#3605](https://github.com/openlayers/ol3/pull/3605) - vector-esri-edit.html uses non api method ([@bartvde](https://github.com/bartvde))
+ * [#3602](https://github.com/openlayers/ol3/pull/3602) - Rename ol.feature.FeatureStyleFunction to ol.FeatureStyleFunction. ([@tschaub](https://github.com/tschaub))
+ * [#3604](https://github.com/openlayers/ol3/pull/3604) - Add charset so that zoom out button shows correctly ([@bartvde](https://github.com/bartvde))
+ * [#3603](https://github.com/openlayers/ol3/pull/3603) - Reformat upgrade-notes.md ([@elemoine](https://github.com/elemoine))
+ * [#3599](https://github.com/openlayers/ol3/pull/3599) - Improve docs for source.Vector options ([@probins](https://github.com/probins))
+ * [#3598](https://github.com/openlayers/ol3/pull/3598) - Remove unnecessary entry in `.gitignore`. ([@tschaub](https://github.com/tschaub))
+ * [#3595](https://github.com/openlayers/ol3/pull/3595) - Add featureloader.jsdoc ([@probins](https://github.com/probins))
+ * [#3593](https://github.com/openlayers/ol3/pull/3593) - Add /examples/index.js to .gitignore ([@fredj](https://github.com/fredj))
+ * [#3592](https://github.com/openlayers/ol3/pull/3592) - Remove reference to binding in Collection docs ([@probins](https://github.com/probins))
+ * [#3591](https://github.com/openlayers/ol3/pull/3591) - Only draw the layer if visible and inside the resolution range ([@fredj](https://github.com/fredj))
+ * [#3528](https://github.com/openlayers/ol3/pull/3528) - Fix memory leak when removing layers from ol.layer.Group ([@fredj](https://github.com/fredj))
+ * [#3549](https://github.com/openlayers/ol3/pull/3549) - Move ol.*_DURATION const to a constructor option ([@fredj](https://github.com/fredj))
+ * [#3587](https://github.com/openlayers/ol3/pull/3587) - Handle left/right segment intersections for top/bottom spans. ([@tschaub](https://github.com/tschaub))
+ * [#3516](https://github.com/openlayers/ol3/pull/3516) - Remove ol.format.BinaryFeature. ([@tschaub](https://github.com/tschaub))
+ * [#3586](https://github.com/openlayers/ol3/pull/3586) - Simplify dragAndDropInteraction in examples. ([@probins](https://github.com/probins))
+ * [#3555](https://github.com/openlayers/ol3/pull/3555) - Esri JSON support ([@bartvde](https://github.com/bartvde))
+ * [#3583](https://github.com/openlayers/ol3/pull/3583) - Add a one sentence summary for ol.proj.* and ol.layer.* exportable symbols ([@marcjansen](https://github.com/marcjansen))
+ * [#3581](https://github.com/openlayers/ol3/pull/3581) - Always show links to related API documentation. ([@tschaub](https://github.com/tschaub))
+ * [#3582](https://github.com/openlayers/ol3/pull/3582) - Index what the examples require. ([@tschaub](https://github.com/tschaub))
+ * [#3580](https://github.com/openlayers/ol3/pull/3580) - Add a one sentence summary for ol.source.* exportable symbols ([@marcjansen](https://github.com/marcjansen))
+ * [#3551](https://github.com/openlayers/ol3/pull/3551) - Automatically add links to API-docs in examples ([@marcjansen](https://github.com/marcjansen))
+ * [#3575](https://github.com/openlayers/ol3/pull/3575) - Check proj equivalence by code. ([@nd0ut](https://github.com/nd0ut))
+ * [#3579](https://github.com/openlayers/ol3/pull/3579) - Use HTTPS were available. ([@tschaub](https://github.com/tschaub))
+ * [#3558](https://github.com/openlayers/ol3/pull/3558) - Example sources in examples dir and built examples in build/examples. ([@tschaub](https://github.com/tschaub))
+ * [#3550](https://github.com/openlayers/ol3/pull/3550) - Reduce differences between the rendering test runner and the standard test runner. ([@tschaub](https://github.com/tschaub))
+ * [#3576](https://github.com/openlayers/ol3/pull/3576) - Add KML options related note the upgrade notes ([@elemoine](https://github.com/elemoine))
+ * [#3573](https://github.com/openlayers/ol3/pull/3573) - Modify draw interaction dispatch order ([@gberaudo](https://github.com/gberaudo))
+ * [#3572](https://github.com/openlayers/ol3/pull/3572) - Do not return a null tileSize ([@ahocevar](https://github.com/ahocevar))
+ * [#3570](https://github.com/openlayers/ol3/pull/3570) - Add missing @api ([@gberaudo](https://github.com/gberaudo))
+ * [#3569](https://github.com/openlayers/ol3/pull/3569) - Fix link to Bootstrap documentation ([@fredj](https://github.com/fredj))
+ * [#3559](https://github.com/openlayers/ol3/pull/3559) - Add support for non-square tiles ([@ahocevar](https://github.com/ahocevar))
+ * [#3568](https://github.com/openlayers/ol3/pull/3568) - Move extractStyles option to ol.format.KML ([@fredj](https://github.com/fredj))
+ * [#3562](https://github.com/openlayers/ol3/pull/3562) - Simplify .ol-zoomslider and .ol-overviewmap CSS ([@fredj](https://github.com/fredj))
+ * [#3565](https://github.com/openlayers/ol3/pull/3565) - Move extractStyles option to ol.format.KML ([@fredj](https://github.com/fredj))
+ * [#3523](https://github.com/openlayers/ol3/pull/3523) - Update proj4 version to 2.3.6 ([@fredj](https://github.com/fredj))
+ * [#3556](https://github.com/openlayers/ol3/pull/3556) - Minor TileUTFGrid error fix ([@klokantech](https://github.com/klokantech))
+ * [#3557](https://github.com/openlayers/ol3/pull/3557) - Update FastClick externs to version 1.0.6 ([@fredj](https://github.com/fredj))
+ * [#3517](https://github.com/openlayers/ol3/pull/3517) - Add tests for previously untested classes ([@marcjansen](https://github.com/marcjansen))
+ * [#3548](https://github.com/openlayers/ol3/pull/3548) - Write the error stack instead of the error itself. ([@tschaub](https://github.com/tschaub))
+ * [#3542](https://github.com/openlayers/ol3/pull/3542) - Generate example index and rebuild examples on source changes. ([@tschaub](https://github.com/tschaub))
+ * [#3530](https://github.com/openlayers/ol3/pull/3530) - external resources not correctly in inline source of example ([@bartvde](https://github.com/bartvde))
+ * [#3448](https://github.com/openlayers/ol3/pull/3448) - Fix WebGL image layer rendering on retina displays ([@elemoine](https://github.com/elemoine))
+ * [#3544](https://github.com/openlayers/ol3/pull/3544) - Update comments about remaining GeoJSON work. ([@tschaub](https://github.com/tschaub))
+ * [#3531](https://github.com/openlayers/ol3/pull/3531) - Fix PointerEventHandler exception with Overlay containing SVG and IE9 ([@mantonovic](https://github.com/mantonovic))
+ * [#3521](https://github.com/openlayers/ol3/pull/3521) - Remove goog.isDefAndNotNull test on ol.layer.Group#getLayers result ([@fredj](https://github.com/fredj))
+ * [#3481](https://github.com/openlayers/ol3/pull/3481) - Proposal for a simpler vector API ([@elemoine](https://github.com/elemoine))
+ * [#3472](https://github.com/openlayers/ol3/pull/3472) - Remove the experimental bindTo method from ol.Object. ([@tschaub](https://github.com/tschaub))
+ * [#3505](https://github.com/openlayers/ol3/pull/3505) - Add a Create Custom Builds tutorial ([@elemoine](https://github.com/elemoine))
+ * [#3513](https://github.com/openlayers/ol3/pull/3513) - Remove layerGroup.setLayers(null) test ([@fredj](https://github.com/fredj))
+ * [#3511](https://github.com/openlayers/ol3/pull/3511) - Add goog.provide's ([@elemoine](https://github.com/elemoine))
+ * [#3509](https://github.com/openlayers/ol3/pull/3509) - Dispatch change event even when geometry is set to null ([@pgiraud](https://github.com/pgiraud))
+ * [#3510](https://github.com/openlayers/ol3/pull/3510) - Use sinon.spy to ensure change event is dispatched ([@pgiraud](https://github.com/pgiraud))
+ * [#3504](https://github.com/openlayers/ol3/pull/3504) - Rework build-examples.js task. ([@tschaub](https://github.com/tschaub))
+ * [#3470](https://github.com/openlayers/ol3/pull/3470) - Add rendering tests ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3413](https://github.com/openlayers/ol3/pull/3413) - Add support for generic external modules with Browserify ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3503](https://github.com/openlayers/ol3/pull/3503) - Use vector source instead of feature overlay in snap example. ([@tschaub](https://github.com/tschaub))
+ * [#3495](https://github.com/openlayers/ol3/pull/3495) - Initial basic project setup tutorial ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3488](https://github.com/openlayers/ol3/pull/3488) - Add docs for exportable symbols. ([@tschaub](https://github.com/tschaub))
+ * [#3441](https://github.com/openlayers/ol3/pull/3441) - Add a "Compile Application and OpenLayers 3 Together" tutorial ([@elemoine](https://github.com/elemoine))
+ * [#3499](https://github.com/openlayers/ol3/pull/3499) - Update to closure-util 1.4.0 ([@elemoine](https://github.com/elemoine))
+ * [#3494](https://github.com/openlayers/ol3/pull/3494) - Mark VectorContext @api ([@gberaudo](https://github.com/gberaudo))
+ * [#3409](https://github.com/openlayers/ol3/pull/3409) - AssertionError in WMTS.optionsFromCapabilities. ([@bartvde](https://github.com/bartvde))
+ * [#3493](https://github.com/openlayers/ol3/pull/3493) - Add image loading events to ol.source.ImageStatic ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3490](https://github.com/openlayers/ol3/pull/3490) - Add .editorconfig and instructions on its use. ([@tschaub](https://github.com/tschaub))
+ * [#3489](https://github.com/openlayers/ol3/pull/3489) - Use an abstract base class instead of IVectorContext. ([@gberaudo](https://github.com/gberaudo))
+ * [#3483](https://github.com/openlayers/ol3/pull/3483) - Clarify view.setRotation docs ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3485](https://github.com/openlayers/ol3/pull/3485) - build.py graceful interrupt ([@malaretv](https://github.com/malaretv))
+ * [#3484](https://github.com/openlayers/ol3/pull/3484) - Make sure we copy the example css if it exists ([@bartvde](https://github.com/bartvde))
+ * [#3462](https://github.com/openlayers/ol3/pull/3462) - Remove ol.format.GMLBase from the API ([@ahocevar](https://github.com/ahocevar))
+ * [#3445](https://github.com/openlayers/ol3/pull/3445) - Start a FAQ document. ([@marcjansen](https://github.com/marcjansen))
+ * [#3468](https://github.com/openlayers/ol3/pull/3468) - Use the coveralls executable. ([@marcjansen](https://github.com/marcjansen))
+ * [#3415](https://github.com/openlayers/ol3/pull/3415) - Stable Only unchecked by default. ([@malaretv](https://github.com/malaretv))
+ * [#3420](https://github.com/openlayers/ol3/pull/3420) - Unregister viewport size listener on setTarget(null) ([@elemoine](https://github.com/elemoine))
+ * [#3456](https://github.com/openlayers/ol3/pull/3456) - Updated menu on the JSDOC template (non-responsive) ([@klokan](https://github.com/klokan))
+ * [#3475](https://github.com/openlayers/ol3/pull/3475) - Template examples ([@openlayers](https://github.com/openlayers))
+ * [#3455](https://github.com/openlayers/ol3/pull/3455) - Fix pre-loaded icons images for WebGL ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3473](https://github.com/openlayers/ol3/pull/3473) - Add more tests for ol.coordinate. ([@marcjansen](https://github.com/marcjansen))
+ * [#3464](https://github.com/openlayers/ol3/pull/3464) - Mark more of the API stable. ([@tschaub](https://github.com/tschaub))
+ * [#3469](https://github.com/openlayers/ol3/pull/3469) - Update README. ([@malaretv](https://github.com/malaretv))
+ * [#3467](https://github.com/openlayers/ol3/pull/3467) - Update the coveralls badge. ([@openlayers](https://github.com/openlayers))
+ * [#3466](https://github.com/openlayers/ol3/pull/3466) - Include coveralls code-coverage badge in README. ([@marcjansen](https://github.com/marcjansen))
+ * [#3457](https://github.com/openlayers/ol3/pull/3457) - Integrate istanbul for test coverage ([@marcjansen](https://github.com/marcjansen))
+ * [#3446](https://github.com/openlayers/ol3/pull/3446) - Add updateWhileInteracting to olx.layer.VectorOptions ([@elemoine](https://github.com/elemoine))
+ * [#3438](https://github.com/openlayers/ol3/pull/3438) - Parser documentation and XML readme ([@gberaudo](https://github.com/gberaudo))
+ * [#3449](https://github.com/openlayers/ol3/pull/3449) - Fix assertion message ([@gberaudo](https://github.com/gberaudo))
+ * [#3440](https://github.com/openlayers/ol3/pull/3440) - Add fromLonLat and toLonLat convenience functions ([@ahocevar](https://github.com/ahocevar))
+ * [#3423](https://github.com/openlayers/ol3/pull/3423) - Parse extrude and altitude mode ([@gberaudo](https://github.com/gberaudo))
+ * [#3431](https://github.com/openlayers/ol3/pull/3431) - Better typing ([@fredj](https://github.com/fredj))
+ * [#3436](https://github.com/openlayers/ol3/pull/3436) - Mention readme.md files as help for contributors ([@ahocevar](https://github.com/ahocevar))
+ * [#3433](https://github.com/openlayers/ol3/pull/3433) - Add missing goog.provide/goog.require ol.source.TileEvent ([@fredj](https://github.com/fredj))
+ * [#3422](https://github.com/openlayers/ol3/pull/3422) - Fix Select behavior when multi is false ([@elemoine](https://github.com/elemoine))
+ * [#3428](https://github.com/openlayers/ol3/pull/3428) - Reorder assertions and variable declarations. ([@marcjansen](https://github.com/marcjansen))
+ * [#3414](https://github.com/openlayers/ol3/pull/3414) - Add missing ol.style.AtlasManager goog.require ([@fredj](https://github.com/fredj))
+ * [#3429](https://github.com/openlayers/ol3/pull/3429) - Adding missing provide for SelectFilterFunction ([@pgiraud](https://github.com/pgiraud))
+ * [#3426](https://github.com/openlayers/ol3/pull/3426) - Add assertion messages for all assertion statements ([@bartvde](https://github.com/bartvde))
+ * [#3425](https://github.com/openlayers/ol3/pull/3425) - Fix typo in ol.js ([@elemoine](https://github.com/elemoine))
+ * [#3424](https://github.com/openlayers/ol3/pull/3424) - Remove `@api` annotation from `ol.WEBGL_MAX_TEXTURE_SIZE`. ([@tschaub](https://github.com/tschaub))
+ * [#3419](https://github.com/openlayers/ol3/pull/3419) - Remove describe.only ([@elemoine](https://github.com/elemoine))
+ * [#3417](https://github.com/openlayers/ol3/pull/3417) - ol.interaction.Snap extent fix ([@fperucic](https://github.com/fperucic))
+ * [#3410](https://github.com/openlayers/ol3/pull/3410) - Add ol.Object.unset() method ([@gberaudo](https://github.com/gberaudo))
+ * [#3402](https://github.com/openlayers/ol3/pull/3402) - Add "filter" option to Select interaction ([@elemoine](https://github.com/elemoine))
+ * [#3416](https://github.com/openlayers/ol3/pull/3416) - Remove unnecessary typecasts in examples ([@fredj](https://github.com/fredj))
+ * [#3411](https://github.com/openlayers/ol3/pull/3411) - Listen for a 'change:geometry' event ([@fperucic](https://github.com/fperucic))
+ * [#3109](https://github.com/openlayers/ol3/pull/3109) - Snap feature ([@fperucic](https://github.com/fperucic))
+ * [#3407](https://github.com/openlayers/ol3/pull/3407) - Add v3.4.0 empty section to upgrade notes ([@bartvde](https://github.com/bartvde))

changelog/v3.6.0.md

@@ -0,0 +1,64 @@
+# v3.6.0
+
+## Summary
+
+The v3.6.0 release includes features and fixes from 40 pull requests since v3.5.0. To simplify the code base, there were some changes to "experimental" features. Please follow the upgrade notes to make your applications work with the latest release.
+
+## Upgrade notes
+
+### `ol.interaction.Draw` changes
+
+* The `minPointsPerRing` config option has been renamed to `minPoints`. It is now also available for linestring drawing, not only for polygons.
+* The `ol.DrawEvent` and `ol.DrawEventType` types were renamed to `ol.interaction.DrawEvent` and `ol.interaction.DrawEventType`. This has an impact on your code only if your code is compiled together with ol3.
+
+### `ol.tilegrid` changes
+
+* The `ol.tilegrid.XYZ` constructor has been replaced by a static `ol.tilegrid.createXYZ()` function. The `ol.tilegrid.createXYZ()` function takes the same arguments as the previous `ol.tilegrid.XYZ` constructor, but returns an `ol.tilegrid.TileGrid` instance.
+* The internal tile coordinate scheme for XYZ sources has been changed. Previously, the `y` of tile coordinates was transformed to the coordinates used by sources by calculating `-y-1`. Now, it is transformed by calculating `height-y-1`, where height is the number of rows of the tile grid at the zoom level of the tile coordinate.
+* The `widths` constructor option of `ol.tilegrid.TileGrid` and subclasses is no longer available, and it is no longer necessary to get proper wrapping at the 180° meridian. However, for `ol.tilegrid.WMTS`, there is a new option `sizes`, where each entry is an `ol.Size` with the `width` ('TileMatrixWidth' in WMTS capabilities) as first and the `height` ('TileMatrixHeight') as second entry of the array. For other tile grids, users can
+now specify an `extent` instead of `widths`. These settings are used to restrict the range of tiles that sources will request.
+* For `ol.source.TileWMS`, the default value of `warpX` used to be `undefined`, meaning that WMS requests with out-of-extent tile BBOXes would be sent. Now `wrapX` can only be `true` or `false`, and the new default is `true`. No application code changes should be required, but the resulting WMS requests for out-of-extent tiles will no longer use out-of-extent BBOXes, but ones that are shifted to real-world coordinates.
+
+## New features and fixes
+
+ * [#3764](https://github.com/openlayers/ol3/pull/3764) - Add tests and implementation for intersectsExtent (ol.geom.Geometry) ([@alvinlindstam](https://github.com/alvinlindstam))
+ * [#3757](https://github.com/openlayers/ol3/pull/3757) - Add mapBrowserEvent as a member of ol.SelectEvent ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3759](https://github.com/openlayers/ol3/pull/3759) - Mark tilegrid.createTileCoordTransform() @api ([@gberaudo](https://github.com/gberaudo))
+ * [#3747](https://github.com/openlayers/ol3/pull/3747) - Make tileCoordTransform a member again ([@ahocevar](https://github.com/ahocevar))
+ * [#3751](https://github.com/openlayers/ol3/pull/3751) - Do not rely on remote services for tests ([@ahocevar](https://github.com/ahocevar))
+ * [#3749](https://github.com/openlayers/ol3/pull/3749) - Fix typo in API docs ([@marcjansen](https://github.com/marcjansen))
+ * [#3739](https://github.com/openlayers/ol3/pull/3739) - Simplify detection of scientific notation in WKT format ([@marcjansen](https://github.com/marcjansen))
+ * [#3741](https://github.com/openlayers/ol3/pull/3741) - Enhance docs of arguments and return values of callbacks / filters ([@marcjansen](https://github.com/marcjansen))
+ * [#3740](https://github.com/openlayers/ol3/pull/3740) - Add @fires to select interaction ([@probins](https://github.com/probins))
+ * [#3738](https://github.com/openlayers/ol3/pull/3738) - Improve doucmentation for ol.TileUrlFunctionType ([@ahocevar](https://github.com/ahocevar))
+ * [#3736](https://github.com/openlayers/ol3/pull/3736) - Fix invalid example HTML markup ([@fredj](https://github.com/fredj))
+ * [#3735](https://github.com/openlayers/ol3/pull/3735) - Snap example: remove featureoverlay from tags ([@probins](https://github.com/probins))
+ * [#3732](https://github.com/openlayers/ol3/pull/3732) - Add a method to bind button bluring on mouseout/focusout ([@marcjansen](https://github.com/marcjansen))
+ * [#3659](https://github.com/openlayers/ol3/pull/3659) - Revert "Implement ol.renderer.Layer#forEachFeatureAtCoordinate" ([@fredj](https://github.com/fredj))
+ * [#3683](https://github.com/openlayers/ol3/pull/3683) - Improve Map docs for layers and layergroups ([@probins](https://github.com/probins))
+ * [#3720](https://github.com/openlayers/ol3/pull/3720) - Add missing goog.provides in drawinteraction.js ([@elemoine](https://github.com/elemoine))
+ * [#3725](https://github.com/openlayers/ol3/pull/3725) - Document default value for olx.interaction.ModifyOptions#pixelTolerance ([@fredj](https://github.com/fredj))
+ * [#3722](https://github.com/openlayers/ol3/pull/3722) - Use the correct TileCoord transform function ([@ahocevar](https://github.com/ahocevar))
+ * [#3692](https://github.com/openlayers/ol3/pull/3692) - Updates for building on Windows using Cygwin. ([@bill-chadwick](https://github.com/bill-chadwick))
+ * [#3718](https://github.com/openlayers/ol3/pull/3718) - Add a assertion for renderOrder ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3711](https://github.com/openlayers/ol3/pull/3711) - Fix and test ol.color.blend ([@marcjansen](https://github.com/marcjansen))
+ * [#3673](https://github.com/openlayers/ol3/pull/3673) - More control over ol.interaction.Draw, to allow e.g. square drawing ([@ahocevar](https://github.com/ahocevar))
+ * [#3710](https://github.com/openlayers/ol3/pull/3710) - Add more tests for ol.extent ([@marcjansen](https://github.com/marcjansen))
+ * [#3709](https://github.com/openlayers/ol3/pull/3709) - vector-wfs example does not work in JSFiddle ([@bartvde](https://github.com/bartvde))
+ * [#3699](https://github.com/openlayers/ol3/pull/3699) - Add support for scientific notation to WKT format ([@marcjansen](https://github.com/marcjansen))
+ * [#3696](https://github.com/openlayers/ol3/pull/3696) - Add an example for various blend modes ([@marcjansen](https://github.com/marcjansen))
+ * [#3697](https://github.com/openlayers/ol3/pull/3697) - Use a valid SPDX license expression ([@marcjansen](https://github.com/marcjansen))
+ * [#3694](https://github.com/openlayers/ol3/pull/3694) - Correct typo in upgrade-notes ([@probins](https://github.com/probins))
+ * [#3693](https://github.com/openlayers/ol3/pull/3693) - Fix ol.extent.containsExtent documentation ([@tremby](https://github.com/tremby))
+ * [#3689](https://github.com/openlayers/ol3/pull/3689) - Fix WMTS.optionsFromCapabilities if no OperationsMetadata section ([@probins](https://github.com/probins))
+ * [#3688](https://github.com/openlayers/ol3/pull/3688) - Add two missing properties to extern of WebGLContextAttributes ([@fredj](https://github.com/fredj))
+ * [#3682](https://github.com/openlayers/ol3/pull/3682) - Add a note about using the collection in addLayer ([@bartvde](https://github.com/bartvde))
+ * [#3649](https://github.com/openlayers/ol3/pull/3649) - More specific regex in serve.js ([@elemoine](https://github.com/elemoine))
+ * [#3677](https://github.com/openlayers/ol3/pull/3677) - Add metadata to examples, ([@tschaub](https://github.com/tschaub))
+ * [#3672](https://github.com/openlayers/ol3/pull/3672) - Add link to FAQ-document and fix internal links ([@marcjansen](https://github.com/marcjansen))
+ * [#3665](https://github.com/openlayers/ol3/pull/3665) - Add proj4js and projection definition files to example resources ([@marcjansen](https://github.com/marcjansen))
+ * [#3662](https://github.com/openlayers/ol3/pull/3662) - Clarify docs for renderBuffer option ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3664](https://github.com/openlayers/ol3/pull/3664) - Link to download page. ([@tschaub](https://github.com/tschaub))
+ * [#3639](https://github.com/openlayers/ol3/pull/3639) - Add extent support to ol.tilegrid.TileGrid ([@ahocevar](https://github.com/ahocevar))
+ * [#3663](https://github.com/openlayers/ol3/pull/3663) - Readme should not include the version number. ([@tschaub](https://github.com/tschaub))
+ * [#3637](https://github.com/openlayers/ol3/pull/3637) - Implement ol.renderer.Layer#forEachFeatureAtCoordinate ([@fredj](https://github.com/fredj))

changelog/v3.7.0.md

@@ -0,0 +1,152 @@
+# v3.7.0
+
+## Summary
+
+The v3.7.0 release includes features and fixes from 43 pull requests since v3.6.0. To simplify the code base, there were some changes to "experimental" features. Please follow the upgrade notes to make your applications work with the latest release.
+
+## Upgrade notes
+
+#### Removal of `ol.FeatureOverlay`
+
+Instead of an `ol.FeatureOverlay`, we now use an `ol.layer.Vector` with an
+`ol.source.Vector`. If you previously had:
+```js
+var featureOverlay = new ol.FeatureOverlay({
+  map: map,
+  style: overlayStyle
+});
+featureOverlay.addFeature(feature);
+featureOverlay.removeFeature(feature);
+var collection = featureOverlay.getFeatures();
+```
+you will have to change this to:
+```js
+var collection = new ol.Collection();
+var featureOverlay = new ol.layer.Vector({
+  map: map,
+  source: new ol.source.Vector({
+    features: collection,
+    useSpatialIndex: false // optional, might improve performance
+  }),
+  style: overlayStyle,
+  updateWhileAnimating: true, // optional, for instant visual feedback
+  updateWhileInteracting: true // optional, for instant visual feedback
+});
+featureOverlay.getSource().addFeature(feature);
+featureOverlay.getSource().removeFeature(feature);
+```
+
+With the removal of `ol.FeatureOverlay`, `zIndex` symbolizer properties of overlays are no longer stacked per map, but per layer/overlay. If you previously had multiple feature overlays where you controlled the rendering order of features by using `zIndex` symbolizer properties, you can now achieve the same rendering order only if all overlay features are on the same layer.
+
+Note that `ol.FeatureOverlay#getFeatures()` returned an `{ol.Collection.<ol.Feature>}`, whereas `ol.source.Vector#getFeatures()` returns an `{Array.<ol.Feature>}`.
+
+#### `ol.TileCoord` changes
+
+Until now, the API exposed two different types of `ol.TileCoord` tile coordinates: internal ones that increase left to right and upward, and transformed ones that may increase downward, as defined by a transform function on the tile grid. With this change, the API now only exposes tile coordinates that increase left to right and upward.
+
+Previously, tile grids created by OpenLayers either had their origin at the top-left or at the bottom-left corner of the extent. To make it easier for application developers to transform tile coordinates to the common XYZ tiling scheme, all tile grids that OpenLayers creates internally have their origin now at the top-left corner of the extent.
+
+This change affects applications that configure a custom `tileUrlFunction` for an `ol.source.Tile`. Previously, the `tileUrlFunction` was called with rather unpredictable tile coordinates, depending on whether a tile coordinate transform took place before calling the `tileUrlFunction`. Now it is always called with OpenLayers tile coordinates. To transform these into the common XYZ tiling scheme, a custom `tileUrlFunction` has to change the `y` value (tile row) of the `ol.TileCoord`:
+```js
+function tileUrlFunction = function(tileCoord, pixelRatio, projection) {
+  var urlTemplate = '{z}/{x}/{y}';
+  return urlTemplate
+      .replace('{z}', tileCoord[0].toString())
+      .replace('{x}', tileCoord[1].toString())
+      .replace('{y}', (-tileCoord[2] - 1).toString());
+}
+```
+
+The `ol.tilegrid.TileGrid#createTileCoordTransform()` function which could be used to get the tile grid's tile coordinate transform function has been removed. This function was confusing and should no longer be needed now that application developers get tile coordinates in a known layout.
+
+The code snippets below show how your application code needs to be changed:
+
+Old application code (with `ol.tilegrid.TileGrid#createTileCoordTransform()`):
+```js
+var transform = source.getTileGrid().createTileCoordTransform();
+var tileUrlFunction = function(tileCoord, pixelRatio, projection) {
+  tileCoord = transform(tileCoord, projection);
+  return 'http://mytiles.com/' +
+      tileCoord[0] + '/' + tileCoord[1] + '/' + tileCoord[2] + '.png';
+};
+```
+Old application code (with custom `y` transform):
+```js
+var tileUrlFunction = function(tileCoord, pixelRatio, projection) {
+  var z = tileCoord[0];
+  var yFromBottom = tileCoord[2];
+  var resolution = tileGrid.getResolution(z);
+  var tileHeight = ol.size.toSize(tileSize)[1];
+  var matrixHeight =
+      Math.floor(ol.extent.getHeight(extent) / tileHeight / resolution);
+  return 'http://mytiles.com/' +
+      tileCoord[0] + '/' + tileCoord[1] + '/' +
+      (matrixHeight - yFromBottom - 1) + '.png';
+
+};
+```
+New application code (simple -y - 1 transform):
+```js
+var tileUrlFunction = function(tileCoord, pixelRatio, projection) {
+  return 'http://mytiles.com/' +
+      tileCoord[0] + '/' + tileCoord[1] + '/' + (-tileCoord[2] - 1) + '.png';
+};
+```
+
+#### Removal of `ol.tilegrid.Zoomify`
+
+The replacement of `ol.tilegrid.Zoomify` is a plain `ol.tilegrid.TileGrid`, configured with `extent`, `origin` and `resolutions`. If the `size` passed to the `ol.source.Zoomify` source is `[width, height]`, then the extent for the tile grid will be `[0, -height, width, 0]`, and the origin will be `[0, 0]`.
+
+#### Replace `ol.View.fitExtent()` and `ol.View.fitGeometry()` with `ol.View.fit()`
+* This combines two previously distinct functions into one more flexible call which takes either a geometry or an extent.
+* Rename all calls to `fitExtent` and `fitGeometry` to `fit`.
+
+#### Change to `ol.interaction.Modify`
+
+When single clicking a line or boundary within the `pixelTolerance`, a vertex is now created.
+
+## New features and fixes
+ 
+ * [#3867](https://github.com/openlayers/ol3/pull/3867) - Do not require projection extent for x-wrapping tile sources ([@ahocevar](https://github.com/ahocevar))
+ * [#3635](https://github.com/openlayers/ol3/pull/3635) - Create vertex on boundary single click ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3806](https://github.com/openlayers/ol3/pull/3806) - Do not clip canvas for vector layers when wrapping the world ([@ahocevar](https://github.com/ahocevar))
+ * [#3461](https://github.com/openlayers/ol3/pull/3461) - High level Modify interaction events ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3865](https://github.com/openlayers/ol3/pull/3865) - ol.View#fit() ([@bartvde](https://github.com/bartvde))
+ * [#3864](https://github.com/openlayers/ol3/pull/3864) - Check projection.canWrapX() before wrapping tiles ([@klokantech](https://github.com/klokantech))
+ * [#3863](https://github.com/openlayers/ol3/pull/3863) - Handle CDATA in attribute parsing for GML format ([@nhambletCCRI](https://github.com/nhambletCCRI))
+ * [#3860](https://github.com/openlayers/ol3/pull/3860) - Update example layout. ([@tschaub](https://github.com/tschaub))
+ * [#3861](https://github.com/openlayers/ol3/pull/3861) - Don't force 'dom' renderer ([@openlayers](https://github.com/openlayers))
+ * [#3855](https://github.com/openlayers/ol3/pull/3855) - Adding an example with WMTS tiles from IGN Geoportail ([@pgiraud](https://github.com/pgiraud))
+ * [#3856](https://github.com/openlayers/ol3/pull/3856) - ol.source.TileVector(): bind success function of tileLoadFunction to source ([@plepe](https://github.com/plepe))
+ * [#3848](https://github.com/openlayers/ol3/pull/3848) - Check for exports before define. ([@tschaub](https://github.com/tschaub))
+ * [#3845](https://github.com/openlayers/ol3/pull/3845) - Prevent null array to be passed to an ol.Collection ([@fredj](https://github.com/fredj))
+ * [#3849](https://github.com/openlayers/ol3/pull/3849) - Pad min. and sec. with leading zeros in DMS notation ([@pgiraud](https://github.com/pgiraud))
+ * [#3842](https://github.com/openlayers/ol3/pull/3842) - Adding a feature-animation example ([@pgiraud](https://github.com/pgiraud))
+ * [#3833](https://github.com/openlayers/ol3/pull/3833) - Enable use of custom XHR loader for TileVector sources ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3834](https://github.com/openlayers/ol3/pull/3834) - ArcGIS tiled example broken in Chrome ([@bartvde](https://github.com/bartvde))
+ * [#3829](https://github.com/openlayers/ol3/pull/3829) - incorrect assert message ([@kzr-pzr](https://github.com/kzr-pzr))
+ * [#3828](https://github.com/openlayers/ol3/pull/3828) - Fix typo in upgrade notes ([@ahocevar](https://github.com/ahocevar))
+ * [#3826](https://github.com/openlayers/ol3/pull/3826) - Allow custom tileGrid in ol.source.XYZ ([@klokantech](https://github.com/klokantech))
+ * [#3815](https://github.com/openlayers/ol3/pull/3815) - Simplify tilegrid API and internals ([@ahocevar](https://github.com/ahocevar))
+ * [#3820](https://github.com/openlayers/ol3/pull/3820) - Make unmanaged vector layers behave more like ol.FeatureOverlay ([@ahocevar](https://github.com/ahocevar))
+ * [#3822](https://github.com/openlayers/ol3/pull/3822) - Correct docs for updateWhileInteracting ([@probins](https://github.com/probins))
+ * [#3818](https://github.com/openlayers/ol3/pull/3818) - Make geometry.transform api stable again. ([@probins](https://github.com/probins))
+ * [#3801](https://github.com/openlayers/ol3/pull/3801) - Respect the tile grid's extent in ol.source.TileVector ([@ahocevar](https://github.com/ahocevar))
+ * [#3810](https://github.com/openlayers/ol3/pull/3810) - Improve TileGrid documentation and examples ([@ahocevar](https://github.com/ahocevar))
+ * [#3808](https://github.com/openlayers/ol3/pull/3808) - Correct typo in OverlayOptions ([@probins](https://github.com/probins))
+ * [#3766](https://github.com/openlayers/ol3/pull/3766) - Add a clickTolerance option to the Draw interaction ([@elemoine](https://github.com/elemoine))
+ * [#3804](https://github.com/openlayers/ol3/pull/3804) - Remove sentence that was only meant for WMTS tile grids ([@ahocevar](https://github.com/ahocevar))
+ * [#3800](https://github.com/openlayers/ol3/pull/3800) - Remove further references to FeatureOverlay ([@probins](https://github.com/probins))
+ * [#3780](https://github.com/openlayers/ol3/pull/3780) - Only expose transformed tile coordinates to the API ([@ahocevar](https://github.com/ahocevar))
+ * [#3793](https://github.com/openlayers/ol3/pull/3793) - Use 'managed' instead of 'unmanaged' in LayerState ([@ahocevar](https://github.com/ahocevar))
+ * [#3792](https://github.com/openlayers/ol3/pull/3792) - Link to correct layer base class ([@marcjansen](https://github.com/marcjansen))
+ * [#3791](https://github.com/openlayers/ol3/pull/3791) - Remove docs referring to removed feature overlay ([@marcjansen](https://github.com/marcjansen))
+ * [#3790](https://github.com/openlayers/ol3/pull/3790) - Remove unnecessary quotes around object keys ([@fredj](https://github.com/fredj))
+ * [#3787](https://github.com/openlayers/ol3/pull/3787) - Add 'unmanaged' to ol.layer.LayerState ([@ahocevar](https://github.com/ahocevar))
+ * [#3784](https://github.com/openlayers/ol3/pull/3784) - Always write the GeoJSONFeature geometry property ([@fredj](https://github.com/fredj))
+ * [#3783](https://github.com/openlayers/ol3/pull/3783) - Fix broken wmts-hidpi example ([@ahocevar](https://github.com/ahocevar))
+ * [#3782](https://github.com/openlayers/ol3/pull/3782) - Fix assert documentation typo ([@gberaudo](https://github.com/gberaudo))
+ * [#3758](https://github.com/openlayers/ol3/pull/3758) - Removal of ol.FeatureOverlay ([@ahocevar](https://github.com/ahocevar))
+ * [#3775](https://github.com/openlayers/ol3/pull/3775) - Add ol-touch but keep ol-viewport className. ([@pgiraud](https://github.com/pgiraud))
+ * [#3713](https://github.com/openlayers/ol3/pull/3713) - Add missing propertyNames member for olx.format.WFSWriteGetFeatureOptions ([@bartvde](https://github.com/bartvde))
+ * [#3763](https://github.com/openlayers/ol3/pull/3763) - Standardise draw/modify descriptions ([@probins](https://github.com/probins))

changelog/v3.8.0.md

@@ -0,0 +1,41 @@
+# v3.8.0
+
+## Summary
+
+The v3.8.0 release includes features and fixes from 33 pull requests since v3.7.0.  While summer vacations have slowed the pace of development a bit this month, there are some nice improvements in this release.  See the complete list below for details.
+
+## New features and fixes
+
+ * [#3957](https://github.com/openlayers/ol3/pull/3957) - Properly handle vertex deletion with multiple features. ([@tschaub](https://github.com/tschaub))
+ * [#3954](https://github.com/openlayers/ol3/pull/3954) - Remove ol.control.Control.bindMouseOutFocusOutBlur function. ([@fredj](https://github.com/fredj))
+ * [#3214](https://github.com/openlayers/ol3/pull/3214) - Pixel manipulation with raster sources. ([@tschaub](https://github.com/tschaub))
+ * [#3946](https://github.com/openlayers/ol3/pull/3946) - Fix vertex deletion for Modify interaction on mobile devices. ([@Turbo87](https://github.com/Turbo87))
+ * [#3910](https://github.com/openlayers/ol3/pull/3910) - Do not provide an AMD environment to ol.ext modules. ([@ahocevar](https://github.com/ahocevar))
+ * [#3934](https://github.com/openlayers/ol3/pull/3934) - Fix `drawstart` and `drawend` events when drawing a point ([@fredj](https://github.com/fredj))
+ * [#3774](https://github.com/openlayers/ol3/pull/3774) - Measure tooltips touchdevice ([@pgiraud](https://github.com/pgiraud))
+ * [#3949](https://github.com/openlayers/ol3/pull/3949) - Remove count argument from `called` function ([@fredj](https://github.com/fredj))
+ * [#3950](https://github.com/openlayers/ol3/pull/3950) - Remove reference to vbarray.js ([@elemoine](https://github.com/elemoine))
+ * [#3947](https://github.com/openlayers/ol3/pull/3947) - Clarify documentation of Image source ratio option. ([@alvinlindstam](https://github.com/alvinlindstam))
+ * [#3920](https://github.com/openlayers/ol3/pull/3920) - Remove use_types_for_optimization from custom build tutorial. ([@probins](https://github.com/probins))
+ * [#3922](https://github.com/openlayers/ol3/pull/3922) - Document {?-?} pattern in expandUrl ([@probins](https://github.com/probins))
+ * [#3921](https://github.com/openlayers/ol3/pull/3921) - Cache node_modules on Travis. ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3942](https://github.com/openlayers/ol3/pull/3942) - Fix WMTS TileMatrixSet lookup by SRS identifier ([@ahocevar](https://github.com/ahocevar))
+ * [#3945](https://github.com/openlayers/ol3/pull/3945) - Simplify icon example and show popup at clicked position ([@ahocevar](https://github.com/ahocevar))
+ * [#3930](https://github.com/openlayers/ol3/pull/3930) - Use goog.functions.identity instead of goog.identityFunction ([@fredj](https://github.com/fredj))
+ * [#3929](https://github.com/openlayers/ol3/pull/3929) - Expand description for XYZ source ([@probins](https://github.com/probins))
+ * [#3933](https://github.com/openlayers/ol3/pull/3933) - Snap center to pixel to avoid floating point issues ([@ahocevar](https://github.com/ahocevar))
+ * [#3932](https://github.com/openlayers/ol3/pull/3932) - SnapOptions: Fix typo in pixelTolerance JSDoc ([@Turbo87](https://github.com/Turbo87))
+ * [#3931](https://github.com/openlayers/ol3/pull/3931) - Remove unused htmlparser2 package ([@fredj](https://github.com/fredj))
+ * [#3912](https://github.com/openlayers/ol3/pull/3912) - Fix the event type fired by goog.fx.Dragger ([@fredj](https://github.com/fredj))
+ * [#3871](https://github.com/openlayers/ol3/pull/3871) - Document change events properly ([@ahocevar](https://github.com/ahocevar))
+ * [#3906](https://github.com/openlayers/ol3/pull/3906) - Clear features properly when there is no spatial index ([@ahocevar](https://github.com/ahocevar))
+ * [#3896](https://github.com/openlayers/ol3/pull/3896) - Fire WebGL precompose event in same sequence as other renderers ([@ahocevar](https://github.com/ahocevar))
+ * [#3359](https://github.com/openlayers/ol3/pull/3359) - Enable deep clone of MultiPolygon. ([@Kenny806](https://github.com/Kenny806))
+ * [#3895](https://github.com/openlayers/ol3/pull/3895) - Rework the tile queue for multiple queues. ([@aisaacs](https://github.com/aisaacs))
+ * [#3894](https://github.com/openlayers/ol3/pull/3894) - Install Python dependencies without sudo. ([@tschaub](https://github.com/tschaub))
+ * [#3824](https://github.com/openlayers/ol3/pull/3824) - Improve docs for interaction.Select. ([@probins](https://github.com/probins))
+ * [#3884](https://github.com/openlayers/ol3/pull/3884) - Provide a debug loader for the library. ([@tschaub](https://github.com/tschaub))
+ * [#3883](https://github.com/openlayers/ol3/pull/3883) - Ignore layer filter for unmanaged layers ([@ahocevar](https://github.com/ahocevar))
+ * [#3859](https://github.com/openlayers/ol3/pull/3859) - Add in crossOrigin option ([@llambanna](https://github.com/llambanna))
+ * [#3873](https://github.com/openlayers/ol3/pull/3873) - Correct minor typo in modifyinteraction ([@probins](https://github.com/probins))
+ * [#3872](https://github.com/openlayers/ol3/pull/3872) - Correct event notations in ol.Feature ([@probins](https://github.com/probins))

changelog/v3.8.1.md

@@ -0,0 +1,7 @@
+# v3.8.1
+
+## Summary
+
+This is a patch release that updates the URL for builds shown in the examples.  Details below.
+
+ * [#3970](https://github.com/openlayers/ol3/pull/3970) - Pull builds from openlayers.org. ([@tschaub](https://github.com/tschaub))

changelog/v3.8.2.md

@@ -0,0 +1,7 @@
+# v3.8.2
+
+## Summary
+
+This is a patch release that corrects the URL for builds shown in the examples.  Details below.
+
+ * [#3979](https://github.com/openlayers/ol3/pull/3979) - Fix URLs for openlayers.org resources. ([@tschaub](https://github.com/tschaub))

changelog/v3.9.0.md

@@ -0,0 +1,91 @@
+# v3.9.0
+
+## Summary
+
+The v3.9.0 release includes features and fixes from 62 pull requests since the v3.8.2 release. New features include:
+
+* [#3986](https://github.com/openlayers/ol3/pull/3986) - Modify 'url' option of ol.source.Vector to accept a function ([@alvinlindstam](https://github.com/alvinlindstam))
+* [#4069](https://github.com/openlayers/ol3/pull/4069) - Add Z-index to layers ([@gberaudo](https://github.com/gberaudo))
+* [#4044](https://github.com/openlayers/ol3/pull/4044) - Add ol.interaction.Draw#continueDrawing ([@elemoine](https://github.com/elemoine))
+* [#4008](https://github.com/openlayers/ol3/pull/4008) - Add a Translate interaction ([@elemoine](https://github.com/elemoine))
+
+See the complete list below for details. And see the following notes to know how to upgrade from v3.8.x to v3.9.0.
+
+## Upgrade notes
+
+#### `ol.style.Circle` changes
+
+The experimental `getAnchor`, `getOrigin`, and `getSize` methods have been removed.  The anchor and origin of a circle symbolizer are not modifiable, so these properties should not need to be accessed.  The radius and stroke width can be used to calculate the rendered size of a circle symbolizer if needed:
+
+```js
+// calculate rendered size of a circle symbolizer
+var width = 2 * circle.getRadius();
+if (circle.getStroke()) {
+  width += circle.getStroke().getWidth() + 1;
+}
+```
+
+## New features and fixes
+
+ * [#4055](https://github.com/openlayers/ol3/pull/4055) - Improve graticule perf ([@fgravin](https://github.com/fgravin))
+ * [#4088](https://github.com/openlayers/ol3/pull/4088) - Update jshint to v2.8.0 ([@fredj](https://github.com/fredj))
+ * [#4089](https://github.com/openlayers/ol3/pull/4089) - 

SelectEventType in ol.interaction namespace ([@pgiraud](https://github.com/pgiraud))
+ * [#4095](https://github.com/openlayers/ol3/pull/4095) - Zoom to the extent of the drag box. ([@tschaub](https://github.com/tschaub))
+ * [#4084](https://github.com/openlayers/ol3/pull/4084) - Fewer circle exports. ([@tschaub](https://github.com/tschaub))
+ * [#4094](https://github.com/openlayers/ol3/pull/4094) - Allow source.setAttributions() to be exported. ([@tschaub](https://github.com/tschaub))
+ * [#4096](https://github.com/openlayers/ol3/pull/4096) - Reinstate inheritdoc to fix #4082 ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#4091](https://github.com/openlayers/ol3/pull/4091) - Remove unused ol.renderer.webgl.Map.DEFAULT_COLOR_VALUES_ ([@fredj](https://github.com/fredj))
+ * [#4092](https://github.com/openlayers/ol3/pull/4092) - Minor coding style fixes ([@fredj](https://github.com/fredj))
+ * [#4083](https://github.com/openlayers/ol3/pull/4083) - Add API descriptions. ([@tschaub](https://github.com/tschaub))
+ * [#4078](https://github.com/openlayers/ol3/pull/4078) - Enable all the compiler checks ([@fredj](https://github.com/fredj))
+ * [#4085](https://github.com/openlayers/ol3/pull/4085) - Parse nested document tag ([@oterral](https://github.com/oterral))
+ * [#4060](https://github.com/openlayers/ol3/pull/4060) - Remove unnecessary cast ([@fredj](https://github.com/fredj))
+ * [#4064](https://github.com/openlayers/ol3/pull/4064) - Use a private variable to cache the default style array ([@fredj](https://github.com/fredj))
+ * [#4081](https://github.com/openlayers/ol3/pull/4081) - Update link to workshop. ([@tschaub](https://github.com/tschaub))
+ * [#4062](https://github.com/openlayers/ol3/pull/4062) - Remove ol.xml.makeParsersNS and use ol.xml.makeStructureNS instead ([@fredj](https://github.com/fredj))
+ * [#3986](https://github.com/openlayers/ol3/pull/3986) - Modify 'url' option of ol.source.Vector to accept a function ([@alvinlindstam](https://github.com/alvinlindstam))
+ * [#4077](https://github.com/openlayers/ol3/pull/4077) - Add missing const jsdoc annotation ([@fredj](https://github.com/fredj))
+ * [#4080](https://github.com/openlayers/ol3/pull/4080) - Remove unused goog.require in examples ([@fredj](https://github.com/fredj))
+ * [#4041](https://github.com/openlayers/ol3/pull/4041) - Fix custom build issue ([@elemoine](https://github.com/elemoine))
+ * [#4059](https://github.com/openlayers/ol3/pull/4059) - Clarify drag interaction example to inform about ol.interaction.Translate ([@alvinlindstam](https://github.com/alvinlindstam))
+ * [#4069](https://github.com/openlayers/ol3/pull/4069) - Add Z-index to layers ([@gberaudo](https://github.com/gberaudo))
+ * [#4076](https://github.com/openlayers/ol3/pull/4076) - Add assertion for required option 'code' on ol.proj.Projection ([@weskamm](https://github.com/weskamm))
+ * [#4075](https://github.com/openlayers/ol3/pull/4075) - setOpacity of Image undefined ([@bartvde](https://github.com/bartvde))
+ * [#4044](https://github.com/openlayers/ol3/pull/4044) - Add ol.interaction.Draw#continueDrawing ([@elemoine](https://github.com/elemoine))
+ * [#4073](https://github.com/openlayers/ol3/pull/4073) - Better type definition ([@fredj](https://github.com/fredj))
+ * [#4072](https://github.com/openlayers/ol3/pull/4072) - Update to closure-util 1.7.0 ([@elemoine](https://github.com/elemoine))
+ * [#4070](https://github.com/openlayers/ol3/pull/4070) - Make the debug server work regardless of the current working directory. ([@tschaub](https://github.com/tschaub))
+ * [#4067](https://github.com/openlayers/ol3/pull/4067) - Fix bootstrap class name in examples ([@fredj](https://github.com/fredj))
+ * [#4050](https://github.com/openlayers/ol3/pull/4050) - Use view.getRotation and view.getResolution instead of view.getState ([@fredj](https://github.com/fredj))
+ * [#4051](https://github.com/openlayers/ol3/pull/4051) - Move wrench node package to devDependencies ([@fredj](https://github.com/fredj))
+ * [#4047](https://github.com/openlayers/ol3/pull/4047) - Remove pystache dependency ([@fredj](https://github.com/fredj))
+ * [#4027](https://github.com/openlayers/ol3/pull/4027) - closure-compiler v20150729 compatibility ([@fredj](https://github.com/fredj))
+ * [#4040](https://github.com/openlayers/ol3/pull/4040) - Better docs for ol.ENABLE_[WEBGL|CANVAS|DOM] ([@elemoine](https://github.com/elemoine))
+ * [#4032](https://github.com/openlayers/ol3/pull/4032) - Improve ol.Overlay extensibility ([@gberaudo](https://github.com/gberaudo))
+ * [#4037](https://github.com/openlayers/ol3/pull/4037) - Don't install python packages in before_install ([@fredj](https://github.com/fredj))
+ * [#4028](https://github.com/openlayers/ol3/pull/4028) - Update to closure-util 1.6 ([@elemoine](https://github.com/elemoine))
+ * [#4014](https://github.com/openlayers/ol3/pull/4014) - Remove deprecated checkStructDictInheritance ([@fredj](https://github.com/fredj))
+ * [#3987](https://github.com/openlayers/ol3/pull/3987) - Remove unnecessary cast ([@fredj](https://github.com/fredj))
+ * [#4035](https://github.com/openlayers/ol3/pull/4035) - Remove unused sphere and ellipsoid methods. ([@tschaub](https://github.com/tschaub))
+ * [#4031](https://github.com/openlayers/ol3/pull/4031) - Fixing size of popup ([@pgiraud](https://github.com/pgiraud))
+ * [#4023](https://github.com/openlayers/ol3/pull/4023) - Render map when layer.setMap(map) called ([@elemoine](https://github.com/elemoine))
+ * [#4026](https://github.com/openlayers/ol3/pull/4026) - Fix Font Awesome CSS class in examples ([@fredj](https://github.com/fredj))
+ * [#4024](https://github.com/openlayers/ol3/pull/4024) - Correct documentation for ol.FeatureStyleFunction ([@marcjansen](https://github.com/marcjansen))
+ * [#4011](https://github.com/openlayers/ol3/pull/4011) - Make Modify interaction listen to feature changes ([@elemoine](https://github.com/elemoine))
+ * [#3917](https://github.com/openlayers/ol3/pull/3917) - Resolved issue with cluster source reloading ([@cmiles74](https://github.com/cmiles74))
+ * [#4015](https://github.com/openlayers/ol3/pull/4015) - Add a getUrls Method to ol.source.XYZ ([@weskamm](https://github.com/weskamm))
+ * [#4019](https://github.com/openlayers/ol3/pull/4019) - Simplify .editorconfig file ([@marcjansen](https://github.com/marcjansen))
+ * [#4002](https://github.com/openlayers/ol3/pull/4002) - Update closure-library to latest commit ([@fredj](https://github.com/fredj))
+ * [#4018](https://github.com/openlayers/ol3/pull/4018) - Fix rotate buttons in animation example ([@marcjansen](https://github.com/marcjansen))
+ * [#4013](https://github.com/openlayers/ol3/pull/4013) - Use a more recent version of marked ([@marcjansen](https://github.com/marcjansen))
+ * [#4017](https://github.com/openlayers/ol3/pull/4017) - Do not overwrite projections in the registry simply by using `new ol.proj.Projection()` ([@ahocevar](https://github.com/ahocevar))
+ * [#4008](https://github.com/openlayers/ol3/pull/4008) - Add a Translate interaction ([@elemoine](https://github.com/elemoine))
+ * [#3230](https://github.com/openlayers/ol3/pull/3230) - Add stroke to default editing style for geometry collections ([@pgiraud](https://github.com/pgiraud))
+ * [#4007](https://github.com/openlayers/ol3/pull/4007) - Do not use Function.prototype.bind in examples ([@elemoine](https://github.com/elemoine))
+ * [#4006](https://github.com/openlayers/ol3/pull/4006) - Fix typo (vegetaion -> vegetation) ([@elemoine](https://github.com/elemoine))
+ * [#3993](https://github.com/openlayers/ol3/pull/3993) - Replace base symbols with overridden ones when generating info.json ([@ahocevar](https://github.com/ahocevar))
+ * [#3992](https://github.com/openlayers/ol3/pull/3992) - Fix typo in Makefile ([@fredj](https://github.com/fredj))
+ * [#3989](https://github.com/openlayers/ol3/pull/3989) - Handle JSONP errors in ol.source.TileJSON ([@fredj](https://github.com/fredj))
+ * [#3983](https://github.com/openlayers/ol3/pull/3983) - Remove doc footer with timestamp. ([@tschaub](https://github.com/tschaub))
+ * [#3984](https://github.com/openlayers/ol3/pull/3984) - Style source control links in examples. ([@tschaub](https://github.com/tschaub))
+ * [#3982](https://github.com/openlayers/ol3/pull/3982) - Rebuild examples if package.json changes. ([@tschaub](https://github.com/tschaub))

closure-util.json

@@ -1,3 +1,3 @@
 {
-  "library_url": "https://github.com/google/closure-library/archive/0011afd534469ba111786fe68300a634e08a4d80.zip"
+  "library_url": "https://github.com/google/closure-library/archive/5b25e65.zip"
 }

config/example.json

@@ -0,0 +1,51 @@
+{
+  "exports": [],
+  "src": [
+    "src/**/*.js",
+    "build/ol.ext/*.js",
+    "build/examples/{{id}}.js"
+  ],
+  "compile": {
+    "js": [
+      "externs/olx.js",
+      "externs/oli.js"
+    ],
+    "externs": [
+      "externs/bingmaps.js",
+      "externs/bootstrap.js",
+      "externs/closure-compiler.js",
+      "externs/esrijson.js",
+      "externs/example.js",
+      "externs/fastclick.js",
+      "externs/geojson.js",
+      "externs/jquery-1.9.js",
+      "externs/proj4js.js",
+      "externs/tilejson.js",
+      "externs/topojson.js"
+    ],
+    "define": [
+      "goog.array.ASSUME_NATIVE_FUNCTIONS=true",
+      "goog.dom.ASSUME_STANDARDS_MODE=true",
+      "goog.json.USE_NATIVE_JSON=true",
+      "goog.DEBUG=false"
+    ],
+    "jscomp_error": [
+      "*"
+    ],
+    "jscomp_off": [
+      "useOfGoogBase",
+      "unnecessaryCasts",
+      "lintChecks",
+      "missingProvide",
+      "unknownDefines"
+    ],
+    "extra_annotation_name": [
+      "api", "observable"
+    ],
+    "compilation_level": "ADVANCED",
+    "warning_level": "VERBOSE",
+    "output_wrapper": "(function(){%output%})();",
+    "use_types_for_optimization": true,
+    "manage_closure_dependencies": true
+  }
+}

config/examples-all.json

@@ -3,7 +3,7 @@
   "src": [
     "src/**/*.js",
     "build/ol.ext/*.js",
-    "build/examples/all.js"
+    "build/compiled-examples/all.js"
   ],
   "compile": {
     "js": [
@@ -14,14 +14,14 @@
       "externs/bingmaps.js",
       "externs/bootstrap.js",
       "externs/closure-compiler.js",
+      "externs/esrijson.js",
       "externs/example.js",
       "externs/fastclick.js",
       "externs/geojson.js",
       "externs/jquery-1.9.js",
       "externs/proj4js.js",
       "externs/tilejson.js",
-      "externs/topojson.js",
+      "externs/topojson.js"
-      "externs/vbarray.js"
     ],
     "define": [
       "goog.array.ASSUME_NATIVE_FUNCTIONS=true",
@@ -30,40 +30,12 @@
       "goog.DEBUG=false"
     ],
     "jscomp_error": [
-      "accessControls",
+      "*"
-      "ambiguousFunctionDecl",
+    ],
-      "checkEventfulObjectDisposal",
+    "jscomp_off": [
-      "checkRegExp",
+      "useOfGoogBase",
-      "checkStructDictInheritance",
+      "unnecessaryCasts",
-      "checkTypes",
+      "lintChecks"
-      "checkVars",
-      "const",
-      "constantProperty",
-      "deprecated",
-      "duplicateMessage",
-      "es3",
-      "es5Strict",
-      "externsValidation",
-      "fileoverviewTags",
-      "globalThis",
-      "internetExplorerChecks",
-      "invalidCasts",
-      "misplacedTypeAnnotation",
-      "missingGetCssName",
-      "missingProperties",
-      "missingProvide",
-      "missingRequire",
-      "missingReturn",
-      "newCheckTypes",
-      "nonStandardJsDocs",
-      "suspiciousCode",
-      "strictModuleDepCheck",
-      "typeInvalidation",
-      "undefinedNames",
-      "undefinedVars",
-      "unknownDefines",
-      "uselessCode",
-      "visibility"
     ],
     "extra_annotation_name": [
       "api", "observable"

config/examples/example-verbatim.html

@@ -0,0 +1 @@
+{{{ contents }}}

config/examples/example.html

@@ -0,0 +1,87 @@
+<!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="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" type="text/css">
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="./resources/prism/prism.css" type="text/css">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="./resources/layout.css" type="text/css">
+    {{{ extraHead.local }}}
+    {{{ css.tag }}}
+    <script src="./resources/zeroclipboard/ZeroClipboard.min.js"></script>
+    <title>{{ title }}</title>
+  </head>
+  <body>
+
+    <header class="navbar" role="navigation">
+      <div class="container" id="navbar-inner-container">
+        <a class="navbar-brand" href="./"><img src="./resources/logo-70x70.png">&nbsp;OpenLayers 3 Examples</a>
+      </div>
+    </header>
+
+    <div class="container-fluid">
+
+      {{{ contents }}}
+
+      <div class="row-fluid">
+        <div class="span12">
+          <h4 id="title">{{ title }}</h4>
+          <p id="shortdesc">{{ shortdesc }}</p>
+          <div id="docs">{{ md docs }}</div>
+          <div id="tags">{{ tags }}</div>
+          <div id="api-links">Related API documentation: {{{ js.apiHtml }}}</div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+        <div id="source-controls">
+          <a id="copy-button"><i class="fa fa-clipboard"></i> Copy</a>
+          <a id="jsfiddle-button"><i class="fa fa-jsfiddle"></i> Edit</a>
+        </div>
+        <form method="POST" id="jsfiddle-form" target="_blank" action="http://jsfiddle.net/api/post/jquery/1.11.0/">
+          <textarea class="hidden" name="js">{{ js.source }}</textarea>
+          <textarea class="hidden" name="css">{{ css.source }}</textarea>
+          <textarea class="hidden" name="html">{{ contents }}</textarea>
+          <input type="hidden" name="wrap" value="l">
+          <input type="hidden" name="resources" value="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css,https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js,http://openlayers.org/en/v{{ olVersion }}/css/ol.css,http://openlayers.org/en/v{{ olVersion }}/build/ol.js{{ extraResources }}">
+        </form>
+        <pre><code id="example-source" class="language-markup">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;{{ title }}&lt;/title&gt;
+&lt;script src="https://code.jquery.com/jquery-1.11.2.min.js"&gt;&lt;/script&gt;
+&lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"&gt;
+&lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"&gt;&lt;/script&gt;
+&lt;link rel="stylesheet" href="http://openlayers.org/en/v{{ olVersion }}/css/ol.css" type="text/css"&gt;
+&lt;script src="http://openlayers.org/en/v{{ olVersion }}/build/ol.js"&gt;&lt;/script&gt;
+{{ extraHead.remote }}
+{{#if css.source}}
+&lt;style&gt;
+{{ css.source }}
+&lt;/style&gt;
+{{/if}}
+&lt;/head&gt;
+&lt;body&gt;
+&lt;div class="container-fluid"&gt;
+
+{{ contents }}
+&lt;/div&gt;
+&lt;script&gt;
+{{ js.source }}
+&lt;/script&gt;
+&lt;/body&gt;
+&lt;/html&gt;</code></pre>
+      </div>
+    </div>
+
+    <script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
+    <script src="./resources/common.js"></script>
+    <script src="./resources/prism/prism.min.js"></script>
+    {{{ js.tag }}}
+
+  </body>
+</html>

config/examples/readme.md

@@ -0,0 +1,21 @@
+This folder contains example templates. These templates are used to build the examples in the `examples/` folder. The resulting examples are written to the `build/examples` folder.
+
+Although the main purpose of these examples is to demonstrate how to use the API, they also serve other purposes in the development cycle, and so are not exactly as they would be in normal application code:
+
+ * every time the library changes, they are compiled together with the library as a basic check that they remain in sync with the library
+
+ * they use a special loader script to enable defining at run time which build mode (raw/debug/advanced) to use
+
+To enable this, examples have the following, not needed in application code:
+
+ * each html file loads `loader.js`; application code would not need this, but would instead load the appropriate library build file, either a hosted version or a custom build
+
+ * each js file starts with `goog.require` functions, used by the compiler; application code would only have these if the code is to be compiled together with the library and/or Closure library
+
+ * some js files use type definitions (comments with @type tags); these are also used by the compiler, and are only needed if the code is to be compiled together with the library
+
+ * html files load `resources/common.js` and some scripts use `common.getRendererFromQueryString()` to set the map renderer; application code would not need these
+
+ * in addition, examples use Twitter Bootstrap and jQuery; this is of course not a requirement - you may use whichever presentation/helper libraries you wish
+
+At the bottom of each example generated in the `build/examples` folder, a modified version of its source code is shown. That modified version can be run standalone and is usually used as starting point for users to extend examples into their own application.

config/jsdoc/api/conf.json

@@ -16,9 +16,8 @@
         ]
     },
     "plugins": [
-        "node_modules/jsdoc/plugins/markdown",
+        "node_modules/jsdoc-fork/plugins/markdown",
         "config/jsdoc/api/plugins/inheritdoc",
-        "config/jsdoc/api/plugins/interface",
         "config/jsdoc/api/plugins/typedefs",
         "config/jsdoc/api/plugins/events",
         "config/jsdoc/api/plugins/observable",

config/jsdoc/api/index.md

@@ -29,13 +29,11 @@ Interactions for [vector features](ol.Feature.html)
 <br>[Vector sources](ol.source.Vector.html) for [ol.layer.Vector](ol.layer.Vector.html)
 <br>[Formats](ol.format.Feature.html) for reading/writing vector data
 <br>[ol.format.WMSCapabilities](ol.format.WMSCapabilities.html)</td></tr>
-<tr><th>Projections</th><th>2-way bindings</th><th>Other components</th></tr>
+<tr><th>Projections</th><th>Observable objects</th><th>Other components</th></tr>
 <tr><td><p>All coordinates and extents need to be provided in view projection (default: EPSG:3857). To transform, use [ol.proj.transform()](ol.proj.html#transform) and [ol.proj.transformExtent()](ol.proj.html#transformExtent).</p>
 [ol.proj](ol.proj.html)</td>
-<td><p>[Objects](ol.Object.html) can be kept in sync using the [bindTo()](ol.Object.html#bindTo) method.</p>
+<td><p>Changes to all [ol.Objects](ol.Object.html) can observed by calling the [object.on('propertychange')](ol.Object.html#on) method.  Listeners receive an [ol.ObjectEvent](ol.ObjectEvent.html) with information on the changed property and old value.</p>
-<p>A [DOM Input](ol.dom.Input.html) class is available to bind Object properties to HTML Input elements.</p></td>
 <td>[ol.DeviceOrientation](ol.DeviceOrientation.html)<br>
 [ol.Geolocation](ol.Geolocation.html)<br>
-[ol.Overlay](ol.Overlay.html)<br>
+[ol.Overlay](ol.Overlay.html)<br></td>
-[ol.FeatureOverlay](ol.FeatureOverlay.html)<br></td>
 </tr></table>

config/jsdoc/api/plugins/api.js

@@ -16,7 +16,7 @@ exports.defineTags = function(dictionary) {
         doclet.stability = level;
       } else {
         var errorText = util.format('Invalid stability level (%s) in %s line %s', tag.text, doclet.meta.filename, doclet.meta.lineno);
-        require('jsdoc/util/error').handle( new Error(errorText) );
+        require('jsdoc-fork/lib/jsdoc/util/error').handle( new Error(errorText) );
       }
     }
   });

config/jsdoc/api/plugins/interface.js

@@ -1,25 +0,0 @@
-exports.defineTags = function(dictionary) {
-
-  var classTag = dictionary.lookUp('class');
-  dictionary.defineTag('interface', {
-    mustHaveValue: false,
-    onTagged: function(doclet, tag) {
-      classTag.onTagged.apply(this, arguments);
-      doclet.interface = true;
-    }
-  });
-
-  var augmentsTag = dictionary.lookUp('augments');
-  dictionary.defineTag('implements', {
-    mustHaveValue: true,
-    onTagged: function(doclet, tag) {
-      tag.value = tag.value.match(/^\{?([^\}]*)\}?$/)[1];
-      augmentsTag.onTagged.apply(this, arguments);
-      if (!doclet.implements) {
-        doclet.implements = [];
-      }
-      doclet.implements.push(tag.value);
-    }
-  });
-
-};

config/jsdoc/api/plugins/typedefs.js

@@ -5,6 +5,10 @@
 
 var lastOlxTypedef = null;
 var olxTypes = {};
+// names of the olx typenames
+var olxTypeNames = [];
+// types that are undefined or typedefs containing undefined
+var undefinedLikes = null;
 
 function addSubparams(params) {
   for (var j = 0, jj = params.length; j < jj; ++j) {
@@ -23,6 +27,63 @@ function addSubparams(params) {
   }
 }
 
+/**
+ * Changes the description of the param, if it is found to be a required
+ * option of an olxTypeName.
+ */
+function markRequiredIfNeeded(doclet){
+  var memberof = doclet.memberof;
+  // only check doclets that belong to an olxTypeName
+  if (!memberof || olxTypeNames.indexOf(memberof) == -1) {
+    return doclet;
+  }
+
+  var types = doclet.type.names;
+  var isRequiredParam = true;
+
+  // iterate over all types that are like-undefined (see above for explanation)
+  for (var idx = undefinedLikes.length - 1; idx >= 0; idx--) {
+    var undefinedLike = undefinedLikes[idx];
+    // … if the current types contains a type that is undefined-like,
+    // it is not required.
+    if (types.indexOf(undefinedLike) != -1) {
+      isRequiredParam = false;
+    }
+  }
+
+  if (isRequiredParam) {
+    var reqSnippet = '<span class="required-option">Required.</span></p>';
+    var endsWithP = /<\/p>$/i;
+    var description = doclet.description;
+    if (description && endsWithP.test(description)) {
+      description = description.replace(endsWithP, ' ' + reqSnippet);
+    } else if (doclet.description === undefined) {
+      description = '<p>' + reqSnippet;
+    }
+    doclet.description = description;
+  }
+  return doclet;
+}
+
+/**
+ * Iterates over all doclets and finds the names of types that contain
+ * undefined. Stores the names in the global variable undefinedLikes, so
+ * that e.g. markRequiredIfNeeded can use these.
+ */
+function findTypesLikeUndefined(doclets) {
+  undefinedLikes = ['undefined']; // include type 'undefined' explicitly
+  for (var i = doclets.length - 1; i >= 0; --i) {
+    var doclet = doclets[i];
+    if(doclet.kind === 'typedef') {
+      var types = doclet.type.names;
+      if (types.indexOf('undefined') !== -1) {
+        // the typedef contains 'undefined', so it self is undefinedLike.
+        undefinedLikes.push(doclet.longname);
+      }
+    }
+  }
+}
+
 exports.handlers = {
 
   newDoclet: function(e) {
@@ -34,6 +95,7 @@ exports.handlers = {
       }
       if (doclet.kind == 'typedef') {
         lastOlxTypedef = doclet;
+        olxTypeNames.push(doclet.longname);
         olxTypes[doclet.longname] = [];
         doclet.properties = [];
       } else if (lastOlxTypedef && doclet.memberof == lastOlxTypedef.longname) {
@@ -51,12 +113,14 @@ exports.handlers = {
 
   parseComplete: function(e) {
     var doclets = e.doclets;
+    findTypesLikeUndefined(doclets);
     for (var i = doclets.length - 1; i >= 0; --i) {
       var doclet = doclets[i];
       var params = doclet.params;
       if (params) {
         addSubparams(params);
       }
+      markRequiredIfNeeded(doclet);
     }
   }
 

config/jsdoc/api/readme.md

@@ -24,6 +24,8 @@ The second line tells the Closure compiler the type of the argument.
 
 The third line (`@api`) marks the method as part of the api and thus exportable. The stability can be added as value, e.g. `@api stable`. Without such an api annotation, the method will not be documented in the generated API documentation. Symbols without an api annotation will also not be exportable (unless they are explicitly exported with a `goog.exportProperty` call).
 
+The `@api` annotation can be used in conjunciton with the `@inheritDoc` annotation to export a symbol that is documented on a parent class (where the method may be abstract).  In general, `@api` annotations should never be used on abstract methods (only on their implementations).
+
 ### Events
 
 Events are documented using `@fires` and `@event` annotations:

config/jsdoc/api/template/publish.js

@@ -1,10 +1,10 @@
 /*global env: true */
-var template = require('jsdoc/template'),
+var template = require('jsdoc-fork/lib/jsdoc/template'),
-    fs = require('jsdoc/fs'),
+    fs = require('jsdoc-fork/lib/jsdoc/fs'),
-    path = require('jsdoc/path'),
+    path = require('jsdoc-fork/lib/jsdoc/path'),
     taffy = require('taffydb').taffy,
-    handle = require('jsdoc/util/error').handle,
+    handle = require('jsdoc-fork/lib/jsdoc/util/error').handle,
-    helper = require('jsdoc/util/templateHelper'),
+    helper = require('jsdoc-fork/lib/jsdoc/util/templateHelper'),
     _ = require('underscore'),
     htmlsafe = helper.htmlsafe,
     linkto = helper.linkto,
@@ -350,8 +350,8 @@ exports.publish = function(taffyData, opts, tutorials) {
     var staticFileScanner;
     if (conf['default'].staticFiles) {
         staticFilePaths = conf['default'].staticFiles.paths || [];
-        staticFileFilter = new (require('jsdoc/src/filter')).Filter(conf['default'].staticFiles);
+        staticFileFilter = new (require('jsdoc-fork/lib/jsdoc/src/filter')).Filter(conf['default'].staticFiles);
-        staticFileScanner = new (require('jsdoc/src/scanner')).Scanner();
+        staticFileScanner = new (require('jsdoc-fork/lib/jsdoc/src/scanner')).Scanner();
 
         staticFilePaths.forEach(function(filePath) {
             var extraStaticFiles = staticFileScanner.scan([filePath], 10, staticFileFilter);

config/jsdoc/api/template/static/scripts/main.js

@@ -74,7 +74,7 @@ $(function () {
     var stabilityToggle = $('#stability-toggle');
     stabilityToggle.change(function() {
         unstable.toggleClass('hidden', this.checked);
-        var search = this.checked ? '' : '?unstable=true';
+        var search = this.checked ? '?stableonly=true' : '';
         links.each(function(i, el) {
             this.href = this.pathname + search + this.hash;
         });
@@ -88,6 +88,6 @@ $(function () {
     links.each(function(i, el) {
         this.href = this.pathname + search + this.hash;
     });
-    stabilityToggle.prop('checked', search !== '?unstable=true');
+    stabilityToggle.prop('checked', search === '?stableonly=true');
     unstable.toggleClass('hidden', stabilityToggle[0].checked);
 });

config/jsdoc/api/template/static/styles/jaguar.css

@@ -1,15 +1,47 @@
 @import url(http://fonts.googleapis.com/css?family=Quattrocento+Sans:400,400italic,700);
+.navbar-inverse {
+  border: 0;
+}
 .navbar-inverse .navbar-inner {
   background: #1F6B75;
   height: 50px;
+  text-shadow: 1px 1px 2px rgba(0,0,0,0.25);
 }
 .navbar-inverse .brand {
-  color: white;
+  color: #fff;
-  font-size: 20px;
+  font-size: 160%;
+  font-weight: bold;
+  position: absolute;
+  top: 6px;
+  left: 16px;
+}
+.navbar-inverse .brand:hover,
+.navbar-inverse .brand:focus {
+  color: #aae1e9;
+  text-decoration: none;
+}
+.navbar-inverse .brand img {
+  width: 35px;
+  height: 35px;
+  vertical-align: middle;
+  margin-right: 5px;
+  border:0;
 }
 .navbar-inverse .container {
-  padding: 5px 0 5px 0;
+  padding: 0;
 }
+.navbar-inverse .navbar-nav>li>a {
+  color: #fff;
+}
+.navbar-inverse .navbar-nav>li>a:hover,
+.navbar-inverse .navbar-nav>li>a:focus,
+.navbar-inverse .navbar-nav>li>a.active
+ {
+  outline:0;
+  color: #fff;
+  background-color: #268591;
+}
+
 body {
   padding-top: 50px;
 }
@@ -20,6 +52,8 @@ body {
 a {
   position: relative;
   z-index: 1;
+  -webkit-transition: all .2s;
+  transition: all .2s;
 }
 .navigation li {
   color: #888;
@@ -379,5 +413,6 @@ footer {
   color: white;
   position: absolute;
   top: 1em;
-  right: 8em;
+  left: 250px;
+  font-weight: normal;
 }

config/jsdoc/api/template/tmpl/layout.tmpl

@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <meta charset="utf-8">
-    <title>OpenLayers 3 API Documentation - <?js= title ?></title>
+    <title>OpenLayers 3 API Reference - <?js= title ?></title>
     <script src="scripts/prettify/prettify.js"> </script>
     <script src="scripts/prettify/lang-css.js"> </script>
     <script src="scripts/jquery.min.js"> </script>
@@ -18,11 +18,16 @@
 <div class="navbar navbar-inverse navbar-fixed-top">
   <div class="navbar-inner">
     <div class="container">
-      <a class="brand" href="/"><img src="../resources/logo.png" width="40"> OpenLayers 3</a>
+      <a class="brand" href="/"><img src="logo-70x70.png"> OpenLayers 3</a>
-      <a class="brand" href="index.html">API Documentation</a>
       <label id="stability">
-        <input type="checkbox" id="stability-toggle" checked> Stable Only
+        <input type="checkbox" id="stability-toggle"> Stable Only
       </label>
+      <ul class="nav navbar-nav pull-right">
+        <li><a href="../doc">Docs</a></li>
+        <li><a href="../examples">Examples</a></li>
+        <li><a href="index.html" class="active">API</a></li>
+        <li><a href="https://github.com/openlayers/ol3">Code</a></li>
+      </ul>
     </div>
   </div>
 </div>
@@ -32,10 +37,6 @@
     <div class="main">
         <h1 class="page-title" data-filename="<?js= filename ?>"><?js= title ?></h1>
         <?js= content ?>
-
-        <footer>
-            Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc <?js= env.version.number ?></a> on <?js= (new Date()) ?>
-        </footer>
     </div>
 </div>
 <script>prettyPrint();</script>

config/jsdoc/api/template/tmpl/method.tmpl

@@ -68,7 +68,7 @@ var self = this;
             }
         ?>
         <li class="<?js= (eventDoclet || data).stability !== 'stable' ? 'unstable' : '' ?>">
-            <code><?js= self.linkto(f, type) ?></code>
+            <code><?js= eventClassName ? self.linkto(f, type) : type ?></code>
             <?js if (eventClassName) {
               var eventClass = self.find({longname: eventClassName})[0];
               if (eventClass) { ?>

config/jsdoc/info/publish.js

@@ -6,11 +6,14 @@ var assert = require('assert');
 var fs = require('fs');
 var path = require('path');
 
+var Promise = require('bluebird');
+
 
 /**
  * Publish hook for the JSDoc template.  Writes to JSON stdout.
  * @param {function} data The root of the Taffy DB containing doclet records.
  * @param {Object} opts Options.
+ * @return {Promise} A promise that resolves when writing is complete.
  */
 exports.publish = function(data, opts) {
 
@@ -49,7 +52,7 @@ exports.publish = function(data, opts) {
   var externs = [];
   var base = [];
   var augments = {};
-  var names = {};
+  var symbolsByName = {};
   docs.filter(function(doc) {
     var include = true;
     var constructor = doc.memberof;
@@ -144,8 +147,13 @@ exports.publish = function(data, opts) {
       }
 
       var target = isExterns ? externs : (doc.api ? symbols : base);
+      var existingSymbol = symbolsByName[symbol.name];
+      if (existingSymbol) {
+        var idx = target.indexOf(existingSymbol);
+        target.splice(idx, 1);
+      }
       target.push(symbol);
-      names[symbol.name] = true;
+      symbolsByName[symbol.name] = symbol;
 
       if (doc.api && symbol.extends) {
         while (symbol.extends in classes && !classes[symbol.extends].api &&
@@ -163,13 +171,17 @@ exports.publish = function(data, opts) {
     return (symbol.name in augments || symbol.virtual);
   });
 
-  process.stdout.write(
+  return new Promise(function(resolve, reject) {
-      JSON.stringify({
+
-        symbols: symbols,
+    process.stdout.write(
-        defines: defines,
+        JSON.stringify({
-        typedefs: typedefs,
+          symbols: symbols,
-        externs: externs,
+          defines: defines,
-        base: base
+          typedefs: typedefs,
-      }, null, 2));
+          externs: externs,
+          base: base
+        }, null, 2), resolve);
+
+  });
 
 };

config/ol.json

@@ -5,13 +5,13 @@
     "externs": [
       "externs/bingmaps.js",
       "externs/closure-compiler.js",
+      "externs/esrijson.js",
       "externs/geojson.js",
       "externs/oli.js",
       "externs/olx.js",
       "externs/proj4js.js",
       "externs/tilejson.js",
-      "externs/topojson.js",
+      "externs/topojson.js"
-      "externs/vbarray.js"
     ],
     "define": [
       "goog.array.ASSUME_NATIVE_FUNCTIONS=true",
@@ -20,40 +20,12 @@
       "goog.DEBUG=false"
     ],
     "jscomp_error": [
-      "accessControls",
+      "*"
-      "ambiguousFunctionDecl",
+    ],
-      "checkEventfulObjectDisposal",
+    "jscomp_off": [
-      "checkRegExp",
+      "useOfGoogBase",
-      "checkStructDictInheritance",
+      "unnecessaryCasts",
-      "checkTypes",
+      "lintChecks"
-      "checkVars",
-      "const",
-      "constantProperty",
-      "deprecated",
-      "duplicateMessage",
-      "es3",
-      "es5Strict",
-      "externsValidation",
-      "fileoverviewTags",
-      "globalThis",
-      "internetExplorerChecks",
-      "invalidCasts",
-      "misplacedTypeAnnotation",
-      "missingGetCssName",
-      "missingProperties",
-      "missingProvide",
-      "missingRequire",
-      "missingReturn",
-      "newCheckTypes",
-      "nonStandardJsDocs",
-      "suspiciousCode",
-      "strictModuleDepCheck",
-      "typeInvalidation",
-      "undefinedNames",
-      "undefinedVars",
-      "unknownDefines",
-      "uselessCode",
-      "visibility"
     ],
     "extra_annotation_name": [
       "api", "observable"

css/ol.css

@@ -1,3 +1,8 @@
+.ol-box {
+  box-sizing: border-box;
+  border-radius: 2px;
+  border: 2px solid blue;
+}
 
 .ol-mouse-position {
   top: 8px;
@@ -154,6 +159,7 @@
 .ol-attribution img {
   max-height: 2em;
   max-width: inherit;
+  vertical-align: middle;
 }
 .ol-attribution ul, .ol-attribution button {
   display: inline-block;
@@ -190,35 +196,20 @@
 }
 
 .ol-zoomslider {
-  position: absolute;
   top: 4.5em;
   left: .5em;
-  background: #eee;
-  background: rgba(255, 255, 255, 0.4);
-  width: 24px;
   height: 200px;
 }
-.ol-zoomslider-thumb {
+.ol-zoomslider button {
-  position: absolute;
+  position: relative;
-  background: #7b98bc;
-  background: rgba(0,60,136,0.5);
-  border-radius: 2px;
-  cursor: pointer;
   height: 10px;
-  width: 22px;
-  margin: 3px;
 }
 
 .ol-touch .ol-zoomslider {
   top: 5.5em;
-  width: 2.052em;
-}
-.ol-touch .ol-zoomslider-thumb {
-  width: 1.8em;
 }
 
 .ol-overviewmap {
-  position: absolute;
   left: 0.5em;
   bottom: 0.5em;
 }

doc/faq.md

@@ -0,0 +1,336 @@
+---
+title: Frequently Asked Questions (FAQ)
+layout: doc.hbs
+---
+
+# Frequently Asked Questions (FAQ)
+
+Certain questions arise more often than others when users ask for help. This 
+document tries to list some of the common questions that frequently get asked,
+e.g. on [Stack Overflow](http://stackoverflow.com/questions/tagged/openlayers-3).
+
+If you think a question (and naturally its answer) should be added here, feel
+free to ping us or to send a pull request enhancing this document.
+
+Table of contents:
+
+* [What projection is OpenLayers using?](#what-projection-is-openlayers-using-)
+* [How do I change the projection of my map?](#how-do-i-change-the-projection-of-my-map-)
+* [Why is my map centered on the gulf of guinea (or africa, the ocean, null-island)?](#why-is-my-map-centered-on-the-gulf-of-guinea-or-africa-the-ocean-null-island-)
+* [Why is the order of a coordinate [lon,lat], and not [lat,lon]?](#why-is-the-order-of-a-coordinate-lon-lat-and-not-lat-lon-)
+* [Why aren't there any features in my source?](#why-aren-t-there-any-features-in-my-source-)
+* [How do I force a re-render of the map?](#how-do-i-force-a-re-render-of-the-map-)
+* [How do I create a custom build of OpenLayers?](#how-do-i-create-a-custom-build-of-openlayers-)
+* [Do I need to write my own code using Closure library?](#do-i-need-to-write-my-own-code-using-closure-library-)
+* [Do I need to compress my code with Closure compiler?](#do-i-need-to-compress-my-code-with-closure-compiler-)
+
+
+## What projection is OpenLayers using?
+
+Every map that you'll create with OpenLayers will have a view, and every view
+will have a projection. As the earth is three-dimensional and round but the 2D
+view of a map isn't, we need a mathematical expression to represent it. Enter
+projections.
+
+There isn't only one projection, but there are many common ones. Each projection
+has different properties, in that it accurately represents distances, angles or
+areas. Certain projections are better suited for different regions in the world.
+
+Back to the original question: OpenLayers is capable of dealing with most
+projections. If you do not explicitly set one, your map is going to use our
+default which is the Web Mercator projection (EPSG:3857). The same projection is
+used e.g. for the maps of the OpenStreetMap-project and commercial products such
+as Bing Maps or Google Maps.
+
+This projection is a good choice if you want a map which shows the whole world,
+and you may need to have this projection if you want to e.g. use the
+OpenStreetMap or Bing tiles.
+
+
+## How do I change the projection of my map?
+
+There is a good chance that you want to change the default projection of
+OpenLayers to something more appropriate for your region or your specific data.
+
+The projection of your map can be set through the `view`-property. Here are some
+examples:
+
+```javascript
+// OpenLayers comes with support for the World Geodetic System 1984, EPSG:4326:
+var map = new ol.Map({
+  view: new ol.View({
+    projection: 'EPSG:4326'
+    // other view properties like map center etc.
+  })
+  // other properties for your map like layers etc.
+});
+```
+
+```javascript
+// To use other projections, you have to register the projection in OpenLayers:
+//
+// By default OpenLayers does not know about the EPSG:21781 (Swiss) projection.
+// So we create a projection instance for EPSG:21781 and pass it to
+// ol.proj.addProjection to make it available to the library for lookup by its
+// code.
+var swissProjection = new ol.proj.Projection({
+  code: 'EPSG:21781',
+  // The extent is used to determine zoom level 0. Recommended values for a
+  // projection's validity extent can be found at http://epsg.io/.
+  extent: [485869.5728, 76443.1884, 837076.5648, 299941.7864],
+  units: 'm'
+});
+ol.proj.addProjection(swissProjection);
+
+// we can now use the projection:
+var map = new ol.Map({
+  view: new ol.View({
+    projection: swissProjection
+    // other view properties like map center etc.
+  })
+  // other properties for your map like layers etc.
+});
+```
+
+We recommend to lookup parameters of your projection (like the validity extent)
+over at [epsg.io](http://epsg.io/).
+
+
+## Why is my map centered on the gulf of guinea (or africa, the ocean, null-island)?
+
+If you have set a center in your map view, but don't see a real change in visual
+output, chances are that you have provided the coordinates of the map center in
+the wrong (a non-matching) projection.
+
+As the default projection in OpenLayers is Web Mercator (see above), the
+coordinates for the center have to be provided in that projection. Chances are
+that your map looks like this:
+
+```javascript
+var washingtonLonLat = [-77.036667, 38.895];
+var map = new ol.Map({
+  layers: [
+    new ol.layer.Tile({
+      source: new ol.source.OSM()
+    })
+  ],
+  target: 'map',
+  view: new ol.View({
+    center: washingtonLonLat,
+    zoom: 12
+  })
+});
+```
+
+Here `[-77.036667, 38.895]` is provided as the center of the view. But as Web
+Mercator is a metric projection, you are currently telling OpenLayers that the
+center shall be some meters (~77m and ~39m respectively) away from `[0, 0]`. In
+the Web Mercator projection the coordinate is right in the gulf of guinea.
+
+The solution is easy: Provide the coordinates projected into Web Mercator.
+OpenLayers has some helpful utility methods to assist you:
+
+```javascript
+var washingtonLonLat = [-77.036667, 38.895];
+var washingtonWebMercator = ol.proj.fromLonLat(washingtonLonLat);
+
+var map = new ol.Map({
+  layers: [
+    new ol.layer.Tile({
+      source: new ol.source.OSM()
+    })
+  ],
+  target: 'map',
+  view: new ol.View({
+    center: washingtonWebMercator,
+    zoom: 8
+  })
+});
+```
+
+The method `ol.proj.fromLonLat()` is available from version 3.5 onwards.
+
+If you told OpenLayers about a custom projection (see above), you can use the
+following method to transform a coordinate from WGS84 to your projection:
+
+```javascript
+// assuming that OpenLayers knows about EPSG:21781, see above
+var swissCoord = ol.proj.transform([8.23, 46.86], 'EPSG:4326', 'EPSG:21781');
+```
+
+
+## Why is the order of a coordinate [lon,lat], and not [lat,lon]?
+
+So you want to center your map on a certain place on the earth and obviously you
+need to have its coordinates for this. Let's assume you want your map centered
+on Schladming, a beautiful place in Austria. Head over to the wikipedia
+page for [Schladming](http://en.wikipedia.org/wiki/Schladming). In the top-right
+corner there is a link to [GeoHack](http://tools.wmflabs.org/geohack/geohack.php?pagename=Schladming&params=47_23_39_N_13_41_21_E_type:city(4565)_region:AT-6),
+which effectively tells you the coordinates are:
+
+    WGS84:
+    47° 23′ 39″ N, 13° 41′ 21″ E
+    47.394167, 13.689167
+
+So the next step would be to put the decimal coordinates into an array and use
+it as center:
+
+```javascript
+var schladming = [47.394167, 13.689167]; // caution partner, read on...
+// since we are using OSM, we have to transform the coordinates...
+var schladmingWebMercator = ol.proj.fromLonLat(schladming);
+
+var map = new ol.Map({
+  layers: [
+    new ol.layer.Tile({
+      source: new ol.source.OSM()
+    })
+  ],
+  target: 'map',
+  view: new ol.View({
+    center: schladmingWebMercator,
+    zoom: 9
+  })
+});
+```
+
+Running the above example will possibly surprise you, since we are not centered
+on Schladming, Austria, but instead on Abyan, a region in Yemen (possibly also a
+nice place). So what happened?
+
+Many people mix up the order of longitude and latitude in a coordinate array.
+Don't worry if you get it wrong at first, many OpenLayers developers have to
+think twice about whether to put the longitude or the latitude first when they
+e.g. try to change the map center.
+
+Ok, then let's flip the coordinates:
+
+```javascript
+var schladming = [13.689167, 47.394167]; // longitude first, then latitude
+// since we are using OSM, we have to transform the coordinates...
+var schladmingWebMercator = ol.proj.fromLonLat(schladming);
+
+var map = new ol.Map({
+  layers: [
+    new ol.layer.Tile({
+      source: new ol.source.OSM()
+    })
+  ],
+  target: 'map',
+  view: new ol.View({
+    center: schladmingWebMercator,
+    zoom: 9
+  })
+});
+```
+
+Schladming is now correctly displayed in the center of the map.
+
+So when you deal with EPSG:4326 coordinates in OpenLayers, put the longitude
+first, and then the latitude. This behaviour is the same as we had in OpenLayers
+2, and it actually makes sense because of the natural axis order in WGS84.
+
+If you cannot remember the correct order, just have a look at the method name
+we used: `ol.proj.fromLonLat`; even there we hint that we expect longitude
+first, and then latitude.
+
+
+## Why aren't there any features in my source?
+
+Suppose you want to load a KML file and display the contained features on the
+map. Code like the following could be used:
+
+```javascript
+var vector = new ol.layer.Vector({
+  source: new ol.source.KML({
+    projection: 'EPSG:3857',
+    url: 'data/kml/2012-02-10.kml'
+  })
+});
+```
+
+You may ask yourself how many features are in that KML, and try something like
+the following:
+
+```javascript
+var vector = new ol.layer.Vector({
+  source: new ol.source.KML({
+    projection: 'EPSG:3857',
+    url: 'data/kml/2012-02-10.kml'
+  })
+});
+var numFeatures = vector.getSource().getFeatures().length;
+console.log("Count right after construction: " + numFeatures);
+```
+
+This will log a count of `0` features to be in the source. This is because the
+loading of the KML-file will happen in an asynchronous manner. To get the count
+as soon as possible (right after the file has been fetched and the source has
+been populated with features), you should use an event listener function on the
+`source`:
+
+```javascript
+vector.getSource().on('change', function(evt){
+  var source = evt.target;
+  if (source.getState() === 'ready') {
+    var numFeatures = source.getFeatures().length; 
+    console.log("Count after change: " + numFeatures);
+  }
+});
+```
+
+This will correctly report the number of features, `1119` in that particular
+case.
+
+
+## How do I force a re-render of the map?
+
+Usually the map is automatically re-rendered, once a source changes (for example
+when a remote source has loaded).
+
+If you actually want to manually trigger a rendering, you could use
+
+```javascript
+map.render();
+```
+
+...or its companion method
+
+```javascript
+map.renderSync();
+```
+
+
+## How do I create a custom build of OpenLayers?
+
+Please refer to the [official create custom builds tutorial](tutorials/custom-builds.html)
+which explains how to create a custom build of OpenLayers with just those parts
+included that you want.
+
+
+## Do I need to write my own code using Closure library?
+
+OpenLayers is built on top of the [Google Closure JavaScript
+library](https://developers.google.com/closure/library/), but this
+does not mean that you must use that library in your application code.
+
+OpenLayers should play well with all sorts of JavaScript libraries out there,
+and you are in no way forced to use a specific one. Choose one that looks
+right for you.
+
+
+## Do I need to compress my code with Closure compiler?
+
+No, you don't need to do compress your code with the [Google Closure
+compiler](https://developers.google.com/closure/compiler/).
+
+It may be a good choice though, because when your application code and the
+OpenLayers source code is compiled together using closure compiler, the
+resulting build will most probably be the smallest in terms of byte-size. For
+more details refer to the
+[compile application and OpenLayers together tutorial](tutorials/closure.html).
+
+If you don't want to use the closure compiler, or you can't, you are not at all
+forced to use it.
+
+

doc/index.hbs

@@ -9,10 +9,14 @@ If you're eager to get your first OpenLayers 3 map on a page, dive into the [qui
 
 For a more in-depth overview of OpenLayers 3 core concepts, check out the [tutorials](tutorials/).
 
-Make sure to also check out the [OpenLayers 3 workshop](../../../ol3-workshop/).
+Make sure to also check out the [OpenLayers 3 workshop](/workshop/).
 
 Find additional reference material in the [API docs](../apidoc).
 
-# Questions
+# Frequently Asked Questions (FAQ)
 
-If you cannot find an answer in the documentation, you can ask your question on [stackoverflow using the tag 'openlayers-3'](http://stackoverflow.com/questions/tagged/openlayers-3).
+We have put together a document that lists [Frequently Asked Questions (FAQ)](faq.html) and our answers. Common problems that may arise when using OpenLayers 3 are explained there, and chances are you'll find an appropriate solution in this document.
+
+# More questions?
+
+If you cannot find an answer in the documentation or the FAQ, you can ask your question on [stackoverflow using the tag 'openlayers-3'](http://stackoverflow.com/questions/tagged/openlayers-3).

doc/quickstart.hbs

@@ -35,7 +35,7 @@ Below you'll find a complete working example.  Create a new file, copy in the co
           })
         ],
         view: new ol.View({
-          center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'),
+          center: ol.proj.fromLonLat([37.41, 8.82]),
           zoom: 4
         })
       });
@@ -89,7 +89,7 @@ The map in the application is contained in a [`<div>` HTML element](http://en.wi
       })
     ],
     view: new ol.View({
-      center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'),
+      center: ol.proj.fromLonLat([37.41, 8.82]),
       zoom: 4
     })
   });
@@ -125,9 +125,9 @@ The next part of the `Map` object is the `View`. The view allow to specify the c
 
 ```js
     view: new ol.View({
-      center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'),
+      center: ol.proj.fromLonLat([37.41, 8.82]),
       zoom: 4
     })
 ```
 
-You will notice that the `center` specified is in lat/lon coordinates (EPSG:4326). Since the only layer we use is in Spherical Mercator projection (EPSG:3857), we can reproject them on the fly to be able to zoom the map on the right coordinates.
+You will notice that the `center` specified is in lon/lat coordinates (EPSG:4326). Since the only layer we use is in Spherical Mercator projection (EPSG:3857), we can reproject them on the fly to be able to zoom the map on the right coordinates.

doc/tutorials/browserify.md

@@ -0,0 +1,89 @@
+---
+title: Basic project setup using NPM and Browserify
+layout: doc.hbs
+---
+
+# Introduction
+
+When going beyond modifying existing examples you might be looking for a
+way to setup your own code with dependency management together with external
+dependencies like OpenLayers 3.
+
+This tutorial serves as a suggested project setup using NPM and Browserify
+for the most basic needs. There are several other options and in particular
+you might be interested in 
+[compiling your own code together with OpenLayers 3](closure.html).
+
+## Initial steps
+
+Create a new empty directory for your project and navigate to it by running
+`mkdir new-project && cd new-project`. Initialize your project using `npm init`
+and answer the questions asked.
+
+At this point you can ask NPM to add required dependencies by running
+`npm install --save-dev openlayers browserify watchify uglify-js`. Watchify and
+Uglify will be used to monitor for changes and to build into a minified
+bundle.
+
+## Application code and index.html
+
+Place your application code in `index.js`. Here is a simple starting point:
+
+```js
+var ol = require('openlayers');
+ 
+var map = new ol.Map({
+  target: 'map',
+  layers: [
+    new ol.layer.Tile({
+      source: new ol.source.OSM()
+    })
+  ],
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 0
+  })
+});
+```
+
+You will also need an `ìndex.html` file that will use your bundle. Here is a simple
+example:
+
+```html
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Using Browserify with OpenLayers</title>
+    <link rel="stylesheet" href="node_modules/openlayers/dist/ol.css" type="text/css">
+    <style>
+      #map {
+        width: 400px;
+        height: 250px;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="map"></div>
+    <script src="bundle.js"></script>
+  </body>
+</html>
+```
+
+## Creating a bundle
+
+With simple scripts you can introduce the commands `npm run build` and `npm start` to
+manually build your bundle and watch for changes, respectively. Add the following
+to the script section in `package.json`:
+
+```json
+"scripts": {
+  "start": "watchify index.js --outfile bundle.js",
+  "build": "browserify index.js | uglifyjs --compress --output bundle.js"
+}
+```
+
+Note that `bundle.js` will contain your application code and all dependencies
+used in your application, in this case the official full build of OpenLayers 3.
+If you only need parts of OpenLayers 3 you can create
+[custom builds](../../builder).

doc/tutorials/closure.md

@@ -0,0 +1,336 @@
+---
+title: Compiling Application with Closure Compiler
+layout: doc.hbs
+---
+
+# Compiling Application with Closure Compiler
+
+The OpenLayers 3 code uses the Closure Library, and it is compiled with the
+Closure Compiler. Using OpenLayers 3 in an application does not require using
+Closure. But using Closure in an OpenLayers 3 application is possible. And this
+is what this tutorial is about.
+
+This tutorial will teach you how to set up an OpenLayers 3 application based on
+the [`closure-util`](https://github.com/openlayers/closure-util) node package,
+which provides utilities for working with Closure. Using `closure-util` is one
+way to use Closure in a web application, but there are others. This tutorial
+just covers the "`closure-util`" way.
+
+The `closure-util` documentation is available on the [`closure-util` readme
+page](https://github.com/openlayers/closure-util/blob/master/readme.md). You
+don't need to read the `closure-util` documentation to follow this tutorial,
+but it's available in `closure-util`'s [readme
+file](https://github.com/openlayers/closure-util/blob/master/readme.md) if you
+need it.
+
+Also, the sample application built in this tutorial is
+[available](https://github.com/openlayers/openlayers-closure-application) on
+GitHub.
+
+## Advantages of using Closure
+
+This tutorial will show you how to use the Closure Compiler to compile an
+application and OpenLayers 3 together. Compiling the application code together
+with the OpenLayers 3 code has a number of advantages.
+
+First of all, it allows you to only "pay" for the OpenLayers 3 code your
+application uses, as the compiler will exclude the OpenLayers 3 code that the
+application doesn't use. And there is no need to write and maintain a list of
+"exports", which is necessary when creating custom builds of OpenLayers 3.
+
+Also, compiling the application and OpenLayers 3 together allows using
+OpenLayers 3 functions and objects that are not part of the official OpenLayers
+3 API. Using non-API functions and objects may be risky, but it is mitigated by
+the fact that the compiler will complain if you use functions or objects
+that are not in OpenLayers 3 anymore.
+
+## Setting up the Application
+
+First, create a directory for the application. We will name that directory
+`openlayers-closure-application` in this tutorial.
+
+    $ mkdir openlayers-closure-application
+
+Now change to that directory:
+
+    $ cd openlayers-closure-application
+
+Our application will be a `node` application, and the `openlayers` and
+`closure-util` node packages will be downloaded from the node package registry
+using the `npm` command line tool.
+
+So we're going to create a `package.json` file for the application, which every
+node application includes. This file basically includes metadata for the
+application.
+
+Create the application's `package.json` file:
+
+    $ npm init
+
+You can pretty much use the default answers to the questions `npm init` asks
+you.
+
+Now install OpenLayers 3 using:
+
+    $ npm install openlayers --save
+
+The `--save` flag persists the `openlayers` dependency in the application's
+`package.json` file. You can edit `package.json` to verify that the dependency
+was added.
+
+`closure-util` is a dependency of the `openlayers` package, so it should have
+been installed with `openlayers`. Use the following to verify that
+`closure-util` is installed:
+
+    $ ./node_modules/openlayers/node_modules/.bin/closure-util
+
+    command argument is required
+
+    Usage: node closure-util <command> [options]
+
+    command     
+      update-compiler     Update the Compiler
+      update-library      Update the Library
+      update              Update both the Library and the Compiler
+      build               Build with Closure Compiler
+      serve               Start the development server
+
+    Options:
+       -l LEVEL, --loglevel LEVEL   Log level  [info]
+
+
+## Create an OpenLayers 3 map
+
+You're now going to create a JavaScript file that creates an OpenLayers 3 map.
+This is the file that we will define the application's entry point.
+
+First of all create an `src` directory at the root of the application:
+
+    $ mkdir src
+
+Now add a file `main.js` to `src`, with the following content:
+
+```js
+goog.provide('app');
+
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.layer.Tile');
+goog.require('ol.source.OSM');
+
+
+/**
+ * @type {ol.Map}
+ */
+app.map = new ol.Map({
+  target: 'map',
+  layers: [
+    new ol.layer.Tile({
+      source: new ol.source.OSM()
+    })
+  ],
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 4
+  })
+});
+```
+
+`goog.provide('app')` creates the namespace `app` for the application. The
+`goog.require` statements that follow define the OpenLayers constructors and
+namespaces that the application uses. The rest of the code just creates the
+OpenLayers map as you would do in any OpenLayers application.
+
+## Compiling the Application
+
+We're now going to compile the application and OpenLayers 3 together, using the
+Closure Compiler and `closure-util`. For this we need to create a JSON config
+file, that we will then pass as an input file to the `closure-util` command.
+
+The minimum config file looks like this:
+
+```json
+{
+  "lib": [
+    "node_modules/openlayers/src/**/*.js",
+    "node_modules/openlayers/build/ol.ext/**/*.js",
+    "src/**/*.js"
+  ],
+  "compile": {
+    "closure_entry_point": "app",
+    "externs": [
+      "node_modules/openlayers/externs/bingmaps.js",
+      "node_modules/openlayers/externs/closure-compiler.js",
+      "node_modules/openlayers/externs/geojson.js",
+      "node_modules/openlayers/externs/proj4js.js",
+      "node_modules/openlayers/externs/tilejson.js",
+      "node_modules/openlayers/externs/topojson.js"
+    ],
+    "define": [
+      "goog.array.ASSUME_NATIVE_FUNCTIONS=true",
+      "goog.dom.ASSUME_STANDARDS_MODE=true",
+      "goog.json.USE_NATIVE_JSON=true",
+      "goog.DEBUG=false",
+      "ol.ENABLE_DOM=false",
+      "ol.ENABLE_WEBGL=false"
+    ],
+    "js": [
+      "node_modules/openlayers/externs/olx.js",
+      "node_modules/openlayers/externs/oli.js"
+    ],
+    "jscomp_off": [
+      "unknownDefines"
+    ],
+    "extra_annotation_name": [
+      "api", "observable"
+    ],
+    "compilation_level": "ADVANCED",
+    "warning_level": "VERBOSE",
+    "output_wrapper": "(function(){%output%})();",
+    "use_types_for_optimization": true
+  }
+}
+```
+
+Create a `config.json` file with the above content at the root of the
+application directory.
+
+We can now use `closure-util` to compile the code:
+
+    $ ./node_modules/openlayers/node_modules/.bin/closure-util build config.json app.js
+
+The resulting `app.js` file, which you can view in your editor if you're
+curious, includes a minified version of the application code (`main.js`), and
+the OpenLayers 3 code that the application code uses.
+
+Here is a version of `config.json` with more compilation checks enabled:
+
+```json
+{
+  "lib": [
+    "node_modules/openlayers/src/**/*.js",
+    "node_modules/openlayers/build/ol.ext/**/*.js",
+    "src/**/*.js"
+  ],
+  "compile": {
+    "closure_entry_point": "app",
+    "externs": [
+      "node_modules/openlayers/externs/bingmaps.js",
+      "node_modules/openlayers/externs/closure-compiler.js",
+      "node_modules/openlayers/externs/geojson.js",
+      "node_modules/openlayers/externs/proj4js.js",
+      "node_modules/openlayers/externs/tilejson.js",
+      "node_modules/openlayers/externs/topojson.js"
+    ],
+    "define": [
+      "goog.array.ASSUME_NATIVE_FUNCTIONS=true",
+      "goog.dom.ASSUME_STANDARDS_MODE=true",
+      "goog.json.USE_NATIVE_JSON=true",
+      "goog.DEBUG=false",
+      "ol.ENABLE_DOM=false",
+      "ol.ENABLE_WEBGL=false"
+    ],
+    "js": [
+      "node_modules/openlayers/externs/olx.js",
+      "node_modules/openlayers/externs/oli.js"
+    ],
+    "jscomp_error": [
+      "accessControls",
+      "ambiguousFunctionDecl",
+      "checkEventfulObjectDisposal",
+      "checkRegExp",
+      "checkTypes",
+      "checkVars",
+      "const",
+      "constantProperty",
+      "deprecated",
+      "duplicateMessage",
+      "es3",
+      "es5Strict",
+      "externsValidation",
+      "fileoverviewTags",
+      "globalThis",
+      "internetExplorerChecks",
+      "invalidCasts",
+      "misplacedTypeAnnotation",
+      "missingGetCssName",
+      "missingProperties",
+      "missingProvide",
+      "missingRequire",
+      "missingReturn",
+      "newCheckTypes",
+      "nonStandardJsDocs",
+      "suspiciousCode",
+      "strictModuleDepCheck",
+      "typeInvalidation",
+      "undefinedNames",
+      "undefinedVars",
+      "uselessCode",
+      "visibility"
+    ],
+    "jscomp_off": [
+      "unknownDefines"
+    ],
+    "extra_annotation_name": [
+      "api", "observable"
+    ],
+    "compilation_level": "ADVANCED",
+    "warning_level": "VERBOSE",
+    "output_wrapper": "(function(){%output%})();",
+    "use_types_for_optimization": true
+  }
+}
+```
+
+## Create an HTML file for the Application
+
+You can now go ahead and create a simple HTML for the application. Create
+a `index.html` file with the following content at the root the application
+directory:
+
+```html
+<!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="node_modules/openlayers/css/ol.css" type="text/css">
+    <title>Simple example</title>
+    <style>
+      #map {
+        width: 600px;
+        height: 400px;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="map"></div>
+    <script src="app.js" type="text/javascript"></script>
+  </body>
+</html>
+```
+
+Note that the page includes a `script` tag referencing the `app.js` file,
+which is the file resuted from the compilation.
+
+You are done!
+
+## Run Application in Debug Mode
+
+As a bonus, we're going to show how to use `closure-util` to run the
+application in "debug" mode, where the original application and OpenLayers
+scripts are loaded one by one in the page.
+
+Start the `closure-util` development server:
+
+    $ ./node_modules/openlayers/node_modules/.bin/closure-util serve config.json
+
+Now change the `script` tag to the following in the `index.html` file:
+
+```html
+      <script src="@?main=src/main.js" type="text/javascript"></script>
+```
+
+Reload the page in your browser and you should see that scripts are now loaded
+individually, making debugging much easier.

doc/tutorials/custom-builds.md

@@ -0,0 +1,232 @@
+---
+title: Custom builds
+layout: doc.hbs
+---
+
+# Creating custom builds
+
+OpenLayers 3 is a big library providing a lot of functionality. So it is unlikely that an application will need and use all the functionality OpenLayers 3 provides. This is why creating application-specific OpenLayers 3 builds, with just the functionality your application needs, is often a good idea.
+
+An alternative to creating custom builds is to compile your application code together with OpenLayers 3. See the [Compiling Application with Closure Compiler](closure.html) tutorial for more information.
+
+This particular tutorial explains how to create custom builds of OpenLayers 3.
+
+## Requirements
+
+OpenLayers 3's build tools use Node and Java, so you need to have Node and Java installed on your machine. You can run `node --version` and `java -version` to test that Node and Java are installed, respectively.
+
+## Download OpenLayers
+
+Obviously, creating a custom build requires the OpenLayers 3 source and specific build scripts.
+
+To get the OpenLayers 3 source and the build scripts you can clone the `ol3` [repository](https://github.com/openlayers/ol3), or you can download one of the release archives. You can also download the `openlayers` Node package from the Node package registry, using NPM (the Node Package Manager). This is the method we are going to use in this tutorial.
+
+Create a directory:
+
+    $ mkdir openlayers
+
+Download the OpenLayers 3 distribution using NPM:
+
+    $ npm install openlayers
+
+This will download the latest stable version of OpenLayers 3, and install it under `node_modules`. You can list the content of `node_modules` to verify that it effectively contains a directory named "openlayers".
+
+The Node packages onto which the `openlayers` package depends are installed under `node_modules/openlayers/node_modules`. That directory should, for example, include `closure-util`, which is the utility library OpenLayers 3 uses for Closure.
+
+You should now have everything you need to create custom builds of OpenLayers 3!
+
+## Create a build configuration file
+
+Creating a custom build requires writing a build configuration file. The format of build configuration files is JSON. Here is a simple example of a build configuration file:
+
+```json
+{
+  "exports": [
+    "ol.Map",
+    "ol.View",
+    "ol.control.defaults",
+    "ol.layer.Tile",
+    "ol.source.OSM"
+  ],
+  "compile": {
+    "externs": [
+      "externs/bingmaps.js",
+      "externs/closure-compiler.js",
+      "externs/geojson.js",
+      "externs/oli.js",
+      "externs/olx.js",
+      "externs/proj4js.js",
+      "externs/tilejson.js",
+      "externs/topojson.js"
+    ],
+    "define": [
+      "goog.array.ASSUME_NATIVE_FUNCTIONS=true",
+      "goog.dom.ASSUME_STANDARDS_MODE=true",
+      "goog.json.USE_NATIVE_JSON=true",
+      "goog.DEBUG=false"
+    ],
+    "jscomp_off": [
+      "unknownDefines"
+    ],
+    "extra_annotation_name": [
+      "api", "observable"
+    ],
+    "compilation_level": "ADVANCED_OPTIMIZATIONS",
+    "manage_closure_dependencies": true
+  }
+}
+```
+
+Create a file named `ol-custom.json` with that content, and save it under the `node_modules/openlayers/build` directory. (You can save it to any location really.)
+
+The most relevant part of this configuration object is the `"exports"` array. This array declares the functions/constructors you use in your JavaScript code. For example, the above configuration file is what you'd use for the following JavaScript code:
+
+```js
+var map = new ol.Map({
+  target: 'map',
+  layers: [
+    new ol.layer.Tile({
+      source: new ol.source.OSM()
+    })
+  ],
+  controls: ol.control.defaults({
+    attributionOptions: {
+      collapsible: false
+    }
+  }),
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 4
+  })
+});
+```
+
+Note that this JavaScript code corresponds to OpenLayers 3's [`simple`](http://openlayers.org/en/master/examples/simple.html) example.
+
+You are now ready to create your first OpenLayers 3 build. Use the following command to create the build:
+
+    $ cd node_modules/openlayers
+    $ node tasks/build.js build/ol-custom.json build/ol-custom.js
+
+The build command may take some time, but it should end with the following output in the console:
+
+    info ol Parsing dependencies
+    info ol Compiling 364 sources
+
+The build command should have created an `ol-custom.js` file in the `node_modules/openlayers/build` directory. You can verify that the file was created. You can even open it in your editor if you're curious.
+
+As a test, you can use the following HTML file to verify that your custom build works as expected:
+
+```html
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8" />
+    <title>OpenLayers 3 example</title>
+    <link rel="stylesheet" href="node_modules/openlayers/css/ol.css" />
+    <style>
+      #map {
+        width: 600px;
+        height: 400px;
+      }
+    </style>
+</head>
+<body>
+    <div id="map"></div>
+    <script src="node_modules/openlayers/build/ol-custom.js"></script>
+    <script>
+    var map = new ol.Map({
+      target: 'map',
+      layers: [
+        new ol.layer.Tile({
+          source: new ol.source.OSM()
+        })
+      ],
+      view: new ol.View({
+        center: [0, 0],
+        zoom: 4
+      })
+    });
+    </script>
+</body>
+</html>
+```
+
+## More on the config file
+
+### `define`'s
+
+Closure allows you to define constants that can be set at compile time. The `define` config property above sets four `goog` properties for the Closure library. The OpenLayers 3 code also has defined values you can set.
+
+Setting some of these to `false` means that the portions of the code relating to this setting become "dead", i.e. are never executed. As Closure Compiler's `ADVANCED` mode removes dead code, this makes the size of the advanced compiled file smaller.
+
+You might have noticed that the build file you've just created is considerably smaller than the full build, but it can be reduced further. This is because all three renderers and all layer types are included by default. We only need one renderer, and only need the tile layer, so can exclude the others by setting these properties with `define`s. So add the following to the define section of the config above:
+```
+      "ol.ENABLE_DOM=false",
+      "ol.ENABLE_WEBGL=false",
+      "ol.ENABLE_PROJ4JS=false",
+      "ol.ENABLE_IMAGE=false",
+      "ol.ENABLE_VECTOR=false",
+```
+
+and re-run the build script. The build size should now be smaller.
+
+### Externs
+
+The Closure documentation explains that "externs" are for external names used in the code being compiled. The compiler includes externs for built-ins such as `document`. The `externs` directory of the OpenLayers 3 code includes files for all those used in some part of the library. For example, if you use Bing Maps, you should include the Bing externs file in the `externs` section of the config file.
+
+`oli.js` and `olx.js` are externs files for the OpenLayers 3 API. For examples `olx.js` includes extern definitions for OpenLayers 3's constructor options. You should always use these two files as externs when creating custom builds.
+
+### Other compiler options
+
+There are a couple of other compiler options in the config file above. `manage_closure_dependencies` should always be used.
+
+You can specify any of the other compiler options here as needed, such as the renaming reports, output manifest, or source maps. There is a full list of available options in [closure-util](https://github.com/openlayers/closure-util/blob/master/compiler-options.txt).
+
+Note that `build.js` currently requires you to enter an output file and will write the output from the compiler to it; it does not use the `js_output_file` compiler option. If you specify this in the config file, there will be no compiler output, so `build.js`'s output file will be empty.
+
+## A more complicated example
+
+Now let's try a more complicated example: [`heatmaps-earthquakes`](http://openlayers.org/en/master/examples/heatmap-earthquakes.html). The build configuration file looks like this:
+
+```json
+{
+  "exports": [
+    "ol.layer.Heatmap",
+    "ol.source.KML",
+    "ol.layer.Heatmap#getSource",
+    "ol.source.KML#on",
+    "ol.source.VectorEvent#feature",
+    "ol.Feature#get",
+    "ol.Feature#set",
+    "ol.layer.Tile",
+    "ol.source.Stamen",
+    "ol.Map",
+    "ol.View"
+  ],
+  "compile": {
+    "externs": [
+      "externs/olx.js",
+      "externs/oli.js"
+    ],
+    "define": [
+      "ol.ENABLE_DOM=false",
+      "ol.ENABLE_WEBGL=false",
+      "ol.ENABLE_PROJ4JS=false",
+      "ol.ENABLE_IMAGE=false",
+      "goog.dom.ASSUME_STANDARDS_MODE=true",
+      "goog.DEBUG=false"
+    ],
+    "compilation_level": "ADVANCED_OPTIMIZATIONS",
+    "manage_closure_dependencies": true
+  }
+}
+```
+
+The exports are given here in the order in which they occur in the `heatmaps-earthquakes` example's JavaScript code. In this example we not only use the `ol.` functions and constructors, but also `prototype` methods where the `ol` namespace is not directly used. In the code, we have for example `vector.getSource().on()`. This means we are using the `getSource` method of `layer.Heatmap` and the `on` method of `source.KML`, so this is what has to be exported. Similarly, `event.feature.get()` means we are using the `feature` property of `source.VectorEvent` and the `get` method of `Feature`. If any of these names are left out, the compile will complete successfully, but the missing names will be obfuscated and you will get a 'property undefined' error when you try and run the script.
+
+As this example uses a vector layer it is necessary to remove `"ol.ENABLE_VECTOR=false"` in the `define` section of the configuration.
+
+## Conclusion
+
+This tutorial should have given you the information you need to create custom builds, i.e. builds tailored to your application. See the [tasks readme](https://github.com/openlayers/ol3/tree/master/tasks/readme.md) for more information on the build scripts and the properties you can use in the build configuration file.

doc/tutorials/index.hbs

@@ -5,4 +5,8 @@ layout: doc.hbs
 
 # Tutorials
 
-We'll be putting together a more comprehensive set of tutorials here.  For now, you can take a look at the [introduction](introduction.html) and [basic concepts](concepts.html) tutorial.  Stay tuned for more!
+* [Introduction to OpenLayers 3](introduction.html)
+* [Basic Concepts](concepts.html)
+* [Create Custom Builds](custom-builds.html)
+* [Bundle Application and OpenLayers using Browserify](browserify.html)
+* [Compile Application and OpenLayers together](closure.html)

doc/tutorials/introduction.md

@@ -39,6 +39,4 @@ Class namespaces, such as `ol.layer` have a base class type with the same name,
 
 Source files are similarly organised, with a directory for each class namespace. Names are however all lower-case, and the subclasses repeat the superclass type in their name, for example, `ol/layer/vectorlayer.js`.
 
-The naming structure means that there are sometimes 2 objects with the same name but different initial, such as `ol.feature`, a simple object with static functions to be used with features, and `ol.Feature`, a class used to instantiate new features. These two objects are however stored in the same file, in this case, `ol/feature.js`
-
 OL3 follows the convention that the names of private properties and methods, that is, those that are not part of the API, end in an underscore. In general, instance properties are private and accessed using accessors.

examples/accessible.css

@@ -0,0 +1,16 @@
+a.skiplink {
+  position: absolute;
+  clip: rect(1px, 1px, 1px, 1px);
+  padding: 0;
+  border: 0;
+  height: 1px;
+  width: 1px;
+  overflow: hidden;
+}
+a.skiplink:focus {
+  clip: auto;
+  height: auto;
+  width: auto;
+  background-color: #fff;
+  padding: 0.3em;
+}

examples/accessible.html

@@ -1,72 +1,20 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Accessibility example
-    <meta charset="utf-8">
+shortdesc: Example of an accessible map.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  This page's `map` element has its `tabindex` attribute set to `"0"`, that makes it focusable. To focus the map element you can either navigate to it using the "tab" key or use the skip link. When the `map` element is focused the + and - keys can be used to zoom in and out and the arrow keys can be used to pan.
-    <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>Accessibility example</title>
-    <style>
-      a.skiplink {
-        position: absolute;
-        clip: rect(1px, 1px, 1px, 1px);
-        padding: 0;
-        border: 0;
-        height: 1px;
-        width: 1px;
-        overflow: hidden;
-      }
-      a.skiplink:focus {
-        clip: auto;
-        height: auto;
-        width: auto;
-        background-color: #fff;
-        padding: 0.3em;
-      }
-    </style>
-  </head>
-  <body>
 
-    <div class="navbar navbar-inverse navbar-fixed-top">
-      <div class="navbar-inner">
-        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png" alt=""> OpenLayers 3 Examples</a>
-        </div>
-      </div>
-    </div>
 
-    <div class="container-fluid">
+  Clicking on the "Zoom in" and "Zoom out" buttons below the map zooms the map in and out. You can navigate to the buttons using the "tab" key, and press the "enter" key to trigger the zooming action.
 
-      <div class="row-fluid">
+tags: "accessibility, tabindex"
-        <div class="span12">
+---
-          <a class="skiplink" href="#map">Go to map</a>
+<div class="row-fluid">
-          <div id="map" class="map" tabindex="0"></div>
+  <div class="span12">
-        </div>
+    <a class="skiplink" href="#map">Go to map</a>
-      </div>
+    <div id="map" class="map" tabindex="0"></div>
-
+    <button id="zoom-out">Zoom out</button>
-      <div class="row-fluid">
+    <button id="zoom-in">Zoom in</button>
-
+  </div>
-        <div class="span12">
+</div>
-          <h4 id="title">Accessibility example</h4>
-          <p id="shortdesc">Example of an accessible map.</p>
-          <div id="docs">
-            <p>This page's <code>map</code> element has its <code>tabindex</code> attribute set to <code>"0"</code>, that makes it focusable. To focus the map element you can either navigate to it using the "tab" key or use the skip link. When the <code>map</code> element is focused the + and - keys can be used to zoom in and out and the arrow keys can be used to pan.</p>
-            <p>When clicked the "Zoom in" and "Zoom out" buttons below the map zoom the map in and out, respectively. You can navigate to the buttons using the "tab" key, and press the "enter" key to trigger the zooming action.</p>
-            <p>See the <a href="accessible.js" target="_blank">accessible.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">accessibility, tabindex</div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=accessible" type="text/javascript"></script>
-
-  </body>
-</html>

examples/accessible.js

@@ -11,7 +11,7 @@ var map = new ol.Map({
       source: new ol.source.OSM()
     })
   ],
-  renderer: exampleNS.getRendererFromQueryString(),
+  renderer: common.getRendererFromQueryString(),
   target: 'map',
   controls: ol.control.defaults({
     attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
@@ -24,9 +24,14 @@ var map = new ol.Map({
   })
 });
 
-jQuery('#map').after('<button type="button" ' +
+document.getElementById('zoom-out').onclick = function() {
-    'onclick="map.getView().setZoom(map.getView().getZoom() - 1);">' +
+  var view = map.getView();
-    'Zoom out</button>');
+  var zoom = view.getZoom();
-jQuery('#map').after('<button type="button" ' +
+  view.setZoom(zoom - 1);
-    'onclick="map.getView().setZoom(map.getView().getZoom() + 1);">' +
+};
-    'Zoom in</button>');
+
+document.getElementById('zoom-in').onclick = function() {
+  var view = map.getView();
+  var zoom = view.getZoom();
+  view.setZoom(zoom + 1);
+};

examples/animation.html

@@ -1,65 +1,27 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Animation example
-    <meta charset="utf-8">
+shortdesc: Demonstrates animated pan, zoom, and rotation.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  This example shows how to use the beforeRender function on the Map to run one
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+  or more animations.
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+tags: "animation"
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+---
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+<div class="row-fluid">
-    <title>Animation example</title>
+  <div class="span12">
-  </head>
+    <div id="map" class="map"></div>
-  <body>
+  </div>
-
+</div>
-    <div class="navbar navbar-inverse navbar-fixed-top">
+<div class="row-fluid">
-      <div class="navbar-inner">
+  <div class="span12">
-        <div class="container">
+    <button id="rotate-left" title="Rotate clockwise">↻</button>
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+    <button id="rotate-right" title="Rotate counterclockwise">↺</button>
-        </div>
+    <button id="rotate-around-rome">Rotate around Rome</button>
-      </div>
+    <button id="pan-to-london">Pan to London</button>
-    </div>
+    <button id="elastic-to-moscow">Elastic to Moscow</button>
-
+    <button id="bounce-to-istanbul">Bounce to Istanbul</button>
-    <div class="container-fluid">
+    <button id="spin-to-rome">Spin to Rome</button>
-
+    <button id="fly-to-bern">Fly to Bern</button>
-      <div class="row-fluid">
+    <button id="spiral-to-madrid">Spiral to Madrid</button>
-        <div class="span12">
+  </div>
-          <div id="map" class="map"></div>
+</div>
-        </div>
-      </div>
-
-      <div class="row-fluid">
-        <div class="span12">
-          <button id="rotate-left"><i class="icon-arrow-left"></i></button>
-          <button id="rotate-right"><i class="icon-arrow-right"></i></button>
-          <button id="rotate-around-rome">Rotate around Rome</button>
-          <button id="pan-to-london">Pan to London</button>
-          <button id="elastic-to-moscow">Elastic to Moscow</button>
-          <button id="bounce-to-istanbul">Bounce to Istanbul</button>
-          <button id="spin-to-rome">Spin to Rome</button>
-          <button id="fly-to-bern">Fly to Bern</button>
-          <button id="spiral-to-madrid">Spiral to Madrid</button>
-        </div>
-      </div>
-
-      <div class="row-fluid">
-
-        <div class="span12">
-          <h4 id="title">Animation example</h4>
-          <p id="shortdesc">Demonstrates animated pan, zoom, and rotation.</p>
-          <div id="docs">
-            <p>See the <a href="animation.js" target="_blank">animation.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">animation</div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=animation" type="text/javascript"></script>
-
-  </body>
-</html>

examples/animation.js

@@ -34,12 +34,12 @@ function elastic(t) {
   return Math.pow(2, -10 * t) * Math.sin((t - 0.075) * (2 * Math.PI) / 0.3) + 1;
 }
 
-var london = ol.proj.transform([-0.12755, 51.507222], 'EPSG:4326', 'EPSG:3857');
+var london = ol.proj.fromLonLat([-0.12755, 51.507222]);
-var moscow = ol.proj.transform([37.6178, 55.7517], 'EPSG:4326', 'EPSG:3857');
+var moscow = ol.proj.fromLonLat([37.6178, 55.7517]);
-var istanbul = ol.proj.transform([28.9744, 41.0128], 'EPSG:4326', 'EPSG:3857');
+var istanbul = ol.proj.fromLonLat([28.9744, 41.0128]);
-var rome = ol.proj.transform([12.5, 41.9], 'EPSG:4326', 'EPSG:3857');
+var rome = ol.proj.fromLonLat([12.5, 41.9]);
-var bern = ol.proj.transform([7.4458, 46.95], 'EPSG:4326', 'EPSG:3857');
+var bern = ol.proj.fromLonLat([7.4458, 46.95]);
-var madrid = ol.proj.transform([-3.683333, 40.4], 'EPSG:4326', 'EPSG:3857');
+var madrid = ol.proj.fromLonLat([-3.683333, 40.4]);
 
 var view = new ol.View({
   // the view's initial state
@@ -54,7 +54,7 @@ var map = new ol.Map({
       source: new ol.source.OSM()
     })
   ],
-  renderer: exampleNS.getRendererFromQueryString(),
+  renderer: common.getRendererFromQueryString(),
   // Improve user experience by loading tiles while animating. Will make
   // animations stutter on mobile or slow devices.
   loadTilesWhileAnimating: true,

examples/arcgis-tiled.html

@@ -1,51 +1,16 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Tiled ArcGIS MapServer example
-    <meta charset="utf-8">
+shortdesc: Example of a tiled ArcGIS layer.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  This example shows how to use an ArcGIS REST MapService as tiles.
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+  This source type supports Map and Image Services. For cached ArcGIS
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+  services, better performance is available by using
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+  <code>ol.source.XYZ</code> instead.
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+tags: arcgis, tile, tilelayer"
-    <title>Tiled ArcGIS MapServer example</title>
+---
-  </head>
+<div class="row-fluid">
-  <body>
+  <div class="span12">
-
+    <div id="map" class="map"></div>
-    <div class="navbar navbar-inverse navbar-fixed-top">
+  </div>
-      <div class="navbar-inner">
+</div>
-        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
-        </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">Tiled ArcGIS MapServer example</h4>
-          <p id="shortdesc">Example of a tiled ArcGIS layer.</p>
-          <div id="docs">
-            <p>See the <a href="arcgis-tiled.js" target="_blank">arcgis-tiled.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">arcgis, tile, tilelayer</div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=arcgis-tiled" type="text/javascript"></script>
-
-  </body>
-</html>

examples/attributions.html

@@ -1,51 +1,15 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Attributions example
-    <meta charset="utf-8">
+shortdesc: Example of a attributions visibily change on map resize, to collapse them on small maps.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  When the map gets too small because of a resize, the attribution will be collapsed.
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+  This is because the <code>collapsible</code> option is set to true if the width
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+  of the map gets smaller than 600 pixels.
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+tags: "attributions, openstreetmap"
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+---
-    <title>Attributions example</title>
+<div class="row-fluid">
-  </head>
+  <div class="span12">
-  <body>
+    <div id="map" class="map"></div>
-
+  </div>
-    <div class="navbar navbar-inverse navbar-fixed-top">
+</div>
-      <div class="navbar-inner">
-        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
-        </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">Attributions example</h4>
-          <p id="shortdesc">Example of a attributions visibily change on map resize, to collapse them on small maps.</p>
-          <div id="docs">
-            <p>See the <a href="attributions.js" target="_blank">attributions.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">attributions, openstreetmap</div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=attributions" type="text/javascript"></script>
-
-  </body>
-</html>

examples/attributions.js

@@ -15,7 +15,7 @@ var map = new ol.Map({
     })
   ],
   controls: ol.control.defaults({ attribution: false }).extend([attribution]),
-  renderer: exampleNS.getRendererFromQueryString(),
+  renderer: common.getRendererFromQueryString(),
   target: 'map',
   view: new ol.View({
     center: [0, 0],
@@ -29,5 +29,5 @@ function checkSize() {
   attribution.setCollapsed(small);
 }
 
-$(window).on('resize', checkSize);
+window.addEventListener('resize', checkSize);
 checkSize();

examples/bind-input.html

@@ -1,92 +0,0 @@
-<!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>Bind HTML input example</title>
-  </head>
-  <body>
-
-    <div class="navbar navbar-inverse navbar-fixed-top">
-      <div class="navbar-inner">
-        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
-        </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="span4">
-          <h4 id="title">Bind HTML input example</h4>
-          <p id="shortdesc">Demonstrates two-way binding of HTML input elements to OpenLayers objects.</p>
-          <div id="docs">
-            <p>See the <a href="bind-input.js" target="_blank">bind-input.js source</a> to see how this is done.</p>
-            <p id="has-webgl" style="display: none">With the <a href="?renderer=webgl">WebGL renderer</a>, <strong>hue</strong>, <strong>saturation</strong>, <strong>contrast</strong> and <strong>brightness</strong> can also be controlled.</p>
-            <div id="no-webgl" class="alert alert-warning" style="display: none">
-              <h4>Warning!</h4>
-              A browser that supports <a href="http://get.webgl.org/">WebGL</a> is required to change the
-              <strong>hue</strong>, <strong>saturation</strong>, <strong>contrast</strong> and <strong>brightness</strong>.
-            </div>
-          </div>
-          <div id="tags">input, bind, openstreetmap</div>
-        </div>
-
-        <div class="span4">
-          <form class="">
-            <fieldset>
-              <legend>Layer</legend>
-              <label class="checkbox" for="visible">
-                <input id="visible" type="checkbox"/>visibility
-              </label>
-              <label>opacity</label>
-              <input id="opacity" type="range" min="0" max="1" step="0.01"/>
-            </fieldset>
-            <fieldset id="webgl" style="display: none">
-              <label>hue</label>
-              <input id="hue" type="range" min="-3.141592653589793" max="3.141592653589793" step="0.01"/>
-              <label>saturation</label>
-              <input id="saturation" type="range" min="0" max="5" step="0.01"/>
-              <label>contrast</label>
-              <input id="contrast" type="range" min="0" max="2" step="0.01"/>
-              <label>brightness</label>
-              <input id="brightness" type="range" min="-1" max="1" step="0.01"/>
-            </fieldset>
-          </form>
-        </div>
-
-        <div class="span4">
-          <form class="">
-            <fieldset>
-              <legend>View</legend>
-              <label>rotation</label>
-              <input id="rotation" type="range" min="-3.141592653589793" max="3.141592653589793" step="0.01"/>
-              <label>resolution</label>
-              <input id="resolution" type="number" min="0" step="250"/>
-            </fieldset>
-          </form>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=bind-input" type="text/javascript"></script>
-
-  </body>
-</html>

examples/bind-input.js

@@ -1,69 +0,0 @@
-goog.require('ol.Map');
-goog.require('ol.View');
-goog.require('ol.control');
-goog.require('ol.dom.Input');
-goog.require('ol.has');
-goog.require('ol.layer.Tile');
-goog.require('ol.source.OSM');
-
-
-function checkWebGL(evt) {
-  document.getElementById('no-webgl').style.display =
-      ol.has.WEBGL ? 'none' : '';
-  document.getElementById('has-webgl').style.display =
-      ol.has.WEBGL && !evt.glContext ? '' : 'none';
-  document.getElementById('webgl').style.display =
-      evt.glContext ? '' : 'none';
-}
-
-var layer = new ol.layer.Tile({
-  source: new ol.source.OSM()
-});
-layer.once('precompose', checkWebGL);
-
-var view = new ol.View({
-  center: [0, 0],
-  zoom: 2
-});
-
-var map = new ol.Map({
-  layers: [layer],
-  renderer: exampleNS.getRendererFromQueryString(),
-  target: 'map',
-  controls: ol.control.defaults({
-    attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
-      collapsible: false
-    })
-  }),
-  view: view
-});
-
-var visible = new ol.dom.Input(document.getElementById('visible'));
-visible.bindTo('checked', layer, 'visible');
-
-var opacity = new ol.dom.Input(document.getElementById('opacity'));
-opacity.bindTo('value', layer, 'opacity')
-    .transform(parseFloat, String);
-
-var hue = new ol.dom.Input(document.getElementById('hue'));
-hue.bindTo('value', layer, 'hue')
-    .transform(parseFloat, String);
-
-var saturation = new ol.dom.Input(document.getElementById('saturation'));
-saturation.bindTo('value', layer, 'saturation')
-    .transform(parseFloat, String);
-
-var contrast = new ol.dom.Input(document.getElementById('contrast'));
-contrast.bindTo('value', layer, 'contrast')
-    .transform(parseFloat, String);
-
-var brightness = new ol.dom.Input(document.getElementById('brightness'));
-brightness.bindTo('value', layer, 'brightness')
-    .transform(parseFloat, String);
-
-
-var rotation = new ol.dom.Input(document.getElementById('rotation'));
-rotation.bindTo('value', view, 'rotation').transform(parseFloat, String);
-
-var resolution = new ol.dom.Input(document.getElementById('resolution'));
-resolution.bindTo('value', view, 'resolution').transform(parseFloat, String);

examples/bing-maps.html

@@ -1,60 +1,22 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Bing Maps example
-    <meta charset="utf-8">
+shortdesc: Example of a Bing Maps layer.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  <p>When the Bing Maps tile service doesn't have tiles for a given resolution and region it returns "placeholder" tiles indicating that. Zoom the map beyond level 19 to see the "placeholder" tiles. If you want OpenLayers to display stretched tiles in place of "placeholder" tiles beyond zoom level 19 then set <code>maxZoom</code> to <code>19</code> in the options passed to <code>ol.source.BingMaps</code>.</p>
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+tags: "bing, bing-maps"
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+cloak:
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+  Ak-dzM4wZjSqTlzveKz5u0d4IQ4bRzVI309GxmkgSVr1ewS6iPSrOvOKhA-CJlm3: Your Bing Maps Key from http://bingmapsportal.com/ here
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+---
-    <title>Bing Maps example</title>
+ <div class="row-fluid">
-  </head>
+   <div class="span12">
-  <body>
+     <div id="map" class="map"></div>
-
+     <select id="layer-select">
-    <div class="navbar navbar-inverse navbar-fixed-top">
+       <option value="Aerial">Aerial</option>
-      <div class="navbar-inner">
+       <option value="AerialWithLabels" selected>Aerial with labels</option>
-        <div class="container">
+       <option value="Road">Road</option>
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+       <option value="collinsBart">Collins Bart</option>
-        </div>
+       <option value="ordnanceSurvey">Ordnance Survey</option>
-      </div>
+     </select>
-    </div>
+   </div>
-
+ </div>
-    <div class="container-fluid">
-
-      <div class="row-fluid">
-        <div class="span12">
-          <div id="map" class="map"></div>
-
-          <select id="layer-select">
-            <option value="Aerial">Aerial</option>
-            <option value="AerialWithLabels" selected>Aerial with labels</option>
-            <option value="Road">Road</option>
-            <option value="collinsBart">Collins Bart</option>
-            <option value="ordnanceSurvey">Ordnance Survey</option>
-          </select>
-        </div>
-      </div>
-
-      <div class="row-fluid">
-
-        <div class="span12">
-          <h4 id="title">Bing Maps example</h4>
-          <p id="shortdesc">Example of a Bing Maps layer.</p>
-          <div id="docs">
-            <p>When the Bing Maps tile service doesn't have tiles for a given resolution and region it returns "placeholder" tiles indicating that. Zoom the map beyond level 19 to see the "placeholder" tiles. If you want OpenLayers to display stretched tiles in place of "placeholder" tiles beyond zoom level 19 then set <code>maxZoom</code> to <code>19</code> in the options passed to <code>ol.source.BingMaps</code>.</p>
-            <p>See the <a href="bing-maps.js" target="_blank">bing-maps.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">bing, bing-maps</div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=bing-maps" type="text/javascript"></script>
-
-  </body>
-</html>

examples/bing-maps.js

@@ -28,7 +28,7 @@ for (i = 0, ii = styles.length; i < ii; ++i) {
 }
 var map = new ol.Map({
   layers: layers,
-  renderer: exampleNS.getRendererFromQueryString(),
+  renderer: common.getRendererFromQueryString(),
   // Improve user experience by loading tiles while dragging/zooming. Will make
   // zooming choppy on mobile or slow devices.
   loadTilesWhileInteracting: true,
@@ -39,11 +39,12 @@ var map = new ol.Map({
   })
 });
 
-$('#layer-select').change(function() {
+var select = document.getElementById('layer-select');
-  var style = $(this).find(':selected').val();
+function onChange() {
-  var i, ii;
+  var style = select.value;
-  for (i = 0, ii = layers.length; i < ii; ++i) {
+  for (var i = 0, ii = layers.length; i < ii; ++i) {
-    layers[i].setVisible(styles[i] == style);
+    layers[i].setVisible(styles[i] === style);
   }
-});
+}
-$('#layer-select').trigger('change');
+select.addEventListener('change', onChange);
+onChange();

examples/blend-modes.css

@@ -0,0 +1,4 @@
+.map{
+  background-repeat: repeat;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAApSURBVBiVY7x///5/BjSgqKjIiC7GhC6ACwygQgxHMzAwMGDz4FDwDAD5/wevjSk4mwAAAABJRU5ErkJggg==);
+}

examples/blend-modes.html

@@ -0,0 +1,76 @@
+---
+layout: example.html
+title: Blend modes example
+shortdesc: Shows how to change the canvas compositing / blending mode in post- and precompose eventhandlers.
+docs: >
+  <p>This example shows how to change the canvas compositing / blending mode in
+  post- and precompose event handlers. The Canvas 2D API provides the property
+  <code>globalCompositeOperation</code> with which one can influence which
+  composition operation will be used when drawing on the canvas. The various
+  options are well described on the <a href="https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation">MDN
+  documentation page</a>.</p>
+
+  <p>In this example three circles on the corners of an equilateral triangle are
+  drawn with red, green or blue styles respectively. By setting the
+  <code>globalCompositeOperation</code> you can change how these colors turn out
+  when they are combined on the map.</p>
+
+  <p>You can select an operation in the select-field and you can also control
+  which layers will be affected by the chosen operation through the layer
+  checkboxes.</p>
+tags: "blendmode, blend-mode, blend mode, blendingmode, blending-mode, blending mode, composition, compositing, canvas, vector"
+---
+<div class="row-fluid">
+  <div class="span12">
+    <div id="map" class="map"></div>
+  </div>
+</div>
+<div class="row-fluid">
+  <div class="span12">
+    <form class="form-horizontal">
+      <label>
+        <select id="blend-mode" class="form-control">
+          <option value="source-over">source-over (default)</option>
+          <option>source-in</option>
+          <option>source-out</option>
+          <option>source-atop</option>
+          <option>destination-over</option>
+          <option>destination-in</option>
+          <option>destination-out</option>
+          <option>destination-atop</option>
+          <option>lighter</option>
+          <option>copy</option>
+          <option>xor</option>
+          <option>multiply</option>
+          <option>screen</option>
+          <option>overlay</option>
+          <option>darken</option>
+          <option>lighten</option>
+          <option>color-dodge</option>
+          <option>color-burn</option>
+          <option>hard-light</option>
+          <option>soft-light</option>
+          <option selected>difference</option>
+          <option>exclusion</option>
+          <option>hue</option>
+          <option>saturation</option>
+          <option>color</option>
+          <option>luminosity</option>
+        </select>
+        Canvas compositing / blending mode
+      </label>
+      <label>
+        <input type="checkbox" id="affect-red" checked>
+        Red circle affected
+      </label>
+      <label>
+        <input type="checkbox" id="affect-green" checked>
+        Green circle affected
+      </label>
+      <label>
+        <input type="checkbox" id="affect-blue" checked>
+        Blue circle affected
+      </label>
+    </form>
+  </div>
+</div>

examples/blend-modes.js

@@ -0,0 +1,177 @@
+goog.require('ol.Feature');
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.geom.Point');
+goog.require('ol.layer.Vector');
+goog.require('ol.source.Vector');
+goog.require('ol.style.Circle');
+goog.require('ol.style.Fill');
+goog.require('ol.style.Stroke');
+goog.require('ol.style.Style');
+
+
+// Create separate layers for red, green an blue circles.
+//
+// Every layer has one feature that is styled with a circle, together the
+// features form the corners of an equilateral triangle and their styles overlap
+var redLayer = new ol.layer.Vector({
+  source: new ol.source.Vector({
+    features: [new ol.Feature(new ol.geom.Point([0, 0]))]
+  }),
+  style: new ol.style.Style({
+    image: new ol.style.Circle({
+      fill: new ol.style.Fill({
+        color: 'rgba(255,0,0,0.8)'
+      }),
+      stroke: new ol.style.Stroke({
+        color: 'rgb(255,0,0)',
+        width: 15
+      }),
+      radius: 120
+    })
+  })
+});
+var greenLayer = new ol.layer.Vector({
+  source: new ol.source.Vector({
+    // 433.013 is roughly 250 * Math.sqrt(3)
+    features: [new ol.Feature(new ol.geom.Point([250, 433.013]))]
+  }),
+  style: new ol.style.Style({
+    image: new ol.style.Circle({
+      fill: new ol.style.Fill({
+        color: 'rgba(0,255,0,0.8)'
+      }),
+      stroke: new ol.style.Stroke({
+        color: 'rgb(0,255,0)',
+        width: 15
+      }),
+      radius: 120
+    })
+  })
+});
+var blueLayer = new ol.layer.Vector({
+  source: new ol.source.Vector({
+    features: [new ol.Feature(new ol.geom.Point([500, 0]))]
+  }),
+  style: new ol.style.Style({
+    image: new ol.style.Circle({
+      fill: new ol.style.Fill({
+        color: 'rgba(0,0,255,0.8)'
+      }),
+      stroke: new ol.style.Stroke({
+        color: 'rgb(0,0,255)',
+        width: 15
+      }),
+      radius: 120
+    })
+  })
+});
+
+// Create the map, the view is centered on the triangle. Zooming and panning is
+// restricted to a sane area
+var map = new ol.Map({
+  layers: [
+    redLayer,
+    greenLayer,
+    blueLayer
+  ],
+  target: 'map',
+  view: new ol.View({
+    center: [250, 220],
+    extent: [0, 0, 500, 500],
+    resolution: 4,
+    minResolution: 2,
+    maxResolution: 32
+  })
+});
+
+
+// Various helper methods and event handlers
+/**
+ * This method sets the globalCompositeOperation to the value of the select
+ * field and it is bound to the precompose event of the layers.
+ *
+ * @param {ol.render.Event} evt The render event.
+ */
+var setBlendModeFromSelect = function(evt) {
+  evt.context.globalCompositeOperation = select.value;
+};
+
+
+/**
+ * This method resets the globalCompositeOperation to the default value of
+ * 'source-over' and it is bound to the postcompose event of the layers.
+ *
+ * @param {ol.render.Event} evt The render event.
+ */
+var resetBlendModeFromSelect = function(evt) {
+  evt.context.globalCompositeOperation = 'source-over';
+};
+
+
+/**
+ * Bind the pre- and postcompose handlers to the passed layer.
+ *
+ * @param {ol.layer.Vector} layer The layer to bind the handlers to.
+ */
+var bindLayerListeners = function(layer) {
+  layer.on('precompose', setBlendModeFromSelect);
+  layer.on('postcompose', resetBlendModeFromSelect);
+};
+
+
+/**
+ * Unind the pre- and postcompose handlers to the passed layers.
+ *
+ * @param {ol.layer.Vector} layer The layer to unbind the handlers from.
+ */
+var unbindLayerListeners = function(layer) {
+  layer.un('precompose', setBlendModeFromSelect);
+  layer.un('postcompose', resetBlendModeFromSelect);
+};
+
+
+/**
+ * Handler for the click event of the 'affect-XXX' checkboxes.
+ *
+ * @this {HTMLInputElement}
+ */
+var affectLayerClicked = function() {
+  var layer;
+  if (this.id == 'affect-red') {
+    layer = redLayer;
+  } else if (this.id == 'affect-green') {
+    layer = greenLayer;
+  } else {
+    layer = blueLayer;
+  }
+  if (this.checked) {
+    bindLayerListeners(layer);
+  } else {
+    unbindLayerListeners(layer);
+  }
+  map.render();
+};
+
+
+// Get the form elements and bind the listeners
+var select = document.getElementById('blend-mode');
+var affectRed = document.getElementById('affect-red');
+var affectGreen = document.getElementById('affect-green');
+var affectBlue = document.getElementById('affect-blue');
+
+// Rerender map when blend mode changes
+select.addEventListener('change', function() {
+  map.render();
+});
+
+// Unbind / bind listeners depending on the checked state when the checkboxes
+// are clicked
+affectRed.addEventListener('click', affectLayerClicked);
+affectGreen.addEventListener('click', affectLayerClicked);
+affectBlue.addEventListener('click', affectLayerClicked);
+
+// Initially bind listeners
+bindLayerListeners(redLayer);
+bindLayerListeners(greenLayer);
+bindLayerListeners(blueLayer);

examples/box-selection.css

@@ -0,0 +1,4 @@
+.ol-dragbox {
+  background-color: rgba(255,255,255,0.4);
+  border-color: rgba(100,150,0,1);
+}

examples/box-selection.html

@@ -1,59 +1,20 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Box selection example
-    <meta charset="utf-8">
+shortdesc: Using a DragBox interaction to select features.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  <p>This example shows how to use a <code>DragBox</code> interaction to select features. Selected features are added
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+  to the feature overlay of a select interaction (<code>ol.interaction.Select</code>) for highlighting.</p>
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+  <p>Use <code>Ctrl+drag</code> (<code>Meta+drag</code> on Mac) to draw boxes.</p>
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+tags: "DragBox, feature, selection, box"
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+---
-    <title>Box selection example</title>
+<div class="row-fluid">
-  </head>
+  <div class="span12">
-  <body>
+    <div id="map" class="map"></div>
-
+  </div>
-    <div class="navbar navbar-inverse navbar-fixed-top">
+  <div class="span4 offset4 pull-right">
-      <div class="navbar-inner">
+    <div id="info" class="alert alert-success">
-        <div class="container">
+      &nbsp;
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
-        </div>
-      </div>
     </div>
-
+  </div>
-    <div class="container-fluid">
+</div>
-
-      <div class="row-fluid">
-        <div class="span12">
-          <div id="map" class="map"></div>
-        </div>
-      </div>
-
-      <div class="row-fluid">
-
-        <div class="span4">
-          <h4 id="title">Box selection example</h4>
-          <p id="shortdesc">Using a DragBox interaction to select features.</p>
-          <div id="docs">
-            <p>This example shows how to use a <code>DragBox</code> interaction to select features. Selected features are added
-            to the feature overlay of a select interaction (<code>ol.interaction.Select</code>) for highlighting.</p>
-            <p>Use <code>SHIFT+drag</code> to draw boxes.</p>
-            <p>See the <a href="box-selection.js" target="_blank">box-selection.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">DragBox, feature, selection, box</div>
-        </div>
-        <div class="span4 offset4">
-          <div id="info" class="alert alert-success">
-            &nbsp;
-          </div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=box-selection" type="text/javascript"></script>
-
-  </body>
-</html>

examples/box-selection.js

@@ -1,19 +1,18 @@
 goog.require('ol.Map');
 goog.require('ol.View');
 goog.require('ol.events.condition');
+goog.require('ol.format.GeoJSON');
 goog.require('ol.interaction.DragBox');
 goog.require('ol.interaction.Select');
 goog.require('ol.layer.Tile');
 goog.require('ol.layer.Vector');
-goog.require('ol.source.GeoJSON');
 goog.require('ol.source.OSM');
-goog.require('ol.style.Stroke');
+goog.require('ol.source.Vector');
-goog.require('ol.style.Style');
 
 
-var vectorSource = new ol.source.GeoJSON({
+var vectorSource = new ol.source.Vector({
-  projection: 'EPSG:3857',
+  url: 'data/geojson/countries.geojson',
-  url: 'data/geojson/countries.geojson'
+  format: new ol.format.GeoJSON()
 });
 
 
@@ -42,12 +41,7 @@ var selectedFeatures = select.getFeatures();
 
 // a DragBox interaction used to select features by drawing boxes
 var dragBox = new ol.interaction.DragBox({
-  condition: ol.events.condition.shiftKeyOnly,
+  condition: ol.events.condition.platformModifierKeyOnly
-  style: new ol.style.Style({
-    stroke: new ol.style.Stroke({
-      color: [0, 0, 255, 1]
-    })
-  })
 });
 
 map.addInteraction(dragBox);

examples/brightness-contrast.html

@@ -1,74 +0,0 @@
-<!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>Brightness/contrast example</title>
-    <style>
-      #reset-brightness {
-        min-width: 138px;
-      }
-      #reset-contrast {
-        min-width: 120px;
-      }
-    </style>
-  </head>
-  <body>
-
-    <div class="navbar navbar-inverse navbar-fixed-top">
-      <div class="navbar-inner">
-        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
-        </div>
-      </div>
-    </div>
-
-    <div class="container-fluid">
-
-      <div class="row-fluid">
-        <div class="span12">
-          <div id="map" class="map"></div>
-
-          <div id="no-webgl" class="alert alert-error" style="display: none">
-            This example requires a browser that supports <a href="http://get.webgl.org/">WebGL</a>.
-          </div>
-
-          <div class="btn-group">
-            <button id="increase-brightness"><i class="icon-plus"></i></button>
-            <button id="reset-brightness">Brightness</button>
-            <button id="decrease-brightness"><i class="icon-minus"></i></button>
-          </div>
-          <div class="btn-group">
-            <button id="increase-contrast"><i class="icon-plus"></i></button>
-            <button id="reset-contrast">Contrast</button>
-            <button id="decrease-contrast"><i class="icon-minus"></i></button>
-          </div>
-        </div>
-      </div>
-
-      <div class="row-fluid">
-
-        <div class="span12">
-          <h4 id="title">Brightness/contrast example</h4>
-          <p id="shortdesc">Example of brightness/contrast control on the client (WebGL only).</p>
-          <div id="docs">
-            <p>See the <a href="brightness-contrast.js" target="_blank">brightness-contrast.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">brightness, contrast, webgl</div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=brightness-contrast" type="text/javascript"></script>
-
-  </body>
-</html>

examples/brightness-contrast.js

@@ -1,75 +0,0 @@
-goog.require('ol.Map');
-goog.require('ol.View');
-goog.require('ol.has');
-goog.require('ol.layer.Tile');
-goog.require('ol.source.MapQuest');
-
-
-function setResetBrightnessButtonHTML() {
-  resetBrightness.innerHTML = 'Brightness (' +
-      layer.getBrightness().toFixed(3) + ')';
-}
-
-function setResetContrastButtonHTML() {
-  resetContrast.innerHTML = 'Contrast (' + layer.getContrast().toFixed(3) + ')';
-}
-
-if (!ol.has.WEBGL) {
-  var info = document.getElementById('no-webgl');
-  /**
-   * display error message
-   */
-  info.style.display = '';
-} else {
-  var layer = new ol.layer.Tile({
-    source: new ol.source.MapQuest({layer: 'sat'})
-  });
-
-  var map = new ol.Map({
-    layers: [layer],
-    renderer: 'webgl',
-    target: 'map',
-    view: new ol.View({
-      center: [0, 0],
-      zoom: 2
-    })
-  });
-
-  var increaseBrightness = document.getElementById('increase-brightness');
-  var resetBrightness = document.getElementById('reset-brightness');
-  var decreaseBrightness = document.getElementById('decrease-brightness');
-
-  setResetBrightnessButtonHTML();
-
-  increaseBrightness.addEventListener('click', function() {
-    layer.setBrightness(Math.min(layer.getBrightness() + 0.125, 1));
-    setResetBrightnessButtonHTML();
-  }, false);
-  resetBrightness.addEventListener('click', function() {
-    layer.setBrightness(0);
-    setResetBrightnessButtonHTML();
-  }, false);
-  decreaseBrightness.addEventListener('click', function() {
-    layer.setBrightness(Math.max(layer.getBrightness() - 0.125, -1));
-    setResetBrightnessButtonHTML();
-  }, false);
-
-  var increaseContrast = document.getElementById('increase-contrast');
-  var resetContrast = document.getElementById('reset-contrast');
-  var decreaseContrast = document.getElementById('decrease-contrast');
-
-  setResetContrastButtonHTML();
-
-  increaseContrast.addEventListener('click', function() {
-    layer.setContrast(layer.getContrast() + 0.125);
-    setResetContrastButtonHTML();
-  }, false);
-  resetContrast.addEventListener('click', function() {
-    layer.setContrast(1);
-    setResetContrastButtonHTML();
-  }, false);
-  decreaseContrast.addEventListener('click', function() {
-    layer.setContrast(Math.max(layer.getContrast() - 0.125, 0));
-    setResetContrastButtonHTML();
-  }, false);
-}

examples/button-title.css

@@ -0,0 +1,4 @@
+.tooltip-inner {
+  white-space: nowrap;
+}
+

examples/button-title.html

@@ -1,62 +1,13 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Custom tooltips example
-    <meta charset="utf-8">
+shortdesc: This example shows how to customize the buttons tooltips with Bootstrap.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  This example shows how to customize the buttons tooltips with <a href="http://getbootstrap.com/javascript/#tooltips">Bootstrap</a>.
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+tags: "custom, tooltip"
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+---
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+<div class="row-fluid">
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+  <div class="span12">
-    <style type="text/css">
+    <div id="map" class="map"></div>
-      .tooltip-inner {
+  </div>
-        white-space: nowrap;
+</div>
-      }
-    </style>
-    <title>ol3 custom tooltips example</title>
-  </head>
-  <body>
-
-    <div class="navbar navbar-inverse navbar-fixed-top">
-      <div class="navbar-inner">
-        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
-        </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">Custom tooltips</h4>
-          <p id="shortdesc">
-            This example shows how to customize the buttons tooltips with
-            <a href="http://getbootstrap.com/javascript/#tooltips">Bootstrap</a>.
-          </p>
-          <div id="docs">
-            <p>
-              See the <a href="button-title.js" target="_blank">button-title.js source</a> to see how this is done.
-            </p>
-          </div>
-          <div id="tags">
-            custom, tooltip
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=button-title" type="text/javascript"></script>
-
-  </body>
-
-</html>

examples/button-title.js

@@ -9,7 +9,7 @@ var map = new ol.Map({
       source: new ol.source.OSM()
     })
   ],
-  renderer: exampleNS.getRendererFromQueryString(),
+  renderer: common.getRendererFromQueryString(),
   target: 'map',
   view: new ol.View({
     center: [-8730000, 5930000],

examples/canvas-tiles.html

@@ -1,52 +1,17 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Canvas tiles example
-    <meta charset="utf-8">
+shortdesc: Renders tiles with coordinates for debugging.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  The black grid tiles are generated on the client with an HTML5 canvas. The
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+  displayed tile coordinates are OpenLayers tile coordinates. These increase
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+  from bottom to top, but standard XYZ tiling scheme coordinates increase from
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+  top to bottom. To calculate the `y` for a standard XYZ tile coordinate, use
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+  `-y - 1`. 
-    <title>Canvas tiles example</title>
+tags: "layers, openstreetmap, canvas"
-  </head>
+---
-  <body>
+<div class="row-fluid">
-
+  <div class="span12">
-    <div class="navbar navbar-inverse navbar-fixed-top">
+    <div id="map" class="map"></div>
-      <div class="navbar-inner">
+  </div>
-        <div class="container">
+</div>
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
-        </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">Canvas tiles example</h4>
-          <p id="shortdesc">Renders tiles with coordinates for debugging.</p>
-          <div id="docs">
-            <p>The black grid tiles are generated on the client with an HTML5 canvas. Note that the tile coordinates are ol3 normalized tile coordinates (origin bottom left), not OSM tile coordinates (origin top left).</p>
-            <p>See the <a href="canvas-tiles.js" target="_blank">canvas-tiles.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">layers, openstreetmap, canvas</div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=canvas-tiles" type="text/javascript"></script>
-
-  </body>
-</html>

examples/canvas-tiles.js

@@ -5,24 +5,22 @@ goog.require('ol.layer.Tile');
 goog.require('ol.proj');
 goog.require('ol.source.OSM');
 goog.require('ol.source.TileDebug');
-goog.require('ol.tilegrid.XYZ');
 
 
+var osmSource = new ol.source.OSM();
 var map = new ol.Map({
   layers: [
     new ol.layer.Tile({
-      source: new ol.source.OSM()
+      source: osmSource
     }),
     new ol.layer.Tile({
       source: new ol.source.TileDebug({
         projection: 'EPSG:3857',
-        tileGrid: new ol.tilegrid.XYZ({
+        tileGrid: osmSource.getTileGrid()
-          maxZoom: 22
-        })
       })
     })
   ],
-  renderer: exampleNS.getRendererFromQueryString(),
+  renderer: common.getRendererFromQueryString(),
   target: 'map',
   controls: ol.control.defaults({
     attributionOptions: /** @type {olx.control.AttributionOptions} */ ({

examples/center.css

@@ -0,0 +1,56 @@
+.mapcontainer {
+  position: relative;
+  margin-bottom: 20px;
+}
+.map {
+  width: 1000px;
+  height: 600px;
+}
+div.ol-zoom {
+  top: 178px;
+  left: 158px;
+}
+div.ol-attribution {
+  bottom: 30px;
+  right: 50px;
+}
+.padding-top {
+  position: absolute;
+  top: 0;
+  left: 0px;
+  width: 1000px;
+  height: 170px;
+  background: rgba(255, 255, 255, 0.5);
+}
+.padding-left {
+  position: absolute;
+  top: 170px;
+  left: 0;
+  width: 150px;
+  height: 400px;
+  background: rgba(255, 255, 255, 0.5);
+}
+.padding-right {
+  position: absolute;
+  top: 170px;
+  left: 950px;
+  width: 50px;
+  height: 400px;
+  background: rgba(255, 255, 255, 0.5);
+}
+.padding-bottom {
+  position: absolute;
+  top: 570px;
+  left: 0px;
+  width: 1000px;
+  height: 30px;
+  background: rgba(255, 255, 255, 0.5);
+}
+.center {
+  position: absolute;
+  border: solid 1px black;
+  top: 490px;
+  left: 560px;
+  width: 20px;
+  height: 20px;
+}

examples/center.html

@@ -1,131 +1,34 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Advanced View Positioning example
-    <meta charset="utf-8">
+shortdesc: This example demonstrates how a map's view can be adjusted so a geometry or coordinate is positioned at a specific pixel location.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  This example demonstrates how a map's view can be
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+  adjusted so a geometry or coordinate is positioned at a specific
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+  pixel location. The map above has top, right, bottom, and left
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+  padding applied inside the viewport. The view's <code>fit</code> method
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+  is used to fit a geometry in the view with the same padding. The
-    <style>
+  view's <code>centerOn</code> method is used to position a coordinate (Lausanne)
-      .mapcontainer {
+  at a specific pixel location (the center of the black box).
-        position: relative;
+  <p>Use <code>Alt</code>+<code>Shift</code>+drag to rotate the map.</p>
-        margin-bottom: 20px;
+tags: "center, rotation, openstreetmap"
-      }
+---
-      .map {
+<div class="row-fluid">
-        width: 1000px;
+  <div class="span12 mapcontainer">
-        height: 600px;
+    <div id="map" class="map"></div>
-      }
+    <div class="padding-top"></div>
-      div.ol-zoom {
+    <div class="padding-left"></div>
-        top: 178px;
+    <div class="padding-right"></div>
-        left: 158px;
+    <div class="padding-bottom"></div>
-      }
+    <div class="center"></div>
-      div.ol-attribution {
+  </div>
-        bottom: 30px;
+</div>
-        right: 50px;
+<div class="row-fluid">
-      }
+  <div class="span12">
-      .padding-top {
+    <button id="zoomtoswitzerlandbest">Zoom to Switzerland</button> (best fit),<br/>
-        position: absolute;
+    <button id="zoomtoswitzerlandconstrained">Zoom to Switzerland</button> (respect resolution constraint).<br/>
-        top: 0;
+    <button id="zoomtoswitzerlandnearest">Zoom to Switzerland</button> (nearest),<br/>
-        left: 0px;
+    <button id="zoomtolausanne">Zoom to Lausanne</button> (with min resolution),<br/>
-        width: 1000px;
+    <button id="centerlausanne">Center on Lausanne</button>
-        height: 170px;
+  </div>
-        background: rgba(255, 255, 255, 0.5);
+</div>
-      }
-      .padding-left {
-        position: absolute;
-        top: 170px;
-        left: 0;
-        width: 150px;
-        height: 400px;
-        background: rgba(255, 255, 255, 0.5);
-      }
-      .padding-right {
-        position: absolute;
-        top: 170px;
-        left: 950px;
-        width: 50px;
-        height: 400px;
-        background: rgba(255, 255, 255, 0.5);
-      }
-      .padding-bottom {
-        position: absolute;
-        top: 570px;
-        left: 0px;
-        width: 1000px;
-        height: 30px;
-        background: rgba(255, 255, 255, 0.5);
-      }
-      .center {
-        position: absolute;
-        border: solid 1px black;
-        top: 490px;
-        left: 560px;
-        width: 20px;
-        height: 20px;
-      }
-    </style>
-    <title>Advanced View Positioning example</title>
-  </head>
-  <body>
-
-    <div class="navbar navbar-inverse navbar-fixed-top">
-      <div class="navbar-inner">
-        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png">OpenLayers 3 Examples</a>
-        </div>
-      </div>
-    </div>
-
-    <div class="container-fluid">
-
-      <div class="row-fluid">
-        <div class="span12 mapcontainer">
-          <div id="map" class="map"></div>
-          <div class="padding-top"></div>
-          <div class="padding-left"></div>
-          <div class="padding-right"></div>
-          <div class="padding-bottom"></div>
-          <div class="center"></div>
-        </div>
-      </div>
-
-      <div class="row-fluid">
-        <div class="span12">
-          <button id="zoomtoswitzerlandbest">Zoom to Switzerland</button> (best fit),<br/>
-          <button id="zoomtoswitzerlandconstrained">Zoom to Switzerland</button> (respect resolution constraint).<br/>
-          <button id="zoomtoswitzerlandnearest">Zoom to Switzerland</button> (nearest),<br/>
-          <button id="zoomtolausanne">Zoom to Lausanne</button> (with min resolution),<br/>
-          <button id="centerlausanne">Center on Lausanne</button>
-        </div>
-      </div>
-
-      <div class="row-fluid">
-
-        <div class="span12">
-          <h4 id="title">Advanced View Positioning example</h4>
-          <p id="shortdesc">This example demonstrates how a map's view can be
-            adjusted so a geometry or coordinate is positioned at a specific
-            pixel location. The map above has top, right, bottom, and left
-            padding applied inside the viewport. The view's <code>fitGeometry</code> method
-            is used to fit a geometry in the view with the same padding. The
-            view's <code>centerOn</code> method is used to position a coordinate (Lausanne)
-            at a specific pixel location (the center of the black box).</p>
-          <div id="docs">
-            <p>Use <code>Alt</code>+<code>Shift</code>+drag to rotate the map.</p>
-            <p>See the <a href="center.js" target="_blank">center.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">center, rotation, openstreetmap</div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="loader.js?id=center" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-
-  </body>
-</html>

examples/center.js

@@ -1,20 +1,21 @@
 goog.require('ol.Map');
 goog.require('ol.View');
 goog.require('ol.control');
+goog.require('ol.format.GeoJSON');
 goog.require('ol.geom.Point');
 goog.require('ol.geom.SimpleGeometry');
 goog.require('ol.layer.Tile');
 goog.require('ol.layer.Vector');
-goog.require('ol.source.GeoJSON');
 goog.require('ol.source.OSM');
+goog.require('ol.source.Vector');
 goog.require('ol.style.Circle');
 goog.require('ol.style.Fill');
 goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');
 
-var source = new ol.source.GeoJSON({
+var source = new ol.source.Vector({
-  projection: 'EPSG:3857',
+  url: 'data/geojson/switzerland.geojson',
-  url: 'data/geojson/switzerland.geojson'
+  format: new ol.format.GeoJSON()
 });
 var style = new ol.style.Style({
   fill: new ol.style.Fill({
@@ -64,7 +65,7 @@ zoomtoswitzerlandbest.addEventListener('click', function() {
   var feature = source.getFeatures()[0];
   var polygon = /** @type {ol.geom.SimpleGeometry} */ (feature.getGeometry());
   var size = /** @type {ol.Size} */ (map.getSize());
-  view.fitGeometry(
+  view.fit(
       polygon,
       size,
       {
@@ -80,7 +81,7 @@ zoomtoswitzerlandconstrained.addEventListener('click', function() {
   var feature = source.getFeatures()[0];
   var polygon = /** @type {ol.geom.SimpleGeometry} */ (feature.getGeometry());
   var size = /** @type {ol.Size} */ (map.getSize());
-  view.fitGeometry(
+  view.fit(
       polygon,
       size,
       {
@@ -95,7 +96,7 @@ zoomtoswitzerlandnearest.addEventListener('click', function() {
   var feature = source.getFeatures()[0];
   var polygon = /** @type {ol.geom.SimpleGeometry} */ (feature.getGeometry());
   var size = /** @type {ol.Size} */ (map.getSize());
-  view.fitGeometry(
+  view.fit(
       polygon,
       size,
       {
@@ -110,7 +111,7 @@ zoomtolausanne.addEventListener('click', function() {
   var feature = source.getFeatures()[1];
   var point = /** @type {ol.geom.SimpleGeometry} */ (feature.getGeometry());
   var size = /** @type {ol.Size} */ (map.getSize());
-  view.fitGeometry(
+  view.fit(
       point,
       size,
       {

examples/cluster.html

@@ -1,51 +1,13 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Clustering example
-    <meta charset="utf-8">
+shortdesc: Example of using <code>ol.source.Cluster</code>.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  This example shows how to do clustering on point features.
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+tags: "cluster, vector"
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+---
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+<div class="row-fluid">
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+  <div class="span12">
-    <title>Clustering example</title>
+    <div id="map" class="map"></div>
-  </head>
+  </div>
-  <body>
+</div>
-
-    <div class="navbar navbar-inverse navbar-fixed-top">
-      <div class="navbar-inner">
-        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
-        </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">Clustering example</h4>
-          <p id="shortdesc">Example of using <code>ol.Cluster</code>.</p>
-          <div id="docs">
-            <p>See the <a href="cluster.js" target="_blank">cluster.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">cluster vector</div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=cluster" type="text/javascript"></script>
-
-  </body>
-</html>

examples/color-manipulation.css

@@ -0,0 +1,5 @@
+table.controls td {
+  text-align: center;
+  padding: 2px 5px;
+  min-width: 60px;
+}

examples/color-manipulation.html

@@ -0,0 +1,30 @@
+---
+layout: example.html
+title: Manipulating colors with a raster source
+shortdesc: Demonstrates color manipulation with a raster source.
+docs: >
+  A raster source allows arbitrary manipulation of pixel values.  In this example, RGB values on the input tile source are adjusted in a pixel-wise operation before being rendered with a second raster source.  The raster operation takes pixels in in RGB space, converts them to HCL color space, adjusts the values based on the controls above, and then converts them back to RGB space for rendering.
+tags: "color, hue, lightness, chroma"
+---
+<div class="row-fluid">
+  <div class="span12">
+    <div id="map" class="map"></div>
+    <table class="controls">
+      <tr>
+        <td>hue</td>
+        <td><span id="hueOut"></span>°</td>
+        <td><input id="hue" type="range" min="-180" max="180" value="0"/></td>
+      </tr>
+      <tr>
+        <td>chroma</td>
+        <td><span id="chromaOut"></span> %</td>
+        <td><input id="chroma" type="range" min="0" max="100" value="100"/></td>
+      </tr>
+      <tr>
+        <td>lightness</td>
+        <td><span id="lightnessOut"></span> %</td>
+        <td><input id="lightness" type="range" min="0" max="100" value="100"/></td>
+      </tr>
+    </table>
+  </div>
+</div>

examples/color-manipulation.js

@@ -0,0 +1,173 @@
+// NOCOMPILE
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.layer.Image');
+goog.require('ol.source.Raster');
+goog.require('ol.source.Stamen');
+
+
+/**
+ * Color manipulation functions below are adapted from
+ * https://github.com/d3/d3-color.
+ */
+var Xn = 0.950470;
+var Yn = 1;
+var Zn = 1.088830;
+var t0 = 4 / 29;
+var t1 = 6 / 29;
+var t2 = 3 * t1 * t1;
+var t3 = t1 * t1 * t1;
+var twoPi = 2 * Math.PI;
+
+
+/**
+ * Convert an RGB pixel into an HCL pixel.
+ * @param {ol.raster.Pixel} pixel A pixel in RGB space.
+ * @return {ol.raster.Pixel} A pixel in HCL space.
+ */
+function rgb2hcl(pixel) {
+  var red = rgb2xyz(pixel[0]);
+  var green = rgb2xyz(pixel[1]);
+  var blue = rgb2xyz(pixel[2]);
+
+  var x = xyz2lab(
+      (0.4124564 * red + 0.3575761 * green + 0.1804375 * blue) / Xn);
+  var y = xyz2lab(
+      (0.2126729 * red + 0.7151522 * green + 0.0721750 * blue) / Yn);
+  var z = xyz2lab(
+      (0.0193339 * red + 0.1191920 * green + 0.9503041 * blue) / Zn);
+
+  var l = 116 * y - 16;
+  var a = 500 * (x - y);
+  var b = 200 * (y - z);
+
+  var c = Math.sqrt(a * a + b * b);
+  var h = Math.atan2(b, a);
+  if (h < 0) {
+    h += twoPi;
+  }
+
+  pixel[0] = h;
+  pixel[1] = c;
+  pixel[2] = l;
+
+  return pixel;
+}
+
+
+/**
+ * Convert an HCL pixel into an RGB pixel.
+ * @param {ol.raster.Pixel} pixel A pixel in HCL space.
+ * @return {ol.raster.Pixel} A pixel in RGB space.
+ */
+function hcl2rgb(pixel) {
+  var h = pixel[0];
+  var c = pixel[1];
+  var l = pixel[2];
+
+  var a = Math.cos(h) * c;
+  var b = Math.sin(h) * c;
+
+  var y = (l + 16) / 116;
+  var x = isNaN(a) ? y : y + a / 500;
+  var z = isNaN(b) ? y : y - b / 200;
+
+  y = Yn * lab2xyz(y);
+  x = Xn * lab2xyz(x);
+  z = Zn * lab2xyz(z);
+
+  pixel[0] = xyz2rgb(3.2404542 * x - 1.5371385 * y - 0.4985314 * z);
+  pixel[1] = xyz2rgb(-0.9692660 * x + 1.8760108 * y + 0.0415560 * z);
+  pixel[2] = xyz2rgb(0.0556434 * x - 0.2040259 * y + 1.0572252 * z);
+
+  return pixel;
+}
+
+function xyz2lab(t) {
+  return t > t3 ? Math.pow(t, 1 / 3) : t / t2 + t0;
+}
+
+function lab2xyz(t) {
+  return t > t1 ? t * t * t : t2 * (t - t0);
+}
+
+function rgb2xyz(x) {
+  return (x /= 255) <= 0.04045 ? x / 12.92 : Math.pow((x + 0.055) / 1.055, 2.4);
+}
+
+function xyz2rgb(x) {
+  return 255 * (x <= 0.0031308 ?
+      12.92 * x : 1.055 * Math.pow(x, 1 / 2.4) - 0.055);
+}
+
+var raster = new ol.source.Raster({
+  sources: [new ol.source.Stamen({
+    layer: 'watercolor'
+  })],
+  operation: function(pixels, data) {
+    var hcl = rgb2hcl(pixels[0]);
+
+    var h = hcl[0] + Math.PI * data.hue / 180;
+    if (h < 0) {
+      h += twoPi;
+    } else if (h > twoPi) {
+      h -= twoPi;
+    }
+    hcl[0] = h;
+
+    hcl[1] *= (data.chroma / 100);
+    hcl[2] *= (data.lightness / 100);
+
+    return hcl2rgb(hcl);
+  },
+  lib: {
+    rgb2hcl: rgb2hcl,
+    hcl2rgb: hcl2rgb,
+    rgb2xyz: rgb2xyz,
+    lab2xyz: lab2xyz,
+    xyz2lab: xyz2lab,
+    xyz2rgb: xyz2rgb,
+    Xn: Xn,
+    Yn: Yn,
+    Zn: Zn,
+    t0: t0,
+    t1: t1,
+    t2: t2,
+    t3: t3,
+    twoPi: twoPi
+  }
+});
+
+raster.on('beforeoperations', function(event) {
+  var data = event.data;
+  for (var id in controls) {
+    data[id] = Number(controls[id].value);
+  }
+});
+
+var map = new ol.Map({
+  layers: [
+    new ol.layer.Image({
+      source: raster
+    })
+  ],
+  target: 'map',
+  view: new ol.View({
+    center: [0, 2500000],
+    zoom: 2,
+    maxZoom: 18
+  })
+});
+
+var controlIds = ['hue', 'chroma', 'lightness'];
+var controls = {};
+controlIds.forEach(function(id) {
+  var control = document.getElementById(id);
+  var output = document.getElementById(id + 'Out');
+  control.addEventListener('input', function() {
+    output.innerText = control.value;
+    raster.changed();
+  });
+  output.innerText = control.value;
+  controls[id] = control;
+});

examples/custom-controls.css

@@ -0,0 +1,7 @@
+.rotate-north {
+  top: 65px;
+  left: .5em;
+}
+.ol-touch .rotate-north {
+  top: 80px;
+}

examples/custom-controls.html

@@ -1,64 +1,13 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: Custom control example
-    <meta charset="utf-8">
+shortdesc: Shows how to create custom controls.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  This example creates a "rotate to north" button.
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+tags: "custom, control"
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+---
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+<div class="row-fluid">
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+  <div class="span12">
-    <style type="text/css">
+    <div id="map" class="map"></div>
-      .rotate-north {
+  </div>
-        top: 65px;
+</div>
-        left: .5em;
-      }
-      .ol-touch .rotate-north {
-        top: 80px;
-      }
-    </style>
-    <title>ol3 custom controls example</title>
-  </head>
-  <body>
-
-    <div class="navbar navbar-inverse navbar-fixed-top">
-      <div class="navbar-inner">
-        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
-        </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">Custom controls</h4>
-          <p id="shortdesc">This example shows how to create custom controls.</p>
-          <div id="docs">
-            <p>
-              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.
-            </p>
-          </div>
-          <div id="tags">
-            custom, control
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=custom-controls" type="text/javascript"></script>
-
-  </body>
-
-</html>

examples/custom-controls.js

@@ -71,7 +71,7 @@ var map = new ol.Map({
       source: new ol.source.OSM()
     })
   ],
-  renderer: exampleNS.getRendererFromQueryString(),
+  renderer: common.getRendererFromQueryString(),
   target: 'map',
   view: new ol.View({
     center: [0, 0],

examples/custom-interactions.html

@@ -0,0 +1,14 @@
+---
+layout: example.html
+title: Custom interaction example
+shortdesc: Example of a custom interaction.
+docs: >
+  This example demonstrates creating a custom interaction by subclassing `ol.interaction.Pointer`.
+  Note that the built in interaction `ol.interaction.Translate` might be a better option for moving features.
+tags: "drag, feature, vector, editing, custom, interaction"
+---
+<div class="row-fluid">
+  <div class="span12">
+    <div id="map" class="map"></div>
+  </div>
+</div>

examples/d3.html

@@ -1,54 +1,16 @@
-<!doctype html>
+---
-<html lang="en">
+layout: example.html
-  <head>
+title: d3 integration example
-    <meta charset="utf-8">
+shortdesc: Example of using ol3 and d3 together.
-    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+docs: >
-    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+  <p>The example loads TopoJSON geometries and uses d3 (<code>d3.geo.path</code>) to render these geometries to a canvas element that is then used as the image of an ol3 image layer.</p>
-    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+tags: "d3"
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+resources:
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+  - http://d3js.org/d3.v3.min.js
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+  - http://d3js.org/topojson.v1.min.js
-    <title>d3 integration example</title>
+---
-  </head>
+<div class="row-fluid">
-  <body>
+  <div class="span12">
-
+    <div id="map" class="map"></div>
-    <div class="navbar navbar-inverse navbar-fixed-top">
+  </div>
-      <div class="navbar-inner">
+</div>
-        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
-        </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">d3 integration example</h4>
-          <p id="shortdesc">Example of using ol3 and d3 together.</p>
-          <div id="docs">
-            <p>The example loads TopoJSON geometries and uses d3 (<code>d3.geo.path</code>) to render these geometries to a canvas element that is then used as the image of an ol3 image layer.</p>
-            <p>See the <a href="d3.js" target="_blank">d3.js source</a> to see how this is done.</p>
-          </div>
-          <div id="tags">d3</div>
-        </div>
-
-      </div>
-
-    </div>
-
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="http://d3js.org/d3.v3.min.js"></script>
-    <script src="http://d3js.org/topojson.v1.min.js"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
-    <script src="loader.js?id=d3" type="text/javascript"></script>
-
-  </body>
-</html>

examples/d3.js

@@ -21,7 +21,7 @@ var map = new ol.Map({
   ],
   target: 'map',
   view: new ol.View({
-    center: ol.proj.transform([-97, 38], 'EPSG:4326', 'EPSG:3857'),
+    center: ol.proj.fromLonLat([-97, 38]),
     zoom: 4
   })
 });