<?php
    $widget->add_render_attribute( 'counter', [
        'class' => 'pxl-number--value '.$settings['effect'],
        'data-duration' => $settings['duration'],
        'data-startnumber' => $settings['starting_number'],
        'data-endnumber' => $settings['ending_number'],
        'data-to-value' => $settings['ending_number'],
        'data-delimiter' => $settings['thousand_separator_char'],
    ]); 
    $is_cubes = (isset($settings['cubes']) && !empty($settings['cubes']) && count($settings['cubes'])) || false;
    $title = $settings['title'] ?? '';
    $title_tmp = '';
?>

<div class="pxl-counter pxl-counter2">
    <div class="pxl-item--container">
        <div class="pxl-item--inner">
            <?php if($is_cubes) : ?>
                <?php foreach($settings['cubes'] as $cube) : ?>
                    <svg class="pxl-item--cube <?php echo esc_attr($cube['cube_position']); ?>" width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <rect x="2.5" y="2.5" width="10" height="10" transform="rotate(45 7.5 7.5)" fill="#4AAB3D">
                            <?php if($cube['cube_effect'] === 'spin') : ?>
                                <animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 7.5 7.5" to="360 7.5 7.5" dur="5s" repeatCount="indefinite"/>
                            <?php endif;?>
                        </rect>
                    </svg>
                <?php endforeach; ?>
            <?php endif; ?>
            <div class="pxl-item--holder">
                <?php solarva_render_icon($settings['pxl_icon']); ?>
                <div class="pxl-item--content">
                    <div class="pxl-item--group">
                        <div class="pxl-item--number">
                            <?php if(!empty($settings['prefix'])) : ?>
                                <span class="pxl-item--prefix"><?php pxl_print_html($settings['prefix']); ?></span>
                            <?php endif; ?>
                            <span 
                                <?php pxl_print_html($widget->get_render_attribute_string( 'counter' )); ?>>
                                    <?php echo esc_html($settings['starting_number']); ?>
                                </span>
                            <?php if(!empty($settings['suffix'])) : ?>
                                <span class="pxl-item--suffix"><?php pxl_print_html($settings['suffix']); ?></span>
                            <?php endif; ?>
                        </div>
                        <?php if(!empty($title)) : ?>
                            <?php for($i=0; $i<strlen($title); $i++) : ?>
                                <?php 
                                    $title_tmp .= ($title[$i] === '*') ? 
                                    '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="15" viewBox="0 0 16 15" fill="none"><path d="M8.29811 11.7516L12.8518 14.5L11.6434 9.32L15.6665 5.83474L10.3686 5.38526L8.29811 0.5L6.22758 5.38526L0.929688 5.83474L4.95285 9.32L3.74442 14.5L8.29811 11.7516Z" fill="#FEC51B"/></svg>' :
                                    $title[$i];   
                                ?>
                            <?php endfor; ?>
                            <div class="pxl-item--title">
                                <?php pxl_print_html($title_tmp); ?>
                            </div>
                        <?php endif; ?>
                    </div>
                    <div class="pxl-item--desc">
                        <?php echo esc_attr($settings['desc']); ?>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>