<?php
/**
 * Frontend Display Functions
 */

if (!defined('ABSPATH')) {
    exit;
}

// Enqueue frontend assets
function canvon_fb_enqueue_frontend_assets() {
    // Only load on frontend, not admin
    if (is_admin()) {
        return;
    }

    // CSS (shared with admin preview)
    wp_enqueue_style(
        'canvon-fb-frontend-style',
        plugin_dir_url(dirname(__FILE__)) . 'public/css/frontend.css',
        array(),
        '1.0.0'
    );

    // phpcs:ignore WordPress.Security.NonceVerification.Recommended -- Read-only preview token lookup; no state change is performed here.
    $canvon_fb_preview_token = isset( $_GET['canvon_fb_preview'] ) ? preg_replace( '/[^a-zA-Z0-9]/', '', sanitize_text_field( wp_unslash( $_GET['canvon_fb_preview'] ) ) ) : '';
    $canvon_fb_preview_data  = $canvon_fb_preview_token ? get_transient( 'canvon_fb_preview_' . $canvon_fb_preview_token ) : false;
    $canvon_fb_pget = function( $canvon_fb_key, $canvon_fb_default = false ) use ( $canvon_fb_preview_data ) {
        return ( $canvon_fb_preview_data && array_key_exists( $canvon_fb_key, $canvon_fb_preview_data ) ) ? $canvon_fb_preview_data[ $canvon_fb_key ] : get_option( $canvon_fb_key, $canvon_fb_default );
    };

    $canvon_fb_frontend_inline_css = '@media(max-width:768px){.canvon-fb-preview-icon[data-show-on="desktop"]{display:none!important}}' .
        '@media(min-width:769px){.canvon-fb-preview-icon[data-show-on="mobile"]{display:none!important}}' .
        '.canvon-fb-preview-icon[data-show-on="none"]{display:none!important}';

    $canvon_fb_frontend_inline_css = apply_filters( 'canvon_fb_frontend_inline_css', $canvon_fb_frontend_inline_css, $canvon_fb_pget );

    wp_add_inline_style( 'canvon-fb-frontend-style', $canvon_fb_frontend_inline_css );

    // JavaScript (shared with admin preview)
    wp_enqueue_script(
        'canvon-fb-frontend-script',
        plugin_dir_url(dirname(__FILE__)) . 'public/js/frontend.js',
        array('jquery'),
        '1.0.0',
        true
    );
}
add_action('wp_enqueue_scripts', 'canvon_fb_enqueue_frontend_assets');

function canvon_fb_get_platform_input_config( $canvon_fb_platform ) {
    $canvon_fb_configs = array(
        'phone' => array(
            'input_type'  => 'tel',
            'placeholder' => '+1234567890',
            'help'        => 'Phone number',
        ),
        'whatsapp' => array(
            'input_type'  => 'tel',
            'placeholder' => '+1234567890',
            'help'        => 'WhatsApp phone number',
        ),
        'line' => array(
            'input_type'  => 'text',
            'placeholder' => 'LINE ID or https://line.me/ti/p/...',
            'help'        => 'LINE ID or profile link',
        ),
        'wechat' => array(
            'input_type'  => 'text',
            'placeholder' => 'WeChat ID or QR/profile URL',
            'help'        => 'WeChat does not allow reliable direct-chat links by ID. A WeChat ID opens the app; a URL opens that page.',
        ),
        'kakao' => array(
            'input_type'  => 'text',
            'placeholder' => 'KakaoTalk Open Chat or Channel URL',
            'help'        => 'Use a KakaoTalk Open Chat or Channel URL.',
        ),
        'discord' => array(
            'input_type'  => 'text',
            'placeholder' => 'https://discord.gg/yourinvite',
            'help'        => 'Discord invite link or code',
        ),
        'email' => array(
            'input_type'  => 'email',
            'placeholder' => 'your@email.com',
            'help'        => 'Email address',
        ),
    );

    return isset( $canvon_fb_configs[ $canvon_fb_platform ] ) ? $canvon_fb_configs[ $canvon_fb_platform ] : array(
        'input_type'  => 'url',
        'placeholder' => 'https://example.com/your-profile',
        'help'        => 'Profile URL',
    );
}

