PluginProbe
aBlocks – Gutenberg Blocks, User Dashboard Builder, Popup Builder, Form Builder & Animation Builder / 2.9.1
aBlocks – Gutenberg Blocks, User Dashboard Builder, Popup Builder, Form Builder & Animation Builder v2.9.1
2.13.0 2.13.1 2.12.0 2.11.1 2.11.0 2.10.0 2.9.0 2.7.4 2.7.5 2.7.6 2.7.7 2.8.0 2.8.1 2.9.1 trunk 1.0 1.0-beta1 1.0-beta2 1.0-beta3 1.0.1 1.0.2 1.0.3 1.1.0 1.1.1 1.1.2 All 80 releases
ablocks / includes / blocks / news-ticker / block.php

block.php in aBlocks – Gutenberg Blocks, User Dashboard Builder, Popup Builder, Form Builder & Animation Builder 2.9.1, at includes/blocks/news-ticker/block.php

465 lines 16.6 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 namespace ABlocks\Blocks\NewsTicker;
3
4 if ( ! defined( 'ABSPATH' ) ) {
5 exit;
6 }
7
8 use ABlocks\Classes\BlockBaseAbstract;
9 use ABlocks\Classes\CssGenerator;
10 use ABlocks\Controls\Typography;
11 use ABlocks\Controls\TextShadow;
12 use ABlocks\Controls\TextStroke;
13 use ABlocks\Controls\Range;
14
15 class Block extends BlockBaseAbstract {
16 protected $block_name = 'news-ticker';
17
18
19
20 public function build_css( $attributes ) {
21 // Generate CSS start
22 $css_generator = new CssGenerator( $attributes, $this->block_name );
23
24 $css_generator->add_class_styles(
25 '{{WRAPPER}} .ablocks-block-news-ticker__label',
26 $this->get_label_css( $attributes ),
27 $this->get_label_css( $attributes, 'Tablet' ),
28 $this->get_label_css( $attributes, 'Mobile' )
29 );
30
31 $css_generator->add_class_styles(
32 '{{WRAPPER}} .ablocks-block-news-ticker__label:hover',
33 $this->get_label_color_hover_css( $attributes ),
34 $this->get_label_color_hover_css( $attributes, 'Tablet' ),
35 $this->get_label_color_hover_css( $attributes, 'Mobile' )
36 );
37
38 $css_generator->add_class_styles(
39 '{{WRAPPER}} .ablocks-block-news-ticker',
40 $this->get_ticker_content_css( $attributes ),
41 $this->get_ticker_content_css( $attributes, 'Tablet' ),
42 $this->get_ticker_content_css( $attributes, 'Mobile' )
43 );
44
45 $css_generator->add_class_styles(
46 '{{WRAPPER}} .ablocks-block-news-ticker__marquee',
47 $this->get_ticker_color_css( $attributes ),
48 $this->get_ticker_color_css( $attributes, 'Tablet' ),
49 $this->get_ticker_color_css( $attributes, 'Mobile' )
50 );
51
52 $css_generator->add_class_styles(
53 '{{WRAPPER}} .ablocks-block-news-ticker__marquee:hover',
54 $this->get_ticker_color_hover_css( $attributes ),
55 $this->get_ticker_color_hover_css( $attributes, 'Tablet' ),
56 $this->get_ticker_color_hover_css( $attributes, 'Mobile' )
57 );
58
59 $css_generator->add_class_styles(
60 '{{WRAPPER}} .ablocks-block-news-ticker--icons',
61 $this->get_navigator_css( $attributes )
62 );
63 $css_generator->add_class_styles(
64 '{{WRAPPER}} .ablocks-block-news-ticker--icons__prev',
65 $this->get_navigator_color_css( $attributes )
66 );
67 $css_generator->add_class_styles(
68 '{{WRAPPER}} .ablocks-block-news-ticker--icons__next',
69 $this->get_navigator_color_css( $attributes )
70 );
71 $css_generator->add_class_styles(
72 '{{WRAPPER}} .ablocks-block-news-ticker--icons__pause',
73 $this->get_navigator_color_css( $attributes )
74 );
75 $css_generator->add_class_styles(
76 '{{WRAPPER}} .ablocks-block-news-ticker--icons__resume',
77 $this->get_navigator_color_css( $attributes )
78 );
79 $css_generator->add_class_styles(
80 '{{WRAPPER}} .ablocks-block-news-ticker__list',
81 $this->get_ticker_list_styles_css( $attributes ),
82 $this->get_ticker_list_styles_css( $attributes, 'Tablet' ),
83 $this->get_ticker_list_styles_css( $attributes, 'Mobile' )
84 );
85
86 $css_generator->add_class_styles(
87 '{{WRAPPER}} .ablocks-block-news-ticker--date',
88 $this->get_show_time_css( $attributes )
89 );
90
91 return $css_generator->generate_css();
92 }
93
94 public function get_label_css( $attributes, $device = '' ) {
95 $label_css = [];
96
97 if ( ! empty( $attributes['labelColor'] ) ) {
98 $label_css['color'] = $attributes['labelColor'];
99 }
100
101 if ( ! empty( $attributes['labelBackgroundColor'] ) ) {
102 $label_css['background-color'] = $attributes['labelBackgroundColor'];
103 }
104
105 if ( isset( $attributes['isShowLabel'] ) && $attributes['isShowLabel'] ) {
106 $label_css['display'] = 'flex';
107 } else {
108 $label_css['display'] = 'none';
109 }
110
111 if ( isset( $attributes['labelPosition'] ) && $attributes['labelPosition'] === 'right' ) {
112 $label_css['right'] = '0';
113 $label_css['left'] = 'auto';
114 } else {
115 $label_css['left'] = '0';
116 $label_css['right'] = 'auto';
117 }
118
119 if ( ! empty( $attributes['tickerLabelShape'] ) ) {
120 switch ( $attributes['tickerLabelShape'] ) {
121 case 'small':
122 $label_css['clip-path'] = 'polygon(0% 0%, 80% 0%, 100% 50%, 80% 100%, 0% 100%)';
123 break;
124
125 case 'medium':
126 $label_css['clip-path'] = 'polygon(0% 0%, 85% 0%, 100% 50%, 85% 100%, 0% 100%)';
127 break;
128
129 case 'large':
130 $label_css['clip-path'] = 'polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%)';
131 break;
132
133 default:
134 $label_css['clip-path'] = '';
135 break;
136 }
137 }
138 $typography_css = ! empty( $attributes['labelTypography'] ) ? Typography::get_css( $attributes['labelTypography'], '', $device ) : array();
139 $textShadowCss = ! empty( $attributes['labelTextShadow'] ) ? TextShadow::get_css( $attributes['labelTextShadow'], '', $device ) : array();
140 $textStrokeCss = ! empty( $attributes['labelTextStroke'] ) ? TextStroke::get_css( $attributes['labelTextStroke'], '', $device ) : array();
141 return array_merge(
142 Range::get_css([
143 'attributeValue' => $attributes['labelPadding'],
144 'attribute_object_key' => 'value',
145 'isResponsive' => true,
146 'defaultValue' => 10,
147 'hasUnit' => true,
148 'unitDefaultValue' => 'px',
149 'property' => 'padding',
150 'device' => $device,
151 ]),
152 $label_css,
153 $typography_css,
154 $textShadowCss,
155 $textStrokeCss
156 );
157 }
158
159
160 public function get_label_color_hover_css( $attributes ) {
161 $labelColorHoverCSS = [];
162
163 if ( ! empty( $attributes['labelColorH'] ) ) {
164 $labelColorHoverCSS['color'] = $attributes['labelColorH'];
165 }
166
167 if ( ! empty( $attributes['labelBackgroundColorH'] ) ) {
168 $labelColorHoverCSS['background-color'] = $attributes['labelBackgroundColorH'];
169 }
170
171 return array_merge(
172 Range::get_css([
173 'attributeValue' => $attributes['labelColorTransition'],
174 'attribute_object_key' => 'value',
175 'defaultValue' => 0,
176 'unitDefaultValue' => 's',
177 'property' => 'transition-duration',
178 ]),
179 $labelColorHoverCSS
180 );
181 }
182
183 public function get_ticker_content_css( $attributes, $device = '' ) {
184 $ticker_content_css = [];
185
186 if ( isset( $attributes['isPositionSticky'] ) && $attributes['isPositionSticky'] ) {
187 if ( isset( $attributes['stickyPosition'] ) && $attributes['stickyPosition'] === 'up' ) {
188 $ticker_content_css['position'] = 'fixed';
189 $ticker_content_css['top'] = '32px';
190 $ticker_content_css['left'] = '0';
191 $ticker_content_css['width'] = '100%';
192
193 } elseif ( isset( $attributes['stickyPosition'] ) && $attributes['stickyPosition'] === 'down' ) {
194 $ticker_content_css['position'] = 'fixed';
195 $ticker_content_css['bottom'] = '0';
196 $ticker_content_css['left'] = '0';
197 $ticker_content_css['width'] = '100%';
198 }
199 }
200
201 return array_merge(
202 Range::get_css([
203 'attributeValue' => $attributes['tickerHeight'],
204 'attribute_object_key' => 'value',
205 'isResponsive' => true,
206 'defaultValue' => 50,
207 'hasUnit' => true,
208 'unitDefaultValue' => 'px',
209 'property' => 'height',
210 'device' => $device,
211 ]),
212 $ticker_content_css
213 );
214 }
215
216 public function get_ticker_list_styles_css( $attributes, $device = '' ) {
217 $ticker_list_styles_css = [];
218 if ( isset( $attributes['tickerListStyle'] ) ) {
219 switch ( $attributes['tickerListStyle'] ) {
220 case 'none':
221 $ticker_list_styles_css['list-style'] = 'none';
222 break;
223 case 'circle':
224 $ticker_list_styles_css['list-style'] = 'circle';
225 break;
226 case 'box':
227 $ticker_list_styles_css['list-style'] = 'square';
228 break;
229 default:
230 $ticker_list_styles_css['list-style'] = 'none';
231 }
232 }
233
234 $typography_css = ! empty( $attributes['tickerTypography'] ) ? Typography::get_css( $attributes['tickerTypography'], '', $device ) : array();
235 $textShadowCss = ! empty( $attributes['tickerTextShadow'] ) ? TextShadow::get_css( $attributes['tickerTextShadow'], '', $device ) : array();
236 $textStrokeCss = ! empty( $attributes['tickerTextStroke'] ) ? TextStroke::get_css( $attributes['tickerTextStroke'], '', $device ) : array();
237
238 return array_merge(
239 $ticker_list_styles_css,
240 $typography_css,
241 $textShadowCss,
242 $textStrokeCss );
243 }
244
245 public function get_ticker_color_css( $attributes ) {
246 $tickerColorCSS = [];
247
248 if ( isset( $attributes['tickerColor'] ) && ! empty( $attributes['tickerColor'] ) ) {
249 $tickerColorCSS['color'] = $attributes['tickerColor'];
250 }
251
252 if ( isset( $attributes['tickerBgColor'] ) && ! empty( $attributes['tickerBgColor'] ) ) {
253 $tickerColorCSS['background'] = $attributes['tickerBgColor'];
254 }
255
256 return $tickerColorCSS;
257 }
258
259 public function get_ticker_color_hover_css( $attributes ) {
260 $tickerColorHoverCSS = [];
261
262 if ( isset( $attributes['tickerColorH'] ) && ! empty( $attributes['tickerColorH'] ) ) {
263 $tickerColorHoverCSS['color'] = $attributes['tickerColorH'];
264 }
265
266 if ( isset( $attributes['tickerBgColorH'] ) && ! empty( $attributes['tickerBgColorH'] ) ) {
267 $tickerColorHoverCSS['background'] = $attributes['tickerBgColorH'];
268 }
269
270 return array_merge(
271 Range::get_css([
272 'attributeValue' => $attributes['tickerColorTransition'],
273 'attribute_object_key' => 'value',
274 'defaultValue' => 0,
275 'unitDefaultValue' => 's',
276 'property' => 'transition-duration',
277 ]),
278 $tickerColorHoverCSS
279 );
280 }
281
282 public function get_navigator_css( $attributes ) {
283 $navigator_css = [];
284
285 if ( isset( $attributes['showTickerNavigator'] ) && $attributes['showTickerNavigator'] ) {
286 $navigator_css['display'] = 'flex';
287 } else {
288 $navigator_css['display'] = 'none';
289 }
290 if ( isset( $attributes['navigatorPosition'] ) && $attributes['navigatorPosition'] === 'right' ) {
291 $navigator_css['right'] = '0';
292 $navigator_css['left'] = 'auto';
293 } else {
294 $navigator_css['left'] = '0';
295 $navigator_css['right'] = 'auto';
296 }
297
298 return $navigator_css;
299 }
300 public function get_navigator_color_css( $attributes ) {
301 $navigator_css = [];
302
303 if ( isset( $attributes['navigatorBgColor'] ) && $attributes['navigatorBgColor'] ) {
304 $navigator_css['background'] = $attributes['navigatorBgColor'];
305 }
306
307 return $navigator_css;
308 }
309
310 public function get_show_time_css( $attributes ) {
311 $time_show_css = [];
312
313 if ( isset( $attributes['isShowTime'] ) && $attributes['isShowTime'] ) {
314 $time_show_css['display'] = 'inline';
315 } else {
316 $time_show_css['display'] = 'none';
317 }
318
319 return $time_show_css;
320 }
321
322
323
324
325 public function render_block_content( $attributes, $content, $block_instance ) {
326 $sticky_label = $attributes['stickyLabel'] ?? 'Breaking News';
327 $sticky_label_tag = $attributes['stickyLabelTag'] ?? 'span';
328 $selected_posts = $attributes['selectedPosts'] ?? [];
329 $selected_pages = $attributes['selectedPages'] ?? [];
330 $slide_speed = $attributes['slideSpeed'] ?? '2';
331 $is_pause_on_over = $attributes['isPauseOnOver'] ?? false;
332 $show_ticker_navigator = $attributes['showTickerNavigator'] ?? false;
333 $custom_text = $attributes['customText'] ?? '';
334 $query_type = $attributes['queryType'] ?? '';
335 $navigator_color = $attributes['navigatorColor'] ?? '';
336
337 $post_type = ! empty( $selected_pages ) ? 'page' : 'post';
338 $selected_items = ! empty( $selected_pages ) ? $selected_pages : $selected_posts;
339
340 $args = [
341 'post_type' => $post_type,
342 'post__in' => $selected_items,
343 'orderby' => 'post__in',
344 'posts_per_page' => -1,
345 ];
346
347 $query = new \WP_Query( $args );
348
349 ob_start();
350 ?>
351 <div class="ablocks-block-news-ticker"
352 data-slide-speed="<?php echo esc_attr( $slide_speed ); ?>"
353 data-slide-direction="<?php echo esc_attr( $attributes['slideDirection'] ); ?>"
354 data-pause-on-hover="<?php echo esc_attr( $is_pause_on_over ? 'true' : 'false' ); ?>"
355 data-navigator-color="<?php echo esc_attr( $attributes['navigatorColor'] ); ?>">
356 <<?php echo esc_attr( $sticky_label_tag ); ?> class="ablocks-block-news-ticker__label">
357 <?php echo esc_html( $sticky_label ); ?>
358 </<?php echo esc_attr( $sticky_label_tag ); ?>>
359 <div class="ablocks-block-news-ticker__marquee">
360 <div class="ablocks-block-news-ticker_marquee--content">
361 <ul class="ablocks-block-news-ticker__list">
362 <?php if ( $query_type === 'customText' && ! empty( $attributes['lists'] ) ) : ?>
363 <?php foreach ( $attributes['lists'] as $item ) : ?>
364 <li class="ablocks-block-news-ticker__item">
365 <span class="ablocks-block-news-ticker__custom-text">
366 <?php if ( ! empty( $item['link']['href'] ) ) : ?>
367 <a
368 href="<?php echo esc_url( $item['link']['href'] ); ?>"
369 <?php echo ! empty( $item['link']['linkTarget'] ) ? 'target="_blank" rel="noopener noreferrer"' : ''; ?>
370 >
371 <?php echo esc_html( $item['text'] ); ?>
372 </a>
373 <?php else : ?>
374 <?php echo esc_html( $item['text'] ); ?>
375 <?php endif; ?>
376 </span>
377 </li>
378 <?php endforeach; ?>
379 <?php elseif ( ! empty( $selected_items ) ) : ?>
380 <?php
381 if ( $query->have_posts() ) :
382 while ( $query->have_posts() ) :
383 $query->the_post();
384 $has_link = ! empty( $attributes['pageLink'] ) || ! empty( $attributes['postLink'] );
385 $post_link = get_permalink();
386 $link_target = '_blank';
387 ?>
388 <?php if ( $has_link ) : ?>
389 <a href="<?php echo esc_url( $post_link ); ?>" target="<?php echo esc_attr( $link_target ); ?>">
390 <li class="ablocks-block-news-ticker__item">
391 <?php the_title(); ?>
392 <span class="ablocks-block-news-ticker--date">
393 <?php echo esc_html( $this->get_relative_time( get_the_date() ) ); ?>
394 </span>
395 </li>
396 </a>
397 <?php else : ?>
398 <li class="ablocks-block-news-ticker__item">
399 <?php the_title(); ?>
400 <span class="ablocks-block-news-ticker--date">
401 <?php echo esc_html( $this->get_relative_time( get_the_date() ) ); ?>
402 </span>
403 </li>
404 <?php endif; ?>
405 <?php
406 endwhile;
407 else :
408 ?>
409 <li>
410 <?php
411 // translators: %s is the post type (e.g., 'post', 'page', etc.)
412 echo esc_html( sprintf( __( 'No %s found in the selection', 'ablocks' ), $post_type . 's' ) );
413 ?></li>
414 <?php endif; ?>
415
416
417 <?php else : ?>
418 <li><?php esc_html_e( 'No items selected', 'ablocks' ); ?></li>
419 <?php endif; ?>
420 </ul>
421 </div>
422 <?php if ( $show_ticker_navigator ) : ?>
423 <div class="ablocks-block-news-ticker--icons">
424 <button class="ablocks-block-news-ticker--icons__prev">
425 <svg width="24" height="50" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
426 <path d="M18.119 22.1309C18.2003 22.2122 18.2648 22.3087 18.3088 22.415C18.3528 22.5212 18.3755 22.635 18.3755 22.75C18.3755 22.865 18.3528 22.9788 18.3088 23.085C18.2648 23.1913 18.2003 23.2878 18.119 23.3691C18.0378 23.4504 17.9412 23.5148 17.835 23.5588C17.7288 23.6028 17.615 23.6255 17.5 23.6255C17.385 23.6255 17.2712 23.6028 17.165 23.5588C17.0587 23.5148 16.9622 23.4504 16.8809 23.3691L8.13092 14.6191C8.04957 14.5378 7.98503 14.4413 7.941 14.3351C7.89696 14.2288 7.8743 14.115 7.8743 14C7.8743 13.885 7.89696 13.7712 7.941 13.6649C7.98503 13.5587 8.04957 13.4622 8.13092 13.3809L16.8809 4.63094C17.0451 4.46675 17.2678 4.37451 17.5 4.37451C17.7322 4.37451 17.9549 4.46675 18.119 4.63094C18.2832 4.79512 18.3755 5.01781 18.3755 5.25C18.3755 5.48219 18.2832 5.70488 18.119 5.86906L9.98702 14L18.119 22.1309Z" fill="<?php echo esc_attr( $navigator_color ); ?>" />
427 </svg>
428 </button>
429 <button class="ablocks-block-news-ticker--icons__pause">
430 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="50" fill="currentColor">
431 <path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z" />
432 </svg>
433 </button>
434 <button class="ablocks-block-news-ticker--icons__next">
435 <svg width="24" height="50" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
436 <path d="M19.8691 14.6191L11.1191 23.3691C11.0378 23.4504 10.9413 23.5148 10.835 23.5588C10.7288 23.6028 10.615 23.6255 10.5 23.6255C10.385 23.6255 10.2712 23.6028 10.165 23.5588C10.0587 23.5148 9.96223 23.4504 9.88094 23.3691C9.79964 23.2878 9.73515 23.1913 9.69115 23.085C9.64716 22.9788 9.62451 22.865 9.62451 22.75C9.62451 22.635 9.64716 22.5212 9.69115 22.415C9.73515 22.3087 9.79964 22.2122 9.88094 22.1309L18.013 14L9.88094 5.86906C9.71675 5.70488 9.62451 5.48219 9.62451 5.25C9.62451 5.01781 9.71675 4.79512 9.88094 4.63094C10.0451 4.46675 10.2678 4.37451 10.5 4.37451C10.7322 4.37451 10.9549 4.46675 11.1191 4.63094L19.8691 13.3809C19.9504 13.4622 20.015 13.5587 20.059 13.6649C20.103 13.7712 20.1257 13.885 20.1257 14C20.1257 14.115 20.103 14.2288 20.059 14.3351C20.015 14.4413 19.9504 14.5378 19.8691 14.6191Z" fill="<?php echo esc_attr( $navigator_color ); ?>" />
437 </svg>
438 </button>
439 </div>
440 <?php endif; ?>
441 </div>
442 </div>
443 <?php
444
445 wp_reset_postdata();
446
447 return ob_get_clean();
448 }
449
450
451
452 private function get_relative_time( $date_string ) {
453 $post_date = new \DateTime( $date_string );
454 $now = new \DateTime();
455 $interval = $now->diff( $post_date );
456 $weeks = floor( $interval->days / 7 );
457
458 if ( $weeks >= 1 ) {
459 return $weeks . ' week' . ( $weeks > 1 ? 's' : '' ) . ' ago';
460 }
461 return 'Less than a week ago';
462 }
463
464 }
465