71 lines
2.0 KiB
JavaScript
71 lines
2.0 KiB
JavaScript
/*global $ */
|
|
'use strict';
|
|
|
|
$(document).ready(function() {
|
|
if ($(window).width() < 1024) {
|
|
|
|
const create_name = function(text) {
|
|
|
|
// Convert text to lower case.
|
|
let name = text.toLowerCase();
|
|
|
|
// Remove leading and trailing spaces, and any non-alphanumeric
|
|
// characters except for ampersands, spaces and dashes.
|
|
name = name.replace(/^\s+|\s+$|[^a-z0-9&\s-]/g, '');
|
|
|
|
// Replace '&' with 'and'.
|
|
name = name.replace(/&/g, 'and');
|
|
|
|
// Replaces spaces with dashes.
|
|
name = name.replace(/\s/g, '-');
|
|
|
|
// Squash any duplicate dashes.
|
|
name = name.replace(/(-)+\1/g, '$1');
|
|
|
|
return name;
|
|
};
|
|
|
|
// Set toggle class to each #sidebar h2
|
|
$('#sidebar div div h2').addClass('toggle');
|
|
|
|
// Hide all h2.toggle siblings
|
|
$('#sidebar div div h2').nextAll().hide();
|
|
|
|
// Add a link to each h2.toggle element.
|
|
$('h2.toggle').each(function() {
|
|
|
|
// Convert the h2 element text into a value that
|
|
// is safe to use in a name attribute.
|
|
const name = create_name($(this).text());
|
|
|
|
// Create a name attribute in the following sibling
|
|
// to act as a fragment anchor.
|
|
$(this).next().attr('name', name);
|
|
|
|
// Replace the h2.toggle element with a link to the
|
|
// fragment anchor. Use the h2 text to create the
|
|
// link title attribute.
|
|
$(this).html(
|
|
'<a href="#' + name + '" title="Reveal ' +
|
|
$(this).text() + ' content">' +
|
|
$(this).html() + '</a>');
|
|
});
|
|
|
|
// Add a click event handler to all h2.toggle elements.
|
|
$('h2.toggle').on('click', function(event) {
|
|
event.preventDefault();
|
|
// Toggle the 'expanded' class of the h2.toggle
|
|
// element, then apply the slideToggle effect
|
|
// to all siblings.
|
|
$(this).toggleClass('expanded').
|
|
nextAll().slideToggle('fast');
|
|
});
|
|
|
|
// Remove the focus from the link tag when accessed with a mouse.
|
|
$('h2.toggle a').on('mouseup', function() {
|
|
// Use the blur() method to remove focus.
|
|
$(this).trigger('blur');
|
|
});
|
|
}
|
|
});
|