function canvon_fb_sanitize_platform_value( $canvon_fb_value, $canvon_fb_platform ) {
    $canvon_fb_value = is_string( $canvon_fb_value ) ? trim( $canvon_fb_value ) : '';

    if ( '' === $canvon_fb_value ) {
        return '';
    }

    if ( 'email' === $canvon_fb_platform ) {
        return sanitize_email( $canvon_fb_value );
    }

    if ( in_array( $canvon_fb_platform, array( 'phone', 'whatsapp', 'line', 'wechat', 'kakao', 'discord' ), true ) ) {
        return sanitize_text_field( $canvon_fb_value );
    }

    return esc_url_raw( $canvon_fb_value );
}

function canvon_fb_is_absolute_url( $canvon_fb_value ) {
    return (bool) preg_match( '#^https?://#i', $canvon_fb_value );
}

function canvon_fb_build_platform_href( $canvon_fb_platform, $canvon_fb_value ) {
    $canvon_fb_value = is_string( $canvon_fb_value ) ? trim( $canvon_fb_value ) : '';

    if ( '' === $canvon_fb_value ) {
        return '';
    }

    switch ( $canvon_fb_platform ) {
        case 'phone':
            return 'tel:' . preg_replace( '/\s+/', '', $canvon_fb_value );

        case 'whatsapp':
            if ( canvon_fb_is_absolute_url( $canvon_fb_value ) ) {
                return $canvon_fb_value;
            }

            $canvon_fb_number = preg_replace( '/\D+/', '', $canvon_fb_value );
            return $canvon_fb_number ? 'https://wa.me/' . $canvon_fb_number : '';

        case 'email':
            return is_email( $canvon_fb_value ) ? 'mailto:' . $canvon_fb_value : '';

        case 'line':
            if ( canvon_fb_is_absolute_url( $canvon_fb_value ) ) {
                return $canvon_fb_value;
            }

            return 'https://line.me/ti/p/~' . rawurlencode( ltrim( $canvon_fb_value, '@' ) );

        case 'wechat':
            if ( canvon_fb_is_absolute_url( $canvon_fb_value ) ) {
                return $canvon_fb_value;
            }

            return 'weixin://';

        case 'discord':
            if ( canvon_fb_is_absolute_url( $canvon_fb_value ) ) {
                return $canvon_fb_value;
            }

            return 'https://discord.gg/' . rawurlencode( $canvon_fb_value );

        case 'kakao':
            if ( canvon_fb_is_absolute_url( $canvon_fb_value ) ) {
                return $canvon_fb_value;
            }

            return 'https://pf.kakao.com/' . rawurlencode( $canvon_fb_value );
    }

    return canvon_fb_is_absolute_url( $canvon_fb_value ) ? $canvon_fb_value : 'https://' . ltrim( $canvon_fb_value, '/' );
}

