https://capolicylab.org/wp-content/themes/capolicylab/assets/js/pa…scroll-to-id-focus-helper.js?ver=1781277226

1function getSelectorsFromInstances(params) {
2	var selectors = [];
3	for (var instanceKey in params.instances) {
4		if (params.instances.hasOwnProperty(instanceKey)) {
5			selectors.push(params.instances[instanceKey].selector);
6		}
7	}
8	return selectors;
9}
10
11document.addEventListener('DOMContentLoaded', (event) => {
12	// Assume getSelectorsFromInstances returns an array of selector strings.
13	const selectorsArray = getSelectorsFromInstances(mPS2id_params);
14
15	// Convert the array of selectors into a single string joined by commas to use in querySelectorAll
16	const selectorString = selectorsArray.join(',');
17
18	// Query all elements that match any of the selectors in the array
19	const localLinks = document.querySelectorAll(selectorString);
20
21	// Iterate over each link and bind the click event listener
22	localLinks.forEach((link) => {
23		link.addEventListener('click', function(event) {
24			const targetId = this.getAttribute('href');
25			let targetElement = document.querySelector(targetId);  // Declare targetElement using let for block scope
26
27			if (targetElement) {
28				// Check if the element is not focusable and make it focusable if necessary
29				if (!targetElement.hasAttribute('tabindex')) {
30					targetElement.setAttribute('tabindex', '-1');
31				}
32
33				setTimeout(function() {
34					// Set the focus to the target element
35					targetElement.focus();
36				}, 200);
37			}
38		});
39	});
40});
41
42
43(function($) {
44	'use strict';
45
46	// Hook into onStart callback after plugin loads
47	$(window).on('load', function() {
48		setTimeout(function() {
49			// Only run if TOC element exists
50			var $tocElement = $('.modern-post__sidebar__item--toc');
51			if (!$tocElement.length) {
52				return;
53			}
54
55			var pluginOptions = $(document).data('mPS2id');
56
57			if (pluginOptions) {
58				var originalOnStart = pluginOptions.onStart;
59
60				pluginOptions.onStart = function(data) {
61					// Immediately stop any scroll animation
62					$('html, body').stop(true, false);
63
64					// Call original onStart
65					if (originalOnStart && typeof originalOnStart === 'function') {
66						originalOnStart.call(this, data);
67					}
68
69					// Adjust scroll if we have target
70					if (data && data.target && data.target.length && data.scrollTo) {
71						var $target = $(data.target);
72
73						// Get CSS variable value
74						var computedStyle = getComputedStyle(document.documentElement);
75						var offsetValue = computedStyle.getPropertyValue('--scroll-to-id-offsett-value').trim();
76
77						// Parse the value (could be in px, rem, etc.)
78						var offsetValuePx = 0;
79						if (offsetValue) {
80							// If it's in rem, convert to pixels
81							if (offsetValue.indexOf('rem') !== -1) {
82								var remValue = parseFloat(offsetValue);
83								var oneRem = parseFloat(computedStyle.fontSize) || 16;
84								offsetValuePx = remValue * oneRem;
85							} else if (offsetValue.indexOf('px') !== -1) {
86								// If it's in pixels
87								offsetValuePx = parseFloat(offsetValue);
88							} else {
89								// Assume it's a number in pixels
90								offsetValuePx = parseFloat(offsetValue) || 0;
91							}
92						}
93
94						// Get 1rem in pixels
95						var oneRem = parseFloat(computedStyle.fontSize) || 16;
96
97						// Add 1rem to offset value
98						var offsetWithRem = offsetValuePx + oneRem;
99
100						var targetTop = $target.offset().top;
101
102						// Calculate what offset was used: targetTop - scrollTo.y
103						var baseOffset = targetTop - parseInt(data.scrollTo.y);
104
105						// Calculate adjusted scroll position with CSS variable value + 1rem added
106						var adjustedScrollTop = targetTop - baseOffset - offsetWithRem;
107
108						// Use requestAnimationFrame to ensure we run after plugin's setup
109						requestAnimationFrame(function() {
110							// Stop again to be sure
111							$('html, body').stop(true, false);
112
113							// Start adjusted scroll
114							var scrollSpeed = pluginOptions.scrollSpeed || 1000;
115							var scrollEasing = pluginOptions.scrollEasing || 'easeInOutQuint';
116
117							$('html, body').animate({
118								scrollTop: adjustedScrollTop
119							}, scrollSpeed, scrollEasing);
120						});
121					}
122				};
123
124				$(document).data('mPS2id', pluginOptions);
125			}
126		}, 100);
127	});
128})(jQuery);