Break out js to specific files

_layouts/default.html

@@ -20,6 +20,10 @@
     <link href="{{site.baseurl}}/lib/fluidbox/css/fluidbox.min.css?v={{'now' | date: "%s"}}"
           rel="stylesheet" type="text/css">
 
+    {% for stylesheet in page.custom-stylesheet-list %}
+    <link href="{{ stylesheet }}?v={{'now' | date: "%s"}}" rel="stylesheet">
+    {% endfor %}
+
     <link rel="apple-touch-icon" sizes="180x180" href="{{site.baseurl}}/images/icons/apple-touch-icon.png">
     <link rel="icon" type="image/png" sizes="32x32" href="{{site.baseurl}}/images/icons/favicon-32x32.png">
     <link rel="icon" type="image/png" sizes="16x16" href="{{site.baseurl}}/images/icons/favicon-16x16.png">
@@ -147,73 +151,14 @@
             crossorigin="anonymous" integrity="sha256-+nuEu243+6BveXk5N+Vbr268G+4FHjUOEcfKaBqfPbc= sha384-ugp/e34LtoER7mwf3SLygR0OL+STa4FTLzk7MRbpY/usE4VV+24hBxRXRS6g5ZJy sha512-JZSo0h5TONFYmyLMqp8k4oPhuo6yNk9mHM+FY50aBjpypfofqtEWsAgRDQm94ImLCzSaHeqNvYuD9382CEn2zw=="></script>
     <script src="{{site.baseurl}}/lib/fluidbox/js/jquery.fluidbox.min.js"></script>
     {% if jekyll.environment == "production" %}
-    <script>
+    <script src="{{site.baseurl}}/js/ga.min.js?v={{'now' | date: "%s"}}"></script>
-        (function (i, s, o, g, r, a, m) {
-            i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
-                (i[r].q = i[r].q || []).push(arguments)
-            }, i[r].l = 1 * new Date(); a = s.createElement(o),
-                m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
-        })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
-
-        ga('create', 'UA-81915606-4', 'auto');
-        ga('send', 'pageview');
-
-        function gaEvent(action) {
-            ga('send', {
-                hitType: 'event',
-                eventCategory: 'main',
-                eventAction: action
-            });
-        }
-    </script>
     {% else %}
-    <script>
+    <script src="{{site.baseurl}}/js/ga-noop.min.js"></script>
-        function gaEvent(action) {
-            // do nothing
-        }
-    </script>
     {% endif %}
-    <script>
+    <script src="{{site.baseurl}}/js/bit.js?v={{'now' | date: "%s"}}"></script>
-        $(function () {
-            var lightboxOpen = false,
-                lightboxSelector = 'a[rel="lightbox"]';
 
-            $(lightboxSelector)
+    {% for script in page.custom-script-list %}
-                .on('openstart.fluidbox', function () {
+    <script src="{{ script }}?v={{'now' | date: "%s"}}"></script>
-                    lightboxOpen = true;
+    {% endfor %}
-                })
-                .on('closestart.fluidbox', function () {
-                    lightboxOpen = false;
-                })
-                .fluidbox();
-
-            $(document).keydown(function (e) {
-                if (lightboxOpen && e.keyCode === 27) {
-                    $(lightboxSelector).trigger('close.fluidbox');
-                }
-            });
-
-            $(window).scroll(function () {
-                if (lightboxOpen) {
-                    $(lightboxSelector).trigger('close.fluidbox');
-                }
-            });
-
-            $('.article .panel-body > h2, .article .panel-body > h3').filter('[id]').each(function () {
-                var header = $(this),
-                    headerID = header.attr('id'),
-                    anchorClass = 'header-link',
-                    anchorIcon = '<i class="fa fa-link" aria-hidden="true"></i>';
-
-                if (headerID) {
-                    header.append($('<a />')
-                        .addClass(anchorClass)
-                        .attr({ 'href': '#' + headerID, 'aria-hidden': 'true', title: 'Permalink' })
-                        .html(anchorIcon));
-                }
-                return this;
-            });
-        });
-    </script>
 </body>
 </html>

js/bit.js

@@ -0,0 +1,40 @@
+$(function () {
+    var lightboxOpen = false,
+        lightboxSelector = 'a[rel="lightbox"]';
+
+    $(lightboxSelector)
+        .on('openstart.fluidbox', function () {
+            lightboxOpen = true;
+        })
+        .on('closestart.fluidbox', function () {
+            lightboxOpen = false;
+        })
+        .fluidbox();
+
+    $(document).keydown(function (e) {
+        if (lightboxOpen && e.keyCode === 27) {
+            $(lightboxSelector).trigger('close.fluidbox');
+        }
+    });
+
+    $(window).scroll(function () {
+        if (lightboxOpen) {
+            $(lightboxSelector).trigger('close.fluidbox');
+        }
+    });
+
+    $('.article .panel-body > h2, .article .panel-body > h3').filter('[id]').each(function () {
+        var header = $(this),
+            headerID = header.attr('id'),
+            anchorClass = 'header-link',
+            anchorIcon = '<i class="fa fa-link" aria-hidden="true"></i>';
+
+        if (headerID) {
+            header.append($('<a />')
+                .addClass(anchorClass)
+                .attr({ 'href': '#' + headerID, 'aria-hidden': 'true', title: 'Permalink' })
+                .html(anchorIcon));
+        }
+        return this;
+    });
+});

js/ga-noop.js

@@ -0,0 +1,3 @@
+function gaEvent(action) {
+    // do nothing
+}

js/ga.js

@@ -0,0 +1,17 @@
+(function (i, s, o, g, r, a, m) {
+    i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
+        (i[r].q = i[r].q || []).push(arguments)
+    }, i[r].l = 1 * new Date(); a = s.createElement(o),
+        m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
+})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
+
+ga('create', 'UA-81915606-4', 'auto');
+ga('send', 'pageview');
+
+function gaEvent(action) {
+    ga('send', {
+        hitType: 'event',
+        eventCategory: 'main',
+        eventAction: action
+    });
+}