<?php
defined('ABSPATH') or die('No script kiddies please!!');
$selected_menu_templates = (!empty($ciws_account_settings['shortcode']['shortcode_template'])) ? esc_attr($ciws_account_settings['shortcode']['shortcode_template']) : 'ciws-template-1';
$button_fill_color = (!empty($ciws_account_settings['shortcode']['button_fill_color'])) ? esc_attr($ciws_account_settings['shortcode']['button_fill_color']) : '#5bd26d';
$button_text_color = (!empty($ciws_account_settings['shortcode']['button_title_color'])) ? esc_attr($ciws_account_settings['shortcode']['button_title_color']) : '#ffffff';
$ac_id = (!empty($account_id)) ? $account_id : '';
$ciws_shortcode = '[ciws id=' . $ac_id . ']';
$shortcode_customize = (!empty($ciws_account_settings['shortcode']['shortcode_customize_status'])) ? $ciws_account_settings['shortcode']['shortcode_customize_status'] : 0;
if ($shortcode_customize != 1) {
    $button_fill_color = '#5bd26d';
    $button_text_color = '#ffffff';
}

$button_fill_color1 = (!empty($ciws_account_settings['shortcode']['button_fill_color'])) ? esc_attr($ciws_account_settings['shortcode']['button_fill_color']) : '#5bd26d';
$button_text_color1 = (!empty($ciws_account_settings['shortcode']['button_title_color'])) ? esc_attr($ciws_account_settings['shortcode']['button_title_color']) : '#ffffff';


?>
<div class="ciws-settings-section" data-settings-ref="shortcode" style="display:none;">

    <div class="ciws-setting-flex">
        <div class="ciws-setting-left">
            <?php
            if (!empty($ac_id)) { ?>
            <div class="ciws-field-wrap">
                <label>
                    <?php esc_html_e('Shortcode', 'chat-in-website'); ?>
                </label>
                <div class="ciws-field ciws-checkbox-toggle">
                    <input name="ciws_settings[shortcode][short_code]" type="text"
                        value="<?php echo esc_attr($ciws_shortcode); ?>" required="required" readonly />
                </div>
            </div>
            <?php } ?>
            <div class="ciws-field-wrap">
                <label>
                    <?php esc_html_e('Button Heading', 'chat-in-website'); ?>
                </label>
                <div class="ciws-field ciws-checkbox-toggle">
                    <input name="ciws_settings[shortcode][button_heading]" type="text"
                        value="<?php echo (!empty($ciws_account_settings['shortcode']['button_heading'])) ? esc_attr($ciws_account_settings['shortcode']['button_heading']) : 'Need Helps? Chat with us'; ?>"
                        class="shortcode-button-heading" required="required" />
                </div>
            </div>

            <div class="ciws-field-wrap">
                <label>
                    <?php esc_html_e('Shortcode Templates', 'chat-in-website'); ?>
                </label>
                <div class="ciws-field ciws-checkbox-toggle">
                    <select name="ciws_settings[shortcode][shortcode_template]"
                        class="ciws-template-dropdown ciws-select-option">

                        <?php for ($i = 1; $i <= 3; $i++) {
                            ?>
                        <option value="ciws-template-<?php echo esc_attr($i); ?>"
                            <?php echo selected($selected_menu_templates, 'ciws-template-' . $i); ?>>
                            <?php esc_html_e('Template', 'chat-in-website'); ?>
                            <?php echo esc_html($i); ?>
                        </option>
                        <?php } ?>
                    </select>

                </div>
            </div>
            <div class="ciws-field-wrap">
                <label>
                    <?php esc_html_e('Customize Status', 'chat-in-website'); ?>
                </label>
                <div class="ciws-field ciws-checkbox-toggle">
                    <input type="checkbox" class="ciws-shortcode-customize-status"
                        name="ciws_settings[shortcode][shortcode_customize_status]" value="1"
                        <?php checked($shortcode_customize, '1'); ?> />
                    <label></label>
                </div>
            </div>
            <div
                class="ciws-field-wrap ciws-shortcode-customize-status-hide <?php echo ($shortcode_customize != 1) ? esc_attr("ciws-field-hide") : ''; ?>">
                <label>
                    <?php esc_html_e('Button Fill color', 'chat-in-website'); ?>
                </label>
                <div class="ciws-field">
                    <input type="text" name="ciws_settings[shortcode][button_fill_color]"
                        class="ciws-form-field ciws-colorpicker ciws-button-fill"
                        value="<?php echo (!empty($ciws_account_settings['shortcode']['button_fill_color'])) ? esc_attr($ciws_account_settings['shortcode']['button_fill_color']) : ''; ?>" />

                </div>
            </div>

            <div
                class="ciws-field-wrap ciws-shortcode-customize-status-hide <?php echo ($shortcode_customize != 1) ? esc_attr("ciws-field-hide") : ''; ?>">
                <label>
                    <?php esc_html_e('Button Title color', 'chat-in-website'); ?>
                </label>
                <div class="ciws-field ">
                    <input type="text" name="ciws_settings[shortcode][button_title_color]"
                        class="ciws-form-field ciws-colorpicker ciws-button-text-color"
                        value="<?php echo (!empty($ciws_account_settings['shortcode']['button_title_color'])) ? esc_attr($ciws_account_settings['shortcode']['button_title_color']) : ''; ?>" />

                </div>
            </div>
        </div>
        <?php
        $online_option = (!empty($account_details['account']['online'])) ? $account_details['account']['online'] : '1';
        ?>
        <div class="ciws-setting-right">
            <h2><?php esc_html_e('Preview', 'chat-in-website'); ?></h2>
            <div class="ciws-button-wrapper  ciws-preview-class <?php echo esc_attr($selected_menu_templates); ?>">
                <div class="ciws-button ciws-shortcode-btn-fill"
                    style="background:<?php echo esc_attr($button_fill_color); ?>;">
                    <a href="" class="ciws-btn-content-wrap ciws-computer-url"
                        style="color:<?php echo esc_attr($button_text_color); ?>;">
                        <div class="ciws-icon-wrap">
                            <img src="<?php echo esc_url(CIWS_IMG_DIR . '/ciws-whatsapp.svg'); ?>" alt="">
                        </div>
                        <div class="ciws-btn-info-wrap">
                            <div class="ciws-btn-info">
                                <div class="ciws-account-name">
                                    <?php echo esc_html((!empty($account_name)) ? $account_name : ''); ?>
                                </div>
                                <div class="ciws-status"><span><span></div>
                            </div>
                            <div class="ciws-btn-title">
                                <?php echo (!empty($account_details['shortcode']['button_heading'])) ? esc_attr($account_details['shortcode']['button_heading']) : 'Need Help? Chat with us'; ?>
                            </div>
                        </div>
                    </a>
                    <a href="" class="ciws-btn-content-wrap ciws-mobile-url"
                        style="color:<?php echo esc_attr($button_text_color); ?>;">
                        <div class="ciws-icon-wrap">
                            <img src="<?php echo esc_url(CIWS_IMG_DIR . '/ciws-whatsapp.svg'); ?>" alt="">
                        </div>
                        <div class="ciws-btn-info-wrap">
                            <div class="ciws-btn-info">
                                <div class="ciws-account-name">
                                    <?php echo esc_html((!empty($account_name)) ? $account_name : ''); ?>
                                </div>
                                <div class="ciws-status"><span><span></div>
                            </div>
                            <div class="ciws-btn-title">
                                <?php echo (!empty($account_details['shortcode']['button_heading'])) ? esc_html($account_details['shortcode']['button_heading']) : 'Need Help? Chat with us'; ?>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>


</div>