(function () { 'use strict'; if (window.__voicepaHeaderStackStableReady) { if (typeof window.voicepaHeaderStackStableSync === 'function') { window.voicepaHeaderStackStableSync({ reason: 'duplicate-load', burst: true }); } return; } window.__voicepaHeaderStackStableReady = true; var BREAKPOINT = 900; var GAP = 0; var DEFAULT_FLAG_HEIGHT = 46; var DEFAULT_STACK_WIDTH = 300; var DEFAULT_THUMBNAIL_SIZE = 180; var rafId = 0; var mutationObserver = null; var resizeObserver = null; var burstTimers = []; var loadPageProbeTimer = 0; var state = { mode: '', signature: '', header: null, tagInfo: null, midashi: null, image: null, stack: null, anchor: null, loadPageRef: null, lastY: null, lastViewportWidth: window.innerWidth || 0 }; function getRoot() { return document.documentElement; } function getBody() { return document.body; } function getScrollY() { return window.pageYOffset || (document.documentElement && document.documentElement.scrollTop) || 0; } function setClass(el, className, enabled) { if (!el || !el.classList) { return; } if (enabled) { el.classList.add(className); } else { el.classList.remove(className); } } function setReady(enabled) { setClass(getRoot(), 'vp-header-stack-ready', enabled); setClass(getBody(), 'vp-header-stack-ready', enabled); } function setPositioned(enabled) { setClass(getRoot(), 'vp-header-stack-positioned', enabled); setClass(getBody(), 'vp-header-stack-positioned', enabled); } function setMode(mode) { var root = getRoot(); var body = getBody(); var value = mode || 'none'; if (root) { root.setAttribute('data-vp-header-stack-anchor', value); } if (body) { body.setAttribute('data-vp-header-stack-anchor', value); } } function setVar(name, value) { var root = getRoot(); var body = getBody(); if (root && root.style) { root.style.setProperty(name, value); } if (body && body.style) { body.style.setProperty(name, value); } } function px(value) { value = Number(value); if (!isFinite(value)) { value = 0; } return Math.round(value) + 'px'; } function requestFrame(callback) { var raf = window.requestAnimationFrame || function (fn) { return window.setTimeout(fn, 16); }; return raf(callback); } function cancelFrame(id) { if (!id) { return; } if (window.cancelAnimationFrame) { window.cancelAnimationFrame(id); } else { window.clearTimeout(id); } } function queryAll(selector, scope) { var base = scope || document; if (!base || !base.querySelectorAll) { return []; } return Array.prototype.slice.call(base.querySelectorAll(selector)); } function queryFirst(selector, scope) { var base = scope || document; if (!base || !base.querySelector) { return null; } return base.querySelector(selector); } function getStyle(el) { if (!el || !window.getComputedStyle) { return null; } return window.getComputedStyle(el); } function isConnected(el) { if (!el) { return false; } if ('isConnected' in el) { return !!el.isConnected; } return document.documentElement && document.documentElement.contains(el); } function isVisible(el) { if (!el || !el.getBoundingClientRect || !isConnected(el)) { return false; } var style = getStyle(el); if (style && (style.display === 'none' || style.visibility === 'hidden' || style.opacity === '0')) { return false; } var rect = el.getBoundingClientRect(); if (!rect) { return false; } return Math.round(rect.width || 0) > 0 || Math.round(rect.height || 0) > 0; } function isFixedByAncestry(el) { var node = el; while (node && node.nodeType === 1 && node !== document.documentElement) { var style = getStyle(node); var position = style ? String(style.position || '').toLowerCase() : ''; if (position === 'fixed' || position === 'sticky') { return true; } node = node.parentElement; } return false; } function lastVisible(selectors, scope) { var found = null; for (var i = 0; i < selectors.length; i += 1) { var nodes = queryAll(selectors[i], scope); for (var j = 0; j < nodes.length; j += 1) { if (isVisible(nodes[j])) { found = nodes[j]; } } } return found; } function hasSingleHeaderShape(header) { if (!header || !isConnected(header)) { return false; } return !!( queryFirst('.header-container', header) && queryFirst('.super-midashi', header) && queryFirst('.tag-info img', header) ); } function getActiveHeader() { var headers = queryAll('.super-header'); var best = null; for (var i = 0; i < headers.length; i += 1) { var header = headers[i]; if (!hasSingleHeaderShape(header)) { continue; } if (!isVisible(header)) { continue; } best = header; } return best; } function getModeName() { return window.innerWidth > BREAKPOINT ? 'desktop-dark-div' : 'mobile-scrollmenu'; } function getPrimaryAnchorInfo() { var desktop = window.innerWidth > BREAKPOINT; var primary = lastVisible(desktop ? ['.dark-div'] : ['.scrollmenu']); if (primary) { return { element: primary, mode: desktop ? 'dark-div' : 'scrollmenu' }; } var fallback = lastVisible(desktop ? ['.scrollmenu'] : ['.dark-div']); if (fallback) { return { element: fallback, mode: desktop ? 'scrollmenu-fallback' : 'dark-div-fallback' }; } var adminBar = document.getElementById('wpadminbar'); if (isVisible(adminBar)) { return { element: adminBar, mode: 'wpadminbar-fallback' }; } return { element: null, mode: 'viewport-top-fallback' }; } function ensureMediaStack(header) { if (!header || !isConnected(header)) { return null; } var stack = queryFirst('.vp-header-media-stack', header); if (!stack) { stack = document.createElement('div'); stack.className = 'vp-header-media-stack'; stack.setAttribute('aria-hidden', 'false'); header.appendChild(stack); } var selectors = [ '.super-image-container', '.custom-audio-player', '.ad-video-player', '.super-header-bottom' ]; var movedCount = 0; for (var i = 0; i < selectors.length; i += 1) { var el = queryFirst(selectors[i], header); if (!el || el === stack || (el.classList && el.classList.contains('vp-header-media-stack'))) { continue; } if (stack.contains(el)) { movedCount += 1; continue; } stack.appendChild(el); movedCount += 1; } if (!movedCount && !stack.children.length) { return null; } return stack; } function getSingleHeaderParts() { var header = getActiveHeader(); if (!header) { return null; } var container = queryFirst('.header-container', header); var tagInfo = queryFirst('.tag-info', header); var midashi = queryFirst('.super-midashi', header); var image = tagInfo ? queryFirst('img', tagInfo) : null; var stack = ensureMediaStack(header); if (!container || !tagInfo || !midashi || !image) { return null; } return { header: header, container: container, tagInfo: tagInfo, midashi: midashi, image: image, stack: stack }; } function measureImageHeight(image) { if (!image) { return DEFAULT_FLAG_HEIGHT; } var rect = image.getBoundingClientRect ? image.getBoundingClientRect() : null; var height = rect ? Math.round(rect.height || 0) : 0; if (height > 0) { return height; } var offsetHeight = Math.round(image.offsetHeight || 0); if (offsetHeight > 0) { return offsetHeight; } var width = rect ? Math.round(rect.width || 0) : Math.round(image.offsetWidth || 0); if (width > 0 && image.naturalWidth > 0 && image.naturalHeight > 0) { return Math.max(1, Math.round(width * image.naturalHeight / image.naturalWidth)); } return DEFAULT_FLAG_HEIGHT; } function measureThumbnailSize(stack) { var thumbnail = stack ? queryFirst('.custom-thumbnail-container', stack) : null; if (!thumbnail || !thumbnail.getBoundingClientRect) { return DEFAULT_THUMBNAIL_SIZE; } var rect = thumbnail.getBoundingClientRect(); var size = Math.round(Math.max(rect.width || 0, rect.height || 0)); if (size > 0) { return size; } return DEFAULT_THUMBNAIL_SIZE; } function getElementBottomCoordinate(el) { if (!el || !el.getBoundingClientRect) { return 0; } var rect = el.getBoundingClientRect(); if (!rect) { return 0; } if (isFixedByAncestry(el)) { return Math.round(rect.bottom || 0); } return Math.round((rect.bottom || 0) + getScrollY()); } function getElementTopCoordinate(el) { if (!el || !el.getBoundingClientRect) { return 0; } var rect = el.getBoundingClientRect(); if (!rect) { return 0; } if (isFixedByAncestry(el)) { return Math.round(rect.top || 0); } return Math.round((rect.top || 0) + getScrollY()); } function makeSignature(parts, anchorInfo) { var path = window.location ? String(window.location.pathname || '') : ''; var search = window.location ? String(window.location.search || '') : ''; var postId = ''; var titleText = ''; try { var postInput = document.getElementById('comment_post_ID') || document.querySelector('input[name="comment_post_ID"]'); postId = postInput ? String(postInput.value || '') : ''; } catch (error) { postId = ''; } try { var title = document.querySelector('h1.media-title, h1.entry-title, h1'); titleText = title ? String(title.textContent || '').slice(0, 80) : ''; } catch (error2) { titleText = ''; } return [ path, search, postId, titleText, getModeName(), anchorInfo && anchorInfo.mode ? anchorInfo.mode : 'none', parts && parts.header ? 'h' : 'no-h', parts && parts.image ? 'img' : 'no-img', parts && parts.stack ? 'stack' : 'no-stack', window.innerWidth || 0 ].join('|'); } function syncHeaderWidth(parts) { if (!parts || !parts.header) { return; } var target = queryFirst('.post.excerpt10') || queryFirst('.article') || queryFirst('.post-cover'); if (!target || !target.getBoundingClientRect) { return; } var rect = target.getBoundingClientRect(); var width = Math.round(rect.width || 0); if (width < 40) { return; } if (window.innerWidth <= 600) { width = window.innerWidth; } try { parts.header.style.width = width + 'px'; } catch (error) {} } function positionStackFullWidth(parts) { if (!parts || !parts.header) { setPositioned(false); return; } var headerRect = parts.header.getBoundingClientRect ? parts.header.getBoundingClientRect() : null; var headerWidth = headerRect ? Math.round(headerRect.width || 0) : 0; var innerWidth = Math.min(DEFAULT_STACK_WIDTH, Math.max(10, headerWidth - 16)); var thumbnailSize = measureThumbnailSize(parts.stack); setVar('--vp-stack-x', '0px'); setVar('--vp-stack-width', '100%'); setVar('--vp-stack-inner-width', px(innerWidth)); setVar('--vp-stack-thumbnail-size', px(thumbnailSize)); setPositioned(true); } function installImageLoadListener(image) { if (!image || image.__vpHeaderStackStableLoadBound) { return; } image.__vpHeaderStackStableLoadBound = true; image.addEventListener('load', function () { queueBurst('image-load'); }, true); image.addEventListener('error', function () { queueBurst('image-error'); }, true); } function installStackImageLoadListeners(stack) { if (!stack || !stack.querySelectorAll) { return; } var images = stack.querySelectorAll('img'); for (var i = 0; i < images.length; i += 1) { installImageLoadListener(images[i]); } } function installResizeObservers(parts, anchor) { if (!window.ResizeObserver || !parts) { return; } if ( resizeObserver && state.header === parts.header && state.anchor === anchor && state.image === parts.image && state.stack === parts.stack ) { return; } if (resizeObserver) { resizeObserver.disconnect(); resizeObserver = null; } resizeObserver = new ResizeObserver(function () { schedule({ reason: 'element-resize' }); }); if (parts.header) { resizeObserver.observe(parts.header); } if (parts.image) { resizeObserver.observe(parts.image); } if (parts.stack) { resizeObserver.observe(parts.stack); } if (anchor) { resizeObserver.observe(anchor); } } function syncNow(options) { options = options || {}; var parts = getSingleHeaderParts(); if (!parts) { setReady(false); setPositioned(false); setMode('none'); return; } var anchorInfo = getPrimaryAnchorInfo(); var anchor = anchorInfo.element; var signature = makeSignature(parts, anchorInfo); var mode = getModeName(); var anchorBottom = getElementBottomCoordinate(anchor); var headerTop = getElementTopCoordinate(parts.header); var y = Math.max(0, anchorBottom - headerTop + GAP); var flagHeight = measureImageHeight(parts.image); syncHeaderWidth(parts); setPositioned(false); setVar('--vp-stack-rail-y', px(y)); setVar('--vp-stack-flag-height', px(flagHeight)); setMode(anchorInfo.mode); setReady(true); state.mode = mode; state.signature = signature; state.header = parts.header; state.tagInfo = parts.tagInfo; state.midashi = parts.midashi; state.image = parts.image; state.stack = parts.stack; state.anchor = anchor; state.lastY = y; state.lastViewportWidth = window.innerWidth || 0; installImageLoadListener(parts.image); installStackImageLoadListeners(parts.stack); installResizeObservers(parts, anchor); positionStackFullWidth(parts); requestFrame(function () { syncHeaderWidth(parts); positionStackFullWidth(parts); }); if (typeof window.CustomEvent === 'function') { document.dispatchEvent(new CustomEvent('voicepa:header-stack-full-width-positioned', { detail: { reason: options.reason || '', anchor: anchorInfo.mode, mode: mode, y: y, flagHeight: flagHeight, signature: signature } })); } } function schedule(options) { options = options || {}; if (rafId) { cancelFrame(rafId); rafId = 0; } rafId = requestFrame(function () { rafId = 0; syncNow({ reason: options.reason || '' }); }); } function clearBurst() { for (var i = 0; i < burstTimers.length; i += 1) { window.clearTimeout(burstTimers[i]); } burstTimers = []; } function queueBurst(reason) { clearBurst(); var delays = [0, 16, 40, 80, 140, 220, 360, 600, 900, 1300, 1800, 2400]; for (var i = 0; i < delays.length; i += 1) { (function (delay) { var id = window.setTimeout(function () { schedule({ reason: reason || 'burst' }); }, delay); burstTimers.push(id); }(delays[i])); } if (document.fonts && document.fonts.ready && typeof document.fonts.ready.then === 'function') { document.fonts.ready.then(function () { schedule({ reason: (reason || 'burst') + ':fonts-ready' }); }).catch(function () {}); } } function patchHistoryMethod(name) { if (!window.history || !window.history[name]) { return; } var original = window.history[name]; if (original.__vpHeaderStackStablePatched) { return; } window.history[name] = function () { var result = original.apply(this, arguments); queueBurst(name); return result; }; window.history[name].__vpHeaderStackStablePatched = true; } function patchLoadPageIfAvailable() { if (typeof window.loadPage !== 'function') { return false; } if (window.loadPage.__vpHeaderStackStablePatched) { return true; } if (state.loadPageRef === window.loadPage) { return true; } var original = window.loadPage; window.loadPage = function () { queueBurst('loadPage-before'); var result; try { result = original.apply(this, arguments); } catch (error) { queueBurst('loadPage-error'); throw error; } if (result && typeof result.then === 'function') { result.then(function () { queueBurst('loadPage-promise-done'); }).catch(function () { queueBurst('loadPage-promise-error'); }); } else { queueBurst('loadPage-after'); } return result; }; window.loadPage.__vpHeaderStackStablePatched = true; window.loadPage.__vpHeaderStackStableOriginal = original; state.loadPageRef = window.loadPage; return true; } function probeLoadPagePatch() { patchLoadPageIfAvailable(); if (loadPageProbeTimer) { window.clearTimeout(loadPageProbeTimer); } loadPageProbeTimer = window.setTimeout(function () { patchLoadPageIfAvailable(); }, 250); window.setTimeout(patchLoadPageIfAvailable, 800); window.setTimeout(patchLoadPageIfAvailable, 1600); window.setTimeout(patchLoadPageIfAvailable, 3000); } function bindEvents() { var renderEvents = [ 'DOMContentLoaded', 'load', 'pageshow', 'popstate', 'hashchange', 'pjax:start', 'pjax:send', 'pjax:beforeReplace', 'pjax:afterReplace', 'pjax:success', 'pjax:complete', 'pjax:end', 'pjax:render', 'pjax:load', 'swup:contentReplaced', 'swup:page:view', 'swup:transition:end', 'turbo:before-render', 'turbo:render', 'turbo:load', 'htmx:afterSwap', 'htmx:afterSettle', 'voicepa:layout-sync', 'voicepa:header-sync', 'voicepa:zero-base-header-sync', 'voicepa:header-anchor-once-sync', 'voicepa:header-stack-column-sync', 'voicepa:header-stack-full-width-sync', 'voicepa:header-stack-stable-sync' ]; for (var i = 0; i < renderEvents.length; i += 1) { window.addEventListener(renderEvents[i], function () { queueBurst('render-event'); probeLoadPagePatch(); }, true); document.addEventListener(renderEvents[i], function () { queueBurst('render-event'); probeLoadPagePatch(); }, true); } window.addEventListener('resize', function () { queueBurst('resize'); }, true); window.addEventListener('orientationchange', function () { queueBurst('orientationchange'); }, true); if (window.visualViewport) { try { window.visualViewport.addEventListener('resize', function () { queueBurst('visualViewport-resize'); }, { passive: true }); } catch (error) {} } if (window.jQuery) { try { window.jQuery(document).on( 'pjax:start pjax:send pjax:beforeReplace pjax:afterReplace pjax:end pjax:complete pjax:success ajaxComplete', function () { queueBurst('jquery-render-event'); probeLoadPagePatch(); } ); } catch (error2) {} } /* Intentionally no scroll listener. */ } function nodeLooksRelevant(node) { if (!node || node.nodeType !== 1) { return false; } var el = node; if (el.matches && el.matches('.super-header, .dark-div, .scrollmenu, .tag-info, .super-midashi, .super-image-container, .custom-audio-player, .ad-video-player, .super-header-bottom')) { return true; } if (el.querySelector && el.querySelector('.super-header, .dark-div, .scrollmenu, .tag-info, .super-midashi, .super-image-container, .custom-audio-player, .ad-video-player, .super-header-bottom')) { return true; } return false; } function observeDom() { if (!window.MutationObserver || mutationObserver || !document.documentElement) { return; } mutationObserver = new MutationObserver(function (mutations) { var relevant = false; for (var i = 0; i < mutations.length; i += 1) { var mutation = mutations[i]; if (mutation.type !== 'childList') { continue; } var j; for (j = 0; j < mutation.addedNodes.length; j += 1) { if (nodeLooksRelevant(mutation.addedNodes[j])) { relevant = true; break; } } if (relevant) { break; } for (j = 0; j < mutation.removedNodes.length; j += 1) { if (nodeLooksRelevant(mutation.removedNodes[j])) { relevant = true; break; } } if (relevant) { break; } } if (relevant) { queueBurst('dom-relevant-change'); probeLoadPagePatch(); } }); mutationObserver.observe(document.documentElement, { childList: true, subtree: true }); } window.voicepaHeaderStackFullWidthSync = function (options) { options = options || {}; queueBurst(options.reason || 'manual-full-width-sync'); }; window.voicepaHeaderStackStableSync = function (options) { options = options || {}; queueBurst(options.reason || 'manual-stable-sync'); }; patchHistoryMethod('pushState'); patchHistoryMethod('replaceState'); probeLoadPagePatch(); bindEvents(); observeDom(); syncNow({ reason: 'initial' }); queueBurst('initial-burst'); }());