// Get platform data (shared between admin and frontend)
function canvon_fb_get_platform_data() {
    return array(
        'phone' => array(
            'name' => 'Phone',
            'color_class' => 'canvon-fb-phone',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M164.9 24.6c-7.7-18.6-28-28.5-47.4-23.2l-88 24C12.1 30.2 0 46 0 64C0 311.4 200.6 512 448 512c18 0 33.8-12.1 38.6-29.5l24-88c5.3-19.4-4.6-39.7-23.2-47.4l-96-40c-16.3-6.8-35.2-2.1-46.3 11.6L304.7 368C234.3 334.7 177.3 277.7 144 207.3L193.3 167c13.7-11.2 18.4-30 11.6-46.3l-40-96z"/></svg>'
        ),
        'whatsapp' => array(
            'name' => 'WhatsApp',
            'color_class' => 'canvon-fb-whatsapp',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M380.9 97.1C339 55.1 283.2 32 223.9 32c-122.4 0-222 99.6-222 222 0 39.1 10.2 77.3 29.6 111L0 480l117.7-30.9c32.4 17.7 68.9 27 106.1 27h.1c122.3 0 224.1-99.6 224.1-222 0-59.3-25.2-115-67.1-157zm-157 341.6c-33.2 0-65.7-8.9-94-25.7l-6.7-4-69.8 18.3L72 359.2l-4.4-7c-18.5-29.4-28.2-63.3-28.2-98.2 0-101.7 82.8-184.5 184.6-184.5 49.3 0 95.6 19.2 130.4 54.1 34.8 34.9 56.2 81.2 56.1 130.5 0 101.8-84.9 184.6-186.6 184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.5 2.8-3.7 5.6-14.3 18-17.6 21.8-3.2 3.7-6.5 4.2-12 1.4-32.6-16.3-54-29.1-75.5-66-5.7-9.8 5.7-9.1 16.3-30.3 1.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7 0-9.7 1.4-14.8 6.9-5.1 5.6-19.4 19-19.4 46.3 0 27.3 19.9 53.7 22.6 57.4 2.8 3.7 39.1 59.7 94.8 83.8 35.2 15.2 49 16.5 66.6 13.9 10.7-1.6 32.8-13.4 37.4-26.4 4.6-13 4.6-24.1 3.2-26.4-1.3-2.5-5-3.9-10.5-6.6z"/></svg>'
        ),
        'line' => array(
            'name' => 'Line',
            'color_class' => 'canvon-fb-line',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63h2.386c.346 0 .627.285.627.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.63.63-.63.345 0 .63.285.63.63v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63.346 0 .628.285.628.63v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.63.63-.63.348 0 .63.285.63.63v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>'
        ),
        'wechat' => array(
            'name' => 'WeChat',
            'color_class' => 'canvon-fb-wechat',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M385.2 167.6c6.4 0 12.6.3 18.8 1.1C387.4 90.3 303.3 32 207.7 32 100.5 32 13 104.8 13 197.4c0 53.4 29.3 97.5 77.9 131.6l-19.3 58.6 68-34.1c24.4 4.8 43.8 9.7 68.2 9.7 6.2 0 12.1-.3 18.3-.8-4-12.9-6.2-26.6-6.2-40.8-.1-84.9 72.9-154 165.3-154zm-104.5-52.9c14.5 0 24.2 9.7 24.2 24.4 0 14.5-9.7 24.2-24.2 24.2-14.8 0-29.3-9.7-29.3-24.2.1-14.7 14.6-24.4 29.3-24.4zm-136.4 48.6c-14.5 0-29.3-9.7-29.3-24.2 0-14.8 14.8-24.4 29.3-24.4 14.8 0 24.4 9.7 24.4 24.4 0 14.6-9.6 24.2-24.4 24.2zM563 319.4c0-77.9-77.9-141.3-165.4-141.3-92.7 0-165.4 63.4-165.4 141.3S305 460.7 397.6 460.7c19.3 0 38.9-5.1 58.6-9.9l53.4 29.3-14.8-48.6C534 402.1 563 363.2 563 319.4zm-219.1-24.5c-9.7 0-19.3-9.7-19.3-19.6 0-9.7 9.7-19.3 19.3-19.3 14.8 0 24.4 9.7 24.4 19.3 0 10-9.7 19.6-24.4 19.6zm107.1 0c-9.7 0-19.3-9.7-19.3-19.6 0-9.7 9.7-19.3 19.3-19.3 14.5 0 24.4 9.7 24.4 19.3.1 10-9.9 19.6-24.4 19.6z"/></svg>'
        ),
        'kakao' => array(
            'name' => 'KakaoTalk',
            'color_class' => 'canvon-fb-kakao',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="#3C1E1E" d="M256 82C143.3 82 52 153.8 52 242.3c0 56.8 37.7 106.6 94.5 135.1l-19.3 68.1c-1.7 6.1 5.2 10.9 10.4 7.2l84.8-57.4c10.9 1.6 22.1 2.4 33.6 2.4 112.7 0 204-71.8 204-160.3S368.7 82 256 82z"/><text x="256" y="280" fill="#FEE500" text-anchor="middle" font-family="Arial, Helvetica, sans-serif" font-size="72" font-weight="800" letter-spacing="-4">TALK</text></svg>'
        ),
        'discord' => array(
            'name' => 'Discord',
            'color_class' => 'canvon-fb-discord',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path d="M524.5 69.8a1.5 1.5 0 0 0 -.8-.7A485.1 485.1 0 0 0 404.1 32a1.8 1.8 0 0 0 -1.9 .9 337.5 337.5 0 0 0 -14.9 30.6 447.8 447.8 0 0 0 -134.4 0 309.5 309.5 0 0 0 -15.1-30.6 1.9 1.9 0 0 0 -1.9-.9A483.7 483.7 0 0 0 116.1 69.1a1.7 1.7 0 0 0 -.8 .7C39.1 183.7 18.2 294.7 28.4 404.4a2 2 0 0 0 .8 1.4A487.7 487.7 0 0 0 176 479.9a1.9 1.9 0 0 0 2.1-.7A348.2 348.2 0 0 0 208.1 430.4a1.9 1.9 0 0 0 -1-2.6 321.2 321.2 0 0 1 -45.9-21.9 1.9 1.9 0 0 1 -.2-3.1c3.1-2.3 6.2-4.7 9.1-7.1a1.8 1.8 0 0 1 1.9-.3c96.2 43.9 200.4 43.9 295.5 0a1.8 1.8 0 0 1 1.9 .2c2.9 2.4 6 4.9 9.1 7.2a1.9 1.9 0 0 1 -.2 3.1 301.4 301.4 0 0 1 -45.9 21.8 1.9 1.9 0 0 0 -1 2.6 391.1 391.1 0 0 0 30 48.8 1.9 1.9 0 0 0 2.1 .7A486 486 0 0 0 610.7 405.7a1.9 1.9 0 0 0 .8-1.4C623.7 277.6 590.9 167.5 524.5 69.8zM222.5 337.6c-29 0-52.8-26.6-52.8-59.2S193.1 219.1 222.5 219.1c29.7 0 53.3 26.8 52.8 59.2C275.3 311 251.9 337.6 222.5 337.6zm195.4 0c-29 0-52.8-26.6-52.8-59.2S388.4 219.1 417.9 219.1c29.7 0 53.3 26.8 52.8 59.2C470.7 311 447.5 337.6 417.9 337.6z"/></svg>'
        ),
        'email' => array(
            'name' => 'Email',
            'color_class' => 'canvon-fb-email',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M64 112c-8.8 0-16 7.2-16 16v22.1L220.5 291.7c20.7 17 50.4 17 71.1 0L464 150.1V128c0-8.8-7.2-16-16-16H64zM48 212.2V384c0 8.8 7.2 16 16 16H448c8.8 0 16-7.2 16-16V212.2L322 328.8c-38.4 31.5-93.7 31.5-132 0L48 212.2zM0 128C0 92.7 28.7 64 64 64H448c35.3 0 64 28.7 64 64V384c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V128z"/></svg>'
        ),
        'tiktok' => array(
            'name' => 'TikTok',
            'color_class' => 'canvon-fb-tiktok',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M448 209.9a210.1 210.1 0 0 1 -122.8-39.3V349.4A162.6 162.6 0 1 1 185 188.3V278.2a74.6 74.6 0 1 0 52.2 71.2V0l88 0a121.2 121.2 0 0 0 1.9 22.2h0A122.2 122.2 0 0 0 381 102.4a121.4 121.4 0 0 0 67 20.1z"/></svg>'
        ),
        'twitter' => array(
            'name' => 'X (Twitter)',
            'color_class' => 'canvon-fb-twitter',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/></svg>'
        ),
        'linkedin' => array(
            'name' => 'LinkedIn',
            'color_class' => 'canvon-fb-linkedin',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"/></svg>'
        ),
        'threads' => array(
            'name' => 'Threads',
            'color_class' => 'canvon-fb-threads',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M331.5 235.7c2.2 .9 4.2 1.9 6.3 2.8c29.2 14.1 50.6 35.2 61.8 61.4c15.7 36.5 17.2 95.8-30.3 143.2c-36.2 36.2-80.3 52.5-142.6 53h-.3c-70.2-.5-124.1-24.1-160.4-70.2c-32.3-41-48.9-98.1-49.5-169.6V256v-.2C17 184.3 33.6 127.2 65.9 86.2C102.2 40.1 156.2 16.5 226.4 16h.3c70.3 .5 124.9 24 162.3 69.9c18.4 22.7 32 50 40.6 81.7l-40.4 10.8c-7.1-25.8-17.8-47.8-32.2-65.4c-29.2-35.8-73-54.2-130.5-54.6c-57 .5-100.1 18.8-128.2 54.4C72.1 146.1 58.5 194.3 58 256c.5 61.7 14.1 109.9 40.3 143.3c28 35.6 71.2 53.9 128.2 54.4c51.4-.4 85.4-12.6 113.7-40.9c32.3-32.2 31.7-71.8 21.4-95.9c-6.1-14.2-17.1-26-31.9-34.9c-3.7 26.9-11.8 48.3-24.7 64.8c-17.1 21.8-41.4 33.6-72.7 35.3c-23.6 1.3-46.3-4.4-63.9-16c-20.8-13.8-33-34.8-34.3-59.3c-2.5-48.3 35.7-83 95.2-86.4c21.1-1.2 40.9-.3 59.2 2.8c-2.4-14.8-7.3-26.6-14.6-35.2c-10-11.7-25.6-17.7-46.2-17.8H227c-16.6 0-39 4.6-53.3 26.3l-34.4-23.6c19.2-29.1 50.3-45.1 87.8-45.1h.8c62.6 .4 99.9 39.5 103.7 107.7l-.2 .2zm-156 68.8c1.3 25.1 28.4 36.8 54.6 35.3c25.6-1.4 54.6-11.4 59.5-73.2c-13.2-2.9-27.8-4.4-43.4-4.4c-4.8 0-9.6 .1-14.4 .4c-42.9 2.4-57.2 23.2-56.2 41.8l-.1 .1z"/></svg>'
        ),
        'facebook' => array(
            'name' => 'Facebook',
            'color_class' => 'canvon-fb-facebook',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M512 256C512 114.6 397.4 0 256 0S0 114.6 0 256C0 376 82.7 476.8 194.2 504.5V334.2H141.4V256h52.8V222.3c0-87.1 39.4-127.5 125-127.5c16.2 0 44.2 3.2 55.7 6.4V172c-6-.6-16.5-1-29.6-1c-42 0-58.2 15.9-58.2 57.2V256h83.6l-14.4 78.2H287V510.1C413.8 494.8 512 386.9 512 256h0z"/></svg>'
        ),
        'instagram' => array(
            'name' => 'Instagram',
            'color_class' => 'canvon-fb-instagram',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"/></svg>'
        ),
        'youtube' => array(
            'name' => 'YouTube',
            'color_class' => 'canvon-fb-youtube',
            'svg' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"/></svg>'
        )
    );
}

