| @@ -86,31 +86,9 @@ | ||
| 86 | 86 | public function get_keywords() { |
| 87 | 87 | return [ 'counter' ]; |
| 88 | 88 | } |
| 89 | 89 | |
| 90 | - protected function is_dynamic_content(): bool { | |
| 91 | - return false; | |
| 92 | - } | |
| 93 | - | |
| 94 | 90 | /** |
| 95 | - * Get style dependencies. | |
| 96 | - * | |
| 97 | - * Retrieve the list of style dependencies the widget requires. | |
| 98 | - * | |
| 99 | - * @since 3.24.0 | |
| 100 | - * @access public | |
| 101 | - * | |
| 102 | - * @return array Widget style dependencies. | |
| 103 | - */ | |
| 104 | - public function get_style_depends(): array { | |
| 105 | - return [ 'widget-counter' ]; | |
| 106 | - } | |
| 107 | - | |
| 108 | - public function has_widget_inner_wrapper(): bool { | |
| 109 | - return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' ); | |
| 110 | - } | |
| 111 | - | |
| 112 | - /** | |
| 113 | 91 | * Register counter widget controls. |
| 114 | 92 | * |
| 115 | 93 | * Adds different input fields to allow the user to change and customize the widget settings. |
| 116 | 94 | * |
| @@ -156,12 +134,10 @@ | ||
| 156 | 134 | 'type' => Controls_Manager::TEXT, |
| 157 | 135 | 'dynamic' => [ |
| 158 | 136 | 'active' => true, |
| 159 | 137 | ], |
| 160 | - 'ai' => [ | |
| 161 | - 'active' => false, | |
| 162 | - ], | |
| 163 | 138 | 'default' => '', |
| 139 | + 'placeholder' => 1, | |
| 164 | 140 | ] |
| 165 | 141 | ); |
| 166 | 142 | |
| 167 | 143 | $this->add_control( |
| @@ -171,12 +147,10 @@ | ||
| 171 | 147 | 'type' => Controls_Manager::TEXT, |
| 172 | 148 | 'dynamic' => [ |
| 173 | 149 | 'active' => true, |
| 174 | 150 | ], |
| 175 | - 'ai' => [ | |
| 176 | - 'active' => false, | |
| 177 | - ], | |
| 178 | 151 | 'default' => '', |
| 152 | + 'placeholder' => esc_html__( 'Plus', 'elementor' ), | |
| 179 | 153 | ] |
| 180 | 154 | ); |
| 181 | 155 | |
| 182 | 156 | $this->add_control( |
| @@ -181,9 +155,9 @@ | ||
| 181 | 155 | |
| 182 | 156 | $this->add_control( |
| 183 | 157 | 'duration', |
| 184 | 158 | [ |
| 185 | - 'label' => esc_html__( 'Animation Duration', 'elementor' ) . ' (ms)', | |
| 159 | + 'label' => esc_html__( 'Animation Duration', 'elementor' ), | |
| 186 | 160 | 'type' => Controls_Manager::NUMBER, |
| 187 | 161 | 'default' => 2000, |
| 188 | 162 | 'min' => 100, |
| 189 | 163 | 'step' => 100, |
| @@ -212,10 +186,8 @@ | ||
| 212 | 186 | 'options' => [ |
| 213 | 187 | '' => 'Default', |
| 214 | 188 | '.' => 'Dot', |
| 215 | 189 | ' ' => 'Space', |
| 216 | - '_' => 'Underline', | |
| 217 | - "'" => 'Apostrophe', | |
| 218 | 190 | ], |
| 219 | 191 | ] |
| 220 | 192 | ); |
| 221 | 193 | |
| @@ -224,36 +196,22 @@ | ||
| 224 | 196 | [ |
| 225 | 197 | 'label' => esc_html__( 'Title', 'elementor' ), |
| 226 | 198 | 'type' => Controls_Manager::TEXT, |
| 227 | 199 | 'label_block' => true, |
| 228 | - 'separator' => 'before', | |
| 229 | 200 | 'dynamic' => [ |
| 230 | 201 | 'active' => true, |
| 231 | 202 | ], |
| 232 | 203 | 'default' => esc_html__( 'Cool Number', 'elementor' ), |
| 204 | + 'placeholder' => esc_html__( 'Cool Number', 'elementor' ), | |
| 233 | 205 | ] |
| 234 | 206 | ); |
| 235 | 207 | |
| 236 | 208 | $this->add_control( |
| 237 | - 'title_tag', | |
| 209 | + 'view', | |
| 238 | 210 | [ |
| 239 | - 'label' => esc_html__( 'Title HTML Tag', 'elementor' ), | |
| 240 | - 'type' => Controls_Manager::SELECT, | |
| 241 | - 'options' => [ | |
| 242 | - 'h1' => 'H1', | |
| 243 | - 'h2' => 'H2', | |
| 244 | - 'h3' => 'H3', | |
| 245 | - 'h4' => 'H4', | |
| 246 | - 'h5' => 'H5', | |
| 247 | - 'h6' => 'H6', | |
| 248 | - 'div' => 'div', | |
| 249 | - 'span' => 'span', | |
| 250 | - 'p' => 'p', | |
| 251 | - ], | |
| 252 | - 'default' => 'div', | |
| 253 | - 'condition' => [ | |
| 254 | - 'title!' => '', | |
| 255 | - ], | |
| 211 | + 'label' => esc_html__( 'View', 'elementor' ), | |
| 212 | + 'type' => Controls_Manager::HIDDEN, | |
| 213 | + 'default' => 'traditional', | |
| 256 | 214 | ] |
| 257 | 215 | ); |
| 258 | 216 | |
| 259 | 217 | $this->end_controls_section(); |
| @@ -258,235 +216,8 @@ | ||
| 258 | 216 | |
| 259 | 217 | $this->end_controls_section(); |
| 260 | 218 | |
| 261 | 219 | $this->start_controls_section( |
| 262 | - 'section_counter_style', | |
| 263 | - [ | |
| 264 | - 'label' => esc_html__( 'Counter', 'elementor' ), | |
| 265 | - 'tab' => Controls_Manager::TAB_STYLE, | |
| 266 | - ] | |
| 267 | - ); | |
| 268 | - | |
| 269 | - $this->add_responsive_control( | |
| 270 | - 'title_position', | |
| 271 | - [ | |
| 272 | - 'label' => esc_html__( 'Title Position', 'elementor' ), | |
| 273 | - 'type' => Controls_Manager::CHOOSE, | |
| 274 | - 'options' => [ | |
| 275 | - 'before' => [ | |
| 276 | - 'title' => esc_html__( 'Before', 'elementor' ), | |
| 277 | - 'icon' => 'eicon-v-align-top', | |
| 278 | - ], | |
| 279 | - 'after' => [ | |
| 280 | - 'title' => esc_html__( 'After', 'elementor' ), | |
| 281 | - 'icon' => 'eicon-v-align-bottom', | |
| 282 | - ], | |
| 283 | - 'start' => [ | |
| 284 | - 'title' => esc_html__( 'Start', 'elementor' ), | |
| 285 | - 'icon' => 'eicon-h-align-left', | |
| 286 | - ], | |
| 287 | - 'end' => [ | |
| 288 | - 'title' => esc_html__( 'End', 'elementor' ), | |
| 289 | - 'icon' => 'eicon-h-align-right', | |
| 290 | - ], | |
| 291 | - ], | |
| 292 | - 'selectors_dictionary' => [ | |
| 293 | - 'before' => 'flex-direction: column;', | |
| 294 | - 'after' => 'flex-direction: column-reverse;', | |
| 295 | - 'start' => 'flex-direction: row;', | |
| 296 | - 'end' => 'flex-direction: row-reverse;', | |
| 297 | - ], | |
| 298 | - 'selectors' => [ | |
| 299 | - '{{WRAPPER}} .elementor-counter' => '{{VALUE}}', | |
| 300 | - ], | |
| 301 | - 'classes' => 'elementor-control-start-end', | |
| 302 | - 'condition' => [ | |
| 303 | - 'title!' => '', | |
| 304 | - ], | |
| 305 | - ] | |
| 306 | - ); | |
| 307 | - | |
| 308 | - $this->add_responsive_control( | |
| 309 | - 'title_horizontal_alignment', | |
| 310 | - [ | |
| 311 | - 'label' => esc_html__( 'Title Horizontal Alignment', 'elementor' ), | |
| 312 | - 'type' => Controls_Manager::CHOOSE, | |
| 313 | - 'options' => [ | |
| 314 | - 'start' => [ | |
| 315 | - 'title' => esc_html__( 'Start', 'elementor' ), | |
| 316 | - 'icon' => 'eicon-h-align-left', | |
| 317 | - ], | |
| 318 | - 'center' => [ | |
| 319 | - 'title' => esc_html__( 'Center', 'elementor' ), | |
| 320 | - 'icon' => 'eicon-h-align-center', | |
| 321 | - ], | |
| 322 | - 'end' => [ | |
| 323 | - 'title' => esc_html__( 'End', 'elementor' ), | |
| 324 | - 'icon' => 'eicon-h-align-right', | |
| 325 | - ], | |
| 326 | - ], | |
| 327 | - 'separator' => 'before', | |
| 328 | - 'classes' => 'elementor-control-start-end', | |
| 329 | - 'selectors' => [ | |
| 330 | - '{{WRAPPER}} .elementor-counter-title' => 'justify-content: {{VALUE}};', | |
| 331 | - ], | |
| 332 | - 'condition' => [ | |
| 333 | - 'title!' => '', | |
| 334 | - ], | |
| 335 | - ] | |
| 336 | - ); | |
| 337 | - | |
| 338 | - $this->add_responsive_control( | |
| 339 | - 'title_vertical_alignment', | |
| 340 | - [ | |
| 341 | - 'label' => esc_html__( 'Title Vertical Alignment', 'elementor' ), | |
| 342 | - 'type' => Controls_Manager::CHOOSE, | |
| 343 | - 'options' => [ | |
| 344 | - 'start' => [ | |
| 345 | - 'title' => esc_html__( 'Top', 'elementor' ), | |
| 346 | - 'icon' => 'eicon-v-align-top', | |
| 347 | - ], | |
| 348 | - 'center' => [ | |
| 349 | - 'title' => esc_html__( 'Middle', 'elementor' ), | |
| 350 | - 'icon' => 'eicon-v-align-middle', | |
| 351 | - ], | |
| 352 | - 'end' => [ | |
| 353 | - 'title' => esc_html__( 'Bottom', 'elementor' ), | |
| 354 | - 'icon' => 'eicon-v-align-bottom', | |
| 355 | - ], | |
| 356 | - ], | |
| 357 | - 'selectors' => [ | |
| 358 | - '{{WRAPPER}} .elementor-counter-title' => 'align-items: {{VALUE}};', | |
| 359 | - ], | |
| 360 | - 'condition' => [ | |
| 361 | - 'title!' => '', | |
| 362 | - 'title_position' => [ 'start', 'end' ], | |
| 363 | - ], | |
| 364 | - ] | |
| 365 | - ); | |
| 366 | - | |
| 367 | - $this->add_responsive_control( | |
| 368 | - 'title_gap', | |
| 369 | - [ | |
| 370 | - 'label' => esc_html__( 'Title Gap', 'elementor' ), | |
| 371 | - 'type' => Controls_Manager::SLIDER, | |
| 372 | - 'size_units' => [ 'px', 'em', 'rem', 'custom' ], | |
| 373 | - 'selectors' => [ | |
| 374 | - '{{WRAPPER}} .elementor-counter' => 'gap: {{SIZE}}{{UNIT}};', | |
| 375 | - ], | |
| 376 | - 'condition' => [ | |
| 377 | - 'title!' => '', | |
| 378 | - 'title_position' => [ '', 'before', 'after' ], | |
| 379 | - ], | |
| 380 | - ] | |
| 381 | - ); | |
| 382 | - | |
| 383 | - $this->add_responsive_control( | |
| 384 | - 'number_position', | |
| 385 | - [ | |
| 386 | - 'label' => esc_html__( 'Number Position', 'elementor' ), | |
| 387 | - 'type' => Controls_Manager::CHOOSE, | |
| 388 | - 'options' => [ | |
| 389 | - 'start' => [ | |
| 390 | - 'title' => esc_html__( 'Start', 'elementor' ), | |
| 391 | - 'icon' => 'eicon-h-align-left', | |
| 392 | - ], | |
| 393 | - 'center' => [ | |
| 394 | - 'title' => esc_html__( 'Center', 'elementor' ), | |
| 395 | - 'icon' => 'eicon-h-align-center', | |
| 396 | - ], | |
| 397 | - 'end' => [ | |
| 398 | - 'title' => esc_html__( 'End', 'elementor' ), | |
| 399 | - 'icon' => 'eicon-h-align-right', | |
| 400 | - ], | |
| 401 | - 'stretch' => [ | |
| 402 | - 'title' => esc_html__( 'Stretch', 'elementor' ), | |
| 403 | - 'icon' => 'eicon-grow', | |
| 404 | - ], | |
| 405 | - ], | |
| 406 | - 'classes' => 'elementor-control-start-end', | |
| 407 | - 'selectors_dictionary' => [ | |
| 408 | - 'start' => 'text-align: {{VALUE}}; --counter-prefix-grow: 0; --counter-suffix-grow: 1; --counter-number-grow: 0;', | |
| 409 | - 'center' => 'text-align: {{VALUE}}; --counter-prefix-grow: 1; --counter-suffix-grow: 1; --counter-number-grow: 0;', | |
| 410 | - 'end' => 'text-align: {{VALUE}}; --counter-prefix-grow: 1; --counter-suffix-grow: 0; --counter-number-grow: 0;', | |
| 411 | - 'stretch' => '--counter-prefix-grow: 0; --counter-suffix-grow: 0; --counter-number-grow: 1;', | |
| 412 | - ], | |
| 413 | - 'selectors' => [ | |
| 414 | - '{{WRAPPER}} .elementor-counter-number-wrapper' => '{{VALUE}}', | |
| 415 | - ], | |
| 416 | - 'separator' => 'before', | |
| 417 | - ] | |
| 418 | - ); | |
| 419 | - | |
| 420 | - $this->add_responsive_control( | |
| 421 | - 'number_alignment', | |
| 422 | - [ | |
| 423 | - 'label' => esc_html__( 'Number Alignment', 'elementor' ), | |
| 424 | - 'type' => Controls_Manager::CHOOSE, | |
| 425 | - 'options' => [ | |
| 426 | - 'start' => [ | |
| 427 | - 'title' => esc_html__( 'Start', 'elementor' ), | |
| 428 | - 'icon' => 'eicon-text-align-left', | |
| 429 | - ], | |
| 430 | - 'center' => [ | |
| 431 | - 'title' => esc_html__( 'Center', 'elementor' ), | |
| 432 | - 'icon' => 'eicon-text-align-center', | |
| 433 | - ], | |
| 434 | - 'end' => [ | |
| 435 | - 'title' => esc_html__( 'End', 'elementor' ), | |
| 436 | - 'icon' => 'eicon-text-align-right', | |
| 437 | - ], | |
| 438 | - ], | |
| 439 | - 'classes' => 'elementor-control-start-end', | |
| 440 | - 'selectors' => [ | |
| 441 | - '{{WRAPPER}} .elementor-counter-number' => 'text-align: {{VALUE}};', | |
| 442 | - ], | |
| 443 | - 'condition' => [ | |
| 444 | - 'number_position' => 'stretch', | |
| 445 | - ], | |
| 446 | - ] | |
| 447 | - ); | |
| 448 | - | |
| 449 | - $this->add_responsive_control( | |
| 450 | - 'number_gap', | |
| 451 | - [ | |
| 452 | - 'label' => esc_html__( 'Number Gap', 'elementor' ), | |
| 453 | - 'type' => Controls_Manager::SLIDER, | |
| 454 | - 'size_units' => [ 'px', 'em', 'rem', 'custom' ], | |
| 455 | - 'selectors' => [ | |
| 456 | - '{{WRAPPER}} .elementor-counter-number-wrapper' => 'gap: {{SIZE}}{{UNIT}};', | |
| 457 | - ], | |
| 458 | - 'conditions' => [ | |
| 459 | - 'relation' => 'and', | |
| 460 | - 'terms' => [ | |
| 461 | - [ | |
| 462 | - 'name' => 'number_position', | |
| 463 | - 'operator' => '!==', | |
| 464 | - 'value' => 'stretch', | |
| 465 | - ], | |
| 466 | - [ | |
| 467 | - 'relation' => 'or', | |
| 468 | - 'terms' => [ | |
| 469 | - [ | |
| 470 | - 'name' => 'prefix', | |
| 471 | - 'operator' => '!==', | |
| 472 | - 'value' => '', | |
| 473 | - ], | |
| 474 | - [ | |
| 475 | - 'name' => 'suffix', | |
| 476 | - 'operator' => '!==', | |
| 477 | - 'value' => '', | |
| 478 | - ], | |
| 479 | - ], | |
| 480 | - ], | |
| 481 | - ], | |
| 482 | - ], | |
| 483 | - ] | |
| 484 | - ); | |
| 485 | - | |
| 486 | - $this->end_controls_section(); | |
| 487 | - | |
| 488 | - $this->start_controls_section( | |
| 489 | 220 | 'section_number', |
| 490 | 221 | [ |
| 491 | 222 | 'label' => esc_html__( 'Number', 'elementor' ), |
| 492 | 223 | 'tab' => Controls_Manager::TAB_STYLE, |
| @@ -518,16 +249,8 @@ | ||
| 518 | 249 | ] |
| 519 | 250 | ); |
| 520 | 251 | |
| 521 | 252 | $this->add_group_control( |
| 522 | - Group_Control_Text_Stroke::get_type(), | |
| 523 | - [ | |
| 524 | - 'name' => 'number_stroke', | |
| 525 | - 'selector' => '{{WRAPPER}} .elementor-counter-number-wrapper', | |
| 526 | - ] | |
| 527 | - ); | |
| 528 | - | |
| 529 | - $this->add_group_control( | |
| 530 | 253 | Group_Control_Text_Shadow::get_type(), |
| 531 | 254 | [ |
| 532 | 255 | 'name' => 'number_shadow', |
| 533 | 256 | 'selector' => '{{WRAPPER}} .elementor-counter-number-wrapper', |
| @@ -540,11 +263,8 @@ | ||
| 540 | 263 | 'section_title', |
| 541 | 264 | [ |
| 542 | 265 | 'label' => esc_html__( 'Title', 'elementor' ), |
| 543 | 266 | 'tab' => Controls_Manager::TAB_STYLE, |
| 544 | - 'condition' => [ | |
| 545 | - 'title!' => '', | |
| 546 | - ], | |
| 547 | 267 | ] |
| 548 | 268 | ); |
| 549 | 269 | |
| 550 | 270 | $this->add_control( |
| @@ -557,11 +277,8 @@ | ||
| 557 | 277 | ], |
| 558 | 278 | 'selectors' => [ |
| 559 | 279 | '{{WRAPPER}} .elementor-counter-title' => 'color: {{VALUE}};', |
| 560 | 280 | ], |
| 561 | - 'condition' => [ | |
| 562 | - 'title!' => '', | |
| 563 | - ], | |
| 564 | 281 | ] |
| 565 | 282 | ); |
| 566 | 283 | |
| 567 | 284 | $this->add_group_control( |
| @@ -571,33 +288,16 @@ | ||
| 571 | 288 | 'global' => [ |
| 572 | 289 | 'default' => Global_Typography::TYPOGRAPHY_SECONDARY, |
| 573 | 290 | ], |
| 574 | 291 | 'selector' => '{{WRAPPER}} .elementor-counter-title', |
| 575 | - 'condition' => [ | |
| 576 | - 'title!' => '', | |
| 577 | - ], | |
| 578 | 292 | ] |
| 579 | 293 | ); |
| 580 | 294 | |
| 581 | 295 | $this->add_group_control( |
| 582 | - Group_Control_Text_Stroke::get_type(), | |
| 583 | - [ | |
| 584 | - 'name' => 'title_stroke', | |
| 585 | - 'selector' => '{{WRAPPER}} .elementor-counter-title', | |
| 586 | - 'condition' => [ | |
| 587 | - 'title!' => '', | |
| 588 | - ], | |
| 589 | - ] | |
| 590 | - ); | |
| 591 | - | |
| 592 | - $this->add_group_control( | |
| 593 | 296 | Group_Control_Text_Shadow::get_type(), |
| 594 | 297 | [ |
| 595 | 298 | 'name' => 'title_shadow', |
| 596 | 299 | 'selector' => '{{WRAPPER}} .elementor-counter-title', |
| 597 | - 'condition' => [ | |
| 598 | - 'title!' => '', | |
| 599 | - ], | |
| 600 | 300 | ] |
| 601 | 301 | ); |
| 602 | 302 | |
| 603 | 303 | $this->end_controls_section(); |
| @@ -612,47 +312,23 @@ | ||
| 612 | 312 | * @access protected |
| 613 | 313 | */ |
| 614 | 314 | protected function content_template() { |
| 615 | 315 | ?> |
| 616 | - <# | |
| 617 | - view.addRenderAttribute( 'elementor-counter', 'class', 'elementor-counter' ); | |
| 316 | + <# view.addRenderAttribute( 'counter-title', { | |
| 317 | + 'class': 'elementor-counter-title' | |
| 318 | + } ); | |
| 618 | 319 | |
| 619 | - view.addRenderAttribute( 'counter-number', 'class', 'elementor-counter-number-wrapper' ); | |
| 620 | - | |
| 621 | - view.addRenderAttribute( | |
| 622 | - 'counter', | |
| 623 | - { | |
| 624 | - 'class': 'elementor-counter-number', | |
| 625 | - 'data-duration': settings.duration, | |
| 626 | - 'data-to-value': settings.ending_number, | |
| 627 | - 'data-from-value': settings.starting_number, | |
| 628 | - } | |
| 629 | - ); | |
| 630 | - | |
| 631 | - if ( settings.thousand_separator ) { | |
| 632 | - const delimiter = settings.thousand_separator_char ? settings.thousand_separator_char : ','; | |
| 633 | - view.addRenderAttribute( 'counter', 'data-delimiter', delimiter ); | |
| 634 | - } | |
| 635 | - | |
| 636 | - view.addRenderAttribute( 'prefix', 'class', 'elementor-counter-number-prefix' ); | |
| 637 | - | |
| 638 | - view.addRenderAttribute( 'suffix', 'class', 'elementor-counter-number-suffix' ); | |
| 639 | - | |
| 640 | - view.addRenderAttribute( 'counter-title', 'class', 'elementor-counter-title' ); | |
| 641 | - | |
| 642 | 320 | view.addInlineEditingAttributes( 'counter-title' ); |
| 643 | - | |
| 644 | - const titleTag = elementor.helpers.validateHTMLTag( settings.title_tag ); | |
| 645 | 321 | #> |
| 646 | - <div {{{ view.getRenderAttributeString( 'elementor-counter' ) }}}> | |
| 322 | + <div class="elementor-counter"> | |
| 323 | + <div class="elementor-counter-number-wrapper"> | |
| 324 | + <span class="elementor-counter-number-prefix">{{{ settings.prefix }}}</span> | |
| 325 | + <span class="elementor-counter-number" data-duration="{{ settings.duration }}" data-to-value="{{ settings.ending_number }}" data-delimiter="{{ settings.thousand_separator ? settings.thousand_separator_char || ',' : '' }}">{{{ settings.starting_number }}}</span> | |
| 326 | + <span class="elementor-counter-number-suffix">{{{ settings.suffix }}}</span> | |
| 327 | + </div> | |
| 647 | 328 | <# if ( settings.title ) { |
| 648 | - #><{{ titleTag }} {{{ view.getRenderAttributeString( 'counter-title' ) }}}>{{{ elementor.helpers.sanitize( settings.title, { ALLOW_DATA_ATTR: false } ) }}}</{{ titleTag }}><# | |
| 329 | + #><div {{{ view.getRenderAttributeString( 'counter-title' ) }}}>{{{ settings.title }}}</div><# | |
| 649 | 330 | } #> |
| 650 | - <div {{{ view.getRenderAttributeString( 'counter-number' ) }}}> | |
| 651 | - <span {{{ view.getRenderAttributeString( 'prefix' ) }}}>{{ settings.prefix }}</span> | |
| 652 | - <span {{{ view.getRenderAttributeString( 'counter' ) }}}>{{ settings.starting_number }}</span> | |
| 653 | - <span {{{ view.getRenderAttributeString( 'suffix' ) }}}>{{ settings.suffix }}</span> | |
| 654 | - </div> | |
| 655 | 331 | </div> |
| 656 | 332 | <?php |
| 657 | 333 | } |
| 658 | 334 | |
| @@ -666,62 +342,33 @@ | ||
| 666 | 342 | */ |
| 667 | 343 | protected function render() { |
| 668 | 344 | $settings = $this->get_settings_for_display(); |
| 669 | 345 | |
| 670 | - $this->add_render_attribute( 'elementor-counter', 'class', 'elementor-counter' ); | |
| 346 | + $this->add_render_attribute( 'counter', [ | |
| 347 | + 'class' => 'elementor-counter-number', | |
| 348 | + 'data-duration' => $settings['duration'], | |
| 349 | + 'data-to-value' => $settings['ending_number'], | |
| 350 | + 'data-from-value' => $settings['starting_number'], | |
| 351 | + ] ); | |
| 671 | 352 | |
| 672 | - $this->add_render_attribute( 'counter-number', 'class', 'elementor-counter-number-wrapper' ); | |
| 673 | - | |
| 674 | - $this->add_render_attribute( | |
| 675 | - 'counter', | |
| 676 | - [ | |
| 677 | - 'class' => 'elementor-counter-number', | |
| 678 | - 'data-duration' => $settings['duration'], | |
| 679 | - 'data-to-value' => $settings['ending_number'], | |
| 680 | - 'data-from-value' => $settings['starting_number'], | |
| 681 | - ] | |
| 682 | - ); | |
| 683 | - | |
| 684 | 353 | if ( ! empty( $settings['thousand_separator'] ) ) { |
| 685 | 354 | $delimiter = empty( $settings['thousand_separator_char'] ) ? ',' : $settings['thousand_separator_char']; |
| 686 | 355 | $this->add_render_attribute( 'counter', 'data-delimiter', $delimiter ); |
| 687 | 356 | } |
| 688 | 357 | |
| 689 | - $this->add_render_attribute( 'prefix', 'class', 'elementor-counter-number-prefix' ); | |
| 690 | - | |
| 691 | - $this->add_render_attribute( 'suffix', 'class', 'elementor-counter-number-suffix' ); | |
| 692 | - | |
| 693 | 358 | $this->add_render_attribute( 'counter-title', 'class', 'elementor-counter-title' ); |
| 694 | 359 | |
| 695 | 360 | $this->add_inline_editing_attributes( 'counter-title' ); |
| 696 | - | |
| 697 | - $title_tag = Utils::validate_html_tag( $settings['title_tag'] ); | |
| 698 | 361 | ?> |
| 699 | - <div <?php $this->print_render_attribute_string( 'elementor-counter' ); ?>> | |
| 700 | - <?php | |
| 701 | - if ( $settings['title'] ) : | |
| 702 | - ?><<?php Utils::print_validated_html_tag( $title_tag ); ?> <?php $this->print_render_attribute_string( 'counter-title' ); ?>><?php echo wp_kses_post( $this->get_settings_for_display( 'title' ) ); ?></<?php Utils::print_validated_html_tag( $title_tag ); ?>><?php | |
| 703 | - endif; | |
| 704 | - ?> | |
| 705 | - <div <?php $this->print_render_attribute_string( 'counter-number' ); ?>> | |
| 706 | - <span <?php $this->print_render_attribute_string( 'prefix' ); ?>><?php echo wp_kses_post( $settings['prefix'] ); ?></span> | |
| 707 | - <span <?php $this->print_render_attribute_string( 'counter' ); ?>><?php echo wp_kses_post( $settings['starting_number'] ); ?></span> | |
| 708 | - <span <?php $this->print_render_attribute_string( 'suffix' ); ?>><?php echo wp_kses_post( $settings['suffix'] ); ?></span> | |
| 362 | + <div class="elementor-counter"> | |
| 363 | + <div class="elementor-counter-number-wrapper"> | |
| 364 | + <span class="elementor-counter-number-prefix"><?php $this->print_unescaped_setting( 'prefix' ); ?></span> | |
| 365 | + <span <?php $this->print_render_attribute_string( 'counter' ); ?>><?php $this->print_unescaped_setting( 'starting_number' ); ?></span> | |
| 366 | + <span class="elementor-counter-number-suffix"><?php $this->print_unescaped_setting( 'suffix' ); ?></span> | |
| 709 | 367 | </div> |
| 368 | + <?php if ( $settings['title'] ) : ?> | |
| 369 | + <div <?php $this->print_render_attribute_string( 'counter-title' ); ?>><?php $this->print_unescaped_setting( 'title' ); ?></div> | |
| 370 | + <?php endif; ?> | |
| 710 | 371 | </div> |
| 711 | 372 | <?php |
| 712 | - } | |
| 713 | - | |
| 714 | - public function render_markdown(): string { | |
| 715 | - $settings = $this->get_settings_for_display(); | |
| 716 | - $number = $settings['ending_number'] ?? ''; | |
| 717 | - $prefix = $settings['prefix'] ?? ''; | |
| 718 | - $suffix = $settings['suffix'] ?? ''; | |
| 719 | - $title = Utils::html_to_plain_text( $settings['title'] ?? '' ); | |
| 720 | - $value = $prefix . $number . $suffix; | |
| 721 | - if ( empty( $value ) && empty( $title ) ) { | |
| 722 | - return ''; | |
| 723 | - } | |
| 724 | - $parts = array_filter( [ $value, $title ] ); | |
| 725 | - return implode( ' - ', $parts ); | |
| 726 | 373 | } |
| 727 | 374 | } |
