diff --git a/config/examples/example.html b/config/examples/example.html
index eea96c02b4..fa52d8e50d 100644
--- a/config/examples/example.html
+++ b/config/examples/example.html
@@ -33,6 +33,7 @@
{{ shortdesc }}
{{ md docs }}
{{ tags }}
+ Related API documentation: {{{ js.apiHtml }}}
diff --git a/examples/resources/layout.css b/examples/resources/layout.css
index a0daef1002..066bcc5021 100644
--- a/examples/resources/layout.css
+++ b/examples/resources/layout.css
@@ -18,6 +18,9 @@ body {
#tags, #shortdesc, .hidden {
display: none;
}
+#api-links ul {
+ display: inline;
+}
body, h1, h2, h3, h4, p, li, td, th {
font-family: Quattrocento Sans;
diff --git a/tasks/build-examples.js b/tasks/build-examples.js
index 212b8c04e3..b8bb463166 100644
--- a/tasks/build-examples.js
+++ b/tasks/build-examples.js
@@ -8,6 +8,7 @@ var pkg = require('../package.json');
var markupRegEx = /([^\/^\.]*)\.html$/;
var cleanupJSRegEx = /.*(goog\.require(.*);|.*renderer: common\..*,?)[\n]*/g;
+var googRequiresRegEx = /.*goog\.require\('(ol\.\S*)'\);/g;
var isCssRegEx = /\.css$/;
var isJsRegEx = /\.js$/;
@@ -15,6 +16,41 @@ var srcDir = path.join(__dirname, '..', 'examples');
var destDir = path.join(__dirname, '..', 'build', 'examples');
var templatesDir = path.join(__dirname, '..', 'config', 'examples');
+/**
+ * Returns an array of classes that are explicitly required inside the source
+ * by calling 'goog.require(…)'
+ *
+ * @param {string} src The JavaScript sourcecode to search for goog.require.
+ * @returns {Array.} An array of ol-classes that the source requires.
+ */
+function getGoogRequires(src) {
+ var googRequires = [];
+ var match = googRequiresRegEx.exec(src);
+ while (match) {
+ googRequires.push(match[1]);
+ match = googRequiresRegEx.exec(src);
+ }
+ return googRequires;
+}
+
+/**
+ * Takes an array of the names of required OpenLayers symbols and returns an
+ * HTML-snippet with an unordered list to the API-docs for the particular
+ * classes.
+ *
+ * @param {Array.} googRequires An array of ol-classes that the source
+ * requires.
+ * @returns {string} The HTML-snippet with the list of links to API-docs.
+ */
+function getLinkToApiHtml(googRequires) {
+ var lis = googRequires.map(function(symb) {
+ var href = '../apidoc/' + symb + '.html';
+ return '' + symb + '';
+ });
+ return '';
+}
+
/**
* A Metalsmith plugin that adds metadata to the example HTML files. For each
* example HTML file, this adds metadata for related js and css resources. When
@@ -46,10 +82,11 @@ function augmentExamples(files, metalsmith, done) {
if (!(jsFilename in files)) {
throw new Error('No .js file found for ' + filename);
}
+ var jsSource = files[jsFilename].contents.toString();
file.js = {
tag: '',
- source: files[jsFilename].contents.toString().replace(
- cleanupJSRegEx, '')
+ source: jsSource.replace(cleanupJSRegEx, ''),
+ apiHtml: getLinkToApiHtml(getGoogRequires(jsSource))
};
// add css tag and source