PluginProbe
King Addons for Elementor – 80+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce, Mega Menu, Popup Builder / 51.1.49
King Addons for Elementor – 80+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce, Mega Menu, Popup Builder v51.1.49
51.1.83 51.1.82 51.1.81 51.1.79 51.1.78 51.1.77 51.1.76 51.1.74 51.1.75 51.1.65 51.1.64 51.1.63 trunk 51.1.14 51.1.2 51.1.35 51.1.36 51.1.37 51.1.38 51.1.39 51.1.44 51.1.45 51.1.46 51.1.47 51.1.49 All 37 releases
king-addons / includes / widgets / Auto_Scrolling_Text / Auto_Scrolling_Text.php

Auto_Scrolling_Text.php in King Addons for Elementor – 80+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce, Mega Menu, Popup Builder 51.1.49, at includes/widgets/Auto_Scrolling_Text/Auto_Scrolling_Text.php

1,157 lines 46.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php /** @noinspection SpellCheckingInspection, DuplicatedCode, PhpUnused */
2
3 namespace King_Addons;
4
5 use Elementor\Controls_Manager;
6 use Elementor\Group_Control_Background;
7 use Elementor\Group_Control_Border;
8 use Elementor\Group_Control_Box_Shadow;
9 use Elementor\Group_Control_Image_Size;
10 use Elementor\Group_Control_Typography;
11 use Elementor\Repeater;
12 use Elementor\Utils;
13 use Elementor\Widget_Base;
14
15 if (!defined('ABSPATH')) {
16 exit; // Exit if accessed directly.
17 }
18
19
20
21 class Auto_Scrolling_Text extends Widget_Base
22 {
23
24
25 public function get_name(): string
26 {
27 return 'king-addons-auto-scrolling-text';
28 }
29
30 public function get_title(): string
31 {
32 return esc_html__('Auto-Scrolling Text', 'king-addons');
33 }
34
35 public function get_icon(): string
36 {
37 /** @noinspection SpellCheckingInspection */
38 return 'king-addons-icon king-addons-auto-scrolling-text';
39 }
40
41 public function get_style_depends(): array
42 {
43 return [KING_ADDONS_ASSETS_UNIQUE_KEY . '-auto-scrolling-text-style'];
44 }
45
46 public function get_categories(): array
47 {
48 return ['king-addons'];
49 }
50
51 public function get_keywords(): array
52 {
53 return ['card', 'carousel', 'slider', 'scroller', 'swiper', 'content', 'button', 'dot', 'dots', 'navigation',
54 'cards', 'wheel', 'touch', 'nav', 'navigation', 'animation', 'effect', 'animated', 'template', 'link',
55 'left', 'right', 'top', 'bottom', 'vertical', 'horizontal', 'mouse', 'dragging', 'hover', 'over',
56 'hover over', 'picture', 'float', 'floating', 'sticky', 'click', 'target', 'point', 'king', 'addons',
57 'mouseover', 'page', 'card carousel', 'kingaddons', 'king-addons', 'team', 'members', 'testimonial',
58 'testimonials', 'reviews', ' team memebers', 'drag', 'tabs', 'tab',
59 'image', 'images', 'txt', 'typography', 'text', 'animation', 'animated', 'build', 'complex', 'effect',
60 'interactive', 'click', 'target', 'point', 'builder', 'link', 'point', 'points', 'color', 'mouse', 'hover',
61 'over', 'hover over', 'picture', 'font', 'size', 'heading',
62 'header', 'paragraph', 'section', 'article', 'particle', 'document', 'writing', 'style', 'format', 'complex',
63 'auto', 'scroll', 'scrolling', 'auto-scroll', 'auto-scrolling', 'head', 'heading', 'title', 'subtitle'];
64 }
65
66 public function get_custom_help_url()
67 {
68 return 'mailto:bug@kingaddons.com?subject=Bug Report - King Addons&body=Please describe the issue';
69 }
70
71 protected function register_controls(): void
72 {
73 /** START TAB: CONTENT ===================== */
74 /** SECTION: Texts ===================== */
75 $this->start_controls_section(
76 'kng_auto_scroll_txt_content_section_content',
77 [
78 'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Content', 'king-addons'),
79 'tab' => Controls_Manager::TAB_CONTENT,
80 'frontend_available' => true,
81 ]
82 );
83
84 $repeater = new Repeater();
85
86 $repeater->add_control(
87 'kng_auto_scroll_txt_content_type',
88 [
89 'label' => '<b>' . esc_html__('Type of content', 'king-addons') . '</b>',
90 'type' => Controls_Manager::SELECT,
91 'options' => [
92 'text' => esc_html__('Text', 'king-addons'),
93 'image' => esc_html__('Image', 'king-addons'),
94 ],
95 'default' => 'text',
96 'separator' => 'after',
97 ]
98 );
99
100 $repeater->add_group_control(
101 Group_Control_Typography::get_type(),
102 [
103 'label' => esc_html__('Typography', 'king-addons'),
104 'name' => 'kng_auto_scroll_txt_typography',
105 'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text',
106 'condition' => [
107 'kng_auto_scroll_txt_content_type' => 'text'
108 ]
109 ]
110 );
111
112 $repeater->add_control(
113 'kng_auto_scroll_txt_color',
114 [
115 'label' => esc_html__('Color', 'king-addons'),
116 'type' => Controls_Manager::COLOR,
117 'selectors' => [
118 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'color: {{VALUE}};',
119 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text a' => 'color: {{VALUE}};',
120 ],
121 'condition' => [
122 'kng_auto_scroll_txt_content_type' => 'text'
123 ]
124 ]
125 );
126
127 $repeater->add_group_control(
128 Group_Control_Background::get_type(),
129 [
130 'name' => 'kng_auto_scroll_txt_bg_color',
131 'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text',
132 'condition' => [
133 'kng_auto_scroll_txt_content_type' => 'text'
134 ],
135 'separator' => 'before',
136 ]
137 );
138
139 $repeater->add_control(
140 'kng_auto_scroll_txt_custom_vertical_align',
141 [
142 'label' => esc_html__('Custom Vertical Align', 'king-addons'),
143 'type' => Controls_Manager::SWITCHER,
144 'condition' => [
145 'kng_auto_scroll_txt_content_type' => 'text'
146 ],
147 'separator' => 'before',
148 ]
149 );
150
151 $repeater->add_responsive_control(
152 'kng_auto_scroll_txt_vertical_align',
153 [
154 'label' => esc_html__('Vertical Align', 'king-addons'),
155 'type' => Controls_Manager::SELECT,
156 'options' => [
157 'baseline' => esc_html__('baseline', 'king-addons'),
158 'top' => esc_html__('top', 'king-addons'),
159 'bottom' => esc_html__('bottom', 'king-addons'),
160 'sub' => esc_html__('sub', 'king-addons'),
161 'super' => esc_html__('super', 'king-addons'),
162 'text-top' => esc_html__('text-top', 'king-addons'),
163 'text-bottom' => esc_html__('text-bottom', 'king-addons'),
164 'middle' => esc_html__('middle', 'king-addons'),
165 ],
166 'default' => 'baseline',
167 'selectors' => [
168 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'vertical-align: {{VALUE}};',
169 ],
170 'condition' => [
171 'kng_auto_scroll_txt_custom_vertical_align!' => '',
172 'kng_auto_scroll_txt_content_type' => 'text'
173 ]
174 ]
175 );
176
177 $repeater->add_control(
178 'kng_auto_scroll_txt_padding_switcher',
179 [
180 'label' => esc_html__('Custom Padding', 'king-addons'),
181 'type' => Controls_Manager::SWITCHER,
182 'condition' => [
183 'kng_auto_scroll_txt_content_type' => 'text'
184 ]
185 ]
186 );
187
188 $repeater->add_responsive_control(
189 'kng_auto_scroll_txt_padding',
190 [
191 'label' => esc_html__('Padding', 'king-addons'),
192 'type' => Controls_Manager::DIMENSIONS,
193 'size_units' => ['px', 'em', '%'],
194 'default' => [
195 'top' => 0,
196 'right' => 0,
197 'bottom' => 0,
198 'left' => 0,
199 ],
200 'selectors' => [
201 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
202 ],
203 'condition' => [
204 'kng_auto_scroll_txt_padding_switcher!' => '',
205 'kng_auto_scroll_txt_content_type' => 'text'
206 ]
207 ]
208 );
209
210 $repeater->add_control(
211 'kng_auto_scroll_txt_margin_switcher',
212 [
213 'label' => esc_html__('Custom Margin', 'king-addons'),
214 'type' => Controls_Manager::SWITCHER,
215 'condition' => [
216 'kng_auto_scroll_txt_content_type' => 'text'
217 ]
218 ]
219 );
220
221 $repeater->add_responsive_control(
222 'kng_auto_scroll_txt_margin_left',
223 [
224 'label' => esc_html__('Margin Left', 'king-addons'),
225 'type' => Controls_Manager::NUMBER,
226 'step' => 1,
227 'selectors' => [
228 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'margin-left: {{SIZE}}px;',
229 ],
230 'condition' => [
231 'kng_auto_scroll_txt_margin_switcher!' => '',
232 'kng_auto_scroll_txt_content_type' => 'text'
233 ]
234 ]
235 );
236
237 $repeater->add_responsive_control(
238 'kng_auto_scroll_txt_margin_right',
239 [
240 'label' => esc_html__('Margin Right', 'king-addons'),
241 'type' => Controls_Manager::NUMBER,
242 'step' => 1,
243 'selectors' => [
244 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'margin-right: {{SIZE}}px;',
245 ],
246 'condition' => [
247 'kng_auto_scroll_txt_margin_switcher!' => '',
248 'kng_auto_scroll_txt_content_type' => 'text'
249 ]
250 ]
251 );
252
253 $repeater->add_control(
254 'kng_auto_scroll_txt_margin_info',
255 [
256 'type' => Controls_Manager::ALERT,
257 'alert_type' => 'info',
258 'content' => esc_html__('For vertical spacing use the line-height parameter in Typography, or optionally Custom Padding - top and bottom. Margin top and bottom parameters are available when Custom Width value is set. This is because of current HTML/CSS limitations for multiline text.', 'king-addons'),
259 'condition' => [
260 'kng_auto_scroll_txt_margin_switcher!' => '',
261 'kng_auto_scroll_txt_content_type' => 'text'
262 ]
263 ]
264 );
265
266 $repeater->add_control(
267 'kng_auto_scroll_txt_custom_border',
268 [
269 'label' => esc_html__('Custom Border', 'king-addons'),
270 'type' => Controls_Manager::SWITCHER,
271 'condition' => [
272 'kng_auto_scroll_txt_content_type' => 'text'
273 ]
274 ]
275 );
276
277 $repeater->add_group_control(
278 Group_Control_Border::get_type(),
279 [
280 'name' => 'kng_auto_scroll_txt_border',
281 'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text',
282 'condition' => [
283 'kng_auto_scroll_txt_custom_border!' => '',
284 'kng_auto_scroll_txt_content_type' => 'text'
285 ]
286 ]
287 );
288
289 $repeater->add_responsive_control(
290 'kng_auto_scroll_txt_border_radius',
291 [
292 'label' => esc_html__('Border Radius', 'king-addons'),
293 'type' => Controls_Manager::DIMENSIONS,
294 'size_units' => ['px', '%'],
295 'default' => [
296 'top' => 0,
297 'right' => 0,
298 'bottom' => 0,
299 'left' => 0,
300 ],
301 'selectors' => [
302 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
303 ],
304 'condition' => [
305 'kng_auto_scroll_txt_custom_border!' => '',
306 'kng_auto_scroll_txt_content_type' => 'text'
307 ]
308 ]
309 );
310
311 $repeater->add_control(
312 'kng_auto_scroll_txt_custom_width_switcher',
313 [
314 'label' => esc_html__('Custom Width', 'king-addons'),
315 'type' => Controls_Manager::SWITCHER,
316 'condition' => [
317 'kng_auto_scroll_txt_content_type' => 'text'
318 ]
319 ]
320 );
321
322 $repeater->add_responsive_control(
323 'kng_auto_scroll_txt_custom_width',
324 [
325 'label' => esc_html__('Width (px)', 'king-addons'),
326 'description' => esc_html__('The custom width of the current content item is useful for creating multiline text snippets or limiting the image size.', 'king-addons'),
327 'type' => Controls_Manager::NUMBER,
328 'min' => 0,
329 'step' => 1,
330 'selectors' => [
331 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'width: {{SIZE}}px; display: inline-block;',
332 ],
333 'condition' => [
334 'kng_auto_scroll_txt_custom_width_switcher!' => '',
335 'kng_auto_scroll_txt_content_type' => 'text'
336 ]
337 ]
338 );
339
340 $repeater->add_responsive_control(
341 'kng_auto_scroll_txt_margin_top',
342 [
343 'label' => esc_html__('Margin Top', 'king-addons'),
344 'type' => Controls_Manager::NUMBER,
345 'step' => 1,
346 'selectors' => [
347 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'margin-top: {{SIZE}}px;',
348 ],
349 'condition' => [
350 'kng_auto_scroll_txt_custom_width_switcher!' => '',
351 'kng_auto_scroll_txt_content_type' => 'text'
352 ]
353 ]
354 );
355
356 $repeater->add_responsive_control(
357 'kng_auto_scroll_txt_margin_bottom',
358 [
359 'label' => esc_html__('Margin Bottom', 'king-addons'),
360 'type' => Controls_Manager::NUMBER,
361 'step' => 1,
362 'selectors' => [
363 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'margin-bottom: {{SIZE}}px;',
364 ],
365 'condition' => [
366 'kng_auto_scroll_txt_custom_width_switcher!' => '',
367 'kng_auto_scroll_txt_content_type' => 'text'
368 ]
369 ]
370 );
371
372 /** ====================================================== */
373 /** TEXT EFFECTS ========================================== */
374 $repeater->add_control(
375 'kng_auto_scroll_txt_effect',
376 [
377 'label' => '<b>' . esc_html__('Text Effect', 'king-addons') . '</b>',
378 'type' => Controls_Manager::SELECT,
379 'options' => [
380 'none' => esc_html__('None', 'king-addons'),
381 'text-gradient' => esc_html__('Text Gradient', 'king-addons'),
382 'underline-gradient' => esc_html__('Underline Gradient', 'king-addons'),
383 'outline-stroke' => esc_html__('Outline Stroke', 'king-addons'),
384 ],
385 'label_block' => true,
386 'default' => 'none',
387 'separator' => 'before',
388 'condition' => [
389 'kng_auto_scroll_txt_content_type' => 'text'
390 ]
391 ]
392 );
393
394 /** Outline Stroke ========================================== */
395 $repeater->add_control(
396 'kng_auto_scroll_txt_effect_stroke_txt_color',
397 [
398 'label' => esc_html__('Text Color', 'king-addons'),
399 'type' => Controls_Manager::COLOR,
400 'default' => '#0000',
401 'selectors' => [
402 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner span' => 'color: {{VALUE}};'
403 ],
404 'condition' => [
405 'kng_auto_scroll_txt_effect' => 'outline-stroke',
406 'kng_auto_scroll_txt_content_type' => 'text'
407 ]
408 ]
409 );
410
411 $repeater->add_control(
412 'kng_auto_scroll_txt_effect_stroke_stroke_color',
413 [
414 'label' => esc_html__('Stroke Color', 'king-addons'),
415 'type' => Controls_Manager::COLOR,
416 'default' => '#dbdbdb',
417 'selectors' => [
418 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner span' => '-webkit-text-stroke-color: {{VALUE}};'
419 ],
420 'condition' => [
421 'kng_auto_scroll_txt_effect' => 'outline-stroke',
422 'kng_auto_scroll_txt_content_type' => 'text'
423 ]
424 ]
425 );
426
427 $repeater->add_control(
428 'kng_auto_scroll_txt_effect_stroke_width',
429 [
430 'label' => esc_html__('Stroke Width (px)', 'king-addons'),
431 'type' => Controls_Manager::NUMBER,
432 'min' => 1,
433 'step' => 1,
434 'default' => 1,
435 'selectors' => [
436 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner span' => '-webkit-text-stroke-width: {{SIZE}}px;',
437 ],
438 'condition' => [
439 'kng_auto_scroll_txt_effect' => 'outline-stroke',
440 'kng_auto_scroll_txt_content_type' => 'text'
441 ]
442 ]
443 );
444 /** END Outline Stroke ========================================== */
445
446 /** Text Gradient ========================================== */
447 $repeater->add_group_control(
448 Group_Control_Background::get_type(),
449 [
450 'name' => 'kng_auto_scroll_txt_effect_gradient',
451 'types' => ['gradient'],
452 'fields_options' => [
453 'color' => [
454 'default' => '#574ff7',
455 ],
456 'background' => [
457 'default' => 'gradient',
458 ]
459 ],
460 'exclude' => ['classic', 'image'],
461 'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner',
462 'condition' => [
463 'kng_auto_scroll_txt_effect' => 'text-gradient',
464 'kng_auto_scroll_txt_content_type' => 'text'
465 ]
466 ]
467 );
468 /** END: Text Gradient ========================================== */
469
470 /** Underline Gradient ========================================== */
471 $repeater->add_group_control(
472 Group_Control_Background::get_type(),
473 [
474 'name' => 'kng_auto_scroll_txt_underline_effects_gradient',
475 'types' => ['gradient'],
476 'fields_options' => [
477 'color' => [
478 'default' => '#84fab0',
479 ],
480 'color_b' => [
481 'default' => '#8fd3f4',
482 ],
483 'background' => [
484 'default' => 'gradient',
485 ],
486 'gradient_type' => [
487 'default' => 'linear'
488 ],
489 'gradient_angle' => [
490 'default' => [
491 'unit' => 'deg',
492 'size' => 120,
493 ],
494 ]
495 ],
496 'exclude' => ['classic', 'image'],
497 'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner',
498 'condition' => [
499 'kng_auto_scroll_txt_effect' => 'underline-gradient',
500 'kng_auto_scroll_txt_content_type' => 'text'
501 ]
502 ]
503 );
504
505 $repeater->add_control(
506 'kng_auto_scroll_txt_underline_effects_bg_position',
507 [
508 'label' => esc_html__('Vertical Position (%)', 'king-addons'),
509 'type' => Controls_Manager::SLIDER,
510 'size_units' => ['%'],
511 'range' => [
512 '%' => [
513 'min' => 0,
514 'max' => 100,
515 'step' => 1,
516 ],
517 ],
518 'default' => [
519 'unit' => '%',
520 'size' => 88,
521 ],
522 'separator' => 'before',
523 'selectors' => [
524 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner' => 'background-position: 0 {{SIZE}}{{UNIT}}; background-repeat: no-repeat;',
525 ],
526 'condition' => [
527 'kng_auto_scroll_txt_effect' => 'underline-gradient',
528 'kng_auto_scroll_txt_content_type' => 'text'
529 ]
530 ]
531 );
532
533 $repeater->add_control(
534 'kng_auto_scroll_txt_underline_effects_bg_height',
535 [
536 'label' => esc_html__('Height (%)', 'king-addons'),
537 'type' => Controls_Manager::SLIDER,
538 'size_units' => ['%'],
539 'range' => [
540 '%' => [
541 'min' => 0,
542 'max' => 100,
543 'step' => 1,
544 ],
545 ],
546 'default' => [
547 'unit' => '%',
548 'size' => 20,
549 ],
550 'selectors' => [
551 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner' => 'background-size: 100% {{SIZE}}{{UNIT}};',
552 ],
553 'condition' => [
554 'kng_auto_scroll_txt_effect' => 'underline-gradient',
555 'kng_auto_scroll_txt_content_type' => 'text'
556 ]
557 ]
558 );
559
560 $repeater->add_control(
561 'kng_auto_scroll_txt_underline_effects_bg_height_hover',
562 [
563 'label' => esc_html__('Height on mouse hover (%)', 'king-addons'),
564 'type' => Controls_Manager::SLIDER,
565 'size_units' => ['%'],
566 'range' => [
567 '%' => [
568 'min' => 0,
569 'max' => 100,
570 'step' => 1,
571 ],
572 ],
573 'default' => [
574 'unit' => '%',
575 'size' => 88,
576 ],
577 'selectors' => [
578 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner:hover' => 'background-size: 100% {{SIZE}}{{UNIT}};',
579 ],
580 'condition' => [
581 'kng_auto_scroll_txt_effect' => 'underline-gradient',
582 'kng_auto_scroll_txt_content_type' => 'text'
583 ]
584 ]
585 );
586
587 /** END: Underline Gradient ========================================== */
588
589 /** END: TEXT EFFECTS ========================================== */
590 /** =========================================================== */
591
592 $repeater->add_control(
593 'kng_auto_scroll_txt_content',
594 [
595 'label' => '<b>' . esc_html__('Text', 'king-addons') . '</b>',
596 'type' => Controls_Manager::TEXTAREA,
597 'default' => esc_html__('Text', 'king-addons'),
598 'condition' => [
599 'kng_auto_scroll_txt_content_type' => 'text'
600 ],
601 'separator' => 'before',
602 ]
603 );
604 /** END: Content Type TEXT ========================================== */
605
606 /** Content Type IMAGE ========================================== */
607 $repeater->add_control(
608 'kng_auto_scroll_txt_image',
609 [
610 'label' => esc_html__('Image', 'king-addons'),
611 'type' => Controls_Manager::MEDIA,
612 'default' => [
613 'url' => Utils::get_placeholder_image_src(),
614 ],
615 'condition' => [
616 'kng_auto_scroll_txt_content_type' => 'image'
617 ]
618 ]
619 );
620
621 $repeater->add_group_control(
622 Group_Control_Image_Size::get_type(),
623 [
624 'name' => 'kng_auto_scroll_txt_image_size',
625 'default' => 'full',
626 'separator' => 'before',
627 'condition' => [
628 'kng_auto_scroll_txt_content_type' => 'image'
629 ]
630 ]
631 );
632
633 $repeater->add_responsive_control(
634 'kng_image_comparison_box_max_width',
635 [
636 'label' => esc_html__('Width (px)', 'king-addons'),
637 'type' => Controls_Manager::NUMBER,
638 'min' => 0,
639 'step' => 1,
640 'default' => 50,
641 'selectors' => [
642 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text img' => 'width: {{SIZE}}px;'
643 ],
644 'condition' => [
645 'kng_auto_scroll_txt_content_type' => 'image'
646 ]
647 ]
648 );
649
650 $repeater->add_group_control(
651 Group_Control_Box_Shadow::get_type(),
652 [
653 'name' => 'kng_auto_scroll_txt_image_shadow',
654 'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text img',
655 'condition' => [
656 'kng_auto_scroll_txt_content_type' => 'image'
657 ]
658 ]
659 );
660
661 $repeater->add_group_control(
662 Group_Control_Border::get_type(),
663 [
664 'name' => 'kng_auto_scroll_txt_image_border',
665 'selector' => '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text img',
666 'condition' => [
667 'kng_auto_scroll_txt_content_type' => 'image'
668 ]
669 ]
670 );
671
672 $repeater->add_responsive_control(
673 'kng_auto_scroll_txt_image_border_radius',
674 [
675 'label' => esc_html__('Border Radius', 'king-addons'),
676 'type' => Controls_Manager::DIMENSIONS,
677 'size_units' => ['px', '%'],
678 'selectors' => [
679 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
680 ],
681 'condition' => [
682 'kng_auto_scroll_txt_content_type' => 'image'
683 ]
684 ]
685 );
686
687 $repeater->add_control(
688 'kng_auto_scroll_txt_image_custom_vertical_align',
689 [
690 'label' => esc_html__('Custom Vertical Align', 'king-addons'),
691 'type' => Controls_Manager::SWITCHER,
692 'condition' => [
693 'kng_auto_scroll_txt_content_type' => 'image'
694 ]
695 ]
696 );
697
698 $repeater->add_responsive_control(
699 'kng_auto_scroll_txt_image_vertical_align',
700 [
701 'label' => esc_html__('Vertical Align', 'king-addons'),
702 'type' => Controls_Manager::SELECT,
703 'options' => [
704 'baseline' => esc_html__('baseline', 'king-addons'),
705 'top' => esc_html__('top', 'king-addons'),
706 'bottom' => esc_html__('bottom', 'king-addons'),
707 'sub' => esc_html__('sub', 'king-addons'),
708 'super' => esc_html__('super', 'king-addons'),
709 'text-top' => esc_html__('text-top', 'king-addons'),
710 'text-bottom' => esc_html__('text-bottom', 'king-addons'),
711 'middle' => esc_html__('middle', 'king-addons'),
712 ],
713 'default' => 'baseline',
714 'selectors' => [
715 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text img' => 'vertical-align: {{VALUE}};',
716 ],
717 'condition' => [
718 'kng_auto_scroll_txt_image_custom_vertical_align!' => '',
719 'kng_auto_scroll_txt_content_type' => 'image'
720 ]
721 ]
722 );
723
724 $repeater->add_control(
725 'kng_auto_scroll_txt_image_margin_switcher',
726 [
727 'label' => esc_html__('Custom Margin', 'king-addons'),
728 'type' => Controls_Manager::SWITCHER,
729 'condition' => [
730 'kng_auto_scroll_txt_content_type' => 'image'
731 ]
732 ]
733 );
734
735 $repeater->add_responsive_control(
736 'kng_auto_scroll_txt_image_margin',
737 [
738 'label' => esc_html__('Margin', 'king-addons'),
739 'type' => Controls_Manager::DIMENSIONS,
740 'size_units' => ['px', '%'],
741 'default' => [
742 'top' => 0,
743 'right' => 0,
744 'bottom' => 0,
745 'left' => 0,
746 ],
747 'selectors' => [
748 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'margin: 0;',
749 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text img' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
750 ],
751 'condition' => [
752 'kng_auto_scroll_txt_image_margin_switcher!' => '',
753 'kng_auto_scroll_txt_content_type' => 'image'
754 ]
755 ]
756 );
757 /** END: Content Type IMAGE ========================================== */
758
759 $repeater->add_control(
760 'kng_auto_scroll_txt_content_common_for_all_types_head',
761 [
762 'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Common for all types', 'king-addons'),
763 'type' => Controls_Manager::HEADING,
764 ]
765 );
766
767 $repeater->add_control(
768 'kng_auto_scroll_txt_custom_css_class_switcher',
769 [
770 'label' => esc_html__('Custom CSS Class', 'king-addons'),
771 'type' => Controls_Manager::SWITCHER,
772 ]
773 );
774
775 $repeater->add_control(
776 'kng_auto_scroll_txt_custom_css_class',
777 [
778 'label' => esc_html__('CSS Class', 'king-addons'),
779 'type' => Controls_Manager::TEXT,
780 'placeholder' => esc_html__('Type or paste the class', 'king-addons'),
781 'ai' => [
782 'active' => false,
783 ],
784 'separator' => 'after',
785 'condition' => [
786 'kng_auto_scroll_txt_custom_css_class_switcher!' => '',
787 ]
788 ]
789 );
790
791 $repeater->add_control(
792 'kng_auto_scroll_txt_transform_switcher',
793 [
794 'label' => esc_html__('Transform', 'king-addons'),
795 'type' => Controls_Manager::SWITCHER,
796 ]
797 );
798
799 $repeater->add_responsive_control(
800 'kng_auto_scroll_txt_transform_rotate',
801 [
802 'label' => esc_html__('Rotate', 'king-addons') . ' (deg)',
803 'type' => Controls_Manager::NUMBER,
804 'min' => -360,
805 'max' => 360,
806 'step' => 5,
807 'default' => 0,
808 'selectors' => [
809 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner' => 'transform: rotateZ({{SIZE}}deg); display: inline-block;',
810 ],
811 'condition' => [
812 'kng_auto_scroll_txt_transform_switcher!' => '',
813 ],
814 'frontend_available' => true,
815 ]
816 );
817
818 $repeater->add_responsive_control(
819 'kng_auto_scroll_txt_transform_offset_X',
820 [
821 'label' => esc_html__('Offset X', 'king-addons'),
822 'type' => Controls_Manager::SLIDER,
823 'size_units' => ['px', '%', 'em', 'rem', 'vw', 'custom'],
824 'range' => [
825 '%' => [
826 'min' => -100,
827 'max' => 100,
828 ],
829 'px' => [
830 'min' => -1000,
831 'max' => 1000,
832 ],
833 ],
834 'condition' => [
835 'kng_auto_scroll_txt_transform_switcher!' => '',
836 ],
837 'selectors' => [
838 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner span' => 'transform: translateX({{SIZE}}{{UNIT}}); display: inline-block;',
839 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text .king-addons-auto-scrolling-text-inner img' => 'transform: translateX({{SIZE}}{{UNIT}}); display: inline-block;',
840 ],
841 'frontend_available' => true,
842 ]
843 );
844
845 $repeater->add_responsive_control(
846 'kng_auto_scroll_txt_transform_offset_Y',
847 [
848 'label' => esc_html__('Offset Y', 'king-addons'),
849 'type' => Controls_Manager::SLIDER,
850 'size_units' => ['px', '%', 'em', 'rem', 'vh', 'custom'],
851 'range' => [
852 '%' => [
853 'min' => -100,
854 'max' => 100,
855 ],
856 'px' => [
857 'min' => -1000,
858 'max' => 1000,
859 ],
860 ],
861 'condition' => [
862 'kng_auto_scroll_txt_transform_switcher!' => '',
863 ],
864 'selectors' => [
865 '{{WRAPPER}} {{CURRENT_ITEM}}.king-addons-auto-scrolling-text' => 'transform: translateY({{SIZE}}{{UNIT}}); display: inline-block;',
866 ],
867 'frontend_available' => true,
868 ]
869 );
870
871 $repeater->add_control(
872 'kng_auto_scroll_txt_link_switcher',
873 [
874 'label' => esc_html__('Link', 'king-addons'),
875 'type' => Controls_Manager::SWITCHER,
876 ]
877 );
878
879 $repeater->add_control(
880 'kng_auto_scroll_txt_link',
881 [
882 'label' => esc_html__('Link', 'king-addons'),
883 'type' => Controls_Manager::URL,
884 'condition' => [
885 'kng_auto_scroll_txt_link_switcher!' => '',
886 ]
887 ]
888 );
889
890 $this->add_control(
891 'kng_auto_scroll_txt_content_items',
892 [
893 'type' => Controls_Manager::REPEATER,
894 'fields' => $repeater->get_controls(),
895 'default' => [
896 [
897 'kng_auto_scroll_txt_content_type' => 'text',
898 'kng_auto_scroll_txt_content' => esc_html__('King Addons', 'king-addons'),
899 ],
900 [
901 'kng_auto_scroll_txt_content_type' => 'text',
902 'kng_auto_scroll_txt_content' => esc_html__('King Addons', 'king-addons'),
903 ],
904 [
905 'kng_auto_scroll_txt_content_type' => 'text',
906 'kng_auto_scroll_txt_content' => esc_html__('King Addons', 'king-addons'),
907 ]
908 ],
909 'title_field' => '<# if( "text" === kng_auto_scroll_txt_content_type ) { #> {{kng_auto_scroll_txt_content}} <# } else if( "image" === kng_auto_scroll_txt_content_type) {#> <img class="king-addons-repeater-list-img-icon" src="{{kng_auto_scroll_txt_image.url}}"> <# } #>',
910 ]
911 );
912
913 $this->end_controls_section();
914 /** END SECTION: Texts ===================== */
915
916 /** SECTION: Carousel Settings */
917 $this->start_controls_section(
918 'kng_auto_scroll_txt_content_section_caousel_settings',
919 [
920 'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Carousel Settings', 'king-addons'),
921 'tab' => Controls_Manager::TAB_CONTENT,
922 ]
923 );
924
925 $this->add_responsive_control(
926 'kng_auto_scroll_txt_space_between_items',
927 [
928 'label' => esc_html__('Space between items (px)', 'king-addons'),
929 'type' => Controls_Manager::NUMBER,
930 'min' => 0,
931 'step' => 1,
932 'default' => 50,
933 'selectors' => [
934 '{{WRAPPER}} .king-addons-auto-scrolling-text' => 'margin-right: {{VALUE}}px;',
935 ],
936 ]
937 );
938
939 $this->add_responsive_control(
940 'kng_auto_scroll_txt_animation_speed',
941 [
942 'label' => esc_html__('Animation Speed (s)', 'king-addons'),
943 'type' => Controls_Manager::NUMBER,
944 'min' => 0,
945 'step' => 1,
946 'default' => 80,
947 'selectors' => [
948 '{{WRAPPER}} .king-addons-auto-scrolling-text-wrapper' => 'animation-duration: {{VALUE}}s;',
949 ],
950 ]
951 );
952
953 $this->end_controls_section();
954 /** END SECTION: Carousel Settings */
955
956 /** END TAB: CONTENT ===================== */
957
958 /** START TAB: STYLE ===================== */
959 /** SECTION: Common Styles ===================== */
960 $this->start_controls_section(
961 'kng_auto_scroll_txt_style_section_commmon_styles',
962 [
963 'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Common Styles', 'king-addons'),
964 'tab' => Controls_Manager::TAB_STYLE,
965 ]
966 );
967
968 $this->add_group_control(
969 Group_Control_Typography::get_type(),
970 [
971 'label' => esc_html__('Typography', 'king-addons'),
972 'name' => 'kng_auto_scroll_txt_common_typography',
973 'selector' => '{{WRAPPER}} .king-addons-auto-scrolling-text',
974 'fields_options' => [
975 'font_size' => [
976 'default' => [
977 'size' => 50,
978 'unit' => 'px'
979 ],
980 ],
981 'typography' => [
982 'default' => 'custom',
983 ]
984 ],
985 ]
986 );
987
988 $this->add_control(
989 'kng_auto_scroll_txt_common_color',
990 [
991 'label' => esc_html__('Text Color', 'king-addons'),
992 'type' => Controls_Manager::COLOR,
993 'selectors' => [
994 '{{WRAPPER}} .king-addons-auto-scrolling-text' => 'color: {{VALUE}};',
995 ],
996 ]
997 );
998
999 $this->add_responsive_control(
1000 'kng_auto_scroll_txt_common_items_padding',
1001 [
1002 'label' => esc_html__('Items Padding', 'king-addons'),
1003 'type' => Controls_Manager::DIMENSIONS,
1004 'size_units' => ['px', 'em', '%'],
1005 'default' => [
1006 'top' => 0,
1007 'right' => 0,
1008 'bottom' => 0,
1009 'left' => 0,
1010 'unit' => 'px',
1011 ],
1012 'selectors' => [
1013 '{{WRAPPER}} .king-addons-auto-scrolling-text' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1014 ],
1015 'separator' => 'before',
1016 ]
1017 );
1018
1019 $this->end_controls_section();
1020 /** END SECTION: Common Styles ===================== */
1021 /** END TAB: STYLE ===================== */
1022 }
1023
1024 protected function render(): void
1025 {
1026 $settings = $this->get_settings();
1027 $this_ID = $this->get_id();
1028 ?>
1029 <div class="king-addons-auto-scrolling-text-items-wrapper">
1030 <div class="king-addons-auto-scrolling-text-items king-addons-auto-scrolling-text-items-<?php echo esc_attr($this_ID); ?>">
1031 <div class="king-addons-auto-scrolling-text-wrapper king-addons-auto-scrolling-text-wrapper-<?php echo esc_attr($this_ID); ?>">
1032 <?php
1033
1034 $item_count = 0;
1035
1036 /** @noinspection PhpUnusedLocalVariableInspection */
1037 foreach ($settings['kng_auto_scroll_txt_content_items'] as $key => $item) {
1038
1039 $content_type = $item['kng_auto_scroll_txt_content_type'];
1040 $item_tag = 'span';
1041
1042 $this->add_render_attribute('kng_auto_scroll_txt_content_inner_attribute' . $item_count, 'class', 'king-addons-auto-scrolling-text-inner');
1043
1044 // If the item has link
1045 if ('yes' === $item['kng_auto_scroll_txt_link_switcher']) {
1046 if ('' !== $item['kng_auto_scroll_txt_link']['url']) {
1047
1048 $item_tag = 'a';
1049
1050 $this->add_render_attribute('kng_auto_scroll_txt_content_inner_attribute' . $item_count, 'href', esc_url($item['kng_auto_scroll_txt_link']['url']));
1051
1052 if ($item['kng_auto_scroll_txt_link']['is_external']) {
1053 $this->add_render_attribute('kng_auto_scroll_txt_content_inner_attribute' . $item_count, 'target', '_blank');
1054 }
1055
1056 if ($item['kng_auto_scroll_txt_link']['nofollow']) {
1057 $this->add_render_attribute('kng_auto_scroll_txt_content_inner_attribute' . $item_count, 'rel', 'nofollow');
1058 }
1059
1060 }
1061 }
1062
1063 // If the item has custom CSS class
1064 if ('yes' === $item['kng_auto_scroll_txt_custom_css_class_switcher']) {
1065 if ('' !== $item['kng_auto_scroll_txt_custom_css_class']) {
1066 $this->add_render_attribute('kng_auto_scroll_txt_content_inner_attribute' . $item_count, 'class', esc_attr($item['kng_auto_scroll_txt_custom_css_class']));
1067 }
1068 }
1069
1070 /** START: Text Item ===================== */
1071 if ('text' === $content_type) {
1072
1073 $txt_effect = $item['kng_auto_scroll_txt_effect'];
1074 $txt_effect_class = '';
1075
1076 switch ($txt_effect) {
1077 case 'text-gradient':
1078 $txt_effect_class = ' king-addons-auto-scrolling-text-gradient';
1079 break;
1080 case 'underline-gradient':
1081 $txt_effect_class = ' king-addons-auto-scrolling-text-underline-gradient';
1082 break;
1083 }
1084
1085 if ('' !== $item['kng_auto_scroll_txt_content']) {
1086
1087 echo '<span class="elementor-repeater-item-' .
1088 esc_attr($item['_id']) .
1089 esc_attr($txt_effect_class) . ' king-addons-auto-scrolling-text">';
1090
1091 $html = '<' . esc_attr($item_tag) . ' ' . $this->get_render_attribute_string('kng_auto_scroll_txt_content_inner_attribute' . $item_count) . '>';
1092 echo wp_kses($html, wp_kses_allowed_html('post'));
1093
1094 echo '<span>' . wp_kses_post($item['kng_auto_scroll_txt_content']) . '</span>';
1095 echo '</' . esc_attr($item_tag) . '></span>';
1096
1097 }
1098
1099 }
1100 /** END: Text Item ===================== */
1101
1102 /** START: Image Item ===================== */
1103 if ('image' === $content_type) {
1104
1105 if ('' !== $item['kng_auto_scroll_txt_image']) {
1106
1107 echo '<span class="elementor-repeater-item-' .
1108 esc_attr($item['_id']) . ' king-addons-auto-scrolling-text">';
1109
1110 $html = '<' . esc_attr($item_tag) . ' ' . $this->get_render_attribute_string('kng_auto_scroll_txt_content_inner_attribute' . $item_count) . '>';
1111 echo wp_kses($html, wp_kses_allowed_html('post'));
1112
1113 $image_html = Group_Control_Image_Size::get_attachment_image_html($item, 'kng_auto_scroll_txt_image_size', 'kng_auto_scroll_txt_image');
1114
1115 // Define allowed tags and attributes
1116 $allowed_tags = wp_kses_allowed_html('post');
1117 $allowed_tags['img']['srcset'] = true; // Allow srcset attribute for img tag
1118 $allowed_tags['img']['sizes'] = true; // Allow sizes attribute for img tag
1119 $allowed_tags['img']['decoding'] = true; // Allow decoding attribute for img tag
1120 $allowed_tags['img']['loading'] = true; // Allow loading attribute for img tag. It is for the lazy loading possibility.
1121
1122 // Sanitize the image HTML using the extended set of allowed tags and attributes
1123 echo wp_kses($image_html, $allowed_tags);
1124
1125 echo '</' . esc_attr($item_tag) . '></span>';
1126
1127 }
1128
1129 }
1130 /** END: Image Item ===================== */
1131
1132 $item_count++;
1133 } ?>
1134 </div>
1135 </div>
1136 </div>
1137 <?php
1138
1139 // Security fix: Escape content before using innerHTML
1140 $escaped_content = esc_js($settings['auto_scroll_text']);
1141 $js_auto_scroll_text = "if (document.readyState === 'complete') {
1142 const marquee = document.querySelector('.king-addons-auto-scrolling-text-wrapper-" . esc_attr($this_ID) . "');
1143 const texts = '{$escaped_content}';
1144 marquee.innerHTML += texts;
1145 marquee.innerHTML += texts;
1146 } else {
1147 window.addEventListener('load', function () {
1148 const marquee = document.querySelector('.king-addons-auto-scrolling-text-wrapper-" . esc_attr($this_ID) . "');
1149 const texts = '{$escaped_content}';
1150 marquee.innerHTML += texts;
1151 marquee.innerHTML += texts;
1152 });
1153 }";
1154
1155 wp_print_inline_script_tag($js_auto_scroll_text);
1156 }
1157 }