initial
This commit is contained in:
@@ -0,0 +1,83 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles block functionality.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* The Block class.
|
||||
*/
|
||||
class GenerateBlocks_Block {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
protected static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Store our block name.
|
||||
*
|
||||
* @var string $block_name The block name.
|
||||
*/
|
||||
public static $block_name = '';
|
||||
|
||||
/**
|
||||
* Store our block ID in memory.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function store_block_id( $id ) {
|
||||
static::$block_ids[] = $id;
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if our block ID exists.
|
||||
*
|
||||
* @param string $id The block ID to check.
|
||||
*/
|
||||
public static function block_id_exists( $id ) {
|
||||
return in_array( $id, (array) static::$block_ids );
|
||||
}
|
||||
|
||||
/**
|
||||
* Render the block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $block_content The block content.
|
||||
* @param array $block The block.
|
||||
*/
|
||||
public static function render_block( $attributes, $block_content, $block ) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the block CSS.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
*/
|
||||
public static function get_css( $attributes ) {
|
||||
$id = $attributes['uniqueId'] ?? '';
|
||||
|
||||
if ( ! $id ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
// Store this block ID in memory.
|
||||
static::store_block_id( $id );
|
||||
|
||||
return apply_filters(
|
||||
'generateblocks_block_css',
|
||||
$attributes['css'] ?? '',
|
||||
[
|
||||
'attributes' => $attributes ?? [],
|
||||
'block_name' => static::$block_name ?? '',
|
||||
]
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,307 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Button Container block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* Add Button Container related functions.
|
||||
*/
|
||||
class GenerateBlocks_Block_Button_Container {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
private static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Keep track of CSS we want to output once per block type.
|
||||
*
|
||||
* @var boolean
|
||||
*/
|
||||
private static $singular_css_added = false;
|
||||
|
||||
/**
|
||||
* Block defaults.
|
||||
*/
|
||||
public static function defaults() {
|
||||
return [
|
||||
'alignment' => '',
|
||||
'alignmentTablet' => '',
|
||||
'alignmentMobile' => '',
|
||||
'marginTop' => '',
|
||||
'marginRight' => '',
|
||||
'marginBottom' => '',
|
||||
'marginLeft' => '',
|
||||
'marginTopTablet' => '',
|
||||
'marginRightTablet' => '',
|
||||
'marginBottomTablet' => '',
|
||||
'marginLeftTablet' => '',
|
||||
'marginTopMobile' => '',
|
||||
'marginRightMobile' => '',
|
||||
'marginBottomMobile' => '',
|
||||
'marginLeftMobile' => '',
|
||||
'marginUnit' => 'px',
|
||||
'stack' => false,
|
||||
'stackTablet' => false,
|
||||
'stackMobile' => false,
|
||||
'fillHorizontalSpace' => false,
|
||||
'fillHorizontalSpaceTablet' => false,
|
||||
'fillHorizontalSpaceMobile' => false,
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Store our block ID in memory.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function store_block_id( $id ) {
|
||||
self::$block_ids[] = $id;
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if our block ID exists.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function block_id_exists( $id ) {
|
||||
return in_array( $id, (array) self::$block_ids );
|
||||
}
|
||||
|
||||
/**
|
||||
* Compile our CSS data based on our block attributes.
|
||||
*
|
||||
* @param array $attributes Our block attributes.
|
||||
*/
|
||||
public static function get_css_data( $attributes ) {
|
||||
$css = new GenerateBlocks_Dynamic_CSS();
|
||||
$desktop_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$tablet_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$tablet_only_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$mobile_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$css_data = [];
|
||||
|
||||
$defaults = generateblocks_get_block_defaults();
|
||||
|
||||
$settings = wp_parse_args(
|
||||
$attributes,
|
||||
$defaults['buttonContainer']
|
||||
);
|
||||
|
||||
$id = $attributes['uniqueId'];
|
||||
$blockVersion = ! empty( $settings['blockVersion'] ) ? $settings['blockVersion'] : 1;
|
||||
|
||||
// Only add this CSS once.
|
||||
if ( ! self::$singular_css_added ) {
|
||||
$css->set_selector( '.gb-button-wrapper' );
|
||||
$css->add_property( 'display', 'flex' );
|
||||
$css->add_property( 'flex-wrap', 'wrap' );
|
||||
$css->add_property( 'align-items', 'flex-start' );
|
||||
$css->add_property( 'justify-content', 'flex-start' );
|
||||
$css->add_property( 'clear', 'both' );
|
||||
|
||||
do_action(
|
||||
'generateblocks_block_one_time_css_data',
|
||||
'button-container',
|
||||
$settings,
|
||||
$css
|
||||
);
|
||||
|
||||
self::$singular_css_added = true;
|
||||
}
|
||||
|
||||
// Map deprecated settings.
|
||||
$settings = GenerateBlocks_Map_Deprecated_Attributes::map_attributes( $settings );
|
||||
|
||||
$css->set_selector( '.gb-button-wrapper-' . $id );
|
||||
$css->add_property( 'justify-content', generateblocks_get_flexbox_alignment( $settings['alignment'] ) );
|
||||
generateblocks_add_spacing_css( $css, $settings );
|
||||
|
||||
$stack_desktop = $desktop_css;
|
||||
$stack_tablet_only = $tablet_only_css;
|
||||
|
||||
if ( $blockVersion < 2 ) {
|
||||
$stack_desktop = $css;
|
||||
$stack_tablet_only = $tablet_css;
|
||||
}
|
||||
|
||||
if ( $settings['stack'] ) {
|
||||
$stack_desktop->set_selector( '.gb-button-wrapper-' . $id );
|
||||
$stack_desktop->add_property( 'flex-direction', 'column' );
|
||||
$stack_desktop->add_property( 'align-items', generateblocks_get_flexbox_alignment( $settings['alignment'] ) );
|
||||
}
|
||||
|
||||
if ( $settings['fillHorizontalSpace'] ) {
|
||||
$stack_desktop->set_selector( '.gb-button-wrapper-' . $id . ' > .gb-button' );
|
||||
$stack_desktop->add_property( 'flex', '1' );
|
||||
}
|
||||
|
||||
if ( $settings['stack'] && $settings['fillHorizontalSpace'] ) {
|
||||
$stack_desktop->add_property( 'width', '100%' );
|
||||
$stack_desktop->add_property( 'box-sizing', 'border-box' );
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( '.gb-button-wrapper-' . $id );
|
||||
$tablet_css->add_property( 'justify-content', generateblocks_get_flexbox_alignment( $settings['alignmentTablet'] ) );
|
||||
generateblocks_add_spacing_css( $tablet_css, $settings, 'Tablet' );
|
||||
|
||||
if ( $settings['stackTablet'] ) {
|
||||
$stack_tablet_only->set_selector( '.gb-button-wrapper-' . $id );
|
||||
$stack_tablet_only->add_property( 'flex-direction', 'column' );
|
||||
$stack_tablet_only->add_property( 'align-items', generateblocks_get_flexbox_alignment( $settings['alignmentTablet'] ) );
|
||||
}
|
||||
|
||||
if ( $settings['fillHorizontalSpaceTablet'] ) {
|
||||
$stack_tablet_only->set_selector( '.gb-button-wrapper-' . $id . ' > .gb-button' );
|
||||
$stack_tablet_only->add_property( 'flex', '1' );
|
||||
}
|
||||
|
||||
if ( $settings['stackTablet'] && $settings['fillHorizontalSpaceTablet'] ) {
|
||||
$stack_tablet_only->add_property( 'width', '100%' );
|
||||
$stack_tablet_only->add_property( 'box-sizing', 'border-box' );
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( '.gb-button-wrapper-' . $id );
|
||||
$mobile_css->add_property( 'justify-content', generateblocks_get_flexbox_alignment( $settings['alignmentMobile'] ) );
|
||||
generateblocks_add_spacing_css( $mobile_css, $settings, 'Mobile' );
|
||||
|
||||
if ( $settings['stackMobile'] ) {
|
||||
$mobile_css->add_property( 'flex-direction', 'column' );
|
||||
$mobile_css->add_property( 'align-items', generateblocks_get_flexbox_alignment( $settings['alignmentMobile'] ) );
|
||||
}
|
||||
|
||||
if ( $settings['fillHorizontalSpaceMobile'] ) {
|
||||
$mobile_css->set_selector( '.gb-button-wrapper-' . $id . ' > .gb-button' );
|
||||
$mobile_css->add_property( 'flex', '1' );
|
||||
}
|
||||
|
||||
if ( $settings['stackMobile'] && $settings['fillHorizontalSpaceMobile'] ) {
|
||||
$mobile_css->add_property( 'width', '100%' );
|
||||
$mobile_css->add_property( 'box-sizing', 'border-box' );
|
||||
}
|
||||
|
||||
// Store this block ID in memory.
|
||||
self::store_block_id( $id );
|
||||
|
||||
/**
|
||||
* Do generateblocks_block_css_data hook
|
||||
*
|
||||
* @since 1.0
|
||||
*
|
||||
* @param string $name The name of our block.
|
||||
* @param array $settings The settings for the current block.
|
||||
* @param object $css Our desktop/main CSS data.
|
||||
* @param object $desktop_css Our desktop only CSS data.
|
||||
* @param object $tablet_css Our tablet CSS data.
|
||||
* @param object $tablet_only_css Our tablet only CSS data.
|
||||
* @param object $mobile_css Our mobile CSS data.
|
||||
*/
|
||||
do_action(
|
||||
'generateblocks_block_css_data',
|
||||
'button-container',
|
||||
$settings,
|
||||
$css,
|
||||
$desktop_css,
|
||||
$tablet_css,
|
||||
$tablet_only_css,
|
||||
$mobile_css
|
||||
);
|
||||
|
||||
return [
|
||||
'main' => $css->css_output(),
|
||||
'desktop' => $desktop_css->css_output(),
|
||||
'tablet' => $tablet_css->css_output(),
|
||||
'tablet_only' => $tablet_only_css->css_output(),
|
||||
'mobile' => $mobile_css->css_output(),
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Wrapper function for our dynamic buttons.
|
||||
*
|
||||
* @since 1.6.0
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $content The dynamic text to display.
|
||||
* @param WP_Block $block Block instance.
|
||||
*/
|
||||
public static function render_block( $attributes, $content, $block ) {
|
||||
if ( ! isset( $attributes['isDynamic'] ) || ! $attributes['isDynamic'] ) {
|
||||
// Add styles to this block if needed.
|
||||
$content = generateblocks_maybe_add_block_css(
|
||||
$content,
|
||||
[
|
||||
'class_name' => 'GenerateBlocks_Block_Button_Container',
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
return $content;
|
||||
}
|
||||
|
||||
if ( isset( $block->parsed_block['innerBlocks'] ) ) {
|
||||
$button_count = apply_filters(
|
||||
'generateblocks_button_count',
|
||||
count( (array) $block->parsed_block['innerBlocks'] ),
|
||||
$attributes,
|
||||
$block
|
||||
);
|
||||
|
||||
if ( 0 === $button_count ) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
$defaults = generateblocks_get_block_defaults();
|
||||
|
||||
$settings = wp_parse_args(
|
||||
$attributes,
|
||||
$defaults['buttonContainer']
|
||||
);
|
||||
|
||||
$classNames = array(
|
||||
'gb-button-wrapper',
|
||||
'gb-button-wrapper-' . $settings['uniqueId'],
|
||||
);
|
||||
|
||||
if ( ! empty( $settings['className'] ) ) {
|
||||
$classNames[] = $settings['className'];
|
||||
}
|
||||
|
||||
// Add styles to this block if needed.
|
||||
$output = generateblocks_maybe_add_block_css(
|
||||
'',
|
||||
[
|
||||
'class_name' => 'GenerateBlocks_Block_Button_Container',
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
$output .= sprintf(
|
||||
'<div %s>',
|
||||
generateblocks_attr(
|
||||
'button-container',
|
||||
array(
|
||||
'id' => isset( $settings['anchor'] ) ? $settings['anchor'] : null,
|
||||
'class' => implode( ' ', $classNames ),
|
||||
),
|
||||
$settings,
|
||||
$block
|
||||
)
|
||||
);
|
||||
|
||||
$output .= $content;
|
||||
|
||||
$output .= '</div>';
|
||||
|
||||
return $output;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,553 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Button block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* Add Button related functions.
|
||||
*/
|
||||
class GenerateBlocks_Block_Button {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
private static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Keep track of CSS we want to output once per block type.
|
||||
*
|
||||
* @var boolean
|
||||
*/
|
||||
private static $singular_css_added = false;
|
||||
|
||||
/**
|
||||
* Block defaults.
|
||||
*/
|
||||
public static function defaults() {
|
||||
return [
|
||||
'backgroundColor' => '',
|
||||
'backgroundColorHover' => '',
|
||||
'backgroundColorCurrent' => '',
|
||||
'textColor' => '',
|
||||
'textColorHover' => '',
|
||||
'textColorCurrent' => '',
|
||||
'fontFamilyFallback' => '',
|
||||
'googleFont' => false,
|
||||
'googleFontVariants' => '',
|
||||
'icon' => '',
|
||||
'hasIcon' => false,
|
||||
'iconLocation' => 'left',
|
||||
'removeText' => false,
|
||||
'ariaLabel' => '',
|
||||
'gradient' => false,
|
||||
'gradientDirection' => '',
|
||||
'gradientColorOne' => '',
|
||||
'gradientColorOneOpacity' => '',
|
||||
'gradientColorStopOne' => '',
|
||||
'gradientColorTwo' => '',
|
||||
'gradientColorTwoOpacity' => '',
|
||||
'gradientColorStopTwo' => '',
|
||||
'hasButtonContainer' => false,
|
||||
'variantRole' => '',
|
||||
'buttonType' => 'link',
|
||||
// Deprecated attributes.
|
||||
'backgroundColorOpacity' => 1,
|
||||
'backgroundColorHoverOpacity' => 1,
|
||||
'borderColorHoverOpacity' => 1,
|
||||
'borderColorOpacity' => 1,
|
||||
'fontSize' => false,
|
||||
'fontSizeTablet' => false,
|
||||
'fontSizeMobile' => false,
|
||||
'fontSizeUnit' => 'px',
|
||||
'letterSpacing' => '',
|
||||
'letterSpacingTablet' => '',
|
||||
'letterSpacingMobile' => '',
|
||||
'fontWeight' => '',
|
||||
'textTransform' => '',
|
||||
'alignment' => '',
|
||||
'alignmentTablet' => '',
|
||||
'alignmentMobile' => '',
|
||||
'fontFamily' => '',
|
||||
'iconPaddingTop' => '',
|
||||
'iconPaddingRight' => '0.5',
|
||||
'iconPaddingBottom' => '',
|
||||
'iconPaddingLeft' => '',
|
||||
'iconPaddingTopTablet' => '',
|
||||
'iconPaddingRightTablet' => '',
|
||||
'iconPaddingBottomTablet' => '',
|
||||
'iconPaddingLeftTablet' => '',
|
||||
'iconPaddingTopMobile' => '',
|
||||
'iconPaddingRightMobile' => '',
|
||||
'iconPaddingBottomMobile' => '',
|
||||
'iconPaddingLeftMobile' => '',
|
||||
'iconPaddingUnit' => 'em',
|
||||
'iconSize' => 1,
|
||||
'iconSizeTablet' => '',
|
||||
'iconSizeMobile' => '',
|
||||
'iconSizeUnit' => 'em',
|
||||
'borderColor' => '',
|
||||
'borderColorHover' => '',
|
||||
'borderColorCurrent' => '',
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Store our block ID in memory.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function store_block_id( $id ) {
|
||||
self::$block_ids[] = $id;
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if our block ID exists.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function block_id_exists( $id ) {
|
||||
return in_array( $id, (array) self::$block_ids );
|
||||
}
|
||||
|
||||
/**
|
||||
* Compile our CSS data based on our block attributes.
|
||||
*
|
||||
* @param array $attributes Our block attributes.
|
||||
*/
|
||||
public static function get_css_data( $attributes ) {
|
||||
$css = new GenerateBlocks_Dynamic_CSS();
|
||||
$desktop_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$tablet_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$tablet_only_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$mobile_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$css_data = [];
|
||||
|
||||
$defaults = generateblocks_get_block_defaults();
|
||||
|
||||
$settings = wp_parse_args(
|
||||
$attributes,
|
||||
$defaults['button']
|
||||
);
|
||||
|
||||
$id = $attributes['uniqueId'];
|
||||
$blockVersion = ! empty( $settings['blockVersion'] ) ? $settings['blockVersion'] : 1;
|
||||
|
||||
// Use legacy settings if needed.
|
||||
if ( $blockVersion < 2 ) {
|
||||
$settings = GenerateBlocks_Legacy_Attributes::get_settings( '1.4.0', 'button', $settings, $attributes );
|
||||
}
|
||||
|
||||
// Map deprecated settings.
|
||||
$settings = GenerateBlocks_Map_Deprecated_Attributes::map_attributes( $settings );
|
||||
|
||||
$selector = generateblocks_get_css_selector( 'button', $attributes );
|
||||
$use_visited_selector = generateblocks_use_visited_selector( 'button', $attributes );
|
||||
$using_global_style = isset( $settings['useGlobalStyle'] ) && $settings['useGlobalStyle'];
|
||||
|
||||
// Back-compatibility for when icon held a value.
|
||||
if ( $settings['icon'] ) {
|
||||
$settings['hasIcon'] = true;
|
||||
}
|
||||
|
||||
$gradientColorStopOneValue = '';
|
||||
$gradientColorStopTwoValue = '';
|
||||
|
||||
if ( $settings['gradient'] ) {
|
||||
if ( $settings['gradientColorOne'] && '' !== $settings['gradientColorStopOne'] ) {
|
||||
$gradientColorStopOneValue = ' ' . $settings['gradientColorStopOne'] . '%';
|
||||
}
|
||||
|
||||
if ( $settings['gradientColorTwo'] && '' !== $settings['gradientColorStopTwo'] ) {
|
||||
$gradientColorStopTwoValue = ' ' . $settings['gradientColorStopTwo'] . '%';
|
||||
}
|
||||
}
|
||||
|
||||
// Only add this CSS once.
|
||||
if ( ! self::$singular_css_added ) {
|
||||
// Singular CSS is no longer supported since 1.9.0.
|
||||
do_action(
|
||||
'generateblocks_block_one_time_css_data',
|
||||
'button',
|
||||
$settings,
|
||||
$css
|
||||
);
|
||||
|
||||
self::$singular_css_added = true;
|
||||
}
|
||||
|
||||
$visited_selector = $use_visited_selector
|
||||
? ', ' . $selector . ':visited'
|
||||
: '';
|
||||
|
||||
$css->set_selector( $selector . $visited_selector );
|
||||
generateblocks_add_layout_css( $css, $settings );
|
||||
generateblocks_add_sizing_css( $css, $settings );
|
||||
generateblocks_add_flex_child_css( $css, $settings );
|
||||
generateblocks_add_typography_css( $css, $settings );
|
||||
generateblocks_add_spacing_css( $css, $settings );
|
||||
generateblocks_add_border_css( $css, $settings );
|
||||
$css->add_property( 'background-color', generateblocks_hex2rgba( $settings['backgroundColor'], $settings['backgroundColorOpacity'] ) );
|
||||
$css->add_property( 'color', $settings['textColor'] );
|
||||
$css->add_property( 'text-decoration', 'none' );
|
||||
|
||||
if ( $settings['gradient'] ) {
|
||||
$css->add_property( 'background-image', 'linear-gradient(' . $settings['gradientDirection'] . 'deg, ' . generateblocks_hex2rgba( $settings['gradientColorOne'], $settings['gradientColorOneOpacity'] ) . $gradientColorStopOneValue . ', ' . generateblocks_hex2rgba( $settings['gradientColorTwo'], $settings['gradientColorTwoOpacity'] ) . $gradientColorStopTwoValue . ')' );
|
||||
}
|
||||
|
||||
if ( $blockVersion < 3 && ! $using_global_style ) {
|
||||
$css->add_property( 'display', 'inline-flex' );
|
||||
$css->add_property( 'align-items', 'center' );
|
||||
$css->add_property( 'justify-content', 'center' );
|
||||
$css->add_property( 'text-align', 'center' );
|
||||
}
|
||||
|
||||
$css->set_selector( $selector . ':hover, ' . $selector . ':active, ' . $selector . ':focus' );
|
||||
generateblocks_add_border_color_css( $css, $settings, 'Hover' );
|
||||
$css->add_property( 'background-color', generateblocks_hex2rgba( $settings['backgroundColorHover'], $settings['backgroundColorHoverOpacity'] ) );
|
||||
$css->add_property( 'color', $settings['textColorHover'] );
|
||||
|
||||
$visited_selector = $use_visited_selector
|
||||
? ', ' . $selector . '.gb-block-is-current:visited'
|
||||
: '';
|
||||
|
||||
$current_selector = sprintf(
|
||||
'%1$s.gb-block-is-current, %1$s.gb-block-is-current:hover, %1$s.gb-block-is-current:active, %1$s.gb-block-is-current:focus',
|
||||
$selector
|
||||
);
|
||||
|
||||
$css->set_selector( $current_selector . $visited_selector );
|
||||
generateblocks_add_border_color_css( $css, $settings, 'Current' );
|
||||
$css->add_property( 'background-color', $settings['backgroundColorCurrent'] );
|
||||
$css->add_property( 'color', $settings['textColorCurrent'] );
|
||||
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$css->set_selector( $selector . ' .gb-icon' );
|
||||
|
||||
if ( $blockVersion < 4 ) {
|
||||
$css->add_property( 'font-size', $settings['iconSize'], $settings['iconSizeUnit'] );
|
||||
}
|
||||
|
||||
$css->add_property( 'line-height', '0' );
|
||||
|
||||
if ( ! $settings['removeText'] ) {
|
||||
if ( $blockVersion < 4 ) {
|
||||
// Need to check for blockVersion here instead of mapping as iconPaddingRight has a default.
|
||||
$css->add_property( 'padding', array( $settings['iconPaddingTop'], $settings['iconPaddingRight'], $settings['iconPaddingBottom'], $settings['iconPaddingLeft'] ), $settings['iconPaddingUnit'] );
|
||||
} else {
|
||||
$css->add_property(
|
||||
'padding',
|
||||
array(
|
||||
generateblocks_get_array_attribute_value( 'paddingTop', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingRight', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingBottom', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingLeft', $settings['iconStyles'] ),
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
if ( $blockVersion < 3 ) {
|
||||
$css->add_property( 'align-items', 'center' );
|
||||
$css->add_property( 'display', 'inline-flex' );
|
||||
}
|
||||
|
||||
$css->set_selector( $selector . ' .gb-icon svg' );
|
||||
|
||||
if ( $blockVersion < 4 ) {
|
||||
$css->add_property( 'height', '1em' );
|
||||
$css->add_property( 'width', '1em' );
|
||||
}
|
||||
|
||||
$css->add_property( 'width', generateblocks_get_array_attribute_value( 'width', $settings['iconStyles'] ) );
|
||||
$css->add_property( 'height', generateblocks_get_array_attribute_value( 'height', $settings['iconStyles'] ) );
|
||||
$css->add_property( 'fill', 'currentColor' );
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( $selector );
|
||||
generateblocks_add_layout_css( $tablet_css, $settings, 'Tablet' );
|
||||
generateblocks_add_sizing_css( $tablet_css, $settings, 'Tablet' );
|
||||
generateblocks_add_flex_child_css( $tablet_css, $settings, 'Tablet' );
|
||||
generateblocks_add_typography_css( $tablet_css, $settings, 'Tablet' );
|
||||
generateblocks_add_spacing_css( $tablet_css, $settings, 'Tablet' );
|
||||
generateblocks_add_border_css( $tablet_css, $settings, 'Tablet' );
|
||||
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$tablet_css->set_selector( $selector . ' .gb-icon' );
|
||||
|
||||
if ( $blockVersion < 4 ) {
|
||||
$tablet_css->add_property( 'font-size', $settings['iconSizeTablet'], $settings['iconSizeUnit'] );
|
||||
}
|
||||
|
||||
if ( ! $settings['removeText'] ) {
|
||||
if ( $blockVersion < 4 ) {
|
||||
$tablet_css->add_property( 'padding', array( $settings['iconPaddingTopTablet'], $settings['iconPaddingRightTablet'], $settings['iconPaddingBottomTablet'], $settings['iconPaddingLeftTablet'] ), $settings['iconPaddingUnit'] );
|
||||
} else {
|
||||
$tablet_css->add_property(
|
||||
'padding',
|
||||
array(
|
||||
generateblocks_get_array_attribute_value( 'paddingTopTablet', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingRightTablet', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingBottomTablet', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingLeftTablet', $settings['iconStyles'] ),
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( $selector . ' .gb-icon svg' );
|
||||
$tablet_css->add_property( 'width', generateblocks_get_array_attribute_value( 'widthTablet', $settings['iconStyles'] ) );
|
||||
$tablet_css->add_property( 'height', generateblocks_get_array_attribute_value( 'heightTablet', $settings['iconStyles'] ) );
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( $selector );
|
||||
generateblocks_add_layout_css( $mobile_css, $settings, 'Mobile' );
|
||||
generateblocks_add_sizing_css( $mobile_css, $settings, 'Mobile' );
|
||||
generateblocks_add_flex_child_css( $mobile_css, $settings, 'Mobile' );
|
||||
generateblocks_add_typography_css( $mobile_css, $settings, 'Mobile' );
|
||||
generateblocks_add_spacing_css( $mobile_css, $settings, 'Mobile' );
|
||||
generateblocks_add_border_css( $mobile_css, $settings, 'Mobile' );
|
||||
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$mobile_css->set_selector( $selector . ' .gb-icon' );
|
||||
|
||||
if ( $blockVersion < 4 ) {
|
||||
$mobile_css->add_property( 'font-size', $settings['iconSizeMobile'], $settings['iconSizeUnit'] );
|
||||
}
|
||||
|
||||
if ( ! $settings['removeText'] ) {
|
||||
if ( $blockVersion < 4 ) {
|
||||
$mobile_css->add_property( 'padding', array( $settings['iconPaddingTopMobile'], $settings['iconPaddingRightMobile'], $settings['iconPaddingBottomMobile'], $settings['iconPaddingLeftMobile'] ), $settings['iconPaddingUnit'] );
|
||||
} else {
|
||||
$mobile_css->add_property(
|
||||
'padding',
|
||||
array(
|
||||
generateblocks_get_array_attribute_value( 'paddingTopMobile', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingRightMobile', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingBottomMobile', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingLeftMobile', $settings['iconStyles'] ),
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( $selector . ' .gb-icon svg' );
|
||||
$mobile_css->add_property( 'width', generateblocks_get_array_attribute_value( 'widthMobile', $settings['iconStyles'] ) );
|
||||
$mobile_css->add_property( 'height', generateblocks_get_array_attribute_value( 'heightMobile', $settings['iconStyles'] ) );
|
||||
}
|
||||
|
||||
// Store this block ID in memory.
|
||||
self::store_block_id( $id );
|
||||
|
||||
/**
|
||||
* Do generateblocks_block_css_data hook
|
||||
*
|
||||
* @since 1.0
|
||||
*
|
||||
* @param string $name The name of our block.
|
||||
* @param array $settings The settings for the current block.
|
||||
* @param object $css Our desktop/main CSS data.
|
||||
* @param object $desktop_css Our desktop only CSS data.
|
||||
* @param object $tablet_css Our tablet CSS data.
|
||||
* @param object $tablet_only_css Our tablet only CSS data.
|
||||
* @param object $mobile_css Our mobile CSS data.
|
||||
*/
|
||||
do_action(
|
||||
'generateblocks_block_css_data',
|
||||
'button',
|
||||
$settings,
|
||||
$css,
|
||||
$desktop_css,
|
||||
$tablet_css,
|
||||
$tablet_only_css,
|
||||
$mobile_css
|
||||
);
|
||||
|
||||
return [
|
||||
'main' => $css->css_output(),
|
||||
'desktop' => $desktop_css->css_output(),
|
||||
'tablet' => $tablet_css->css_output(),
|
||||
'tablet_only' => $tablet_only_css->css_output(),
|
||||
'mobile' => $mobile_css->css_output(),
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Wrapper function for our dynamic buttons.
|
||||
*
|
||||
* @since 1.6.0
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $content The dynamic text to display.
|
||||
* @param WP_Block $block Block instance.
|
||||
*/
|
||||
public static function render_block( $attributes, $content, $block ) {
|
||||
if ( ! isset( $attributes['hasUrl'] ) && strpos( trim( $content ), '<a' ) === 0 ) {
|
||||
$attributes['hasUrl'] = true;
|
||||
}
|
||||
|
||||
if ( ! isset( $attributes['useDynamicData'] ) || ! $attributes['useDynamicData'] ) {
|
||||
// Add styles to this block if needed.
|
||||
$content = generateblocks_maybe_add_block_css(
|
||||
$content,
|
||||
[
|
||||
'class_name' => 'GenerateBlocks_Block_Button',
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
return $content;
|
||||
}
|
||||
|
||||
$allow_empty_content = false;
|
||||
|
||||
// Add an attribute showing we're working with the Button block.
|
||||
$attributes['isButton'] = true;
|
||||
|
||||
if ( empty( $attributes['dynamicContentType'] ) ) {
|
||||
$dynamic_content = GenerateBlocks_Dynamic_Content::get_static_content( $content );
|
||||
|
||||
if ( ! empty( $attributes['hasIcon'] ) && ! empty( $attributes['removeText'] ) ) {
|
||||
// Allow icon-only items to continue.
|
||||
$allow_empty_content = true;
|
||||
}
|
||||
} else {
|
||||
$dynamic_content = GenerateBlocks_Dynamic_Content::get_content( $attributes, $block );
|
||||
}
|
||||
|
||||
if ( ! $dynamic_content && '0' !== $dynamic_content && ! $allow_empty_content ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
$defaults = generateblocks_get_block_defaults();
|
||||
|
||||
$settings = wp_parse_args(
|
||||
$attributes,
|
||||
$defaults['button']
|
||||
);
|
||||
|
||||
$classNames = array(
|
||||
'gb-button',
|
||||
'gb-button-' . $settings['uniqueId'],
|
||||
);
|
||||
|
||||
if ( ! empty( $settings['className'] ) ) {
|
||||
$classNames[] = $settings['className'];
|
||||
}
|
||||
|
||||
if ( empty( $settings['hasIcon'] ) ) {
|
||||
$classNames[] = 'gb-button-text';
|
||||
}
|
||||
|
||||
$relAttributes = array();
|
||||
|
||||
if ( ! empty( $settings['relNoFollow'] ) ) {
|
||||
$relAttributes[] = 'nofollow';
|
||||
}
|
||||
|
||||
if ( ! empty( $settings['target'] ) ) {
|
||||
$relAttributes[] = 'noopener';
|
||||
$relAttributes[] = 'noreferrer';
|
||||
}
|
||||
|
||||
if ( ! empty( $settings['relSponsored'] ) ) {
|
||||
$relAttributes[] = 'sponsored';
|
||||
}
|
||||
|
||||
$icon_html = '';
|
||||
|
||||
// Extract our icon from the static HTML.
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$icon_html = GenerateBlocks_Dynamic_Content::get_icon_html( $content );
|
||||
}
|
||||
|
||||
// Add styles to this block if needed.
|
||||
$output = generateblocks_maybe_add_block_css(
|
||||
'',
|
||||
[
|
||||
'class_name' => 'GenerateBlocks_Block_Button',
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
foreach ( (array) $dynamic_content as $content ) {
|
||||
$tagName = 'span';
|
||||
|
||||
$dynamic_link = GenerateBlocks_Dynamic_Content::get_dynamic_url( $attributes, $block );
|
||||
|
||||
if ( ! empty( $content['attributes']['href'] ) || $dynamic_link ) {
|
||||
$tagName = 'a';
|
||||
}
|
||||
|
||||
if ( 'button' === $settings['buttonType'] ) {
|
||||
$tagName = 'button';
|
||||
}
|
||||
|
||||
$button_attributes = array(
|
||||
'id' => ! empty( $settings['anchor'] ) ? $settings['anchor'] : null,
|
||||
'class' => implode( ' ', $classNames ),
|
||||
'href' => 'a' === $tagName ? $dynamic_link : null,
|
||||
'rel' => ! empty( $relAttributes ) ? implode( ' ', $relAttributes ) : null,
|
||||
'target' => ! empty( $settings['target'] ) ? '_blank' : null,
|
||||
'aria-label' => ! empty( $settings['ariaLabel'] ) ? $settings['ariaLabel'] : null,
|
||||
);
|
||||
|
||||
if ( isset( $content['attributes'] ) ) {
|
||||
foreach ( $content['attributes'] as $attribute => $value ) {
|
||||
if ( 'class' === $attribute ) {
|
||||
$button_attributes[ $attribute ] .= ' ' . $value;
|
||||
} else {
|
||||
$button_attributes[ $attribute ] = $value;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$output .= sprintf(
|
||||
'<%1$s %2$s>',
|
||||
$tagName,
|
||||
generateblocks_attr(
|
||||
'dynamic-button',
|
||||
$button_attributes,
|
||||
$settings,
|
||||
$block
|
||||
)
|
||||
);
|
||||
|
||||
if ( $icon_html ) {
|
||||
if ( 'left' === $settings['iconLocation'] ) {
|
||||
$output .= $icon_html;
|
||||
}
|
||||
|
||||
$output .= '<span class="gb-button-text">';
|
||||
}
|
||||
|
||||
if ( isset( $content['content'] ) ) {
|
||||
$output .= $content['content'];
|
||||
} else {
|
||||
$output .= $content;
|
||||
}
|
||||
|
||||
if ( $icon_html ) {
|
||||
$output .= '</span>';
|
||||
|
||||
if ( 'right' === $settings['iconLocation'] ) {
|
||||
$output .= $icon_html;
|
||||
}
|
||||
}
|
||||
|
||||
$output .= sprintf(
|
||||
'</%s>',
|
||||
$tagName
|
||||
);
|
||||
}
|
||||
|
||||
return $output;
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,50 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Element block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* The Element block.
|
||||
*/
|
||||
class GenerateBlocks_Block_Element extends GenerateBlocks_Block {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
protected static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Store our block name.
|
||||
*
|
||||
* @var string $block_name The block name.
|
||||
*/
|
||||
public static $block_name = 'generateblocks/element';
|
||||
|
||||
/**
|
||||
* Render the Element block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $block_content The block content.
|
||||
* @param array $block The block.
|
||||
*/
|
||||
public static function render_block( $attributes, $block_content, $block ) {
|
||||
// Add styles to this block if needed.
|
||||
$block_content = generateblocks_maybe_add_block_css(
|
||||
$block_content,
|
||||
[
|
||||
'class_name' => __CLASS__,
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
return $block_content;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,306 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Grid block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* Add Grid related functions.
|
||||
*/
|
||||
class GenerateBlocks_Block_Grid {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
private static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Keep track of CSS we want to output once per block type.
|
||||
*
|
||||
* @var boolean
|
||||
*/
|
||||
private static $singular_css_added = false;
|
||||
|
||||
/**
|
||||
* Block defaults.
|
||||
*/
|
||||
public static function defaults() {
|
||||
return [
|
||||
'horizontalGap' => '',
|
||||
'verticalGap' => '',
|
||||
'verticalAlignment' => '',
|
||||
'horizontalGapTablet' => '',
|
||||
'verticalGapTablet' => '',
|
||||
'verticalAlignmentTablet' => 'inherit',
|
||||
'horizontalGapMobile' => '',
|
||||
'verticalGapMobile' => '',
|
||||
'verticalAlignmentMobile' => 'inherit',
|
||||
'horizontalAlignment' => '',
|
||||
'horizontalAlignmentTablet' => '',
|
||||
'horizontalAlignmentMobile' => '',
|
||||
'useLegacyRowGap' => false,
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Store our block ID in memory.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function store_block_id( $id ) {
|
||||
self::$block_ids[] = $id;
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if our block ID exists.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function block_id_exists( $id ) {
|
||||
return in_array( $id, (array) self::$block_ids );
|
||||
}
|
||||
|
||||
/**
|
||||
* Compile our CSS data based on our block attributes.
|
||||
*
|
||||
* @param array $attributes Our block attributes.
|
||||
*/
|
||||
public static function get_css_data( $attributes ) {
|
||||
$css = new GenerateBlocks_Dynamic_CSS();
|
||||
$desktop_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$tablet_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$tablet_only_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$mobile_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$css_data = [];
|
||||
|
||||
$defaults = generateblocks_get_block_defaults();
|
||||
|
||||
$settings = wp_parse_args(
|
||||
$attributes,
|
||||
$defaults['gridContainer']
|
||||
);
|
||||
|
||||
$id = $attributes['uniqueId'];
|
||||
$blockVersion = ! empty( $settings['blockVersion'] ) ? $settings['blockVersion'] : 1;
|
||||
|
||||
// Use legacy settings if needed.
|
||||
if ( $blockVersion < 2 ) {
|
||||
$settings = GenerateBlocks_Legacy_Attributes::get_settings( '1.4.0', 'grid', $settings, $attributes );
|
||||
}
|
||||
|
||||
$gap_direction = 'left';
|
||||
|
||||
if ( is_rtl() ) {
|
||||
$gap_direction = 'right';
|
||||
}
|
||||
|
||||
// Don't output horizontal gap defaults if we're using global styles.
|
||||
if ( $blockVersion < 2 && isset( $settings['useGlobalStyle'] ) && $settings['useGlobalStyle'] && isset( $settings['globalStyleId'] ) && $settings['globalStyleId'] ) {
|
||||
if ( (string) $settings['horizontalGap'] === (string) $defaults['gridContainer']['horizontalGap'] ) {
|
||||
$settings['horizontalGap'] = '';
|
||||
}
|
||||
}
|
||||
|
||||
// Only add this CSS once.
|
||||
if ( ! self::$singular_css_added ) {
|
||||
do_action(
|
||||
'generateblocks_block_one_time_css_data',
|
||||
'grid',
|
||||
$settings,
|
||||
$css
|
||||
);
|
||||
|
||||
self::$singular_css_added = true;
|
||||
}
|
||||
|
||||
$css->set_selector( '.gb-grid-wrapper-' . $id );
|
||||
$css->add_property( 'display', 'flex' );
|
||||
$css->add_property( 'flex-wrap', 'wrap' );
|
||||
$css->add_property( 'align-items', $settings['verticalAlignment'] );
|
||||
$css->add_property( 'justify-content', $settings['horizontalAlignment'] );
|
||||
|
||||
if ( $blockVersion > 2 && ! $settings['useLegacyRowGap'] ) {
|
||||
$css->add_property( 'row-gap', $settings['verticalGap'], 'px' );
|
||||
}
|
||||
|
||||
if ( $settings['horizontalGap'] ) {
|
||||
$css->add_property( 'margin-' . $gap_direction, '-' . $settings['horizontalGap'] . 'px' );
|
||||
}
|
||||
|
||||
$css->set_selector( '.gb-grid-wrapper-' . $id . ' > .gb-grid-column' );
|
||||
$css->add_property( 'box-sizing', 'border-box' );
|
||||
$css->add_property( 'padding-' . $gap_direction, $settings['horizontalGap'], 'px' );
|
||||
|
||||
if ( $blockVersion < 3 || $settings['useLegacyRowGap'] ) {
|
||||
$css->add_property( 'padding-bottom', $settings['verticalGap'], 'px' );
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( '.gb-grid-wrapper-' . $id );
|
||||
|
||||
if ( $blockVersion > 2 && ! $settings['useLegacyRowGap'] ) {
|
||||
$tablet_css->add_property( 'row-gap', $settings['verticalGapTablet'], 'px' );
|
||||
}
|
||||
|
||||
if ( 'inherit' !== $settings['verticalAlignmentTablet'] ) {
|
||||
$tablet_css->add_property( 'align-items', $settings['verticalAlignmentTablet'] );
|
||||
}
|
||||
|
||||
if ( 'inherit' !== $settings['horizontalAlignmentTablet'] ) {
|
||||
$tablet_css->add_property( 'justify-content', $settings['horizontalAlignmentTablet'] );
|
||||
}
|
||||
|
||||
if ( $settings['horizontalGapTablet'] ) {
|
||||
$tablet_css->add_property( 'margin-' . $gap_direction, '-' . $settings['horizontalGapTablet'] . 'px' );
|
||||
} elseif ( 0 === $settings['horizontalGapTablet'] ) {
|
||||
$tablet_css->add_property( 'margin-' . $gap_direction, $settings['horizontalGapTablet'] );
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( '.gb-grid-wrapper-' . $id . ' > .gb-grid-column' );
|
||||
$tablet_css->add_property( 'padding-' . $gap_direction, $settings['horizontalGapTablet'], 'px' );
|
||||
|
||||
if ( $blockVersion < 3 || $settings['useLegacyRowGap'] ) {
|
||||
$tablet_css->add_property( 'padding-bottom', $settings['verticalGapTablet'], 'px' );
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( '.gb-grid-wrapper-' . $id );
|
||||
|
||||
if ( $blockVersion > 2 && ! $settings['useLegacyRowGap'] ) {
|
||||
$mobile_css->add_property( 'row-gap', $settings['verticalGapMobile'], 'px' );
|
||||
}
|
||||
|
||||
if ( 'inherit' !== $settings['verticalAlignmentMobile'] ) {
|
||||
$mobile_css->add_property( 'align-items', $settings['verticalAlignmentMobile'] );
|
||||
}
|
||||
|
||||
if ( 'inherit' !== $settings['horizontalAlignmentMobile'] ) {
|
||||
$mobile_css->add_property( 'justify-content', $settings['horizontalAlignmentMobile'] );
|
||||
}
|
||||
|
||||
if ( $settings['horizontalGapMobile'] ) {
|
||||
$mobile_css->add_property( 'margin-' . $gap_direction, '-' . $settings['horizontalGapMobile'] . 'px' );
|
||||
} elseif ( 0 === $settings['horizontalGapMobile'] ) {
|
||||
$mobile_css->add_property( 'margin-' . $gap_direction, $settings['horizontalGapMobile'] );
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( '.gb-grid-wrapper-' . $id . ' > .gb-grid-column' );
|
||||
$mobile_css->add_property( 'padding-' . $gap_direction, $settings['horizontalGapMobile'], 'px' );
|
||||
|
||||
if ( $blockVersion < 3 || $settings['useLegacyRowGap'] ) {
|
||||
$mobile_css->add_property( 'padding-bottom', $settings['verticalGapMobile'], 'px' );
|
||||
}
|
||||
|
||||
// Store this block ID in memory.
|
||||
self::store_block_id( $id );
|
||||
|
||||
/**
|
||||
* Do generateblocks_block_css_data hook
|
||||
*
|
||||
* @since 1.0
|
||||
*
|
||||
* @param string $name The name of our block.
|
||||
* @param array $settings The settings for the current block.
|
||||
* @param object $css Our desktop/main CSS data.
|
||||
* @param object $desktop_css Our desktop only CSS data.
|
||||
* @param object $tablet_css Our tablet CSS data.
|
||||
* @param object $tablet_only_css Our tablet only CSS data.
|
||||
* @param object $mobile_css Our mobile CSS data.
|
||||
*/
|
||||
do_action(
|
||||
'generateblocks_block_css_data',
|
||||
'grid',
|
||||
$settings,
|
||||
$css,
|
||||
$desktop_css,
|
||||
$tablet_css,
|
||||
$tablet_only_css,
|
||||
$mobile_css
|
||||
);
|
||||
|
||||
return [
|
||||
'main' => $css->css_output(),
|
||||
'desktop' => $desktop_css->css_output(),
|
||||
'tablet' => $tablet_css->css_output(),
|
||||
'tablet_only' => $tablet_only_css->css_output(),
|
||||
'mobile' => $mobile_css->css_output(),
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Wrapper function for our dynamic buttons.
|
||||
*
|
||||
* @since 1.6.0
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $content The dynamic text to display.
|
||||
* @param WP_Block $block Block instance.
|
||||
*/
|
||||
public static function render_block( $attributes, $content, $block ) {
|
||||
if ( ! isset( $attributes['isDynamic'] ) || ! $attributes['isDynamic'] ) {
|
||||
// Add styles to this block if needed.
|
||||
$content = generateblocks_maybe_add_block_css(
|
||||
$content,
|
||||
[
|
||||
'class_name' => 'GenerateBlocks_Block_Grid',
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
return $content;
|
||||
}
|
||||
|
||||
$defaults = generateblocks_get_block_defaults();
|
||||
|
||||
$settings = wp_parse_args(
|
||||
$attributes,
|
||||
$defaults['gridContainer']
|
||||
);
|
||||
|
||||
$classNames = array(
|
||||
'gb-grid-wrapper',
|
||||
'gb-grid-wrapper-' . $settings['uniqueId'],
|
||||
);
|
||||
|
||||
if ( ! empty( $settings['className'] ) ) {
|
||||
$classNames[] = $settings['className'];
|
||||
}
|
||||
|
||||
// Add styles to this block if needed.
|
||||
$output = generateblocks_maybe_add_block_css(
|
||||
'',
|
||||
[
|
||||
'class_name' => 'GenerateBlocks_Block_Grid',
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
$output .= sprintf(
|
||||
'<div %s>',
|
||||
generateblocks_attr(
|
||||
'grid-wrapper',
|
||||
array(
|
||||
'id' => isset( $settings['anchor'] ) ? $settings['anchor'] : null,
|
||||
'class' => implode( ' ', $classNames ),
|
||||
),
|
||||
$settings,
|
||||
$block
|
||||
)
|
||||
);
|
||||
|
||||
if ( empty( $attributes['isQueryLoop'] ) ) {
|
||||
$output .= $content;
|
||||
} else {
|
||||
$output .= GenerateBlocks_Block_Query_Loop::render_block( $attributes, $content, $block );
|
||||
}
|
||||
|
||||
$output .= '</div>';
|
||||
|
||||
return $output;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,828 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Headline block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* Add Headline related functions.
|
||||
*/
|
||||
class GenerateBlocks_Block_Headline {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
private static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Keep track of CSS we want to output once per block type.
|
||||
*
|
||||
* @var boolean
|
||||
*/
|
||||
private static $singular_css_added = false;
|
||||
|
||||
/**
|
||||
* Block defaults.
|
||||
*/
|
||||
public static function defaults() {
|
||||
return [
|
||||
'element' => 'h2',
|
||||
'cssClasses' => '',
|
||||
'backgroundColor' => '',
|
||||
'textColor' => '',
|
||||
'linkColor' => '',
|
||||
'linkColorHover' => '',
|
||||
'highlightTextColor' => '',
|
||||
'fontFamilyFallback' => '',
|
||||
'googleFont' => false,
|
||||
'googleFontVariants' => '',
|
||||
'icon' => '',
|
||||
'hasIcon' => false,
|
||||
'iconColor' => '',
|
||||
'iconLocation' => 'inline',
|
||||
'iconLocationTablet' => '',
|
||||
'iconLocationMobile' => '',
|
||||
'removeText' => false,
|
||||
'ariaLabel' => '',
|
||||
// Deprecated attributes.
|
||||
'backgroundColorOpacity' => 1,
|
||||
'borderColorOpacity' => 1,
|
||||
'iconColorOpacity' => 1,
|
||||
'fontSize' => '',
|
||||
'fontSizeTablet' => '',
|
||||
'fontSizeMobile' => '',
|
||||
'fontSizeUnit' => 'px',
|
||||
'lineHeight' => '',
|
||||
'lineHeightTablet' => '',
|
||||
'lineHeightMobile' => '',
|
||||
'lineHeightUnit' => 'em',
|
||||
'letterSpacing' => '',
|
||||
'letterSpacingTablet' => '',
|
||||
'letterSpacingMobile' => '',
|
||||
'fontWeight' => '',
|
||||
'textTransform' => '',
|
||||
'alignment' => '',
|
||||
'alignmentTablet' => '',
|
||||
'alignmentMobile' => '',
|
||||
'iconVerticalAlignment' => 'center',
|
||||
'iconVerticalAlignmentTablet' => '',
|
||||
'iconVerticalAlignmentMobile' => '',
|
||||
'inlineWidth' => false,
|
||||
'inlineWidthTablet' => false,
|
||||
'inlineWidthMobile' => false,
|
||||
'fontFamily' => '',
|
||||
'borderColor' => '',
|
||||
'iconPaddingTop' => '',
|
||||
'iconPaddingRight' => '0.5',
|
||||
'iconPaddingBottom' => '',
|
||||
'iconPaddingLeft' => '',
|
||||
'iconPaddingTopTablet' => '',
|
||||
'iconPaddingRightTablet' => '',
|
||||
'iconPaddingBottomTablet' => '',
|
||||
'iconPaddingLeftTablet' => '',
|
||||
'iconPaddingTopMobile' => '',
|
||||
'iconPaddingRightMobile' => '',
|
||||
'iconPaddingBottomMobile' => '',
|
||||
'iconPaddingLeftMobile' => '',
|
||||
'iconPaddingUnit' => 'em',
|
||||
'iconSize' => 1,
|
||||
'iconSizeTablet' => '',
|
||||
'iconSizeMobile' => '',
|
||||
'iconSizeUnit' => 'em',
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Store our block ID in memory.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function store_block_id( $id ) {
|
||||
self::$block_ids[] = $id;
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if our block ID exists.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function block_id_exists( $id ) {
|
||||
return in_array( $id, (array) self::$block_ids );
|
||||
}
|
||||
|
||||
/**
|
||||
* Compile our CSS data based on our block attributes.
|
||||
*
|
||||
* @param array $attributes Our block attributes.
|
||||
*/
|
||||
public static function get_css_data( $attributes ) {
|
||||
$css = new GenerateBlocks_Dynamic_CSS();
|
||||
$desktop_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$tablet_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$tablet_only_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$mobile_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$css_data = [];
|
||||
|
||||
$defaults = generateblocks_get_block_defaults();
|
||||
|
||||
$settings = wp_parse_args(
|
||||
$attributes,
|
||||
$defaults['headline']
|
||||
);
|
||||
|
||||
$id = $attributes['uniqueId'];
|
||||
$blockVersion = ! empty( $settings['blockVersion'] ) ? $settings['blockVersion'] : 1;
|
||||
|
||||
// Map deprecated settings.
|
||||
$settings = GenerateBlocks_Map_Deprecated_Attributes::map_attributes( $settings );
|
||||
|
||||
$selector = generateblocks_get_css_selector( 'headline', $attributes );
|
||||
|
||||
// Back-compatibility for when icon held a value.
|
||||
if ( $settings['icon'] ) {
|
||||
$settings['hasIcon'] = true;
|
||||
}
|
||||
|
||||
// Only add this CSS once.
|
||||
if ( ! self::$singular_css_added ) {
|
||||
// Singular CSS is no longer supported since 1.9.0.
|
||||
do_action(
|
||||
'generateblocks_block_one_time_css_data',
|
||||
'headline',
|
||||
$settings,
|
||||
$css
|
||||
);
|
||||
|
||||
self::$singular_css_added = true;
|
||||
}
|
||||
|
||||
if ( ! isset( $attributes['hasWrapper'] ) ) {
|
||||
$css->set_selector( $selector );
|
||||
generateblocks_add_layout_css( $css, $settings );
|
||||
generateblocks_add_sizing_css( $css, $settings );
|
||||
generateblocks_add_flex_child_css( $css, $settings );
|
||||
generateblocks_add_typography_css( $css, $settings );
|
||||
generateblocks_add_spacing_css( $css, $settings );
|
||||
generateblocks_add_border_css( $css, $settings );
|
||||
$css->add_property( 'color', $settings['textColor'] );
|
||||
$css->add_property( 'background-color', generateblocks_hex2rgba( $settings['backgroundColor'], $settings['backgroundColorOpacity'] ) );
|
||||
|
||||
if ( $blockVersion < 2 && $settings['inlineWidth'] ) {
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$css->add_property( 'display', 'inline-flex' );
|
||||
} else {
|
||||
$css->add_property( 'display', 'inline-block' );
|
||||
}
|
||||
}
|
||||
|
||||
if ( $blockVersion < 2 && $settings['hasIcon'] ) {
|
||||
if ( ! $settings['inlineWidth'] ) {
|
||||
$css->add_property( 'display', 'flex' );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocation'] ) {
|
||||
$css->add_property( 'text-align', $settings['alignment'] );
|
||||
} else {
|
||||
$css->add_property( 'justify-content', generateblocks_get_flexbox_alignment( $settings['alignment'] ) );
|
||||
}
|
||||
|
||||
if ( 'inline' === $settings['iconLocation'] ) {
|
||||
$css->add_property( 'align-items', generateblocks_get_flexbox_alignment( $settings['iconVerticalAlignment'] ) );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocation'] ) {
|
||||
$css->add_property( 'flex-direction', 'column' );
|
||||
}
|
||||
}
|
||||
|
||||
$css->set_selector( $selector . ' a' );
|
||||
$css->add_property( 'color', $settings['linkColor'] );
|
||||
|
||||
$css->set_selector( $selector . ' a:hover' );
|
||||
$css->add_property( 'color', $settings['linkColorHover'] );
|
||||
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$css->set_selector( $selector . ' .gb-icon' );
|
||||
$css->add_property( 'line-height', '0' );
|
||||
$css->add_property( 'color', generateblocks_hex2rgba( $settings['iconColor'], $settings['iconColorOpacity'] ) );
|
||||
|
||||
if ( ! $settings['removeText'] ) {
|
||||
if ( $blockVersion < 3 ) {
|
||||
// Need to check for blockVersion here instead of mapping as iconPaddingRight has a default.
|
||||
$css->add_property( 'padding', array( $settings['iconPaddingTop'], $settings['iconPaddingRight'], $settings['iconPaddingBottom'], $settings['iconPaddingLeft'] ), $settings['iconPaddingUnit'] );
|
||||
} else {
|
||||
$css->add_property(
|
||||
'padding',
|
||||
array(
|
||||
generateblocks_get_array_attribute_value( 'paddingTop', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingRight', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingBottom', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingLeft', $settings['iconStyles'] ),
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
if ( $blockVersion < 2 ) {
|
||||
if ( 'above' === $settings['iconLocation'] ) {
|
||||
$css->add_property( 'display', 'inline' );
|
||||
} else {
|
||||
$css->add_property( 'display', 'inline-flex' );
|
||||
}
|
||||
}
|
||||
|
||||
$css->set_selector( $selector . ' .gb-icon svg' );
|
||||
|
||||
if ( $blockVersion < 3 ) {
|
||||
$css->add_property( 'width', $settings['iconSize'], $settings['iconSizeUnit'] );
|
||||
$css->add_property( 'height', $settings['iconSize'], $settings['iconSizeUnit'] );
|
||||
}
|
||||
|
||||
$css->add_property( 'width', generateblocks_get_array_attribute_value( 'width', $settings['iconStyles'] ) );
|
||||
$css->add_property( 'height', generateblocks_get_array_attribute_value( 'height', $settings['iconStyles'] ) );
|
||||
$css->add_property( 'fill', 'currentColor' );
|
||||
}
|
||||
|
||||
if ( $settings['highlightTextColor'] ) {
|
||||
$css->set_selector( $selector . ' .gb-highlight' );
|
||||
$css->add_property( 'color', $settings['highlightTextColor'] );
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( $selector );
|
||||
generateblocks_add_layout_css( $tablet_css, $settings, 'Tablet' );
|
||||
generateblocks_add_sizing_css( $tablet_css, $settings, 'Tablet' );
|
||||
generateblocks_add_flex_child_css( $tablet_css, $settings, 'Tablet' );
|
||||
generateblocks_add_typography_css( $tablet_css, $settings, 'Tablet' );
|
||||
generateblocks_add_spacing_css( $tablet_css, $settings, 'Tablet' );
|
||||
generateblocks_add_border_css( $tablet_css, $settings, 'Tablet' );
|
||||
|
||||
if ( $blockVersion < 2 && $settings['inlineWidthTablet'] ) {
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$tablet_css->add_property( 'display', 'inline-flex' );
|
||||
} else {
|
||||
$tablet_css->add_property( 'display', 'inline-block' );
|
||||
}
|
||||
}
|
||||
|
||||
if ( $settings['hasIcon'] ) {
|
||||
if ( $blockVersion < 2 ) {
|
||||
$tablet_css->add_property( 'justify-content', generateblocks_get_flexbox_alignment( $settings['alignmentTablet'] ) );
|
||||
|
||||
if ( 'inline' === $settings['iconLocationTablet'] ) {
|
||||
$tablet_css->add_property( 'align-items', generateblocks_get_flexbox_alignment( $settings['iconVerticalAlignmentTablet'] ) );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocationTablet'] ) {
|
||||
$tablet_css->add_property( 'flex-direction', 'column' );
|
||||
}
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( $selector . ' .gb-icon' );
|
||||
|
||||
if ( ! $settings['removeText'] ) {
|
||||
if ( $blockVersion < 3 ) {
|
||||
$tablet_css->add_property( 'padding', array( $settings['iconPaddingTopTablet'], $settings['iconPaddingRightTablet'], $settings['iconPaddingBottomTablet'], $settings['iconPaddingLeftTablet'] ), $settings['iconPaddingUnit'] );
|
||||
} else {
|
||||
$tablet_css->add_property(
|
||||
'padding',
|
||||
array(
|
||||
generateblocks_get_array_attribute_value( 'paddingTopTablet', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingRightTablet', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingBottomTablet', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingLeftTablet', $settings['iconStyles'] ),
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
if ( $blockVersion < 2 ) {
|
||||
if ( 'above' === $settings['iconLocationTablet'] || ( 'above' === $settings['iconLocation'] && '' == $settings['iconLocationTablet'] ) ) { // phpcs:ignore WordPress.PHP.StrictComparisons.LooseComparison
|
||||
$tablet_css->add_property( 'align-self', generateblocks_get_flexbox_alignment( $settings['alignmentTablet'] ) );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocationTablet'] ) {
|
||||
$tablet_css->add_property( 'display', 'inline' );
|
||||
}
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( $selector . ' .gb-icon svg' );
|
||||
|
||||
if ( $blockVersion < 3 ) {
|
||||
$tablet_css->add_property( 'width', $settings['iconSizeTablet'], $settings['iconSizeUnit'] );
|
||||
$tablet_css->add_property( 'height', $settings['iconSizeTablet'], $settings['iconSizeUnit'] );
|
||||
}
|
||||
|
||||
$tablet_css->add_property( 'width', generateblocks_get_array_attribute_value( 'widthTablet', $settings['iconStyles'] ) );
|
||||
$tablet_css->add_property( 'height', generateblocks_get_array_attribute_value( 'heightTablet', $settings['iconStyles'] ) );
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( $selector );
|
||||
generateblocks_add_layout_css( $mobile_css, $settings, 'Mobile' );
|
||||
generateblocks_add_sizing_css( $mobile_css, $settings, 'Mobile' );
|
||||
generateblocks_add_flex_child_css( $mobile_css, $settings, 'Mobile' );
|
||||
generateblocks_add_typography_css( $mobile_css, $settings, 'Mobile' );
|
||||
generateblocks_add_spacing_css( $mobile_css, $settings, 'Mobile' );
|
||||
generateblocks_add_border_css( $mobile_css, $settings, 'Mobile' );
|
||||
|
||||
if ( $blockVersion < 2 && $settings['inlineWidthMobile'] ) {
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$mobile_css->add_property( 'display', 'inline-flex' );
|
||||
} else {
|
||||
$mobile_css->add_property( 'display', 'inline-block' );
|
||||
}
|
||||
}
|
||||
|
||||
if ( $settings['hasIcon'] ) {
|
||||
if ( $blockVersion < 2 ) {
|
||||
$mobile_css->add_property( 'justify-content', generateblocks_get_flexbox_alignment( $settings['alignmentMobile'] ) );
|
||||
|
||||
if ( 'inline' === $settings['iconLocationMobile'] ) {
|
||||
$mobile_css->add_property( 'align-items', generateblocks_get_flexbox_alignment( $settings['iconVerticalAlignmentMobile'] ) );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocationMobile'] ) {
|
||||
$mobile_css->add_property( 'flex-direction', 'column' );
|
||||
}
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( $selector . ' .gb-icon' );
|
||||
|
||||
if ( ! $settings['removeText'] ) {
|
||||
if ( $blockVersion < 3 ) {
|
||||
$mobile_css->add_property( 'padding', array( $settings['iconPaddingTopMobile'], $settings['iconPaddingRightMobile'], $settings['iconPaddingBottomMobile'], $settings['iconPaddingLeftMobile'] ), $settings['iconPaddingUnit'] );
|
||||
} else {
|
||||
$mobile_css->add_property(
|
||||
'padding',
|
||||
array(
|
||||
generateblocks_get_array_attribute_value( 'paddingTopMobile', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingRightMobile', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingBottomMobile', $settings['iconStyles'] ),
|
||||
generateblocks_get_array_attribute_value( 'paddingLeftMobile', $settings['iconStyles'] ),
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
if ( $blockVersion < 2 ) {
|
||||
if ( 'above' === $settings['iconLocationMobile'] || ( 'above' === $settings['iconLocation'] && '' == $settings['iconLocationMobile'] ) ) { // phpcs:ignore WordPress.PHP.StrictComparisons.LooseComparison
|
||||
$mobile_css->add_property( 'align-self', generateblocks_get_flexbox_alignment( $settings['alignmentMobile'] ) );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocationMobile'] ) {
|
||||
$mobile_css->add_property( 'display', 'inline' );
|
||||
}
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( $selector . ' .gb-icon svg' );
|
||||
|
||||
if ( $blockVersion < 3 ) {
|
||||
$mobile_css->add_property( 'width', $settings['iconSizeMobile'], $settings['iconSizeUnit'] );
|
||||
$mobile_css->add_property( 'height', $settings['iconSizeMobile'], $settings['iconSizeUnit'] );
|
||||
}
|
||||
|
||||
$mobile_css->add_property( 'width', generateblocks_get_array_attribute_value( 'widthMobile', $settings['iconStyles'] ) );
|
||||
$mobile_css->add_property( 'height', generateblocks_get_array_attribute_value( 'heightMobile', $settings['iconStyles'] ) );
|
||||
}
|
||||
} else {
|
||||
/**
|
||||
* All of the below CSS is when the Headline block had a surrounding `div` element.
|
||||
* This surroundng div was deprecated in 1.2.0.
|
||||
*
|
||||
* @TODO Move this CSS to separate function to clean up this function.
|
||||
*/
|
||||
$fontFamily = $settings['fontFamily'];
|
||||
|
||||
if ( $fontFamily && $settings['fontFamilyFallback'] ) {
|
||||
$fontFamily = $fontFamily . ', ' . $settings['fontFamilyFallback'];
|
||||
}
|
||||
|
||||
$css->set_selector( '.gb-headline-wrapper' );
|
||||
$css->add_property( 'display', 'flex' );
|
||||
|
||||
$css->set_selector( '.gb-headline-wrapper > .gb-headline' );
|
||||
$css->add_property( 'margin', '0' );
|
||||
$css->add_property( 'padding', '0' );
|
||||
|
||||
$css->set_selector( '.gb-headline-' . $id );
|
||||
$css->add_property( 'font-family', $fontFamily );
|
||||
$css->add_property( 'text-align', $settings['alignment'] );
|
||||
$css->add_property( 'color', $settings['textColor'] );
|
||||
|
||||
if ( ! $settings['hasIcon'] ) {
|
||||
$css->add_property( 'background-color', generateblocks_hex2rgba( $settings['backgroundColor'], $settings['backgroundColorOpacity'] ) );
|
||||
|
||||
if ( $settings['inlineWidth'] ) {
|
||||
$css->add_property( 'display', 'inline-block' );
|
||||
}
|
||||
|
||||
$css->add_property( 'border-width', array( $settings['borderSizeTop'], $settings['borderSizeRight'], $settings['borderSizeBottom'], $settings['borderSizeLeft'] ), 'px' );
|
||||
$css->add_property( 'border-color', generateblocks_hex2rgba( $settings['borderColor'], $settings['borderColorOpacity'] ) );
|
||||
}
|
||||
|
||||
$css->add_property( 'font-size', $settings['fontSize'], $settings['fontSizeUnit'] );
|
||||
$css->add_property( 'font-weight', $settings['fontWeight'] );
|
||||
$css->add_property( 'text-transform', $settings['textTransform'] );
|
||||
$css->add_property( 'line-height', $settings['lineHeight'], $settings['lineHeightUnit'] );
|
||||
$css->add_property( 'letter-spacing', $settings['letterSpacing'], 'em' );
|
||||
|
||||
if ( ! $settings['hasIcon'] ) {
|
||||
$css->add_property( 'padding', array( $settings['paddingTop'], $settings['paddingRight'], $settings['paddingBottom'], $settings['paddingLeft'] ), $settings['paddingUnit'] );
|
||||
$css->add_property( 'margin', array( $settings['marginTop'], $settings['marginRight'], $settings['marginBottom'], $settings['marginLeft'] ), $settings['marginUnit'] );
|
||||
|
||||
if ( function_exists( 'generate_get_default_fonts' ) && '' === $settings['marginBottom'] ) {
|
||||
$defaultBlockStyles = generateblocks_get_default_styles();
|
||||
|
||||
if ( isset( $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottom'] ) ) {
|
||||
$css->add_property( 'margin-bottom', $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottom'], $defaultBlockStyles['headline'][ $settings['element'] ]['marginUnit'] );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$css->set_selector( '.gb-headline-' . $id . ' a, .gb-headline-' . $id . ' a:visited' );
|
||||
$css->add_property( 'color', $settings['linkColor'] );
|
||||
|
||||
$css->set_selector( '.gb-headline-' . $id . ' a:hover' );
|
||||
$css->add_property( 'color', $settings['linkColorHover'] );
|
||||
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$css->set_selector( '.gb-headline-wrapper-' . $id . ' .gb-icon' );
|
||||
$css->add_property( 'line-height', '0' );
|
||||
|
||||
if ( ! $settings['removeText'] ) {
|
||||
$css->add_property( 'padding', array( $settings['iconPaddingTop'], $settings['iconPaddingRight'], $settings['iconPaddingBottom'], $settings['iconPaddingLeft'] ), $settings['iconPaddingUnit'] );
|
||||
}
|
||||
|
||||
$css->add_property( 'color', generateblocks_hex2rgba( $settings['iconColor'], $settings['iconColorOpacity'] ) );
|
||||
|
||||
if ( 'above' === $settings['iconLocation'] ) {
|
||||
$css->add_property( 'display', 'inline' );
|
||||
}
|
||||
|
||||
$css->set_selector( '.gb-headline-wrapper-' . $id . ' .gb-icon svg' );
|
||||
$css->add_property( 'width', $settings['iconSize'], $settings['iconSizeUnit'] );
|
||||
$css->add_property( 'height', $settings['iconSize'], $settings['iconSizeUnit'] );
|
||||
$css->add_property( 'fill', 'currentColor' );
|
||||
|
||||
$css->set_selector( '.gb-headline-wrapper-' . $id );
|
||||
$css->add_property( 'padding', array( $settings['paddingTop'], $settings['paddingRight'], $settings['paddingBottom'], $settings['paddingLeft'] ), $settings['paddingUnit'] );
|
||||
$css->add_property( 'margin', array( $settings['marginTop'], $settings['marginRight'], $settings['marginBottom'], $settings['marginLeft'] ), $settings['marginUnit'] );
|
||||
|
||||
$defaultBlockStyles = generateblocks_get_default_styles();
|
||||
|
||||
if ( '' === $settings['marginBottom'] && ! $settings['removeText'] && isset( $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottom'] ) && is_numeric( $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottom'] ) ) {
|
||||
$css->add_property( 'margin-bottom', $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottom'], $defaultBlockStyles['headline'][ $settings['element'] ]['marginUnit'] );
|
||||
}
|
||||
|
||||
if ( '' === $settings['fontSize'] && ! $settings['removeText'] && isset( $defaultBlockStyles['headline'][ $settings['element'] ]['fontSize'] ) ) {
|
||||
$css->add_property( 'font-size', $defaultBlockStyles['headline'][ $settings['element'] ]['fontSize'], $defaultBlockStyles['headline'][ $settings['element'] ]['fontSizeUnit'] );
|
||||
} else {
|
||||
$css->add_property( 'font-size', $settings['fontSize'], $settings['fontSizeUnit'] );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocation'] ) {
|
||||
$css->add_property( 'text-align', $settings['alignment'] );
|
||||
} else {
|
||||
$css->add_property( 'justify-content', generateblocks_get_flexbox_alignment( $settings['alignment'] ) );
|
||||
}
|
||||
|
||||
if ( $settings['inlineWidth'] ) {
|
||||
$css->add_property( 'display', 'inline-flex' );
|
||||
}
|
||||
|
||||
if ( 'inline' === $settings['iconLocation'] ) {
|
||||
$css->add_property( 'align-items', generateblocks_get_flexbox_alignment( $settings['iconVerticalAlignment'] ) );
|
||||
}
|
||||
|
||||
$css->add_property( 'background-color', generateblocks_hex2rgba( $settings['backgroundColor'], $settings['backgroundColorOpacity'] ) );
|
||||
$css->add_property( 'color', $settings['textColor'] );
|
||||
$css->add_property( 'border-width', array( $settings['borderSizeTop'], $settings['borderSizeRight'], $settings['borderSizeBottom'], $settings['borderSizeLeft'] ), 'px' );
|
||||
$css->add_property( 'border-color', generateblocks_hex2rgba( $settings['borderColor'], $settings['borderColorOpacity'] ) );
|
||||
|
||||
if ( 'above' === $settings['iconLocation'] ) {
|
||||
$css->add_property( 'flex-direction', 'column' );
|
||||
}
|
||||
}
|
||||
|
||||
if ( $settings['highlightTextColor'] ) {
|
||||
$css->set_selector( '.gb-headline-' . $id . ' .gb-highlight' );
|
||||
$css->add_property( 'color', $settings['highlightTextColor'] );
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( '.gb-headline-' . $id );
|
||||
$tablet_css->add_property( 'text-align', $settings['alignmentTablet'] );
|
||||
$tablet_css->add_property( 'font-size', $settings['fontSizeTablet'], $settings['fontSizeUnit'] );
|
||||
$tablet_css->add_property( 'line-height', $settings['lineHeightTablet'], $settings['lineHeightUnit'] );
|
||||
$tablet_css->add_property( 'letter-spacing', $settings['letterSpacingTablet'], 'em' );
|
||||
|
||||
if ( ! $settings['hasIcon'] ) {
|
||||
$tablet_css->add_property( 'margin', array( $settings['marginTopTablet'], $settings['marginRightTablet'], $settings['marginBottomTablet'], $settings['marginLeftTablet'] ), $settings['marginUnit'] );
|
||||
$tablet_css->add_property( 'padding', array( $settings['paddingTopTablet'], $settings['paddingRightTablet'], $settings['paddingBottomTablet'], $settings['paddingLeftTablet'] ), $settings['paddingUnit'] );
|
||||
$tablet_css->add_property( 'border-width', array( $settings['borderSizeTopTablet'], $settings['borderSizeRightTablet'], $settings['borderSizeBottomTablet'], $settings['borderSizeLeftTablet'] ), 'px' );
|
||||
|
||||
if ( $settings['inlineWidthTablet'] ) {
|
||||
$tablet_css->add_property( 'display', 'inline-flex' );
|
||||
}
|
||||
}
|
||||
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$tablet_css->set_selector( '.gb-headline-wrapper-' . $id . ' .gb-icon' );
|
||||
|
||||
if ( ! $settings['removeText'] ) {
|
||||
$tablet_css->add_property( 'padding', array( $settings['iconPaddingTopTablet'], $settings['iconPaddingRightTablet'], $settings['iconPaddingBottomTablet'], $settings['iconPaddingLeftTablet'] ), $settings['iconPaddingUnit'] );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocationTablet'] || ( 'above' === $settings['iconLocation'] && '' == $settings['iconLocationTablet'] ) ) { // phpcs:ignore WordPress.PHP.StrictComparisons.LooseComparison
|
||||
$tablet_css->add_property( 'align-self', generateblocks_get_flexbox_alignment( $settings['alignmentTablet'] ) );
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( '.gb-headline-wrapper-' . $id . ' .gb-icon svg' );
|
||||
$tablet_css->add_property( 'width', $settings['iconSizeTablet'], $settings['iconSizeUnit'] );
|
||||
$tablet_css->add_property( 'height', $settings['iconSizeTablet'], $settings['iconSizeUnit'] );
|
||||
|
||||
$tablet_css->set_selector( '.gb-headline-wrapper-' . $id );
|
||||
$tablet_css->add_property( 'margin', array( $settings['marginTopTablet'], $settings['marginRightTablet'], $settings['marginBottomTablet'], $settings['marginLeftTablet'] ), $settings['marginUnit'] );
|
||||
$tablet_css->add_property( 'padding', array( $settings['paddingTopTablet'], $settings['paddingRightTablet'], $settings['paddingBottomTablet'], $settings['paddingLeftTablet'] ), $settings['paddingUnit'] );
|
||||
$tablet_css->add_property( 'border-width', array( $settings['borderSizeTopTablet'], $settings['borderSizeRightTablet'], $settings['borderSizeBottomTablet'], $settings['borderSizeLeftTablet'] ), 'px' );
|
||||
$tablet_css->add_property( 'justify-content', generateblocks_get_flexbox_alignment( $settings['alignmentTablet'] ) );
|
||||
|
||||
$defaultBlockStyles = generateblocks_get_default_styles();
|
||||
|
||||
if ( '' === $settings['marginBottomTablet'] && ! $settings['removeText'] && isset( $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottomTablet'] ) && is_numeric( $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottomTablet'] ) ) {
|
||||
$tablet_css->add_property( 'margin-bottom', $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottomTablet'], $defaultBlockStyles['headline'][ $settings['element'] ]['marginUnit'] );
|
||||
}
|
||||
|
||||
if ( '' === $settings['fontSizeTablet'] && ! $settings['removeText'] && isset( $defaultBlockStyles['headline'][ $settings['element'] ]['fontSizeTablet'] ) ) {
|
||||
$tablet_css->add_property( 'font-size', $defaultBlockStyles['headline'][ $settings['element'] ]['fontSizeTablet'], $defaultBlockStyles['headline'][ $settings['element'] ]['fontSizeUnit'] );
|
||||
} else {
|
||||
$tablet_css->add_property( 'font-size', $settings['fontSizeTablet'], $settings['fontSizeUnit'] );
|
||||
}
|
||||
|
||||
if ( $settings['inlineWidthTablet'] ) {
|
||||
$tablet_css->add_property( 'display', 'inline-flex' );
|
||||
}
|
||||
|
||||
if ( 'inline' === $settings['iconLocationTablet'] ) {
|
||||
$tablet_css->add_property( 'align-items', generateblocks_get_flexbox_alignment( $settings['iconVerticalAlignmentTablet'] ) );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocationTablet'] ) {
|
||||
$tablet_css->add_property( 'flex-direction', 'column' );
|
||||
}
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( '.gb-headline-' . $id );
|
||||
$mobile_css->add_property( 'text-align', $settings['alignmentMobile'] );
|
||||
$mobile_css->add_property( 'font-size', $settings['fontSizeMobile'], $settings['fontSizeUnit'] );
|
||||
$mobile_css->add_property( 'line-height', $settings['lineHeightMobile'], $settings['lineHeightUnit'] );
|
||||
$mobile_css->add_property( 'letter-spacing', $settings['letterSpacingMobile'], 'em' );
|
||||
|
||||
if ( ! $settings['hasIcon'] ) {
|
||||
$mobile_css->add_property( 'margin', array( $settings['marginTopMobile'], $settings['marginRightMobile'], $settings['marginBottomMobile'], $settings['marginLeftMobile'] ), $settings['marginUnit'] );
|
||||
$mobile_css->add_property( 'padding', array( $settings['paddingTopMobile'], $settings['paddingRightMobile'], $settings['paddingBottomMobile'], $settings['paddingLeftMobile'] ), $settings['paddingUnit'] );
|
||||
$mobile_css->add_property( 'border-width', array( $settings['borderSizeTopMobile'], $settings['borderSizeRightMobile'], $settings['borderSizeBottomMobile'], $settings['borderSizeLeftMobile'] ), 'px' );
|
||||
|
||||
if ( $settings['inlineWidthMobile'] ) {
|
||||
$mobile_css->add_property( 'display', 'inline-flex' );
|
||||
}
|
||||
}
|
||||
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$mobile_css->set_selector( '.gb-headline-wrapper-' . $id . ' .gb-icon' );
|
||||
|
||||
if ( ! $settings['removeText'] ) {
|
||||
$mobile_css->add_property( 'padding', array( $settings['iconPaddingTopMobile'], $settings['iconPaddingRightMobile'], $settings['iconPaddingBottomMobile'], $settings['iconPaddingLeftMobile'] ), $settings['iconPaddingUnit'] );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocationMobile'] || ( 'above' === $settings['iconLocation'] && '' == $settings['iconLocationMobile'] ) || ( 'above' === $settings['iconLocationTablet'] && '' == $settings['iconLocationMobile'] ) ) { // phpcs:ignore WordPress.PHP.StrictComparisons.LooseComparison
|
||||
$mobile_css->add_property( 'align-self', generateblocks_get_flexbox_alignment( $settings['alignmentMobile'] ) );
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( '.gb-headline-wrapper-' . $id . ' .gb-icon svg' );
|
||||
$mobile_css->add_property( 'width', $settings['iconSizeMobile'], $settings['iconSizeUnit'] );
|
||||
$mobile_css->add_property( 'height', $settings['iconSizeMobile'], $settings['iconSizeUnit'] );
|
||||
|
||||
$mobile_css->set_selector( '.gb-headline-wrapper-' . $id );
|
||||
$mobile_css->add_property( 'margin', array( $settings['marginTopMobile'], $settings['marginRightMobile'], $settings['marginBottomMobile'], $settings['marginLeftMobile'] ), $settings['marginUnit'] );
|
||||
$mobile_css->add_property( 'padding', array( $settings['paddingTopMobile'], $settings['paddingRightMobile'], $settings['paddingBottomMobile'], $settings['paddingLeftMobile'] ), $settings['paddingUnit'] );
|
||||
$mobile_css->add_property( 'justify-content', generateblocks_get_flexbox_alignment( $settings['alignmentMobile'] ) );
|
||||
|
||||
$defaultBlockStyles = generateblocks_get_default_styles();
|
||||
|
||||
if ( '' === $settings['marginBottomMobile'] && ! $settings['removeText'] && isset( $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottomMobile'] ) && is_numeric( $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottomMobile'] ) ) {
|
||||
$mobile_css->add_property( 'margin-bottom', $defaultBlockStyles['headline'][ $settings['element'] ]['marginBottomMobile'], $defaultBlockStyles['headline'][ $settings['element'] ]['marginUnit'] );
|
||||
}
|
||||
|
||||
if ( '' === $settings['fontSizeMobile'] && ! $settings['removeText'] && ! empty( $defaultBlockStyles['headline'][ $settings['element'] ]['fontSizeMobile'] ) ) {
|
||||
$mobile_css->add_property( 'font-size', $defaultBlockStyles['headline'][ $settings['element'] ]['fontSizeMobile'], $defaultBlockStyles['headline'][ $settings['element'] ]['fontSizeUnit'] );
|
||||
} else {
|
||||
$mobile_css->add_property( 'font-size', $settings['fontSizeMobile'], $settings['fontSizeUnit'] );
|
||||
}
|
||||
|
||||
if ( $settings['inlineWidthMobile'] ) {
|
||||
$mobile_css->add_property( 'display', 'inline-flex' );
|
||||
}
|
||||
|
||||
if ( 'inline' === $settings['iconLocationMobile'] ) {
|
||||
$mobile_css->add_property( 'align-items', generateblocks_get_flexbox_alignment( $settings['iconVerticalAlignmentMobile'] ) );
|
||||
}
|
||||
|
||||
if ( 'above' === $settings['iconLocationMobile'] ) {
|
||||
$mobile_css->add_property( 'flex-direction', 'column' );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Store this block ID in memory.
|
||||
self::store_block_id( $id );
|
||||
|
||||
/**
|
||||
* Do generateblocks_block_css_data hook
|
||||
*
|
||||
* @since 1.0
|
||||
*
|
||||
* @param string $name The name of our block.
|
||||
* @param array $settings The settings for the current block.
|
||||
* @param object $css Our desktop/main CSS data.
|
||||
* @param object $desktop_css Our desktop only CSS data.
|
||||
* @param object $tablet_css Our tablet CSS data.
|
||||
* @param object $tablet_only_css Our tablet only CSS data.
|
||||
* @param object $mobile_css Our mobile CSS data.
|
||||
*/
|
||||
do_action(
|
||||
'generateblocks_block_css_data',
|
||||
'headline',
|
||||
$settings,
|
||||
$css,
|
||||
$desktop_css,
|
||||
$tablet_css,
|
||||
$tablet_only_css,
|
||||
$mobile_css
|
||||
);
|
||||
|
||||
return [
|
||||
'main' => $css->css_output(),
|
||||
'desktop' => $desktop_css->css_output(),
|
||||
'tablet' => $tablet_css->css_output(),
|
||||
'tablet_only' => $tablet_only_css->css_output(),
|
||||
'mobile' => $mobile_css->css_output(),
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Wrapper function for our dynamic buttons.
|
||||
*
|
||||
* @since 1.6.0
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $content The dynamic text to display.
|
||||
* @param WP_Block $block Block instance.
|
||||
*/
|
||||
public static function render_block( $attributes, $content, $block ) {
|
||||
if ( strpos( trim( $content ), '<div class="gb-headline-wrapper' ) === 0 ) {
|
||||
$attributes['hasWrapper'] = true;
|
||||
}
|
||||
|
||||
if ( ! isset( $attributes['useDynamicData'] ) || ! $attributes['useDynamicData'] ) {
|
||||
// Add styles to this block if needed.
|
||||
$content = generateblocks_maybe_add_block_css(
|
||||
$content,
|
||||
[
|
||||
'class_name' => 'GenerateBlocks_Block_Headline',
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
return $content;
|
||||
}
|
||||
|
||||
$allow_empty_content = false;
|
||||
|
||||
if ( empty( $attributes['dynamicContentType'] ) ) {
|
||||
$dynamic_content = GenerateBlocks_Dynamic_Content::get_static_content( $content );
|
||||
|
||||
if ( ! empty( $attributes['hasIcon'] ) && ! empty( $attributes['removeText'] ) ) {
|
||||
// Allow icon-only items to continue.
|
||||
$allow_empty_content = true;
|
||||
}
|
||||
} else {
|
||||
$dynamic_content = GenerateBlocks_Dynamic_Content::get_content( $attributes, $block );
|
||||
}
|
||||
|
||||
if ( ! $dynamic_content && '0' !== $dynamic_content && ! $allow_empty_content ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
$defaults = generateblocks_get_block_defaults();
|
||||
|
||||
$settings = wp_parse_args(
|
||||
$attributes,
|
||||
$defaults['headline']
|
||||
);
|
||||
|
||||
$classNames = array(
|
||||
'gb-headline',
|
||||
'gb-headline-' . $settings['uniqueId'],
|
||||
);
|
||||
|
||||
if ( ! empty( $settings['className'] ) ) {
|
||||
$classNames[] = $settings['className'];
|
||||
}
|
||||
|
||||
if ( empty( $settings['hasIcon'] ) ) {
|
||||
$classNames[] = 'gb-headline-text';
|
||||
}
|
||||
|
||||
$tagName = apply_filters(
|
||||
'generateblocks_dynamic_headline_tagname',
|
||||
$settings['element'],
|
||||
$attributes,
|
||||
$block
|
||||
);
|
||||
|
||||
$allowedTagNames = apply_filters(
|
||||
'generateblocks_dynamic_headline_allowed_tagnames',
|
||||
array(
|
||||
'h1',
|
||||
'h2',
|
||||
'h3',
|
||||
'h4',
|
||||
'h5',
|
||||
'h6',
|
||||
'div',
|
||||
'p',
|
||||
'figcaption',
|
||||
),
|
||||
$attributes,
|
||||
$block
|
||||
);
|
||||
|
||||
if ( ! in_array( $tagName, $allowedTagNames ) ) {
|
||||
$tagName = 'div';
|
||||
}
|
||||
|
||||
// Add styles to this block if needed.
|
||||
$output = generateblocks_maybe_add_block_css(
|
||||
'',
|
||||
[
|
||||
'class_name' => 'GenerateBlocks_Block_Headline',
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
$output .= sprintf(
|
||||
'<%1$s %2$s>',
|
||||
$tagName,
|
||||
generateblocks_attr(
|
||||
'dynamic-headline',
|
||||
array(
|
||||
'id' => isset( $settings['anchor'] ) ? $settings['anchor'] : null,
|
||||
'class' => implode( ' ', $classNames ),
|
||||
),
|
||||
$settings,
|
||||
$block
|
||||
)
|
||||
);
|
||||
|
||||
$icon_html = '';
|
||||
|
||||
// Extract our icon from the static HTML.
|
||||
if ( $settings['hasIcon'] ) {
|
||||
$icon_html = GenerateBlocks_Dynamic_Content::get_icon_html( $content );
|
||||
|
||||
if ( $icon_html ) {
|
||||
$output .= $icon_html;
|
||||
$output .= '<span class="gb-headline-text">';
|
||||
}
|
||||
}
|
||||
|
||||
$dynamic_link = GenerateBlocks_Dynamic_Content::get_dynamic_url( $attributes, $block );
|
||||
|
||||
if ( $dynamic_link ) {
|
||||
$dynamic_content = sprintf(
|
||||
'<a href="%s">%s</a>',
|
||||
esc_url( $dynamic_link ),
|
||||
$dynamic_content
|
||||
);
|
||||
}
|
||||
|
||||
$output .= $dynamic_content;
|
||||
|
||||
if ( $icon_html ) {
|
||||
$output .= '</span>';
|
||||
}
|
||||
|
||||
$output .= sprintf(
|
||||
'</%s>',
|
||||
$tagName
|
||||
);
|
||||
|
||||
return $output;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,334 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Image block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* Add Image related functions.
|
||||
*/
|
||||
class GenerateBlocks_Block_Image {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
private static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Keep track of CSS we want to output once per block type.
|
||||
*
|
||||
* @var boolean
|
||||
*/
|
||||
private static $singular_css_added = false;
|
||||
|
||||
/**
|
||||
* Block defaults.
|
||||
*/
|
||||
public static function defaults() {
|
||||
return [
|
||||
'mediaId' => '',
|
||||
'sizeSlug' => '',
|
||||
'width' => '',
|
||||
'widthTablet' => '',
|
||||
'widthMobile' => '',
|
||||
'height' => '',
|
||||
'heightTablet' => '',
|
||||
'heightMobile' => '',
|
||||
'borderColor' => '',
|
||||
'objectFit' => '',
|
||||
'objectFitTablet' => '',
|
||||
'objectFitMobile' => '',
|
||||
'align' => '',
|
||||
'alignment' => '',
|
||||
'alignmentTablet' => '',
|
||||
'alignmentMobile' => '',
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Store our block ID in memory.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function store_block_id( $id ) {
|
||||
self::$block_ids[] = $id;
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if our block ID exists.
|
||||
*
|
||||
* @param string $id The block ID to store.
|
||||
*/
|
||||
public static function block_id_exists( $id ) {
|
||||
return in_array( $id, (array) self::$block_ids );
|
||||
}
|
||||
|
||||
/**
|
||||
* Compile our CSS data based on our block attributes.
|
||||
*
|
||||
* @param array $attributes Our block attributes.
|
||||
*/
|
||||
public static function get_css_data( $attributes ) {
|
||||
$css = new GenerateBlocks_Dynamic_CSS();
|
||||
$desktop_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$tablet_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$tablet_only_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$mobile_css = new GenerateBlocks_Dynamic_CSS();
|
||||
$css_data = [];
|
||||
|
||||
$defaults = generateblocks_get_block_defaults();
|
||||
|
||||
$settings = wp_parse_args(
|
||||
$attributes,
|
||||
$defaults['image']
|
||||
);
|
||||
|
||||
$id = $attributes['uniqueId'];
|
||||
|
||||
// Only add this CSS once.
|
||||
if ( ! self::$singular_css_added ) {
|
||||
do_action(
|
||||
'generateblocks_block_one_time_css_data',
|
||||
'image',
|
||||
$settings,
|
||||
$css
|
||||
);
|
||||
|
||||
self::$singular_css_added = true;
|
||||
}
|
||||
|
||||
// Map deprecated settings.
|
||||
$settings = GenerateBlocks_Map_Deprecated_Attributes::map_attributes( $settings );
|
||||
|
||||
$css->set_selector( '.gb-block-image-' . $id );
|
||||
generateblocks_add_spacing_css( $css, $settings );
|
||||
|
||||
// Set a flag we'll update later if we disable floats.
|
||||
$disable_float = false;
|
||||
$has_desktop_float = 'floatLeft' === $settings['alignment'] || 'floatRight' === $settings['alignment'];
|
||||
$has_tablet_float = 'floatLeft' === $settings['alignmentTablet'] || 'floatRight' === $settings['alignmentTablet'];
|
||||
|
||||
if ( $has_desktop_float ) {
|
||||
$css->add_property( 'float', generateblocks_get_float_alignment( $settings['alignment'] ) );
|
||||
} else {
|
||||
$css->add_property( 'text-align', $settings['alignment'] );
|
||||
}
|
||||
|
||||
$css->set_selector( '.gb-image-' . $id );
|
||||
generateblocks_add_border_css( $css, $settings );
|
||||
$css->add_property( 'width', $settings['width'] );
|
||||
$css->add_property( 'height', $settings['height'] );
|
||||
$css->add_property( 'object-fit', $settings['objectFit'] );
|
||||
$css->add_property( 'vertical-align', 'middle' );
|
||||
|
||||
$tablet_css->set_selector( '.gb-block-image-' . $id );
|
||||
generateblocks_add_spacing_css( $tablet_css, $settings, 'Tablet' );
|
||||
|
||||
if ( $has_tablet_float ) {
|
||||
$tablet_css->add_property( 'float', generateblocks_get_float_alignment( $settings['alignmentTablet'] ) );
|
||||
} else {
|
||||
$tablet_css->add_property( 'text-align', $settings['alignmentTablet'] );
|
||||
|
||||
if ( $settings['alignmentTablet'] && $has_desktop_float ) {
|
||||
$tablet_css->add_property( 'float', 'none' );
|
||||
$disable_float = true;
|
||||
}
|
||||
}
|
||||
|
||||
$tablet_css->set_selector( '.gb-image-' . $id );
|
||||
generateblocks_add_border_css( $tablet_css, $settings, 'Tablet' );
|
||||
$tablet_css->add_property( 'width', $settings['widthTablet'] );
|
||||
$tablet_css->add_property( 'height', $settings['heightTablet'] );
|
||||
$tablet_css->add_property( 'object-fit', $settings['objectFitTablet'] );
|
||||
|
||||
$mobile_css->set_selector( '.gb-block-image-' . $id );
|
||||
generateblocks_add_spacing_css( $mobile_css, $settings, 'Mobile' );
|
||||
|
||||
if ( 'floatLeft' === $settings['alignmentMobile'] || 'floatRight' === $settings['alignmentMobile'] ) {
|
||||
$mobile_css->add_property( 'float', generateblocks_get_float_alignment( $settings['alignmentMobile'] ) );
|
||||
} else {
|
||||
$mobile_css->add_property( 'text-align', $settings['alignmentMobile'] );
|
||||
|
||||
if (
|
||||
$settings['alignmentMobile'] &&
|
||||
! $disable_float &&
|
||||
(
|
||||
$has_desktop_float ||
|
||||
$has_tablet_float
|
||||
)
|
||||
) {
|
||||
$mobile_css->add_property( 'float', 'none' );
|
||||
}
|
||||
}
|
||||
|
||||
$mobile_css->set_selector( '.gb-image-' . $id );
|
||||
generateblocks_add_border_css( $mobile_css, $settings, 'Mobile' );
|
||||
$mobile_css->add_property( 'width', $settings['widthMobile'] );
|
||||
$mobile_css->add_property( 'height', $settings['heightMobile'] );
|
||||
$mobile_css->add_property( 'object-fit', $settings['objectFitMobile'] );
|
||||
|
||||
// Store this block ID in memory.
|
||||
self::store_block_id( $id );
|
||||
|
||||
/**
|
||||
* Do generateblocks_block_css_data hook
|
||||
*
|
||||
* @since 1.0
|
||||
*
|
||||
* @param string $name The name of our block.
|
||||
* @param array $settings The settings for the current block.
|
||||
* @param object $css Our desktop/main CSS data.
|
||||
* @param object $desktop_css Our desktop only CSS data.
|
||||
* @param object $tablet_css Our tablet CSS data.
|
||||
* @param object $tablet_only_css Our tablet only CSS data.
|
||||
* @param object $mobile_css Our mobile CSS data.
|
||||
*/
|
||||
do_action(
|
||||
'generateblocks_block_css_data',
|
||||
'image',
|
||||
$settings,
|
||||
$css,
|
||||
$desktop_css,
|
||||
$tablet_css,
|
||||
$tablet_only_css,
|
||||
$mobile_css
|
||||
);
|
||||
|
||||
return [
|
||||
'main' => $css->css_output(),
|
||||
'desktop' => $desktop_css->css_output(),
|
||||
'tablet' => $tablet_css->css_output(),
|
||||
'tablet_only' => $tablet_only_css->css_output(),
|
||||
'mobile' => $mobile_css->css_output(),
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Wrapper function for our dynamic buttons.
|
||||
*
|
||||
* @since 1.6.0
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $content The dynamic text to display.
|
||||
* @param WP_Block $block Block instance.
|
||||
*/
|
||||
public static function render_block( $attributes, $content, $block ) {
|
||||
if ( empty( $attributes['useDynamicData'] ) ) {
|
||||
// Add styles to this block if needed.
|
||||
$content = generateblocks_maybe_add_block_css(
|
||||
$content,
|
||||
[
|
||||
'class_name' => 'GenerateBlocks_Block_Image',
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
return generateblocks_filter_images( $content, $attributes );
|
||||
}
|
||||
|
||||
$image = empty( $attributes['dynamicContentType'] )
|
||||
? generateblocks_filter_images( GenerateBlocks_Dynamic_Content::get_static_content( $content ), $attributes )
|
||||
: GenerateBlocks_Dynamic_Content::get_dynamic_image( $attributes, $block );
|
||||
|
||||
if ( ! $image ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
$defaults = generateblocks_get_block_defaults();
|
||||
|
||||
$settings = wp_parse_args(
|
||||
$attributes,
|
||||
$defaults['image']
|
||||
);
|
||||
|
||||
// Add styles to this block if needed.
|
||||
$output = generateblocks_maybe_add_block_css(
|
||||
'',
|
||||
[
|
||||
'class_name' => 'GenerateBlocks_Block_Image',
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
$output .= sprintf(
|
||||
'<figure %s>',
|
||||
generateblocks_attr(
|
||||
'image-figure',
|
||||
array(
|
||||
'class' => implode(
|
||||
' ',
|
||||
array(
|
||||
'gb-block-image',
|
||||
'gb-block-image-' . $settings['uniqueId'],
|
||||
)
|
||||
),
|
||||
),
|
||||
$settings,
|
||||
$block
|
||||
)
|
||||
);
|
||||
|
||||
$dynamic_link = GenerateBlocks_Dynamic_Content::get_dynamic_url( $attributes, $block );
|
||||
|
||||
if ( $dynamic_link ) {
|
||||
$relAttributes = array();
|
||||
|
||||
if ( ! empty( $settings['relNoFollow'] ) ) {
|
||||
$relAttributes[] = 'nofollow';
|
||||
}
|
||||
|
||||
if ( ! empty( $settings['openInNewWindow'] ) ) {
|
||||
$relAttributes[] = 'noopener';
|
||||
$relAttributes[] = 'noreferrer';
|
||||
}
|
||||
|
||||
if ( ! empty( $settings['relSponsored'] ) ) {
|
||||
$relAttributes[] = 'sponsored';
|
||||
}
|
||||
|
||||
$image = sprintf(
|
||||
'<a %s>%s</a>',
|
||||
generateblocks_attr(
|
||||
'image-link',
|
||||
array(
|
||||
'class' => '',
|
||||
'href' => $dynamic_link,
|
||||
'rel' => ! empty( $relAttributes ) ? implode( ' ', $relAttributes ) : null,
|
||||
'target' => ! empty( $settings['openInNewWindow'] ) ? '_blank' : null,
|
||||
),
|
||||
$settings,
|
||||
$block
|
||||
),
|
||||
$image
|
||||
);
|
||||
}
|
||||
|
||||
$output .= $image;
|
||||
|
||||
if ( isset( $block->parsed_block['innerBlocks'][0]['attrs'] ) ) {
|
||||
$image_id = GenerateBlocks_Dynamic_Content::get_dynamic_image_id( $attributes );
|
||||
$block->parsed_block['innerBlocks'][0]['attrs']['dynamicImage'] = $image_id;
|
||||
|
||||
$caption = (
|
||||
new WP_Block(
|
||||
$block->parsed_block['innerBlocks'][0]
|
||||
)
|
||||
)->render( array( 'dynamic' => true ) );
|
||||
|
||||
if ( $caption ) {
|
||||
$output .= $caption;
|
||||
}
|
||||
}
|
||||
|
||||
$output .= '</figure>';
|
||||
|
||||
return $output;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,67 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Element block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* The Element block.
|
||||
*/
|
||||
class GenerateBlocks_Block_Loop_Item extends GenerateBlocks_Block {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
protected static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Store our block name.
|
||||
*
|
||||
* @var string $block_name The block name.
|
||||
*/
|
||||
public static $block_name = 'generateblocks/loop-item';
|
||||
|
||||
/**
|
||||
* Render the Element block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $block_content The block content.
|
||||
* @param object $block The block.
|
||||
*/
|
||||
public static function render_block( $attributes, $block_content, $block ) {
|
||||
$query_type = $block->context['generateblocks/queryType'] ?? null;
|
||||
|
||||
if ( GenerateBlocks_Block_Query::TYPE_WP_QUERY === $query_type ) {
|
||||
$post_classes = get_post_class();
|
||||
|
||||
if ( class_exists( 'WP_HTML_Tag_Processor' ) ) {
|
||||
$tags = new WP_HTML_Tag_Processor( $block_content );
|
||||
|
||||
if ( $tags->next_tag( $attributes['tagName'] ) ) {
|
||||
$existing_classes = $tags->get_attribute( 'class' );
|
||||
$new_classes = $existing_classes . ' ' . implode( ' ', $post_classes );
|
||||
$tags->set_attribute( 'class', $new_classes );
|
||||
$block_content = $tags->get_updated_html();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Add styles to this block if needed.
|
||||
$block_content = generateblocks_maybe_add_block_css(
|
||||
$block_content,
|
||||
[
|
||||
'class_name' => __CLASS__,
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
return $block_content;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,198 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Element block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* The Element block.
|
||||
*/
|
||||
class GenerateBlocks_Block_Looper extends GenerateBlocks_Block {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
protected static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Store our block name.
|
||||
*
|
||||
* @var string $block_name The block name.
|
||||
*/
|
||||
public static $block_name = 'generateblocks/looper';
|
||||
|
||||
/**
|
||||
* Sanitize a loop item's data for security.
|
||||
*
|
||||
* @param array|object $loop_item The loop item to sanitize.
|
||||
* @return array|object The sanitized loop item.
|
||||
*/
|
||||
public static function sanitize_loop_item( $loop_item ) {
|
||||
|
||||
$disallowed_keys = GenerateBlocks_Meta_Handler::DISALLOWED_KEYS ?? [];
|
||||
|
||||
foreach ( $disallowed_keys as $key ) {
|
||||
|
||||
if ( is_object( $loop_item ) ) {
|
||||
if ( isset( $loop_item->$key ) ) {
|
||||
unset( $loop_item->$key );
|
||||
}
|
||||
} elseif ( is_array( $loop_item ) ) {
|
||||
if ( isset( $loop_item[ $key ] ) ) {
|
||||
unset( $loop_item[ $key ] );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return $loop_item;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render the repeater items for the Looper block.
|
||||
*
|
||||
* @param array $attributes Block attributes.
|
||||
* @param WP_Block $block The block instance.
|
||||
* @return string The rendered content.
|
||||
*/
|
||||
public static function render_loop_items( $attributes, $block ) {
|
||||
$query_data = $block->context['generateblocks/queryData']['data'] ?? null;
|
||||
$query_type = $block->context['generateblocks/queryData']['type'] ?? null;
|
||||
$output = '';
|
||||
|
||||
if ( GenerateBlocks_Block_Query::TYPE_WP_QUERY === $query_type ) {
|
||||
$output = self::render_wp_query( $query_data, $attributes, $block );
|
||||
}
|
||||
|
||||
/**
|
||||
* Allow users to filter the looper rendering of loop items.
|
||||
*
|
||||
* @param string $output The block output.
|
||||
* @param string $query_type The query type.
|
||||
* @param array|object $query_data The query data.
|
||||
* @param array $attributes Block attributes.
|
||||
* @param WP_Block $block The block instance.
|
||||
*/
|
||||
$output = apply_filters( 'generateblocks_looper_render_loop_items', $output, $query_type, $query_data, $block, $attributes );
|
||||
|
||||
return $output;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render the repeater items for the Looper block.
|
||||
*
|
||||
* @param WP_Query $query The WP_Query instance.
|
||||
* @param array $attributes Block attributes.
|
||||
* @param WP_Block $block The block instance.
|
||||
* @return string The rendered content.
|
||||
*/
|
||||
public static function render_wp_query( $query, $attributes, $block ) {
|
||||
$query_id = $block->context['generateblocks/queryData']['id'] ?? null;
|
||||
$page_key = $query_id ? 'query-' . $query_id . '-page' : 'query-page';
|
||||
$per_page = $query->query_vars['posts_per_page'] ?? get_option( 'posts_per_page', 10 );
|
||||
$page = empty( $_GET[ $page_key ] ) ? 1 : (int) $_GET[ $page_key ]; // phpcs:ignore -- No data processing happening.
|
||||
$page_index = $page - 1; // Zero based index for pages.
|
||||
$offset = $page_index * $per_page;
|
||||
$content = '';
|
||||
$inner_blocks = $block->parsed_block['innerBlocks'] ?? [];
|
||||
|
||||
if ( empty( $inner_blocks ) ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
// Fallback to support preview in Elements.
|
||||
if ( ! $query ) {
|
||||
return (
|
||||
new WP_Block(
|
||||
$inner_blocks[0],
|
||||
array(
|
||||
'postType' => 'post',
|
||||
'postId' => 0,
|
||||
'generateblocks/queryType' => GenerateBlocks_Block_Query::TYPE_WP_QUERY,
|
||||
'generateblocks/loopIndex' => 1,
|
||||
'generateblocks/loopItem' => [ 'ID' => 0 ],
|
||||
)
|
||||
)
|
||||
)->render( array( 'dynamic' => false ) );
|
||||
}
|
||||
|
||||
if ( $query->have_posts() ) {
|
||||
while ( $query->have_posts() ) {
|
||||
$query->the_post();
|
||||
global $post;
|
||||
// Get the current index of the Loop.
|
||||
foreach ( $inner_blocks as $inner_block ) {
|
||||
$content .= (
|
||||
new WP_Block(
|
||||
$inner_block,
|
||||
array(
|
||||
'postType' => get_post_type(),
|
||||
'postId' => get_the_ID(),
|
||||
'generateblocks/queryType' => GenerateBlocks_Block_Query::TYPE_WP_QUERY,
|
||||
'generateblocks/loopIndex' => $offset + $query->current_post + 1,
|
||||
'generateblocks/loopItem' => self::sanitize_loop_item( $post ),
|
||||
)
|
||||
)
|
||||
)->render();
|
||||
}
|
||||
}
|
||||
|
||||
wp_reset_postdata();
|
||||
}
|
||||
|
||||
return $content;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render the Query block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $block_content The block content.
|
||||
* @param array $block The block.
|
||||
*/
|
||||
public static function render_block( $attributes, $block_content, $block ) {
|
||||
$loop_items = self::render_loop_items( $attributes, $block );
|
||||
|
||||
if ( ! $loop_items ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
$html_attributes = generateblocks_get_processed_html_attributes( $block_content );
|
||||
|
||||
// If our processing returned nothing, let's try to build our attributes from the block attributes.
|
||||
if ( empty( $html_attributes ) ) {
|
||||
$html_attributes = generateblocks_get_backup_html_attributes( 'gb-looper', $attributes );
|
||||
}
|
||||
|
||||
$tag_name = $attributes['tagName'] ?? 'div';
|
||||
|
||||
// Add styles to this block if needed.
|
||||
$output = generateblocks_maybe_add_block_css(
|
||||
'',
|
||||
[
|
||||
'class_name' => __CLASS__,
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
$output .= sprintf(
|
||||
'<%1$s %2$s>%3$s</%1$s>',
|
||||
$tag_name,
|
||||
generateblocks_attr(
|
||||
'looper',
|
||||
$html_attributes,
|
||||
$attributes,
|
||||
$block
|
||||
),
|
||||
$loop_items
|
||||
);
|
||||
|
||||
return $output;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,50 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Element block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* The Element block.
|
||||
*/
|
||||
class GenerateBlocks_Block_Media extends GenerateBlocks_Block {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
protected static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Store our block name.
|
||||
*
|
||||
* @var string $block_name The block name.
|
||||
*/
|
||||
public static $block_name = 'generateblocks/media';
|
||||
|
||||
/**
|
||||
* Render the Void Element block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $block_content The block content.
|
||||
* @param array $block The block.
|
||||
*/
|
||||
public static function render_block( $attributes, $block_content, $block ) {
|
||||
// Add styles to this block if needed.
|
||||
$block_content = generateblocks_maybe_add_block_css(
|
||||
$block_content,
|
||||
[
|
||||
'class_name' => __CLASS__,
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
return $block_content;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,78 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Query Loop block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* Add Query Loop related functions.
|
||||
*/
|
||||
class GenerateBlocks_Block_Query_Loop {
|
||||
/**
|
||||
* Wrapper function for our dynamic buttons.
|
||||
*
|
||||
* @since 1.6.0
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $content The dynamic text to display.
|
||||
* @param WP_Block $block Block instance.
|
||||
*/
|
||||
public static function render_block( $attributes, $content, $block ) {
|
||||
$page_key = isset( $block->context['generateblocks/queryId'] ) ? 'query-' . $block->context['generateblocks/queryId'] . '-page' : 'query-page';
|
||||
$page = empty( $_GET[ $page_key ] ) ? 1 : (int) $_GET[ $page_key ]; // phpcs:ignore -- No data processing happening.
|
||||
$query_args = GenerateBlocks_Query_Loop::get_query_args( $block, $page );
|
||||
|
||||
// Override the custom query with the global query if needed.
|
||||
$use_global_query = ( isset( $block->context['generateblocks/inheritQuery'] ) && $block->context['generateblocks/inheritQuery'] );
|
||||
|
||||
if ( $use_global_query ) {
|
||||
global $wp_query;
|
||||
|
||||
if ( $wp_query && isset( $wp_query->query_vars ) && is_array( $wp_query->query_vars ) ) {
|
||||
// Unset `offset` because if is set, $wp_query overrides/ignores the paged parameter and breaks pagination.
|
||||
unset( $query_args['offset'] );
|
||||
$query_args = wp_parse_args( $wp_query->query_vars, $query_args );
|
||||
|
||||
if ( empty( $query_args['post_type'] ) && is_singular() ) {
|
||||
$query_args['post_type'] = get_post_type( get_the_ID() );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$query_args = apply_filters(
|
||||
'generateblocks_query_loop_args',
|
||||
$query_args,
|
||||
$attributes,
|
||||
$block
|
||||
);
|
||||
|
||||
$the_query = new WP_Query( $query_args );
|
||||
|
||||
$content = '';
|
||||
if ( $the_query->have_posts() ) {
|
||||
while ( $the_query->have_posts() ) {
|
||||
$the_query->the_post();
|
||||
|
||||
$block_content = (
|
||||
new WP_Block(
|
||||
$block->parsed_block,
|
||||
array(
|
||||
'postType' => get_post_type(),
|
||||
'postId' => get_the_ID(),
|
||||
)
|
||||
)
|
||||
)->render( array( 'dynamic' => false ) );
|
||||
|
||||
$content .= $block_content;
|
||||
}
|
||||
}
|
||||
|
||||
wp_reset_postdata();
|
||||
|
||||
return $content;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,39 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the No Results block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* The No Results block.
|
||||
*/
|
||||
class GenerateBlocks_Block_Query_No_Results extends GenerateBlocks_Block {
|
||||
/**
|
||||
* Store our block name.
|
||||
*
|
||||
* @var string $block_name The block name.
|
||||
*/
|
||||
public static $block_name = 'generateblocks/query-no-results';
|
||||
|
||||
/**
|
||||
* Render the Shape block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $block_content The block content.
|
||||
* @param array $block The block.
|
||||
*/
|
||||
public static function render_block( $attributes, $block_content, $block ) {
|
||||
$no_results = $block->context['generateblocks/queryData']['noResults'] ?? false;
|
||||
|
||||
if ( ! $no_results ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
return $block_content;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,163 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the No Results block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* The No Results block.
|
||||
*/
|
||||
class GenerateBlocks_Block_Query_Page_Numbers extends GenerateBlocks_Block {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
protected static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Store our block name.
|
||||
*
|
||||
* @var string $block_name The block name.
|
||||
*/
|
||||
public static $block_name = 'generateblocks/query-page-numbers';
|
||||
|
||||
/**
|
||||
* Render the Shape block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $block_content The block content.
|
||||
* @param object $block The block.
|
||||
*/
|
||||
public static function render_block( $attributes, $block_content, $block ) {
|
||||
$query_id = $block->context['generateblocks/queryData']['id'] ?? null;
|
||||
$page_key = $query_id ? 'query-' . $query_id . '-page' : 'query-page';
|
||||
$page = empty( $_GET[ $page_key ] ) ? 1 : (int) $_GET[ $page_key ]; // phpcs:ignore -- No data processing happening.
|
||||
$args = $block->context['generateblocks/queryData']['args'] ?? [];
|
||||
$per_page = $args['posts_per_page'] ?? apply_filters( 'generateblocks_query_per_page_default', 10, $args );
|
||||
$content = '';
|
||||
$mid_size = isset( $block->attributes['midSize'] ) ? (int) $block->attributes['midSize'] : null;
|
||||
$inherit_query = $block->context['generateblocks/queryData']['inherit'] ?? false;
|
||||
|
||||
if ( $inherit_query ) {
|
||||
$paginate_args = [ 'prev_next' => false ];
|
||||
|
||||
if ( null !== $mid_size ) {
|
||||
$paginate_args['mid_size'] = $mid_size;
|
||||
}
|
||||
|
||||
$content = paginate_links( $paginate_args );
|
||||
} else {
|
||||
$query_data = $block->context['generateblocks/queryData']['data'] ?? null;
|
||||
$max_pages = $block->context['generateblocks/queryData']['maxPages'] ?? 0;
|
||||
|
||||
if ( ! $query_data ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
$paginate_args = array(
|
||||
'base' => '%_%',
|
||||
'format' => "?$page_key=%#%",
|
||||
'current' => max( 1, $page ),
|
||||
'total' => $max_pages,
|
||||
'prev_next' => false,
|
||||
);
|
||||
|
||||
if ( null !== $mid_size ) {
|
||||
$paginate_args['mid_size'] = $mid_size;
|
||||
}
|
||||
|
||||
if ( 1 !== $page ) {
|
||||
/**
|
||||
* `paginate_links` doesn't use the provided `format` when the page is `1`.
|
||||
* This is great for the main query as it removes the extra query params
|
||||
* making the URL shorter, but in the case of multiple custom queries is
|
||||
* problematic. It results in returning an empty link which ends up with
|
||||
* a link to the current page.
|
||||
*
|
||||
* A way to address this is to add a `fake` query arg with no value that
|
||||
* is the same for all custom queries. This way the link is not empty and
|
||||
* preserves all the other existent query args.
|
||||
*
|
||||
* @see https://developer.wordpress.org/reference/functions/paginate_links/
|
||||
*
|
||||
* The proper fix of this should be in core. Track Ticket:
|
||||
* @see https://core.trac.wordpress.org/ticket/53868
|
||||
*
|
||||
* TODO: After two WP versions (starting from the WP version the core patch landed),
|
||||
* we should remove this and call `paginate_links` with the proper new arg.
|
||||
*/
|
||||
$paginate_args['add_args'] = array( 'cst' => '' );
|
||||
}
|
||||
|
||||
// We still need to preserve `paged` query param if exists, as is used
|
||||
// for Queries that inherit from global context.
|
||||
$paged = empty( $_GET['paged'] ) ? null : (int) $_GET['paged']; // phpcs:ignore -- No data processing happening.
|
||||
|
||||
if ( $paged ) {
|
||||
$paginate_args['add_args'] = array( 'paged' => $paged );
|
||||
}
|
||||
|
||||
$content = paginate_links( $paginate_args );
|
||||
}
|
||||
|
||||
if ( empty( $content ) ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
$pagination_type = $block->context['generateblocks/queryData']['paginationType'] ?? '';
|
||||
$instant_pagination = GenerateBlocks_Block_Query::TYPE_INSTANT_PAGINATION === $pagination_type;
|
||||
|
||||
if ( $instant_pagination && class_exists( 'WP_HTML_Tag_Processor' ) ) {
|
||||
$p = new WP_HTML_Tag_Processor( $content );
|
||||
|
||||
while ( $p->next_tag(
|
||||
array( 'class_name' => 'page-numbers' )
|
||||
) ) {
|
||||
if ( 'A' === $p->get_tag() ) {
|
||||
$p->set_attribute( 'data-gb-router-target', 'query-' . $query_id );
|
||||
$p->set_attribute( 'data-gb-prefetch', true );
|
||||
}
|
||||
}
|
||||
$content = $p->get_updated_html();
|
||||
}
|
||||
|
||||
$html_attributes = generateblocks_get_processed_html_attributes( $block_content );
|
||||
|
||||
// If our processing returned nothing, let's try to build our attributes from the block attributes.
|
||||
if ( empty( $html_attributes ) ) {
|
||||
$html_attributes = generateblocks_get_backup_html_attributes( 'gb-query-page-numbers', $attributes );
|
||||
}
|
||||
|
||||
$tag_name = $attributes['tagName'] ?? 'div';
|
||||
|
||||
// Add styles to this block if needed.
|
||||
$output = generateblocks_maybe_add_block_css(
|
||||
'',
|
||||
[
|
||||
'class_name' => __CLASS__,
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
$output .= sprintf(
|
||||
'<%1$s %2$s>%3$s</%1$s>',
|
||||
$tag_name,
|
||||
generateblocks_attr(
|
||||
'query-page-numbers',
|
||||
$html_attributes,
|
||||
$attributes,
|
||||
$block
|
||||
),
|
||||
$content
|
||||
);
|
||||
|
||||
return $output;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,182 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Element block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* The Query block.
|
||||
*/
|
||||
class GenerateBlocks_Block_Query extends GenerateBlocks_Block {
|
||||
|
||||
const TYPE_WP_QUERY = 'WP_Query';
|
||||
const TYPE_INSTANT_PAGINATION = 'instant';
|
||||
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
protected static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Store our block name.
|
||||
*
|
||||
* @var string $block_name The block name.
|
||||
*/
|
||||
public static $block_name = 'generateblocks/query';
|
||||
|
||||
/**
|
||||
* Get the query data based on the type.
|
||||
*
|
||||
* @param string $query_type The type of query (WP_Query, post_meta, etc).
|
||||
* @param array $attributes Block attributes.
|
||||
* @param object $block The block instance.
|
||||
* @param int $page The current query page.
|
||||
* @return array Array of query data including the data for looping and no_results.
|
||||
*/
|
||||
public static function get_query_data( $query_type, $attributes, $block, $page ) {
|
||||
$original_args = $attributes['query'] ?? [];
|
||||
$query_data = [
|
||||
'data' => [],
|
||||
'no_results' => true,
|
||||
'args' => $original_args,
|
||||
];
|
||||
|
||||
if ( self::TYPE_WP_QUERY === $query_type ) {
|
||||
// Override the custom query with the global query if needed.
|
||||
$use_global_query = ( isset( $attributes['inheritQuery'] ) && $attributes['inheritQuery'] );
|
||||
|
||||
if ( $use_global_query ) {
|
||||
global $wp_query;
|
||||
|
||||
/*
|
||||
* If already in the main query loop, duplicate the query instance to not tamper with the main instance.
|
||||
* Since this is a nested query, it should start at the beginning, therefore rewind posts.
|
||||
* Otherwise, the main query loop has not started yet and this block is responsible for doing so.
|
||||
*/
|
||||
if ( in_the_loop() ) {
|
||||
$data = clone $wp_query;
|
||||
$data->rewind_posts();
|
||||
} else {
|
||||
$data = $wp_query;
|
||||
}
|
||||
|
||||
$query_args = $data->query_vars;
|
||||
} else {
|
||||
$query_args = GenerateBlocks_Query_Utils::get_wp_query_args(
|
||||
$query_data['args'],
|
||||
$page,
|
||||
$attributes,
|
||||
$block
|
||||
);
|
||||
|
||||
// Make the new WP_Query with filtered args.
|
||||
$data = new WP_Query( $query_args );
|
||||
}
|
||||
|
||||
$query_data = [
|
||||
'data' => $data,
|
||||
'no_results' => 0 === $data->found_posts,
|
||||
'args' => $query_args,
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Modify the Query block's query data.
|
||||
*
|
||||
* @param array $query_data The current query data.
|
||||
* @param string $query_type The type of query.
|
||||
* @param array $attributes An array of block attributes.
|
||||
* @param object $object The block instance.
|
||||
* @param int $page The current page number.
|
||||
*
|
||||
* @return array An array of query data.
|
||||
*/
|
||||
return apply_filters( 'generateblocks_query_data', $query_data, $query_type, $attributes, $block, $page );
|
||||
}
|
||||
|
||||
/**
|
||||
* Render the Query block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $block_content The block content.
|
||||
* @param object $block The block.
|
||||
*/
|
||||
public static function render_block( $attributes, $block_content, $block ) {
|
||||
$query_id = isset( $attributes['uniqueId'] ) ? 'query-' . $attributes['uniqueId'] : 'query';
|
||||
$page_key = $query_id . '-page';
|
||||
$page = empty( $_GET[ $page_key ] ) ? 1 : (int) $_GET[ $page_key ]; // phpcs:ignore -- No data processing happening.
|
||||
$pagination_type = $attributes['paginationType'] ?? '';
|
||||
$instant_pagination = self::TYPE_INSTANT_PAGINATION === $pagination_type;
|
||||
$query_type = $attributes['queryType'] ?? self::TYPE_WP_QUERY;
|
||||
$query_data = self::get_query_data(
|
||||
$query_type,
|
||||
$attributes,
|
||||
$block,
|
||||
$page
|
||||
);
|
||||
|
||||
if ( $instant_pagination ) {
|
||||
if ( ! wp_script_is( 'generateblocks-looper', 'enqueued' ) ) {
|
||||
$asset_info = generateblocks_get_enqueue_assets( 'generateblocks-looper' );
|
||||
|
||||
wp_enqueue_script(
|
||||
'generateblocks-looper',
|
||||
GENERATEBLOCKS_DIR_URL . 'dist/looper.js',
|
||||
$asset_info['dependencies'],
|
||||
$asset_info['version'],
|
||||
true
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
$max_pages = $query_data['max_num_pages'] ?? $query_data['data']->max_num_pages ?? 0;
|
||||
|
||||
$parsed_content = (
|
||||
new WP_Block(
|
||||
$block->parsed_block,
|
||||
array(
|
||||
'generateblocks/queryData' => [
|
||||
'id' => $attributes['uniqueId'] ?? '',
|
||||
'noResults' => $query_data['no_results'],
|
||||
'data' => $query_data['data'],
|
||||
'args' => $query_data['args'],
|
||||
'type' => $query_type,
|
||||
'maxPages' => $max_pages,
|
||||
'inherit' => $attributes['inheritQuery'] ?? false,
|
||||
'paginationType' => $pagination_type,
|
||||
],
|
||||
)
|
||||
)
|
||||
)->render( array( 'dynamic' => false ) );
|
||||
|
||||
if ( $instant_pagination && class_exists( 'WP_HTML_Tag_Processor' ) ) {
|
||||
$processor = new WP_HTML_Tag_Processor( $parsed_content );
|
||||
|
||||
if ( $processor->next_tag( $attributes['tagName'] ) ) {
|
||||
$processor->set_attribute( 'data-gb-router-region', $query_id );
|
||||
$parsed_content = $processor->get_updated_html();
|
||||
}
|
||||
}
|
||||
|
||||
// Add styles to this block if needed.
|
||||
$output = generateblocks_maybe_add_block_css(
|
||||
'',
|
||||
[
|
||||
'class_name' => __CLASS__,
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
$output .= $parsed_content;
|
||||
|
||||
return $output;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,50 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Element block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* The Element block.
|
||||
*/
|
||||
class GenerateBlocks_Block_Shape extends GenerateBlocks_Block {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
protected static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Store our block name.
|
||||
*
|
||||
* @var string $block_name The block name.
|
||||
*/
|
||||
public static $block_name = 'generateblocks/shape';
|
||||
|
||||
/**
|
||||
* Render the Shape block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $block_content The block content.
|
||||
* @param array $block The block.
|
||||
*/
|
||||
public static function render_block( $attributes, $block_content, $block ) {
|
||||
// Add styles to this block if needed.
|
||||
$block_content = generateblocks_maybe_add_block_css(
|
||||
$block_content,
|
||||
[
|
||||
'class_name' => __CLASS__,
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
return $block_content;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,50 @@
|
||||
<?php
|
||||
/**
|
||||
* Handles the Text block.
|
||||
*
|
||||
* @package GenerateBlocks
|
||||
*/
|
||||
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly.
|
||||
}
|
||||
|
||||
/**
|
||||
* The Text block.
|
||||
*/
|
||||
class GenerateBlocks_Block_Text extends GenerateBlocks_Block {
|
||||
/**
|
||||
* Keep track of all blocks of this type on the page.
|
||||
*
|
||||
* @var array $block_ids The current block id.
|
||||
*/
|
||||
protected static $block_ids = [];
|
||||
|
||||
/**
|
||||
* Store our block name.
|
||||
*
|
||||
* @var string $block_name The block name.
|
||||
*/
|
||||
public static $block_name = 'generateblocks/text';
|
||||
|
||||
/**
|
||||
* Render the Text block.
|
||||
*
|
||||
* @param array $attributes The block attributes.
|
||||
* @param string $block_content The block content.
|
||||
* @param array $block The block.
|
||||
*/
|
||||
public static function render_block( $attributes, $block_content, $block ) {
|
||||
// Add styles to this block if needed.
|
||||
$block_content = generateblocks_maybe_add_block_css(
|
||||
$block_content,
|
||||
[
|
||||
'class_name' => __CLASS__,
|
||||
'attributes' => $attributes,
|
||||
'block_ids' => self::$block_ids,
|
||||
]
|
||||
);
|
||||
|
||||
return $block_content;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user