<?php

/**
 * Click to talk related code
 */
if ( !defined( 'ABSPATH' ) ) {
    exit;
}
$sapmfly_click_to_talk = get_option( 'sapmfly_click_to_talk', 'no' );
wp_localize_script( 'sapmfly-admin-script', 'sapmfly_click_talk_ajax', [
    'nonce' => wp_create_nonce( 'sapmfly_click_talk_popup_ajax' ),
] );
// Fetch value
$sapmfly_click_talk_heading = get_option( 'sapmfly_click_talk_popup_heading' );
$sapmfly_click_talk_subheading = get_option( 'sapmfly_click_talk_popup_subheading' );
$sapmfly_click_talk_highlight_text = get_option( 'sapmfly_click_talk_highlight_text' );
$sapmfly_click_talk_color_bg = get_option( 'sapmfly_click_talk_color_bg' );
$sapmfly_click_talk_agent_1_name = get_option( 'sapmfly_click_talk_agent_1_name' );
$sapmfly_click_talk_agent_1_designation = get_option( 'sapmfly_click_talk_agent_1_designation' );
$sapmfly_click_talk_agent_1_number = get_option( 'sapmfly_click_talk_agent_1_number' );
$sapmfly_click_talk_agent_2_name = get_option( 'sapmfly_click_talk_agent_2_name' );
$sapmfly_click_talk_agent_2_designation = get_option( 'sapmfly_click_talk_agent_2_designation' );
$sapmfly_click_talk_agent_2_number = get_option( 'sapmfly_click_talk_agent_2_number' );
$sapmfly_click_talk_agent_3_name = get_option( 'sapmfly_click_talk_agent_3_name' );
$sapmfly_click_talk_agent_3_designation = get_option( 'sapmfly_click_talk_agent_3_designation' );
$sapmfly_click_talk_agent_3_number = get_option( 'sapmfly_click_talk_agent_3_number' );
?>

<div class="click-talk-wrap toggle-block-bg">

    <label class="sapmfly-switch-update">
        <div class="click-talk-header toggle-header">
            <?php 
echo esc_html__( 'Enable click to talk widget', 'minifly' );
?>
            <input type="checkbox" class="sapmfly-setting-toggle" name="sapmfly_click_to_talk"
                <?php 
checked( $sapmfly_click_to_talk, 'yes' );
?> />
            <span class="sapmfly-slider"></span>
        </div>
    </label>

    <div class="sapmfly-toggle-resource-body">
        <div class="sapmfly-adjust" onclick="miniflyClickTalkPopup(); return false;">
            <p><?php 
echo esc_html__( 'Configure Details', 'minifly' );
?></p>
        </div>
        <div class="sapmfly-docs">
            <p>
                <a href="#" target="_blank">
                    <?php 
echo esc_html__( 'Docs', 'minifly' );
?>
                </a>
            </p>
        </div>
        <div class="sapmfly-tags">
            <p><?php 
echo esc_html__( 'New Feature', 'minifly' );
?></p>
        </div>
    </div>

</div>

<!-- Overlay -->
<div id="sapmfly-overlay" class="sapmfly-overlay"></div>

<!-- Click to Talk Popup -->
<div id="sapmfly-click-to-talk-block" class="sapmfly-click-to-talk-area">

    <div class="sapmfly-click-talk-popup-success" style="display: none;">
        <?php 
echo esc_html__( 'Settings saved successfully!', 'minifly' );
?>
    </div>

    <div id="sapmfly-admin-notice-talk" class="sapmfly-notice" style="display:none;"></div>

    <?php 
