/**
* Astra Theme Customizer Style Guide
*
* @package Astra
* @since x.x.x
*/
(function($, api) {
/**
* Style Guide navigation.
*/
jQuery(document).ready(function($) {
let headerContainer = jQuery('#customize-header-actions'),
button = jQuery('');
let indicatorDot = $('');
headerContainer.append(indicatorDot);
headerContainer.append(button);
// Added function to check visit count and show/hide the red dot.
function checkVisitCount() {
let visitCount = localStorage.getItem('customizerVisitCount');
visitCount = visitCount ? parseInt(visitCount, 10) : 0;
if (visitCount < 5) {
indicatorDot.show();
visitCount++;
localStorage.setItem('customizerVisitCount', visitCount);
} else {
indicatorDot.hide();
}
}
checkVisitCount();
button.on('click', function(event) {
event.preventDefault();
event.stopPropagation();
// Access the iframe's content
var iframeBody = $('#customize-preview').find('iframe').contents().find('body');
// Apply the custom class to the iframe's body
iframeBody.toggleClass('ast-sg-loaded');
// Creating new state for restricting the preview refresh.
api.state.create('astra-style-guide-status');
api.state('astra-style-guide-status').set('loaded');
});
// Bind the click event to the button to focus on the style guide section.
const urlParams = new URLSearchParams( window.location.search );
const autofocus = urlParams.get( 'autofocus' );
if ( autofocus === 'astra-tour' ) {
let hasTriggered = false; // flag to ensure it only fires once
wp.customize.previewer.bind( 'ready', () => {
if ( hasTriggered ) {
return; // if already triggered, do nothing
}
button.trigger( 'click' );
hasTriggered = true; // set the flag to true after triggering
} );
}
});
// development code.
$('#customize-preview iframe').on('load', function() {
// Access the iframe's content
var iframeBody = $('#customize-preview').find('iframe').contents().find('body');
// Apply the custom class to the iframe's body
iframeBody.addClass('ast-sg-loaded');
});
})(jQuery, wp.customize);