123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235 |
- window.addEventListener( 'load', function(e) {
- astra_onload_function();
- });
- function astra_onload_function() {
- /* Do things after DOM has fully loaded */
- var astraMetaBox = document.querySelector( '#astra_settings_meta_box' );
- if( astraMetaBox != null ){
- var titleCheckbox = document.getElementById('site-post-title');
- if( null === titleCheckbox ) {
- titleCheckbox = document.querySelector('.site-post-title input');
- }
- if( null !== titleCheckbox ) {
- titleCheckbox.addEventListener('change',function() {
- var titleBlock = document.querySelector('.editor-post-title__block');
- if( null !== titleBlock ) {
- if( titleCheckbox.checked ){
- titleBlock.style.opacity = '0.2';
- } else {
- titleBlock.style.opacity = '1.0';
- }
- }
- });
- }
- }
- wp.data.subscribe(function () {
- setTimeout( function () {
- // Compatibility for updating layout in editor with direct reflection.
- const contentLayout = ( null !== wp.data.select( 'core/editor' ) && undefined !== wp.data.select( 'core/editor' ).getEditedPostAttribute( 'meta' ) && wp.data.select( 'core/editor' ).getEditedPostAttribute( 'meta' )['site-content-layout'] ) ? wp.data.select( 'core/editor' ).getEditedPostAttribute( 'meta' )['site-content-layout'] : 'default',
- bodyClass = document.querySelector('body');
- switch( contentLayout ) {
- case 'boxed-container':
- bodyClass.classList.add('ast-separate-container' , 'ast-two-container');
- bodyClass.classList.remove('ast-page-builder-template' , 'ast-plain-container');
- break;
- case 'content-boxed-container':
- bodyClass.classList.add('ast-separate-container');
- bodyClass.classList.remove('ast-two-container' , 'ast-page-builder-template' , 'ast-plain-container');
- break;
- case 'plain-container':
- bodyClass.classList.add('ast-plain-container');
- bodyClass.classList.remove('ast-two-container' , 'ast-page-builder-template' , 'ast-separate-container');
- break;
- case 'page-builder':
- bodyClass.classList.add('ast-page-builder-template');
- bodyClass.classList.remove('ast-two-container' , 'ast-plain-container' , 'ast-separate-container');
- break;
- case 'default':
- if( bodyClass.classList.contains( 'ast-default-layout-boxed-container' ) ) {
- bodyClass.classList.add('ast-separate-container' , 'ast-two-container');
- bodyClass.classList.remove('ast-page-builder-template' , 'ast-plain-container');
- } else if( bodyClass.classList.contains( 'ast-default-layout-content-boxed-container' ) ) {
- bodyClass.classList.add('ast-separate-container');
- bodyClass.classList.remove('ast-two-container' , 'ast-page-builder-template' , 'ast-plain-container');
- } else if( bodyClass.classList.contains( 'ast-default-layout-page-builder' ) ) {
- bodyClass.classList.add('ast-page-builder-template');
- bodyClass.classList.remove('ast-two-container' , 'ast-plain-container' , 'ast-separate-container');
- } else {
- bodyClass.classList.add('ast-plain-container');
- bodyClass.classList.remove('ast-two-container' , 'ast-page-builder-template' , 'ast-separate-container');
- }
- break;
- }
- const editorStylesWrapper = document.querySelector( '.editor-styles-wrapper' );
- if( null !== editorStylesWrapper ) {
- const editorStylesWrapperWidth = parseInt( editorStylesWrapper.offsetWidth )
- if( editorStylesWrapperWidth < 1250 ) {
- editorStylesWrapper.classList.remove( 'ast-stacked-title-visibility' );
- editorStylesWrapper.classList.add( 'ast-stacked-title-visibility' );
- } else {
- editorStylesWrapper.classList.remove( 'ast-stacked-title-visibility' );
- }
- }
- /**
- * In WP-5.9 block editor comes up with color palette showing color-code canvas, but with theme var() CSS its appearing directly as it is. So updated them on wp.data event.
- */
- const customColorPickerButtons = document.querySelectorAll( '.components-color-palette__custom-color' );
- for ( let btnCount = 0; btnCount < customColorPickerButtons.length; btnCount++ ) {
- const colorCode = customColorPickerButtons[btnCount].innerText;
- if ( colorCode.indexOf( 'var(--ast-global-color' ) > -1 ) {
- customColorPickerButtons[btnCount].innerHTML = '<span class="ast-theme-block-color-name">' + astraColors[ colorCode ] + '</span>';
- }
- }
- // Title visibility with new editor compatibility update.
- var titleVisibility = document.querySelector( '.title-visibility' ),
- titleBlock = document.querySelector( '.edit-post-visual-editor__post-title-wrapper' );
- if( null === titleVisibility && null !== titleBlock ) {
- var titleVisibilityTrigger = '';
- if( 'disabled' === wp.data.select( 'core/editor' ).getEditedPostAttribute( 'meta' )['site-post-title'] ) {
- titleVisibilityTrigger = '<span class="dashicons dashicons-hidden title-visibility" data-tooltip="Enable Title"></span>';
- titleBlock.classList.toggle( 'invisible' );
- } else {
- titleVisibilityTrigger = '<span class="dashicons dashicons-visibility title-visibility" data-tooltip="Disable Title"></span>';
- }
- titleBlock.insertAdjacentHTML( 'beforeend', titleVisibilityTrigger );
- document.querySelector( '.title-visibility' ).addEventListener( 'click', function() {
- var titleBlock = document.querySelector( '.edit-post-visual-editor__post-title-wrapper' );
- titleBlock.classList.toggle( 'invisible' );
- if( this.classList.contains( 'dashicons-hidden' ) ) {
- this.classList.add( 'dashicons-visibility' );
- this.classList.remove( 'dashicons-hidden' );
- this.dataset.tooltip = 'Disable Title';
- wp.data.dispatch( 'core/editor' ).editPost(
- {
- meta: {
- 'site-post-title': '',
- }
- }
- );
- } else {
- this.classList.add( 'dashicons-hidden' );
- this.classList.remove( 'dashicons-visibility' );
- this.dataset.tooltip = 'Enable Title';
- wp.data.dispatch( 'core/editor' ).editPost(
- {
- meta: {
- 'site-post-title': 'disabled',
- }
- }
- );
- }
- });
- }
- var responsivePreview = document.querySelectorAll( '.is-tablet-preview, .is-mobile-preview' );
- if( responsivePreview.length ) {
- document.body.classList.add( 'responsive-enabled' );
- } else {
- document.body.classList.remove( 'responsive-enabled' );
- }
- // Adding 'inherit-container-width' width to Group block externally.
- let postBlocks = ( null !== wp.data.select( 'core/editor' ) && undefined !== wp.data.select( 'core/editor' ).getCurrentPost() && undefined !== wp.data.select( 'core/editor' ).getBlocks() ) ? wp.data.select( 'core/editor' ).getBlocks() : false,
- groupBlocks = document.querySelectorAll( '.block-editor-block-list__layout.is-root-container > .wp-block-group' );
- if( postBlocks && groupBlocks ) {
- for ( let blockNum = 0; blockNum < postBlocks.length; blockNum++ ) {
- if( 'core/group' === postBlocks[blockNum].name && undefined !== postBlocks[blockNum].attributes && undefined !== postBlocks[blockNum].attributes.layout && undefined !== postBlocks[blockNum].attributes.layout.inherit ) {
- if( undefined === groupBlocks[blockNum] ) {
- return;
- }
- if( ! postBlocks[blockNum].attributes.layout.inherit ) {
- groupBlocks[blockNum].classList.remove( 'inherit-container-width' );
- }
- if( postBlocks[blockNum].attributes.layout.inherit && ! groupBlocks[blockNum].classList.contains( 'inherit-container-width' ) ) {
- groupBlocks[blockNum].classList.add( 'inherit-container-width' );
- }
- }
- }
- }
- }, 1 );
- });
- }
- document.body.addEventListener('mousedown', function () {
- var blockCssMode = document.querySelector('body').classList.contains('ast-block-legacy')
- var fontCss = document.getElementById('astra-google-fonts-css');
- if(true === blockCssMode){
- var blockCss = document.getElementById('astra-block-editor-styles-css');
- var inlineCss = document.getElementById('astra-block-editor-styles-inline-css');
-
- }else {
- var blockCss = document.getElementById('astra-wp-editor-styles-css');
- var inlineCss = document.getElementById('astra-wp-editor-styles-inline-css');
- }
-
- var blockFixCss = blockCss.cloneNode(true);
- var blockInlineCss = inlineCss.cloneNode(true);
- var blockfontCss = null !== fontCss ? fontCss.cloneNode(true) : null;
- setTimeout( function() {
- let tabletPreview = document.getElementsByClassName('is-tablet-preview');
- let mobilePreview = document.getElementsByClassName('is-mobile-preview');
- if (0 !== tabletPreview.length || 0 !== mobilePreview.length) {
- var googleFontId = 'astra-google-fonts-css';
- if(true === blockCssMode){
- var styleTagId = 'astra-block-editor-styles-inline-css';
- var styleTagBlockId = 'astra-block-editor-styles-css';
-
- } else{
- var styleTagId = 'astra-wp-editor-styles-inline-css';
- var styleTagBlockId = 'astra-wp-editor-styles-css';
- }
- var styleTagId = 'astra-block-editor-styles-inline-css';
- var styleTagBlockId = 'astra-block-editor-styles-css';
- var googleFontId = 'astra-google-fonts-css';
- let preview = tabletPreview[0] || mobilePreview[0];
- let iframe = preview.getElementsByTagName('iframe')[0];
- let iframeDocument = iframe.contentWindow.document || iframe.contentDocument;
- let element = iframeDocument.getElementById(
- styleTagId
- );
- let elementBlock = iframeDocument.getElementById(
- styleTagBlockId
- );
- let elementGoogleFont = iframeDocument.getElementById(
- googleFontId
- );
- if ( (null === element || undefined === element)) {
- iframeDocument.head.appendChild( blockInlineCss );
- }
- if ( (null === elementBlock || undefined === elementBlock )) {
- iframeDocument.head.appendChild( blockFixCss );
- }
- if ( (null === elementGoogleFont || undefined === elementGoogleFont ) && null !== fontCss) {
- iframeDocument.head.appendChild( blockfontCss );
- }
- }
- }, 1000);
- });
|