if ( $sapmfly_click_to_talk == 'yes' ) {
    ?>
        <!-- Section title -->
        <h3><?php 
    echo esc_html__( 'Add necessary details carefully', 'minifly' );
    ?></h3>
        <span class="sapmfly-popup-close-btn">&times;</span>

        <?php 
    ?>
            <!-- Header -->
            <div class="click-chat-header">

                <div class="click-chat-header-group">
                    <label><?php 
    echo esc_html__( 'Popup Heading:', 'minifly' );
    ?></label>
                    <input type="text" id="sapmfly_click_talk_popup_heading" name="sapmfly_click_talk_popup_heading" placeholder="<?php 
    echo esc_attr( $sapmfly_click_talk_heading );
    ?>" value="<?php 
    echo esc_attr( $sapmfly_click_talk_heading );
    ?>">
                </div>

                <div class="click-chat-header-group">
                    <label><?php 
    echo esc_html__( 'Popup Subtitle:', 'minifly' );
    ?></label>
                    <input type="text" id="sapmfly_click_talk_popup_subheading" name="sapmfly_click_talk_popup_subheading" placeholder="<?php 
    echo esc_attr( $sapmfly_click_talk_subheading );
    ?>" value="<?php 
    echo esc_attr( $sapmfly_click_talk_subheading );
    ?>">
                </div>

            </div>
            <hr />

            <div class="sapmfly-pro-available-label">
                <a href="https://brainywp.com/minifly/pricing/" target="_blank">
                    <p class="pro-label-href"><?php 
    echo esc_html__( 'Available in PRO plan', 'minifly' );
    ?></p>
                    <!-- Reply Text -->
                    <div class="click-chat-promote">
                        <div class="click-chat-image-group">
                            <label><?php 
    echo esc_html__( 'QR Code Image:', 'minifly' );
    ?></label>
                            <input type="file" id="" accept="image/*" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Highlight Text:', 'minifly' );
    ?></label>
                            <input type="text" id="" name="" placeholder="The team typically replies in a few minutes" value="The team typically replies in a few minutes" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Background Color:', 'minifly' );
    ?></label>
                            <input type="color" id="" value="#2eb843" disabled>
                        </div>
                    </div>
                </a>
            </div>
            <hr />
            <!-- Agent 1 -->
            <div class="click-chat-agent">
                <div class="click-chat-agent-group">
                    <label><?php 
    echo esc_html__( 'Agent 1 Name:', 'minifly' );
    ?></label>
                    <input type="text" id="sapmfly_click_talk_agent_1_name" name="sapmfly_click_talk_agent_1_name" placeholder="<?php 
    echo esc_attr( $sapmfly_click_talk_agent_1_name );
    ?>" value="<?php 
    echo esc_attr( $sapmfly_click_talk_agent_1_name );
    ?>">
                </div>
                <div class="click-chat-agent-group">
                    <label><?php 
    echo esc_html__( 'Agent 1 Role:', 'minifly' );
    ?></label>
                    <input type="text" id="sapmfly_click_talk_agent_1_designation" name="sapmfly_click_talk_agent_1_designation" placeholder="<?php 
    echo esc_attr( $sapmfly_click_talk_agent_1_designation );
    ?>" value="<?php 
    echo esc_attr( $sapmfly_click_talk_agent_1_designation );
    ?>">
                </div>
                <div class="click-chat-agent-group">
                    <label><?php 
    echo esc_html__( 'Agent 1 Number:', 'minifly' );
    ?></label>
                    <input type="number" id="sapmfly_click_talk_agent_1_number" name="sapmfly_click_talk_agent_1_number" placeholder="<?php 
    echo esc_attr( $sapmfly_click_talk_agent_1_number );
    ?>" value="<?php 
    echo esc_attr( $sapmfly_click_talk_agent_1_number );
    ?>">
                </div>
                <div class="click-chat-image-group">
                    <label><?php 
    echo esc_html__( 'Agent 1 Image:', 'minifly' );
    ?></label>
                    <input type="file" id="sapmfly_click_talk_agent_1_image" accept="image/*">
                </div>
            </div>
            <hr />

            <div class="sapmfly-pro-available-label">
                <a href="https://brainywp.com/minifly/pricing/" target="_blank">
                    <p class="pro-label-href"><?php 
    echo esc_html__( 'Available in PRO plan', 'minifly' );
    ?></p>
                    <!-- Agent 2 -->
                    <div class="click-chat-agent">
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 2 Name:', 'minifly' );
    ?></label>
                            <input type="text" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 2 Role:', 'minifly' );
    ?></label>
                            <input type="text" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 2 Number:', 'minifly' );
    ?></label>
                            <input type="number" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-image-group">
                            <label><?php 
    echo esc_html__( 'Agent 2 Image:', 'minifly' );
    ?></label>
                            <input type="file" id="" accept="image/*" disabled>
                        </div>
                    </div>
                    <hr />
                    <!-- Agent 3 -->
                    <div class="click-chat-agent">
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 3 Name:', 'minifly' );
    ?></label>
                            <input type="text" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 3 Role:', 'minifly' );
    ?></label>
                            <input type="text" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 3 Number:', 'minifly' );
    ?></label>
                            <input type="number" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-image-group">
                            <label><?php 
    echo esc_html__( 'Agent 3 Image:', 'minifly' );
    ?></label>
                            <input type="file" id="" accept="image/*" disabled>
                        </div>
                    </div>
                </a>
            </div>
        <?php 
    ?>
    <?php 
} else {
    ?>

        <div class="sapmfly-toggle-blocked">
            <!-- Section title -->
            <h3><?php 
    echo esc_html__( 'Please toggle ON and save changes to add information', 'minifly' );
    ?></h3>
            <span class="sapmfly-popup-close-btn">&times;</span>

            <!-- Header -->
            <div class="click-chat-header">

                <div class="click-chat-header-group">
                    <label><?php 
    echo esc_html__( 'Popup Heading:', 'minifly' );
    ?></label>
                    <input type="text" id="" name="" placeholder="Talk With Us Now" value="Talk With Us Now" disabled>
                </div>

                <div class="click-chat-header-group">
                    <label><?php 
    echo esc_html__( 'Popup Subtitle:', 'minifly' );
    ?></label>
                    <input type="text" id="" name="" placeholder="Tap a member to chat instantly" value="Tap a member to chat instantly" disabled>
                </div>

            </div>
            <hr />

            <div class="sapmfly-pro-available-label">
                <a href="https://brainywp.com/minifly/pricing/" target="_blank">
                    <p class="pro-label-href"><?php 
    echo esc_html__( 'Available in PRO plan', 'minifly' );
    ?></p>
                    <!-- Reply Text -->
                    <div class="click-chat-promote">
                        <div class="click-chat-image-group">
                            <label><?php 
    echo esc_html__( 'QR Code Image:', 'minifly' );
    ?></label>
                            <input type="file" id="" accept="image/*" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Highlight Text:', 'minifly' );
    ?></label>
                            <input type="text" id="" name="" placeholder="The team typically replies in a few minutes" value="The team typically replies in a few minutes" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Background Color:', 'minifly' );
    ?></label>
                            <input type="color" id="" value="#2eb843" disabled>
                        </div>
                    </div>
                </a>
            </div>
            <hr />
            <!-- Agent 1 -->
            <div class="click-chat-agent">
                <div class="click-chat-agent-group">
                    <label><?php 
    echo esc_html__( 'Agent 1 Name:', 'minifly' );
    ?></label>
                    <input type="text" id="" name="" placeholder="Jhon Doe" value="Jhon Doe" disabled>
                </div>
                <div class="click-chat-agent-group">
                    <label><?php 
    echo esc_html__( 'Agent 1 Role:', 'minifly' );
    ?></label>
                    <input type="text" id="" name="" placeholder="Customer Support" value="Customer Support" disabled>
                </div>
                <div class="click-chat-agent-group">
                    <label><?php 
    echo esc_html__( 'Agent 1 Number:', 'minifly' );
    ?></label>
                    <input type="number" id="" name="" placeholder="123 456 78" value="123 456 78" disabled>
                </div>
                <div class="click-chat-image-group">
                    <label><?php 
    echo esc_html__( 'Agent 1 Image:', 'minifly' );
    ?></label>
                    <input type="file" id="" accept="image/*" disabled>
                </div>
            </div>
            <hr />

            <div class="sapmfly-pro-available-label">
                <a href="https://brainywp.com/minifly/pricing/" target="_blank">
                    <p class="pro-label-href"><?php 
    echo esc_html__( 'Available in PRO plan', 'minifly' );
    ?></p>
                    <!-- Agent 2 -->
                    <div class="click-chat-agent">
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 2 Name:', 'minifly' );
    ?></label>
                            <input type="text" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 2 Role:', 'minifly' );
    ?></label>
                            <input type="text" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 2 Number:', 'minifly' );
    ?></label>
                            <input type="number" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-image-group">
                            <label><?php 
    echo esc_html__( 'Agent 2 Image:', 'minifly' );
    ?></label>
                            <input type="file" id="" accept="image/*" disabled>
                        </div>
                    </div>
                    <hr />
                    <!-- Agent 3 -->
                    <div class="click-chat-agent">
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 3 Name:', 'minifly' );
    ?></label>
                            <input type="text" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 3 Role:', 'minifly' );
    ?></label>
                            <input type="text" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-agent-group">
                            <label><?php 
    echo esc_html__( 'Agent 3 Number:', 'minifly' );
    ?></label>
                            <input type="number" id="" name="" placeholder="" value="" disabled>
                        </div>
                        <div class="click-chat-image-group">
                            <label><?php 
    echo esc_html__( 'Agent 3 Image:', 'minifly' );
    ?></label>
                            <input type="file" id="" accept="image/*" disabled>
                        </div>
                    </div>
                </a>
            </div>
        </div>
    <?php 
}
?>
    <!-- Bottom Buttons -->
    <div class="sapmfly-click-talk-popup-actions">
        <button type="button" class="click-chat-save-btn"><?php 
echo esc_html__( 'Save', 'minifly' );
?></button>
        <button type="button" class="click-chat-clear-btn"><?php 
echo esc_html__( 'Clear', 'minifly' );
?></button>
        <button type="button" class="click-chat-close-btn"><?php 
echo esc_html__( 'Close', 'minifly' );
?></button>
    </div>

</div>