From 0d2b833e06e93dc2c34496d8bfd0a0b00179972c Mon Sep 17 00:00:00 2001
From: Andreas Hocevar <andreas.hocevar@gmail.com>
Date: Thu, 12 May 2016 16:16:06 +0200
Subject: [PATCH] Use a div instead of alert for version warning

With this change, it is also no longer necessary to display the version in the
navigation bar. The accidently removed doctype is also brought back.
---
 .../jsdoc/api/template/static/scripts/main.js | 43 +++++++++++--------
 .../api/template/static/styles/jaguar.css     |  5 ++-
 config/jsdoc/api/template/tmpl/layout.tmpl    | 11 ++++-
 .../jsdoc/api/template/tmpl/navigation.tmpl   |  1 -
 4 files changed, 40 insertions(+), 20 deletions(-)

diff --git a/config/jsdoc/api/template/static/scripts/main.js b/config/jsdoc/api/template/static/scripts/main.js
index 235266ba20..16dc04f9fe 100644
--- a/config/jsdoc/api/template/static/scripts/main.js
+++ b/config/jsdoc/api/template/static/scripts/main.js
@@ -53,30 +53,39 @@ $(function () {
     $(window).on('resize', _onResize);
     _onResize();
 
+    var currentVersion = document.getElementById('package-version').innerHTML;
+
     // warn about outdated version
-    var srcLinks = $('div.tag-source');
-    var location = window.location.href;
-    var branchSearch = location.match(/\/([^\/]*)\/apidoc\//);
-    if (branchSearch && branchSearch.length) {
-      var branch = branchSearch[1];
-      if (branch !== 'latest') {
-        if (/^v[0-9\.]*$/.test(branch)) {
-          var ok = confirm('You are viewing outdated docs. Do you want to try the latest?');
-          if (ok) {
-            window.location.href = location.replace(branchSearch[0], '/latest/apidoc/');
-          }
-        } else {
-          $('.package-version').text(branch);
+    var packageUrl = 'https://raw.githubusercontent.com/openlayers/openlayers.github.io/build/package.json';
+    fetch(packageUrl).then(function(response) {
+      return response.json();
+    }).then(function(json) {
+      var latestVersion = json.version;
+      document.getElementById('latest-version').innerHTML = latestVersion;
+      var url = window.location.href;
+      var branchSearch = url.match(/\/([^\/]*)\/apidoc\//);
+      var cookieText = 'dismissed=-' + latestVersion + '-';
+      var dismissed = document.cookie.indexOf(cookieText) != -1;
+      if (!dismissed && /^v[0-9\.]*$/.test(branchSearch[1]) && currentVersion != latestVersion) {
+        var link = url.replace(branchSearch[0], '/latest/apidoc/');
+        fetch(link, {method: 'head'}).then(function(response) {
+          var a = document.getElementById('latest-link');
+          a.href = response.status == 200 ? link : '../../latest/apidoc/';
+        });
+        var latestCheck = document.getElementById('latest-check');
+        latestCheck.style.display = '';
+        document.getElementById('latest-dismiss').onclick = function() {
+          latestCheck.style.display = 'none';
+          document.cookie = cookieText;
         }
       }
-    }
+    });
 
     // create source code links to github
-    var version = $('.package-version');
-    var branch = version.text();
+    var srcLinks = $('div.tag-source');
     srcLinks.each(function(i, el) {
       var textParts = el.innerHTML.trim().split(', ');
-      var link = 'https://github.com/openlayers/ol3/blob/' + branch + '/' +
+      var link = 'https://github.com/openlayers/ol3/blob/' + currentVersion + '/' +
           textParts[0];
       el.innerHTML = '<a href="' + link + '">' + textParts[0] + '</a>, ' +
           '<a href="' + link + textParts[1].replace('line ', '#l') + '">' +
diff --git a/config/jsdoc/api/template/static/styles/jaguar.css b/config/jsdoc/api/template/static/styles/jaguar.css
index fa2e7df197..073d9c46d2 100644
--- a/config/jsdoc/api/template/static/styles/jaguar.css
+++ b/config/jsdoc/api/template/static/styles/jaguar.css
@@ -132,7 +132,6 @@ li {
   display: block;
   font-size: 0.85em;
 }
-.navigation h4,
 .navigation li.item .title a {
   color: #e1e1e1;
 }
@@ -417,3 +416,7 @@ footer {
   left: 250px;
   font-weight: normal;
 }
+#latest-check {
+  margin-top: -10px;
+  margin-bottom: 10px;
+}
diff --git a/config/jsdoc/api/template/tmpl/layout.tmpl b/config/jsdoc/api/template/tmpl/layout.tmpl
index 1d108d413f..9327ba8554 100644
--- a/config/jsdoc/api/template/tmpl/layout.tmpl
+++ b/config/jsdoc/api/template/tmpl/layout.tmpl
@@ -1,7 +1,12 @@
+<?js
+var version = obj.packageInfo.version;
+?>
+<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="utf-8">
-    <title>OpenLayers 3 API Reference - <?js= title ?></title>
+    <title>OpenLayers v<?js= version ?> API - <?js= title ?></title>
+    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=fetch"></script>
     <script src="scripts/prettify/prettify.js"> </script>
     <script src="scripts/prettify/lang-css.js"> </script>
     <script src="scripts/jquery.min.js"> </script>
@@ -35,6 +40,10 @@
     <?js= this.partial('navigation.tmpl', this) ?>
     <div class="main">
         <h1 class="page-title" data-filename="<?js= filename ?>"><?js= title ?></h1>
+        <div id="latest-check" class="alert alert-warning alert-dismissible" role="alert" style="display:none">
+          <button id="latest-dismiss" type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+          This documentation is for OpenLayers v<span id="package-version"><?js= version ?></span>. The <a id="latest-link" href="#" class="alert-link">latest</a> is v<span id="latest-version"></span>.
+        </div>
         <?js= content ?>
     </div>
 </div>
diff --git a/config/jsdoc/api/template/tmpl/navigation.tmpl b/config/jsdoc/api/template/tmpl/navigation.tmpl
index 6972914432..e5fb726d14 100644
--- a/config/jsdoc/api/template/tmpl/navigation.tmpl
+++ b/config/jsdoc/api/template/tmpl/navigation.tmpl
@@ -3,7 +3,6 @@ var self = this;
 ?>
 <div class="navigation">
     <div class="search">
-        <h4 class='package-version'>v<?js= self.version ?></h4>
         <input id="search" type="text" class="form-control input-sm" placeholder="Search Documentation">
     </div>
     <ul class="list">