Add changelog page

Author: mistic100

_config.yml

@@ -1,3 +1,5 @@
+# username/repository
+id: mistic100/jQuery-QueryBuilder
 # name of the software
 name: jQuery QueryBuilder
 # current version of the software

_includes/navbar.html

@@ -10,6 +10,10 @@
   <a href="{{site.github.url}}/api">API</a>
 </li>
 
+<li>
+  <a href="{{site.github.url}}/changelog.html">Changelog</a>
+</li>
+
 <li class="dropdown">
   <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">Advanced <span class="caret"></span></a>
   <ul class="dropdown-menu">

_layouts/default.html

@@ -191,7 +191,7 @@ <h1>{{page.title}}</h1>
   =========================================== -->
   {% if site.header.trianglify %}
   <script src="https://cdnjs.cloudflare.com/ajax/libs/trianglify/1.0.1/trianglify.min.js"></script>
-  <script>trianglify('{{site.header.color1}}', '{{site.header.color2}}', '{{site.name}}');</script>
+  <script>jekyllBootstrapDoc.trianglify('{{site.header.color1}}', '{{site.header.color2}}', '{{site.name}}');</script>
   {% endif %}
 
   {% if site.twitter.enabled or site.twitter.account %}

assets/css/style.css

@@ -57,3 +57,16 @@ h4:hover .anchor-link,
 h5:hover .anchor-link {
   opacity: 1;
 }
+
+#releases h1 {
+  font-size: 28px;
+}
+
+#releases h1 small {
+  padding-left: 1em;
+}
+
+#releases h1 a.release-date {
+  float: right;
+  font-size: 18px;
+}

assets/js/script.js

