|
1
|
|
|
<?php //phpcs:ignore WordPress.Files.FileName.InvalidClassFileName |
|
2
|
|
|
/** |
|
3
|
|
|
* Tiled Gallery block. |
|
4
|
|
|
* Relies on Photon, but can be used even when the module is not active. |
|
5
|
|
|
* |
|
6
|
|
|
* @since 6.9.0 |
|
7
|
|
|
* |
|
8
|
|
|
* @package Jetpack |
|
9
|
|
|
*/ |
|
10
|
|
|
|
|
11
|
|
|
namespace Automattic\Jetpack\Extensions; |
|
12
|
|
|
|
|
13
|
|
|
use Jetpack_Gutenberg; |
|
14
|
|
|
use Jetpack_Plan; |
|
15
|
|
|
|
|
16
|
|
|
/** |
|
17
|
|
|
* Jetpack Tiled Gallery Block class |
|
18
|
|
|
* |
|
19
|
|
|
* @since 7.3 |
|
20
|
|
|
*/ |
|
21
|
|
|
class Tiled_Gallery { |
|
22
|
|
|
const FEATURE_NAME = 'tiled-gallery'; |
|
23
|
|
|
const BLOCK_NAME = 'jetpack/' . self::FEATURE_NAME; |
|
24
|
|
|
|
|
25
|
|
|
/* Values for building srcsets */ |
|
26
|
|
|
const IMG_SRCSET_WIDTH_MAX = 2000; |
|
27
|
|
|
const IMG_SRCSET_WIDTH_MIN = 600; |
|
28
|
|
|
const IMG_SRCSET_WIDTH_STEP = 300; |
|
29
|
|
|
|
|
30
|
|
|
/** |
|
31
|
|
|
* Register the block |
|
32
|
|
|
*/ |
|
33
|
|
|
public static function register() { |
|
34
|
|
|
jetpack_register_block( |
|
35
|
|
|
self::BLOCK_NAME, |
|
36
|
|
|
array( |
|
37
|
|
|
'render_callback' => array( __CLASS__, 'render' ), |
|
38
|
|
|
) |
|
39
|
|
|
); |
|
40
|
|
|
} |
|
41
|
|
|
|
|
42
|
|
|
/** |
|
43
|
|
|
* Tiled gallery block registration |
|
44
|
|
|
* |
|
45
|
|
|
* @param array $attr Array containing the block attributes. |
|
46
|
|
|
* @param string $content String containing the block content. |
|
47
|
|
|
* |
|
48
|
|
|
* @return string |
|
49
|
|
|
*/ |
|
50
|
|
|
public static function render( $attr, $content ) { |
|
51
|
|
|
Jetpack_Gutenberg::load_assets_as_required( self::FEATURE_NAME ); |
|
52
|
|
|
|
|
53
|
|
|
$is_squareish_layout = self::is_squareish_layout( $attr ); |
|
54
|
|
|
|
|
55
|
|
|
// Jetpack_Plan does not exist on WordPress.com. |
|
56
|
|
|
if ( class_exists( 'Jetpack_Plan' ) ) { |
|
57
|
|
|
$jetpack_plan = Jetpack_Plan::get(); |
|
58
|
|
|
wp_localize_script( 'jetpack-gallery-settings', 'jetpack_plan', array( 'data' => $jetpack_plan['product_slug'] ) ); |
|
59
|
|
|
} |
|
60
|
|
|
|
|
61
|
|
|
if ( preg_match_all( '/<img [^>]+>/', $content, $images ) ) { |
|
62
|
|
|
/** |
|
63
|
|
|
* This block processes all of the images that are found and builds $find and $replace. |
|
64
|
|
|
* |
|
65
|
|
|
* The original img is added to the $find array and the replacement is made and added |
|
66
|
|
|
* to the $replace array. This is so that the same find and replace operations can be |
|
67
|
|
|
* made on the entire $content. |
|
68
|
|
|
*/ |
|
69
|
|
|
$find = array(); |
|
70
|
|
|
$replace = array(); |
|
71
|
|
|
|
|
72
|
|
|
foreach ( $images[0] as $image_html ) { |
|
73
|
|
|
if ( |
|
74
|
|
|
preg_match( '/data-width="([0-9]+)"/', $image_html, $img_height ) |
|
75
|
|
|
&& preg_match( '/data-height="([0-9]+)"/', $image_html, $img_width ) |
|
76
|
|
|
&& preg_match( '/src="([^"]+)"/', $image_html, $img_src ) |
|
77
|
|
|
) { |
|
78
|
|
|
// Drop img src query string so it can be used as a base to add photon params |
|
79
|
|
|
// for the srcset. |
|
80
|
|
|
$src_parts = explode( '?', $img_src[1], 2 ); |
|
81
|
|
|
$orig_src = $src_parts[0]; |
|
82
|
|
|
$orig_height = absint( $img_height[1] ); |
|
83
|
|
|
$orig_width = absint( $img_width[1] ); |
|
84
|
|
|
|
|
85
|
|
|
// Because URLs are already "photon", the photon function used short-circuits |
|
86
|
|
|
// before ssl is added. Detect ssl and add is if necessary. |
|
87
|
|
|
$is_ssl = ! empty( $src_parts[1] ) && false !== strpos( $src_parts[1], 'ssl=1' ); |
|
88
|
|
|
|
|
89
|
|
|
if ( ! $orig_width || ! $orig_height || ! $orig_src ) { |
|
90
|
|
|
continue; |
|
91
|
|
|
} |
|
92
|
|
|
|
|
93
|
|
|
$srcset_parts = array(); |
|
94
|
|
|
if ( $is_squareish_layout ) { |
|
95
|
|
|
$min_width = min( self::IMG_SRCSET_WIDTH_MIN, $orig_width, $orig_height ); |
|
96
|
|
|
$max_width = min( self::IMG_SRCSET_WIDTH_MAX, $orig_width, $orig_height ); |
|
97
|
|
|
|
|
98
|
|
View Code Duplication |
for ( $w = $min_width; $w <= $max_width; $w = min( $max_width, $w + self::IMG_SRCSET_WIDTH_STEP ) ) { |
|
99
|
|
|
$srcset_src = add_query_arg( |
|
100
|
|
|
array( |
|
101
|
|
|
'resize' => $w . ',' . $w, |
|
102
|
|
|
'strip' => 'info', |
|
103
|
|
|
), |
|
104
|
|
|
$orig_src |
|
105
|
|
|
); |
|
106
|
|
|
if ( $is_ssl ) { |
|
107
|
|
|
$srcset_src = add_query_arg( 'ssl', '1', $srcset_src ); |
|
108
|
|
|
} |
|
109
|
|
|
$srcset_parts[] = esc_url( $srcset_src ) . ' ' . $w . 'w'; |
|
110
|
|
|
if ( $w >= $max_width ) { |
|
111
|
|
|
break; |
|
112
|
|
|
} |
|
113
|
|
|
} |
|
114
|
|
|
} else { |
|
115
|
|
|
$min_width = min( self::IMG_SRCSET_WIDTH_MIN, $orig_width ); |
|
116
|
|
|
$max_width = min( self::IMG_SRCSET_WIDTH_MAX, $orig_width ); |
|
117
|
|
|
|
|
118
|
|
View Code Duplication |
for ( $w = $min_width; $w <= $max_width; $w = min( $max_width, $w + self::IMG_SRCSET_WIDTH_STEP ) ) { |
|
119
|
|
|
$srcset_src = add_query_arg( |
|
120
|
|
|
array( |
|
121
|
|
|
'strip' => 'info', |
|
122
|
|
|
'w' => $w, |
|
123
|
|
|
), |
|
124
|
|
|
$orig_src |
|
125
|
|
|
); |
|
126
|
|
|
if ( $is_ssl ) { |
|
127
|
|
|
$srcset_src = add_query_arg( 'ssl', '1', $srcset_src ); |
|
128
|
|
|
} |
|
129
|
|
|
$srcset_parts[] = esc_url( $srcset_src ) . ' ' . $w . 'w'; |
|
130
|
|
|
if ( $w >= $max_width ) { |
|
131
|
|
|
break; |
|
132
|
|
|
} |
|
133
|
|
|
} |
|
134
|
|
|
} |
|
135
|
|
|
|
|
136
|
|
|
if ( ! empty( $srcset_parts ) ) { |
|
137
|
|
|
$srcset = 'srcset="' . esc_attr( implode( ',', $srcset_parts ) ) . '"'; |
|
138
|
|
|
|
|
139
|
|
|
$find[] = $image_html; |
|
140
|
|
|
$replace[] = str_replace( '<img', '<img ' . $srcset, $image_html ); |
|
141
|
|
|
} |
|
142
|
|
|
} |
|
143
|
|
|
} |
|
144
|
|
|
|
|
145
|
|
|
if ( ! empty( $find ) ) { |
|
146
|
|
|
$content = str_replace( $find, $replace, $content ); |
|
147
|
|
|
} |
|
148
|
|
|
} |
|
149
|
|
|
|
|
150
|
|
|
/** |
|
151
|
|
|
* Filter the output of the Tiled Galleries content. |
|
152
|
|
|
* |
|
153
|
|
|
* @module tiled-gallery |
|
154
|
|
|
* |
|
155
|
|
|
* @since 6.9.0 |
|
156
|
|
|
* |
|
157
|
|
|
* @param string $content Tiled Gallery block content. |
|
158
|
|
|
*/ |
|
159
|
|
|
return apply_filters( 'jetpack_tiled_galleries_block_content', $content ); |
|
160
|
|
|
} |
|
161
|
|
|
|
|
162
|
|
|
/** |
|
163
|
|
|
* Determines whether a Tiled Gallery block uses square or circle images (1:1 ratio) |
|
164
|
|
|
* |
|
165
|
|
|
* Layouts are block styles and will be available as `is-style-[LAYOUT]` in the className |
|
166
|
|
|
* attribute. The default (rectangular) will be omitted. |
|
167
|
|
|
* |
|
168
|
|
|
* @param {Array} $attr Attributes key/value array. |
|
|
|
|
|
|
169
|
|
|
* @return {boolean} True if layout is squareish, otherwise false. |
|
|
|
|
|
|
170
|
|
|
*/ |
|
171
|
|
|
private static function is_squareish_layout( $attr ) { |
|
172
|
|
|
return isset( $attr['className'] ) |
|
173
|
|
|
&& ( |
|
174
|
|
|
'is-style-square' === $attr['className'] |
|
175
|
|
|
|| 'is-style-circle' === $attr['className'] |
|
176
|
|
|
); |
|
177
|
|
|
} |
|
178
|
|
|
} |
|
179
|
|
|
|
|
180
|
|
|
Tiled_Gallery::register(); |
|
181
|
|
|
|
Automattic /
jetpack
Loading history...
This check marks PHPDoc comments that could not be parsed by our parser. To see which comment annotations we can parse, please refer to our documentation on supported doc-types.