hacks-guide-minimal-mistake.../assets/js/_main.js

137 lines
4.1 KiB
JavaScript
Raw Normal View History

/* ==========================================================================
jQuery plugin settings and other scripts
========================================================================== */
2014-02-13 20:20:28 +01:00
2022-05-27 16:12:25 +02:00
$(function() {
2016-03-10 19:06:17 +01:00
// FitVids init
$("#main").fitVids();
2013-09-09 16:12:07 +02:00
// Sticky sidebar
var stickySideBar = function() {
var show =
2022-05-27 16:12:25 +02:00
$(".author__urls-wrapper").find("button").length === 0
? $(window).width() > 1024 // width should match $large Sass variable
2022-05-27 16:12:25 +02:00
: !$(".author__urls-wrapper").find("button").is(":visible");
if (show) {
// fix
$(".sidebar").addClass("sticky");
} else {
// unfix
$(".sidebar").removeClass("sticky");
}
};
stickySideBar();
$(window).resize(function() {
stickySideBar();
});
2016-03-21 05:03:46 +01:00
// Follow menu drop down
2022-05-27 16:12:25 +02:00
$(".author__urls-wrapper").find("button").on("click", function() {
$(".author__urls").toggleClass("is--visible");
2022-05-27 16:12:25 +02:00
$(".author__urls-wrapper").find("button").toggleClass("open");
});
// Close search screen with Esc key
$(document).keyup(function(e) {
if (e.keyCode === 27) {
if ($(".initial-content").hasClass("is--hidden")) {
$(".search-content").toggleClass("is--visible");
$(".initial-content").toggleClass("is--hidden");
}
}
});
// Search toggle
$(".search__toggle").on("click", function() {
$(".search-content").toggleClass("is--visible");
$(".initial-content").toggleClass("is--hidden");
// set focus on input
setTimeout(function() {
2022-05-27 16:12:25 +02:00
$(".search-content").find("input").focus();
}, 400);
});
// Smooth scrolling
var scroll = new SmoothScroll('a[href*="#"]', {
offset: 20,
speed: 400,
speedAsDuration: true,
durationMax: 500
});
// Gumshoe scroll spy init
if($("nav.toc").length > 0) {
var spy = new Gumshoe("nav.toc a", {
// Active classes
navClass: "active", // applied to the nav list item
contentClass: "active", // applied to the content
// Nested navigation
nested: false, // if true, add classes to parents of active link
nestedClass: "active", // applied to the parent items
// Offset & reflow
offset: 20, // how far from the top of the page to activate a content area
reflow: true, // if true, listen for reflows
// Event support
events: true // if true, emit custom events
});
}
2016-03-10 19:06:17 +01:00
// add lightbox class to all image links
$(
"a[href$='.jpg'],a[href$='.jpeg'],a[href$='.JPG'],a[href$='.png'],a[href$='.gif'],a[href$='.webp']"
2021-08-10 21:17:34 +02:00
).has("> img").addClass("image-popup");
2016-03-10 19:06:17 +01:00
// Magnific-Popup options
$(".image-popup").magnificPopup({
// disableOn: function() {
// if( $(window).width() < 500 ) {
// return false;
// }
// return true;
// },
type: "image",
tLoading: "Loading image #%curr%...",
2013-09-09 16:12:07 +02:00
gallery: {
enabled: true,
navigateByImgClick: true,
preload: [0, 1] // Will preload 0 - before current, and 1 after the current image
2013-09-09 16:12:07 +02:00
},
image: {
tError: '<a href="%url%">Image #%curr%</a> could not be loaded.'
2013-09-09 16:12:07 +02:00
},
2016-03-10 19:06:17 +01:00
removalDelay: 500, // Delay in milliseconds before popup is removed
// Class that is added to body when popup is open.
// make it unique to apply your CSS animations just to this exact popup
mainClass: "mfp-zoom-in",
2016-03-10 19:06:17 +01:00
callbacks: {
beforeOpen: function() {
// just a hack that adds mfp-anim class to markup
this.st.image.markup = this.st.image.markup.replace(
"mfp-figure",
"mfp-figure mfp-with-anim"
);
2016-03-10 19:06:17 +01:00
}
},
closeOnContentClick: true,
midClick: true // allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source.
2013-09-09 16:12:07 +02:00
});
// Add anchors for headings
$('.page__content').find('h1, h2, h3, h4, h5, h6').each(function() {
var id = $(this).attr('id');
if (id) {
var anchor = document.createElement("a");
anchor.className = 'header-link';
anchor.href = '#' + id;
anchor.innerHTML = '<span class=\"sr-only\">Permalink</span><i class=\"fas fa-link\"></i>';
anchor.title = "Permalink";
$(this).append(anchor);
}
});
2016-06-23 00:59:16 +02:00
});