@@ -1,59 +1,72 @@
-$(function() {
-  // build side menu
-  var html = '';
-
-  $('.bs-docs-section').each(function() {
-    var h1 = $(this).find('h1[id]').first(),
-      h23 = $(this).find('h2[id], h3[id]:not([data-no-menu])');
-
-    if (h1.length) {
-      html += '<li><a href="#' + h1[0].id + '">' + h1.clone().children().remove().end().text() + '</a>';
-
-      if (h23.length) {
-        html += '<ul class="nav">';
-        h23.each(function() {
-          html += '<li><a href="#' + this.id + '">' + $(this).clone().children().remove().end().text() + '</a></li>';
-        });
-        html += '</ul>';
+var jekyllBootstrapDoc = {
+  buildSideMenu: function() {
+    var html = '';
+
+    $('.bs-docs-section').each(function() {
+      var h1 = $(this).find('h1[id]').first(),
+        h23 = $(this).find('h2[id], h3[id]:not([data-no-menu])');
+
+      if (h1.length) {
+        html += '<li><a href="#' + h1[0].id + '">' + h1.clone().children().remove().end().text() + '</a>';
+
+        if (h23.length) {
+          html += '<ul class="nav">';
+          h23.each(function() {
+            html += '<li><a href="#' + this.id + '">' + $(this).clone().children().remove().end().text() + '</a></li>';
+          });
+          html += '</ul>';
+        }
+
+        html += '</li>';
       }
+    });
 
-      html += '</li>';
+    if (html == '') {
+      $('[role=complementary]').hide();
+      $('[role=main]').removeClass('col-md-9').addClass('col-md-12');
+    }
+    else {
+      $('[role=complementary]').show();
+      $('[role=main]').removeClass('col-md-12').addClass('col-md-9');
+      $('.bs-docs-sidenav').html(html);
     }
-  });
+  },
 
-  if (html == '') {
-    $('[role=complementary]').hide();
-    $('[role=main]').toggleClass('col-md-9 col-md-12');
-  }
-  else {
-    $('.bs-docs-sidenav').html(html);
-  }
+  addHeadingAnchors: function() {
+    $('h1[id], h2[id], h3[id], h4[id], h5[id]').each(function() {
+      if ($(this).children('.anchor-link').length === 0) {
+        $(this).prepend('<a href="#' + this.id + '" class="anchor-link">§</i>');
+      }
+    });
+  },
 
-  // add heading anchors
-  $('h1[id], h2[id], h3[id], h4[id], h5[id]').each(function() {
-    $(this).prepend('<a href="#' + this.id + '" class="anchor-link">§</i>');
-  });
-
-  // enable bootbox
-  $('[data-bootbox]').on('click', function() {
-    var $target = $('#' + $(this).data('bootbox'));
-    bootbox.alert({
-      title: $target.attr('title'),
-      message: $target.html(),
-      size: $(this).data('bootbox-size')
+  enableBootbox: function() {
+    $('[data-bootbox]').off('click').on('click', function() {
+      var $target = $('#' + $(this).data('bootbox'));
+      bootbox.alert({
+        title: $target.attr('title'),
+        message: $target.html(),
+        size: $(this).data('bootbox-size')
+      });
+    });
+  },
+
+  trianglify: function(color1, color2, seed) {
+    var header = $('#content');
+    var pattern = Trianglify({
+      width: window.screen.width | header.outerWidth(),
+      height: header.outerHeight(),
+      cell_size: 90,
+      seed: seed,
+      x_colors: [color1, color2]
     });
-  });
-});
 
-function trianglify(color1, color2, seed) {
-  var header = $('#content');
-  var pattern = Trianglify({
-    width: window.screen.width | header.outerWidth(),
-    height: header.outerHeight(),
-    cell_size: 90,
-    seed: seed,
-    x_colors: [color1, color2]
-  });
-
-  header.css('background-image', 'url(' + pattern.png() + ')');
+    header.css('background-image', 'url(' + pattern.png() + ')');
+  }
 }
+
+$(function() {
+  jekyllBootstrapDoc.buildSideMenu();
+  jekyllBootstrapDoc.addHeadingAnchors();
+  jekyllBootstrapDoc.enableBootbox();
+});

changelog.html

@@ -0,0 +1,85 @@
+---
+layout: default
+title: Changelog
+---
+
+<div id="releases"></div>
+
+<script src="https://cdn.jsdelivr.net/marked/0.3.5/marked.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
+
+<script>
+  var releasesAPI = 'https://api.github.com/repos/{{site.id}}/releases';
+  var issuesBase = 'https://github.com/{{site.id}}/issues/';
+
+  (function() {
+    function fetchReleases() {
+      var cacheDate = localStorage.releasesCacheDate;
+
+      if (cacheDate && (new Date() - new Date(cacheDate)) < 1000 * 3600) {
+        return $.when(JSON.parse(localStorage.releasesCache));
+      }
+      else {
+        return $.getJSON(releasesAPI)
+          .then(function(data) {
+            localStorage.releasesCacheDate = new Date().toString();
+            localStorage.releasesCache = JSON.stringify(data);
+            return data;
+          });
+      }
+    }
+
+    function unescape(html) {
+      return html
+        .replace(/&quot;/g, '"')
+        .replace(/&#39;/g, "'");
+    }
+
+    function replaceIssueLinks(html) {
+      return html.replace(/(#([0-9]+))/g, '<a href="' + issuesBase + '$2">$1</a>');
+    }
+
+    function sanitizeHeaders(html) {
+      return html.replace(/(<h[2-5])/g, '$1 data-no-menu');
+    }
+
+    function appendRelease(release, container) {
+      var date = moment(release.published_at);
+      var desc = sanitizeHeaders(replaceIssueLinks(unescape(marked(release.body, { breaks: true }))));
+
+      container.append(
+        $('<section>')
+          .addClass('bs-docs-section')
+          .append(
+            $('<h1>')
+              .addClass('page-header')
+              .attr('id', release.id)
+              .text(release.name)
+              .append(
+                $('<small>')
+                  .text(date.format('LL')),
+                $('<a>')
+                  .addClass('release-date')
+                  .attr('href', release.html_url)
+                  .html('<i class="glyphicon glyphicon-tag"></i>')
+              ),
+            $('<article>').html(desc)
+          )
+      );
+    }
+
+    fetchReleases()
+      .then(function(releases) {
+        var container = $('#releases');
+
+        releases.forEach(function(release) {
+          appendRelease(release, container);
+        });
+
+        if (jekyllBootstrapDoc) {
+          jekyllBootstrapDoc.buildSideMenu();
+          jekyllBootstrapDoc.addHeadingAnchors();
+        }
+      });
+  }());
+</script>