From 9d4123cee1867ee7199b06bdc92d40611f547ecc Mon Sep 17 00:00:00 2001 From: Zach van Rijn Date: Wed, 21 Jul 2021 14:54:07 -0500 Subject: Initial unmodified import from Astra (Version: 3.6.5) @ /wp-content/themes/astra/. --- .../assets/js/unminified/customizer-preview.js | 205 +++++++++++++++++++++ 1 file changed, 205 insertions(+) create mode 100644 inc/builder/type/header/off-canvas/assets/js/unminified/customizer-preview.js (limited to 'inc/builder/type/header/off-canvas/assets/js/unminified/customizer-preview.js') diff --git a/inc/builder/type/header/off-canvas/assets/js/unminified/customizer-preview.js b/inc/builder/type/header/off-canvas/assets/js/unminified/customizer-preview.js new file mode 100644 index 0000000..dcf518b --- /dev/null +++ b/inc/builder/type/header/off-canvas/assets/js/unminified/customizer-preview.js @@ -0,0 +1,205 @@ +/** + * This file adds some LIVE to the Customizer live preview. To leverage + * this, set your custom settings to 'postMessage' and then add your handling + * here. Your javascript should grab settings from customizer controls, and + * then make any necessary changes to the page using jQuery. + * + * @package Astra + * @since 3.0.0 + */ + +( function( $ ) { + + var tablet_break_point = astraBuilderPreview.tablet_break_point || 768, + mobile_break_point = astraBuilderPreview.mobile_break_point || 544; + + // Close Icon Color. + astra_css( + 'astra-settings[off-canvas-close-color]', + 'color', + '.ast-mobile-popup-drawer.active .menu-toggle-close' + ); + + // Off-Canvas Background Color. + wp.customize( 'astra-settings[off-canvas-background]', function( value ) { + value.bind( function( bg_obj ) { + var dynamicStyle = ' .ast-mobile-popup-drawer.active .ast-mobile-popup-inner, .ast-mobile-header-wrap .ast-mobile-header-content, .ast-desktop-header-content { {{css}} }'; + astra_background_obj_css( wp.customize, bg_obj, 'off-canvas-background', dynamicStyle ); + } ); + } ); + + wp.customize( 'astra-settings[off-canvas-inner-spacing]', function ( value ) { + value.bind( function ( spacing ) { + var dynamicStyle = ''; + if( spacing != '' ) { + dynamicStyle += '.ast-mobile-popup-content > *, .ast-mobile-header-content > *, .ast-desktop-popup-content > *, .ast-desktop-header-content > * {'; + dynamicStyle += 'padding-top: ' + spacing + 'px;'; + dynamicStyle += 'padding-bottom: ' + spacing + 'px;'; + dynamicStyle += '} '; + } + astra_add_dynamic_css( 'off-canvas-inner-spacing', dynamicStyle ); + } ); + } ); + + wp.customize( 'astra-settings[mobile-header-type]', function ( value ) { + value.bind( function ( newVal ) { + + var mobile_header = document.querySelectorAll( "#ast-mobile-header" ); + var desktop_header = document.querySelectorAll( "#ast-desktop-header" ); + var header_type = newVal; + var off_canvas_slide = ( typeof ( wp.customize._value['astra-settings[off-canvas-slide]'] ) != 'undefined' ) ? wp.customize._value['astra-settings[off-canvas-slide]']._value : 'right'; + + var side_class = ''; + + if ( 'off-canvas' === header_type ) { + + if ( 'left' === off_canvas_slide ) { + + side_class = 'ast-mobile-popup-left'; + } else { + + side_class = 'ast-mobile-popup-right'; + } + } else if ( 'full-width' === header_type ) { + + side_class = 'ast-mobile-popup-full-width'; + } + + jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-left' ); + jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-right' ); + jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-full-width' ); + jQuery('.ast-mobile-popup-drawer').addClass( side_class ); + + if( 'full-width' === header_type ) { + + header_type = 'off-canvas'; + } + + for ( var k = 0; k < mobile_header.length; k++ ) { + mobile_header[k].setAttribute( 'data-type', header_type ); + } + for ( var k = 0; k < desktop_header.length; k++ ) { + desktop_header[k].setAttribute( 'data-type', header_type ); + } + + var event = new CustomEvent( "astMobileHeaderTypeChange", + { + "detail": { 'type' : header_type } + } + ); + + document.dispatchEvent(event); + } ); + } ); + + wp.customize( 'astra-settings[off-canvas-slide]', function ( value ) { + value.bind( function ( newval ) { + + var side_class = ''; + + if ( 'left' === newval ) { + + side_class = 'ast-mobile-popup-left'; + } else { + + side_class = 'ast-mobile-popup-right'; + } + + jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-left' ); + jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-right' ); + jQuery('.ast-mobile-popup-drawer').removeClass( 'ast-mobile-popup-full-width' ); + jQuery('.ast-mobile-popup-drawer').addClass( side_class ); + } ); + } ); + + // Padding. + wp.customize( 'astra-settings[off-canvas-padding]', function( value ) { + value.bind( function( padding ) { + if( + padding.desktop.bottom != '' || padding.desktop.top != '' || padding.desktop.left != '' || padding.desktop.right != '' || + padding.tablet.bottom != '' || padding.tablet.top != '' || padding.tablet.left != '' || padding.tablet.right != '' || + padding.mobile.bottom != '' || padding.mobile.top != '' || padding.mobile.left != '' || padding.mobile.right != '' + ) { + var dynamicStyle = ''; + dynamicStyle += '.ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content {'; + dynamicStyle += 'padding-left: ' + padding['desktop']['left'] + padding['desktop-unit'] + ';'; + dynamicStyle += 'padding-right: ' + padding['desktop']['right'] + padding['desktop-unit'] + ';'; + dynamicStyle += 'padding-top: ' + padding['desktop']['top'] + padding['desktop-unit'] + ';'; + dynamicStyle += 'padding-bottom: ' + padding['desktop']['bottom'] + padding['desktop-unit'] + ';'; + dynamicStyle += '} '; + + dynamicStyle += '@media (max-width: ' + tablet_break_point + 'px) {'; + dynamicStyle += '.ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content {'; + dynamicStyle += 'padding-left: ' + padding['tablet']['left'] + padding['tablet-unit'] + ';'; + dynamicStyle += 'padding-right: ' + padding['tablet']['right'] + padding['tablet-unit'] + ';'; + dynamicStyle += 'padding-top: ' + padding['tablet']['top'] + padding['tablet-unit'] + ';'; + dynamicStyle += 'padding-bottom: ' + padding['tablet']['bottom'] + padding['tablet-unit'] + ';'; + dynamicStyle += '} '; + dynamicStyle += '} '; + + dynamicStyle += '@media (max-width: ' + mobile_break_point + 'px) {'; + dynamicStyle += '.ast-mobile-popup-drawer.active .ast-desktop-popup-content, .ast-mobile-popup-drawer.active .ast-mobile-popup-content {'; + dynamicStyle += 'padding-left: ' + padding['mobile']['left'] + padding['mobile-unit'] + ';'; + dynamicStyle += 'padding-right: ' + padding['mobile']['right'] + padding['mobile-unit'] + ';'; + dynamicStyle += 'padding-top: ' + padding['mobile']['top'] + padding['mobile-unit'] + ';'; + dynamicStyle += 'padding-bottom: ' + padding['mobile']['bottom'] + padding['mobile-unit'] + ';'; + dynamicStyle += '} '; + dynamicStyle += '} '; + astra_add_dynamic_css( 'off-canvas-padding', dynamicStyle ); + } else { + astra_add_dynamic_css( 'off-canvas-padding', '' ); + } + } ); + } ); + + wp.customize( 'astra-settings[header-builder-menu-toggle-target]', function ( value ) { + value.bind( function ( newval ) { + var menuTargetClass = 'ast-builder-menu-toggle-' + newval + ' '; + + jQuery( '.site-header' ).removeClass( 'ast-builder-menu-toggle-icon' ); + jQuery( '.site-header' ).removeClass( 'ast-builder-menu-toggle-link' ); + jQuery( '.site-header' ).addClass( menuTargetClass ); + } ); + } ); + + wp.customize( 'astra-settings[header-offcanvas-content-alignment]', function ( value ) { + value.bind( function ( newval ) { + + var alignment_class = 'content-align-' + newval + ' '; + var menu_content_alignment = 'center'; + + jQuery('.ast-mobile-header-content').removeClass( 'content-align-flex-start' ); + jQuery('.ast-mobile-header-content').removeClass( 'content-align-flex-end' ); + jQuery('.ast-mobile-header-content').removeClass( 'content-align-center' ); + jQuery('.ast-mobile-popup-drawer').removeClass( 'content-align-flex-end' ); + jQuery('.ast-mobile-popup-drawer').removeClass( 'content-align-flex-start' ); + jQuery('.ast-mobile-popup-drawer').removeClass( 'content-align-center' ); + jQuery('.ast-desktop-header-content').removeClass( 'content-align-flex-start' ); + jQuery('.ast-desktop-header-content').removeClass( 'content-align-flex-end' ); + jQuery('.ast-desktop-header-content').removeClass( 'content-align-center' ); + + jQuery('.ast-desktop-header-content').addClass( alignment_class ); + jQuery('.ast-mobile-header-content').addClass( alignment_class ); + jQuery('.ast-mobile-popup-drawer').addClass( alignment_class ); + + + + if ( 'flex-start' === newval ) { + menu_content_alignment = 'left'; + } else if ( 'flex-end' === newval ) { + menu_content_alignment = 'right'; + } + + var dynamicStyle = '.content-align-' + newval + ' .ast-builder-layout-element {'; + dynamicStyle += 'justify-content: ' + newval + ';'; + dynamicStyle += '} '; + + dynamicStyle += '.content-align-' + newval + ' .main-header-menu {'; + dynamicStyle += 'text-align: ' + menu_content_alignment + ';'; + dynamicStyle += '} '; + + astra_add_dynamic_css( 'header-offcanvas-content-alignment', dynamicStyle ); + } ); + } ); + +} )( jQuery ); -- cgit v1.2.3-60-g2f50