// Display floating buttons
function canvon_fb_display_floating_buttons() {
    // Set up preview transient override first — needed for all $canvon_fb_pget() calls below
    // phpcs:ignore WordPress.Security.NonceVerification.Recommended -- Read-only preview token lookup; no state change is performed here.
    $canvon_fb_preview_token = isset( $_GET['canvon_fb_preview'] ) ? preg_replace( '/[^a-zA-Z0-9]/', '', sanitize_text_field( wp_unslash( $_GET['canvon_fb_preview'] ) ) ) : '';
    $canvon_fb_preview_data  = $canvon_fb_preview_token ? get_transient( 'canvon_fb_preview_' . $canvon_fb_preview_token ) : false;
    $canvon_fb_pget = function( $canvon_fb_key, $canvon_fb_default = false ) use ( $canvon_fb_preview_data ) {
        return ( $canvon_fb_preview_data && array_key_exists( $canvon_fb_key, $canvon_fb_preview_data ) ) ? $canvon_fb_preview_data[ $canvon_fb_key ] : get_option( $canvon_fb_key, $canvon_fb_default );
    };

    // Get selected platforms (uses transient in preview mode, DB otherwise)
    $canvon_fb_selected_platforms = $canvon_fb_pget('canvon_fb_selected_platforms', '');
    if (empty($canvon_fb_selected_platforms)) {
        return; // No platforms selected
    }

    $canvon_fb_platforms_array = array_values( array_filter( explode( ',', $canvon_fb_selected_platforms ), function( $canvon_fb_p ) {
        return !empty( trim( $canvon_fb_p ) );
    } ) );
    if ( empty( $canvon_fb_platforms_array ) ) {
        return;
    }

    $canvon_fb_platforms = canvon_fb_get_platform_data();

    // Only count platforms that actually exist in platform data
    $canvon_fb_valid_platforms = array_filter( $canvon_fb_platforms_array, function( $canvon_fb_p ) use ( $canvon_fb_platforms ) {
        return isset( $canvon_fb_platforms[ trim( $canvon_fb_p ) ] );
    } );
    $canvon_fb_button_count = count( $canvon_fb_valid_platforms );

    $canvon_fb_position = $canvon_fb_pget('canvon_fb_button_position', 'right');
    $canvon_fb_size = $canvon_fb_pget('canvon_fb_button_size', 'M');
    $canvon_fb_shape = $canvon_fb_pget('canvon_fb_button_shape', 'round');
    $canvon_fb_color = $canvon_fb_pget('canvon_fb_button_color', '#0D99FF');
    $canvon_fb_widget_icon = $canvon_fb_pget('canvon_fb_widget_icon', 'info');
    $canvon_fb_widget_text = $canvon_fb_pget('canvon_fb_widget_icon_text', '');
    $canvon_fb_widget_text_show = $canvon_fb_pget('canvon_fb_widget_icon_text_show', false);
    $canvon_fb_offset_style = apply_filters( 'canvon_fb_frontend_offset_style', '', $canvon_fb_pget, $canvon_fb_position );

    // Widget icon SVGs
    $canvon_fb_widget_icons = array(
        'info'    => file_get_contents( CANVON_FB_PLUGIN_DIR . 'assets/images/widget-icon-1.svg' ),
        'chat'    => file_get_contents( CANVON_FB_PLUGIN_DIR . 'assets/images/widget-icon-2.svg' ),
        'message' => file_get_contents( CANVON_FB_PLUGIN_DIR . 'assets/images/widget-icon-3.svg' ),
        'contact' => file_get_contents( CANVON_FB_PLUGIN_DIR . 'assets/images/widget-icon-4.svg' ),
    );

    $canvon_fb_widget_icon_svg = isset( $canvon_fb_widget_icons[ $canvon_fb_widget_icon ] ) ? $canvon_fb_widget_icons[ $canvon_fb_widget_icon ] : $canvon_fb_widget_icons['info'];
    $canvon_fb_widget_icon_svg = apply_filters( 'canvon_fb_frontend_widget_icon_svg', $canvon_fb_widget_icon_svg, $canvon_fb_widget_icon, $canvon_fb_pget, $canvon_fb_widget_icons );

    $canvon_fb_wechat_contacts = array();

    ?>
    <div class="canvon-fb-preview-icons <?php echo ( $canvon_fb_button_count <= 1 ) ? 'expanded' : ''; ?>"
         data-position="<?php echo esc_attr($canvon_fb_position); ?>"
         data-size="<?php echo esc_attr($canvon_fb_size); ?>"
         data-shape="<?php echo esc_attr($canvon_fb_shape); ?>"
         data-color="<?php echo esc_attr($canvon_fb_color); ?>"
         data-widget-icon="<?php echo esc_attr($canvon_fb_widget_icon); ?>"
         <?php if ( $canvon_fb_offset_style ) : ?>style="<?php echo esc_attr($canvon_fb_offset_style); ?>"<?php endif; ?>>
        <?php if ($canvon_fb_button_count > 1): ?>
            <?php if ($canvon_fb_widget_text_show && !empty($canvon_fb_widget_text)): ?>
                <div class="canvon-fb-widget-with-text" style="flex-direction: <?php echo esc_attr( $canvon_fb_position === 'right' ? 'row-reverse' : 'row' ); ?>;">
                    <div class="canvon-fb-preview-info-icon" data-collapsed="true" style="background-color: <?php echo esc_attr($canvon_fb_color); ?>;">
                        <?php echo wp_kses( $canvon_fb_widget_icon_svg, canvon_fb_get_icon_kses_allowed_html() ); ?>
                    </div>
                    <div class="canvon-fb-widget-text"><?php echo esc_html($canvon_fb_widget_text); ?></div>
                </div>
            <?php else: ?>
                <div class="canvon-fb-preview-info-icon" data-collapsed="true" style="background-color: <?php echo esc_attr($canvon_fb_color); ?>;">
                    <?php echo wp_kses( $canvon_fb_widget_icon_svg, canvon_fb_get_icon_kses_allowed_html() ); ?>
                </div>
            <?php endif; ?>
        <?php endif; ?>

        <?php foreach ($canvon_fb_platforms_array as $canvon_fb_platform):
            $canvon_fb_platform = trim($canvon_fb_platform);
            if (!isset($canvon_fb_platforms[$canvon_fb_platform])) {
                continue;
            }

            $canvon_fb_url      = $canvon_fb_pget('canvon_fb_' . $canvon_fb_platform . '_url', '');
            $canvon_fb_href     = function_exists( 'canvon_fb_build_platform_href' ) ? canvon_fb_build_platform_href( $canvon_fb_platform, $canvon_fb_url ) : $canvon_fb_url;
            $canvon_fb_wechat_qr_url = 'wechat' === $canvon_fb_platform ? $canvon_fb_pget( 'canvon_fb_wechat_qr_code_url', '' ) : '';
            $canvon_fb_show_on  = $canvon_fb_pget('canvon_fb_' . $canvon_fb_platform . '_show_on', 'both');
            $canvon_fb_show_on  = function_exists( 'canvon_fb_sanitize_show_on_value' ) ? canvon_fb_sanitize_show_on_value( $canvon_fb_show_on ) : $canvon_fb_show_on;
            $canvon_fb_platform_data = $canvon_fb_platforms[$canvon_fb_platform];

            if ( 'wechat' === $canvon_fb_platform && ( ! empty( $canvon_fb_url ) || ! empty( $canvon_fb_wechat_qr_url ) ) ) {
                $canvon_fb_modal_id = 'canvon-fb-wechat-contact-' . count( $canvon_fb_wechat_contacts );
                $canvon_fb_wechat_contacts[] = array(
                    'id'      => $canvon_fb_modal_id,
                    'wechat'  => $canvon_fb_url,
                    'qr_url'  => $canvon_fb_wechat_qr_url,
                );
                ?>
                <button type="button"
                        class="canvon-fb-preview-icon <?php echo esc_attr($canvon_fb_platform_data['color_class']); ?>"
                        aria-label="<?php echo esc_attr($canvon_fb_platform_data['name']); ?>"
                        data-canvon-fb-wechat-modal="<?php echo esc_attr( $canvon_fb_modal_id ); ?>"
                        <?php if ($canvon_fb_show_on !== 'both') : ?>data-show-on="<?php echo esc_attr($canvon_fb_show_on); ?>"<?php endif; ?>>
                    <?php echo wp_kses( $canvon_fb_platform_data['svg'], canvon_fb_get_icon_kses_allowed_html() ); ?>
                </button>
                <?php
                continue;
            }

            // Show button even without URL (like preview does)
            if (!empty($canvon_fb_href)) {
                $canvon_fb_allowed_protocols = array( 'http', 'https', 'mailto', 'tel', 'weixin' );
                // Has URL - make it a clickable link
                ?>
                <a href="<?php echo esc_url( $canvon_fb_href, $canvon_fb_allowed_protocols ); ?>"
                   target="_blank"
                   rel="noopener noreferrer"
                   class="canvon-fb-preview-icon <?php echo esc_attr($canvon_fb_platform_data['color_class']); ?>"
                   aria-label="<?php echo esc_attr($canvon_fb_platform_data['name']); ?>"
                   <?php if ($canvon_fb_show_on !== 'both') : ?>data-show-on="<?php echo esc_attr($canvon_fb_show_on); ?>"<?php endif; ?>>
                    <?php echo wp_kses( $canvon_fb_platform_data['svg'], canvon_fb_get_icon_kses_allowed_html() ); ?>
                </a>
                <?php
            } else {
                // No URL - show as non-clickable div
                ?>
                <div class="canvon-fb-preview-icon <?php echo esc_attr($canvon_fb_platform_data['color_class']); ?>"
                     aria-label="<?php echo esc_attr($canvon_fb_platform_data['name']); ?>"
                     <?php if ($canvon_fb_show_on !== 'both') : ?>data-show-on="<?php echo esc_attr($canvon_fb_show_on); ?>"<?php endif; ?>>
                    <?php echo wp_kses( $canvon_fb_platform_data['svg'], canvon_fb_get_icon_kses_allowed_html() ); ?>
                </div>
                <?php
            }
        endforeach; ?>

        <?php if ($canvon_fb_button_count > 1): ?>
            <div class="canvon-fb-preview-close" style="background-color: <?php echo esc_attr($canvon_fb_color); ?>;">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2">
                    <line x1="18" y1="6" x2="6" y2="18"></line>
                    <line x1="6" y1="6" x2="18" y2="18"></line>
                </svg>
            </div>
        <?php endif; ?>
    </div>
    <?php foreach ( $canvon_fb_wechat_contacts as $canvon_fb_contact ) : ?>
        <div class="canvon-fb-wechat-contact-modal" id="<?php echo esc_attr( $canvon_fb_contact['id'] ); ?>" aria-hidden="true">
            <div class="canvon-fb-wechat-contact-backdrop" data-canvon-fb-wechat-close></div>
            <div class="canvon-fb-wechat-contact-panel" role="dialog" aria-modal="true" aria-label="WeChat contact">
                <button type="button" class="canvon-fb-wechat-contact-close" data-canvon-fb-wechat-close aria-label="Close WeChat contact">&times;</button>
                <h2>WeChat</h2>
                <?php if ( ! empty( $canvon_fb_contact['qr_url'] ) ) : ?>
                    <img class="canvon-fb-wechat-contact-qr" src="<?php echo esc_url( $canvon_fb_contact['qr_url'] ); ?>" alt="WeChat QR code">
                <?php endif; ?>
                <?php if ( ! empty( $canvon_fb_contact['wechat'] ) ) : ?>
                    <p class="canvon-fb-wechat-contact-label">WeChat ID</p>
                    <div class="canvon-fb-wechat-contact-id">
                        <code><?php echo esc_html( $canvon_fb_contact['wechat'] ); ?></code>
                        <button type="button" data-canvon-fb-copy-wechat="<?php echo esc_attr( $canvon_fb_contact['wechat'] ); ?>">Copy</button>
                    </div>
                <?php endif; ?>
                <p class="canvon-fb-wechat-contact-note">Search this ID in WeChat or scan the QR code with the WeChat app.</p>
            </div>
        </div>
    <?php endforeach; ?>
    <?php
}
add_action('wp_footer', 'canvon_fb_display_floating_buttons');
