<?php
$html_id = pxl_get_element_id($settings);

$template = (int)$widget->get_setting('popup_template','0');
if($template > 0 ){
    if ( !has_action( 'pxl_anchor_target_popup_'.$template) ){
        add_action( 'pxl_anchor_target_popup_'.$template, 'hubsteel_hook_anchor_popup' );
    }
}

?>
<div id="pxl-<?php echo esc_attr($html_id) ?>" class="pxl-button-popup <?php echo esc_attr($settings['btn_action'].' '.$settings['pxl_animate']); ?>" data-wow-delay="<?php echo esc_attr($settings['pxl_animate_delay']); ?>ms">
    <button class="btn <?php echo esc_attr($settings['btn_style']); ?>">
        <span class="pxl--btn-text" data-text="<?php echo esc_attr($settings['text']); ?>">
            <?php 
                if($settings['btn_text_effect'] == 'btn-text-nina' || $settings['btn_text_effect'] == 'btn-text-nanuk') {
                    //$chars = str_split($settings['text']);
                    $chars = preg_split('//u', $settings['text'], -1, PREG_SPLIT_NO_EMPTY);

                    foreach ($chars as $value) {
                        if($value == ' ') {
                            echo '<span class="spacer">&nbsp;</span>';
                        } else {
                            //echo '<span>'.$value.'</span>';
                            echo '<span>' . htmlspecialchars($value) . '</span>';
                        }
                    }
                } elseif($settings['btn_text_effect'] == 'btn-text-smoke' || $settings['btn_text_effect'] == 'btn-text-reverse') { ?>
                    <span class="pxl-text--front">
                        <span class="pxl-text--inner">
                            <?php 
                            //$chars = str_split($settings['text']);
                            $chars = preg_split('//u', $settings['text'], -1, PREG_SPLIT_NO_EMPTY);
                            foreach ($chars as $value) {
                                if($value == ' ') {
                                    echo '<span class="spacer">&nbsp;</span>';
                                } else {
                                    //echo '<span>'.$value.'</span>';
                                    echo '<span>' . htmlspecialchars($value) . '</span>';
                                }
                            } ?>
                        </span>
                    </span>
                    <span class="pxl-text--back">
                        <span class="pxl-text--inner">
                            <?php 
                            //$chars = str_split($settings['text']);
                            $chars = preg_split('//u', $settings['text'], -1, PREG_SPLIT_NO_EMPTY);
                                foreach ($chars as $value) {
                                if($value == ' ') {
                                    echo '<span class="spacer">&nbsp;</span>';
                                } else {
                                    //echo '<span>'.$value.'</span>';
                                    echo '<span>' . htmlspecialchars($value) . '</span>';
                                }
                            } ?>
                        </span>
                    </span>
                <?php } else {
                    echo pxl_print_html($settings['text']);
                }
            ?>
        </span>
    </button>
</div>