diff options
| -rw-r--r-- | assets/js/hux-blog.js | 106 | ||||
| -rw-r--r-- | assets/js/search.js | 54 | ||||
| -rw-r--r-- | layouts/partials/footer.html | 67 |
3 files changed, 119 insertions, 108 deletions
diff --git a/assets/js/hux-blog.js b/assets/js/hux-blog.js index ab6effa..c3518fc 100644 --- a/assets/js/hux-blog.js +++ b/assets/js/hux-blog.js @@ -1,7 +1,7 @@ - /*! +/*! * Hux Blog v1.6.0 (http://startbootstrap.com) * Copyright 2016 @huxpro - * Licensed under Apache 2.0 + * Licensed under Apache 2.0 */ // Tooltip Init @@ -10,9 +10,8 @@ // $("[data-toggle='tooltip']").tooltip(); // }); - // make all images responsive -/* +/* * Unuse by Hux * actually only Portfolio-Pages can't use it and only post-img need it. * so I modify the _layout/post and CSS to make post-img responsive! @@ -22,57 +21,68 @@ // }); // responsive tables -$(document).ready(function() { - $("table").wrap("<div class='table-responsive'></div>"); - $("table").addClass("table"); +$(document).ready(function () { + $("table").wrap("<div class='table-responsive'></div>"); + $("table").addClass("table"); }); // responsive embed videos -$(document).ready(function() { - $('iframe[src*="youtube.com"]').wrap('<div class="embed-responsive embed-responsive-16by9"></div>'); - $('iframe[src*="youtube.com"]').addClass('embed-responsive-item'); - $('iframe[src*="vimeo.com"]').wrap('<div class="embed-responsive embed-responsive-16by9"></div>'); - $('iframe[src*="vimeo.com"]').addClass('embed-responsive-item'); +$(document).ready(function () { + $('iframe[src*="youtube.com"]').wrap( + '<div class="embed-responsive embed-responsive-16by9"></div>' + ); + $('iframe[src*="youtube.com"]').addClass("embed-responsive-item"); + $('iframe[src*="vimeo.com"]').wrap( + '<div class="embed-responsive embed-responsive-16by9"></div>' + ); + $('iframe[src*="vimeo.com"]').addClass("embed-responsive-item"); }); // Navigation Scripts to Show Header on Scroll-Up -jQuery(document).ready(function($) { - var MQL = 1170; +jQuery(document).ready(function ($) { + var MQL = 1170; - //primary navigation slide-in effect - if ($(window).width() > MQL) { - var headerHeight = $('.navbar-custom').height(), - bannerHeight = $('.intro-header .container').height(); - $(window).on('scroll', { - previousTop: 0 - }, - function() { - var currentTop = $(window).scrollTop(), - $catalog = $('.side-catalog'); + //primary navigation slide-in effect + if ($(window).width() > MQL) { + var headerHeight = $(".navbar-custom").height(), + bannerHeight = $(".intro-header .container").height(); + $(window).on( + "scroll", + { + previousTop: 0, + }, + function () { + var currentTop = $(window).scrollTop(), + $catalog = $(".side-catalog"); - //check if user is scrolling up by mouse or keyborad - if (currentTop < this.previousTop) { - //if scrolling up... - if (currentTop > 0 && $('.navbar-custom').hasClass('is-fixed')) { - $('.navbar-custom').addClass('is-visible'); - } else { - $('.navbar-custom').removeClass('is-visible is-fixed'); - } - } else { - //if scrolling down... - $('.navbar-custom').removeClass('is-visible'); - if (currentTop > headerHeight && !$('.navbar-custom').hasClass('is-fixed')) $('.navbar-custom').addClass('is-fixed'); - } - this.previousTop = currentTop; + //check if user is scrolling up by mouse or keyborad + if (currentTop < this.previousTop) { + //if scrolling up... + if (currentTop > 0 && $(".navbar-custom").hasClass("is-fixed")) { + $(".navbar-custom").addClass("is-visible"); + } else { + $(".navbar-custom").removeClass("is-visible is-fixed"); + } + } else { + //if scrolling down... + $(".navbar-custom").removeClass("is-visible"); + if ( + currentTop > headerHeight && + !$(".navbar-custom").hasClass("is-fixed") + ) + $(".navbar-custom").addClass("is-fixed"); + } + this.previousTop = currentTop; + //adjust the appearance of side-catalog + $catalog.show(); + if (currentTop > bannerHeight + 41) { + $catalog.addClass("fixed"); + } else { + $catalog.removeClass("fixed"); + } + } + ); + } +}); - //adjust the appearance of side-catalog - $catalog.show() - if (currentTop > (bannerHeight + 41)) { - $catalog.addClass('fixed') - } else { - $catalog.removeClass('fixed') - } - }); - } -});
\ No newline at end of file diff --git a/assets/js/search.js b/assets/js/search.js new file mode 100644 index 0000000..8ab0e16 --- /dev/null +++ b/assets/js/search.js @@ -0,0 +1,54 @@ +// https://stackoverflow.com/questions/1912501/unescape-html-entities-in-javascript +function htmlDecode(input) { + var e = document.createElement('textarea'); + e.innerHTML = input; + // handle case of empty input + return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue; +} + +SimpleJekyllSearch({ + searchInput: document.getElementById('search-input'), + resultsContainer: document.getElementById('search-results'), + json: '/index.json', + searchResultTemplate: '<div class="post-preview item"><a href="{url}"><h2 class="post-title">{title}</h2><h3 class="post-subtitle">{subtitle}</h3><hr></a></div>', + noResultsText: 'No results', + limit: 50, + fuzzy: false, + // a hack to get escaped subtitle unescaped. for some reason, + // post.subtitle w/o escape filter nuke entire search. + templateMiddleware: function (prop, value, template) { + if (prop === 'subtitle' || prop === 'title') { + if (value.indexOf("code")) { + return htmlDecode(value); + } else { + return value; + } + } + } +}); + +$(document).ready(function () { + var $searchPage = $('.search-page'); + var $searchOpen = $('.search-icon'); + var $searchClose = $('.search-icon-close'); + var $searchInput = $('#search-input'); + var $body = $('body'); + + $searchOpen.on('click', function (e) { + e.preventDefault(); + $searchPage.toggleClass('search-active'); + var prevClasses = $body.attr('class') || ''; + setTimeout(function () { + $body.addClass('no-scroll'); + }, 400) + + if ($searchPage.hasClass('search-active')) { + $searchClose.on('click', function (e) { + e.preventDefault(); + $searchPage.removeClass('search-active'); + $body.attr('class', prevClasses); // from closure + }); + $searchInput.focus(); + } + }); +});
\ No newline at end of file diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 086d421..fdbe796 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -25,6 +25,10 @@ <!-- Simple Jekyll Search --> <script src="/js/simple-jekyll-search.min.js"></script> +{{ $searchJs := resources.Get "js/search.js" | minify | fingerprint }} +<script src="{{ $searchJs.Permalink }}"></script> + + {{ if eq .Type "archive" }} {{ $archiveJS := resources.Get "js/archive.js" | minify | fingerprint }} <script src='{{ $archiveJS.Permalink }}'></script> @@ -37,7 +41,7 @@ _containerSelector = 'div.post-container' // init var P = $(_containerSelector), a, n, t, l, i, c; - a = P.find('h1,h2,h3,h4,h5,h6'); + a = P.find('h1,h2,h3,h4'); // clean $(selector).html('') // appending @@ -64,10 +68,6 @@ {{ $navJs := resources.Get "js/jquery.nav.js" | minify | fingerprint }} <script type="text/javascript" src='{{ $navJs.Permalink }}'></script> <script> - /* - * Doc: https://github.com/davist11/jQuery-One-Page-Nav - * Fork by Hux to support padding - */ $(document).ready( function () { $('.catalog-body').onePageNav({ currentClass: "active", @@ -89,65 +89,12 @@ <!-- Simple Jekyll Search --> <script> - // https://stackoverflow.com/questions/1912501/unescape-html-entities-in-javascript - function htmlDecode(input) { - var e = document.createElement('textarea'); - e.innerHTML = input; - // handle case of empty input - return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue; - } - - SimpleJekyllSearch({ - searchInput: document.getElementById('search-input'), - resultsContainer: document.getElementById('search-results'), - json: '/index.json', - searchResultTemplate: '<div class="post-preview item"><a href="{url}"><h2 class="post-title">{title}</h2><h3 class="post-subtitle">{subtitle}</h3><hr></a></div>', - noResultsText: 'No results', - limit: 50, - fuzzy: false, - // a hack to get escaped subtitle unescaped. for some reason, - // post.subtitle w/o escape filter nuke entire search. - templateMiddleware: function (prop, value, template) { - if (prop === 'subtitle' || prop === 'title') { - if (value.indexOf("code")) { - return htmlDecode(value); - } else { - return value; - } - } - } - }); - - $(document).ready(function () { - var $searchPage = $('.search-page'); - var $searchOpen = $('.search-icon'); - var $searchClose = $('.search-icon-close'); - var $searchInput = $('#search-input'); - var $body = $('body'); - $searchOpen.on('click', function (e) { - e.preventDefault(); - $searchPage.toggleClass('search-active'); - var prevClasses = $body.attr('class') || ''; - setTimeout(function () { - $body.addClass('no-scroll'); - }, 400) - - if ($searchPage.hasClass('search-active')) { - $searchClose.on('click', function (e) { - e.preventDefault(); - $searchPage.removeClass('search-active'); - $body.attr('class', prevClasses); // from closure - }); - $searchInput.focus(); - } - }); - }); </script> {{ if not .Site.IsServer }} - {{ template "_internal/google_analytics.html" . }} +{{ template "_internal/google_analytics.html" . }} {{ end }} {{ $zoom_js := resources.Get "zoomjs/zoom.js" | resources.Minify }} -<script src="{{ $zoom_js.RelPermalink }}"></script> +<script src="{{ $zoom_js.RelPermalink }}"></script>
\ No newline at end of file |