ghostkit / gutenberg / extend / effects / index.php

index.php in Block Animations, Motion & Scroll Effects – Ghost Kit 3.7.0, at gutenberg/extend/effects/index.php

126 lines 3.4 KB

Raw Download Zip

1	<?php
2	/**
3	* Effects Extension.
4	*
5	* @package ghostkit
6	*/
7
8	if ( ! defined( 'ABSPATH' ) ) {
9	exit;
10	}
11
12	/**
13	* Class GhostKit_Extension_Effects
14	*/
15	class GhostKit_Extension_Effects {
16	/**
17	* GhostKit_Extension_Effects constructor.
18	*/
19	public function __construct() {
20	GhostKit_Extensions::register(
21	'effects',
22	array(
23	'default_supports' => array(
24	'effects' => array(
25	'reveal' => true,
26	'mouseHover' => true,
27	'mousePress' => true,
28	'mouseMove' => true,
29	'scroll' => true,
30	'loop' => true,
31	),
32	),
33	'render_block' => array( $this, 'render_block' ),
34	)
35	);
36
37	add_action( 'wp_head', array( $this, 'add_reveal_styles' ) );
38	}
39
40	/**
41	* Renders attributes to the block wrapper.
42	*
43	* @param string $block_content Rendered block content.
44	* @param array $block Block object.
45	* @param WP_Block_Type $block_type Block type.
46	*
47	* @return string Filtered block content.
48	*/
49	public function render_block( $block_content, $block, $block_type ) {
50	global $wp_version;
51	$has_effects_support = block_has_support( $block_type, array( 'ghostkit', 'effects' ), null );
52
53	if ( ! $has_effects_support ) {
54	return $block_content;
55	}
56
57	$effects_data = array();
58
59	$has_reveal_support = block_has_support( $block_type, array( 'ghostkit', 'effects', 'reveal' ), null );
60	$reveal_data = _wp_array_get( $block['attrs'], array( 'ghostkit', 'effects', 'reveal' ), false );
61
62	if ( $has_reveal_support && $reveal_data && is_array( $reveal_data ) ) {
63	$effects_data['reveal'] = $reveal_data;
64	}
65
66	$effects_data = apply_filters( 'gkt_extension_effects_data', $effects_data, $block_content, $block, $block_type );
67
68	if ( empty( $effects_data ) ) {
69	return $block_content;
70	}
71
72	// Inject data attribute to block container markup.
73	$processor = new WP_HTML_Tag_Processor( $block_content );
74
75	if ( $processor->next_tag() ) {
76	$effects_data_string = wp_json_encode( $effects_data );
77
78	// WP 6.9+ automatically escapes attributes in WP_HTML_Tag_Processor.
79	// For older versions, we need to manually escape to prevent XSS.
80	//
81	// Possible related issues:
82	// - https://github.com/WordPress/wordpress-develop/pull/10591
83	// - https://core.trac.wordpress.org/ticket/64340 .
84	if ( version_compare( $wp_version, '6.9', '<' ) ) {
85	$effects_data_string = esc_attr( $effects_data_string );
86	}
87
88	$processor->set_attribute( 'data-gkt-effects', $effects_data_string );
89
90	if ( ! empty( $effects_data['reveal'] ) ) {
91	$processor->add_class( 'ghostkit-effects-reveal' );
92	}
93
94	$processor = apply_filters( 'gkt_extension_effects_tag_processor', $processor, $effects_data, $block_content, $block, $block_type );
95	}
96
97	return $processor->get_updated_html();
98	}
99
100	/**
101	* Add styles using JS for effects reveal feature.
102	* As we need to hide blocks, we should make sure that
103	* 1. JS is enabled in the browser.
104	* 2. User has not set reduced motion in the OS settings.
105	*/
106	public function add_reveal_styles() {
107	?>
108	<style type="text/css">
109	.ghostkit-effects-enabled .ghostkit-effects-reveal {
110	pointer-events: none;
111	visibility: hidden;
112	}
113	</style>
114	<script>
115	if (!window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
116	document.documentElement.classList.add(
117	'ghostkit-effects-enabled'
118	);
119	}
120	</script>
121	<?php
122	}
123	}
124
125	new GhostKit_Extension_Effects();
126