<?php
// Exit if accessed directly to ensure security.
if (!defined('ABSPATH')) {
    exit;
}

$integration_name = "Integration #" . ($IAFWZCAI_Field_MappingDBInstance->getFieldMappingTotalCount() + 1);

?>
<!-- Setup Popup Overlay -->
<div id="iafwzcai-setup-popupOverlay" class="iafwzcai-setup-popup-overlay">
    <div class="iafwzcai-setup-popup-content">
        <!-- Close Button -->
        <span class="iafwzcai-setup-close" onclick="window.location.href='<?php echo esc_url(admin_url('admin.php?page=integrate-with-zoho-campaigns&tab=setup')); ?>'">&times;</span>

        <h3 class="iafwzcai-setup-popup-title">
            <?php esc_html_e('Add Integration', 'integrate-with-zoho-campaigns'); ?>
        </h3>

        <div class="iafwzcai-setup-menu">
            <table class="iafwzcai-setup-table">
                <!-- Integration Name -->
                <tr class="iafwzcai-setup-row">
                    <td class="iafwzcai-setup-title"><?php esc_html_e('Integration Name:', 'integrate-with-zoho-campaigns'); ?>
                        <div class="iafwzcai-help-icon-wrapper">
                            <span class="iafwzcai-help-icon">?</span>
                            <div class="iafwzcai-help-tooltip">
                                <p>A unique name to identify this integration.</p>
                            </div>
                        </div>
                    </td>
                    <td>
                        <input type="text" class="iafwzcai-setup-input" id="iafwzcai-setup-integrationName" placeholder="Enter integration name" value="<?php echo esc_attr($integration_name); ?>">
                    </td>
                </tr>

                <!-- Form Name -->
                <tr class="iafwzcai-setup-row">
                    <td class="iafwzcai-setup-title"><?php esc_html_e('Select Form:', 'integrate-with-zoho-campaigns'); ?>
                        <div class="iafwzcai-help-icon-wrapper">
                            <span class="iafwzcai-help-icon">?</span>
                            <div class="iafwzcai-help-tooltip">
                                <span>Select a form to integrate with Zoho Campaigns for data syncing.</span>
                            </div>
                        </div>
                    </td>
                    <td>
                        <select name="formName" class="iafwzcai-setup-input" id="iafwzcai-setup-formName" onchange="iafwzcai_handleFormChange()">
                            <option value=""><?php esc_html_e('Select', 'integrate-with-zoho-campaigns'); ?></option>
                            <?php foreach ($form_group_list as $group_id => $group_data): ?>
                                <optgroup label="<?php echo esc_attr($group_data['form_group_name']); ?>">
                                    <?php foreach ($group_data['forms'] as $form): ?>
                                        <option value="<?php echo esc_attr($group_id . '_' . $form['id']); ?>">
                                            <?php echo esc_html($form['name']); ?>
                                        </option>
                                    <?php endforeach; ?>
                                </optgroup>
                            <?php endforeach; ?>
                        </select>
                    </td>
                </tr>

                <!-- Account Name -->
                <tr class="iafwzcai-setup-row">
                    <td class="iafwzcai-setup-title"><?php esc_html_e('Select Account:', 'integrate-with-zoho-campaigns'); ?>
                        <div class="iafwzcai-help-icon-wrapper">
                            <span class="iafwzcai-help-icon">?</span>
                            <div class="iafwzcai-help-tooltip">
                                <span>
                                    Select the Zoho account to push data.</span>
                            </div>
                        </div>
                    </td>
                    <td>
                        <select name="accountName" class="iafwzcai-setup-input" id="iafwzcai-setup-accountName" onchange="iafwzcai_handleAccountChange()">
                            <option value=""><?php esc_html_e('Select', 'integrate-with-zoho-campaigns'); ?></option>
                            <?php
                            // Loop through the account list and display each account directly
                            foreach ($account_group_list as $account) {
                                $account_name = isset($account['account_name']) ? $account['account_name'] : '';
                                $account_id = isset($account['account_id']) ? $account['account_id'] : '';
                            ?>
                                <option value="<?php echo esc_attr($account_id); ?>">
                                    <?php echo esc_html($account_name); ?>
                                </option>
                            <?php } ?>
                        </select>

                    </td>
                </tr>

                <!-- Module Name -->
                <tr class="iafwzcai-setup-row">
                    <td class="iafwzcai-setup-title"><?php esc_html_e('Select List:', 'integrate-with-zoho-campaigns'); ?>
                        <div class="iafwzcai-help-icon-wrapper">
                            <span class="iafwzcai-help-icon">?</span>
                            <div class="iafwzcai-help-tooltip">
                                <span>Choose the list in Zoho Campaigns to store the submitted data.</span>
                            </div>
                        </div>
                    </td>
                    <td>
                        <select name="moduleName" class="iafwzcai-setup-input" id="iafwzcai-setup-moduleName" onchange="iafwzcai_handleModuleChange()">
                            <option value=""><?php esc_html_e('Select', 'integrate-with-zoho-campaigns'); ?></option>
                        </select>
                    </td>
                </tr>
            </table>
        </div>

        <!-- Alert Text -->
        <div class="iafwzcai-setup-loading-text">
            <p></p>
        </div>


        <div id="iafwzcai-setup-fieldMapping-area" style="display:none;">
            <!-- Field Mapping -->
            <div id="iafwzcai-setup-fieldMapping" style="margin-top:30px;" class="iafwzcai-setup-menu">
                <table id="iafwzcai-setup-fieldMapping-table" class="iafwzcai-setup-table">
                    <thead>
                        <tr>
                            <th class="iafwzcai-setup-th" width="43%"><?php esc_html_e('Select Form Fields', 'integrate-with-zoho-campaigns'); ?>
                                <div class="iafwzcai-help-icon-wrapper">
                                    <span class="iafwzcai-help-icon">?</span>
                                    <div class="iafwzcai-help-tooltip">
                                        <span>Select the form field to map with Zoho Campaigns fields.</span>
                                    </div>
                                </div>
                            </th>
                            <th class="iafwzcai-setup-th" width="43%"><?php esc_html_e('Select Campaigns Fields', 'integrate-with-zoho-campaigns'); ?>
                                <div class="iafwzcai-help-icon-wrapper">
                                    <span class="iafwzcai-help-icon">?</span>
                                    <div class="iafwzcai-help-tooltip">
                                        <span>Choose the Zoho Campaigns field to map with the selected form field.</span>
                                    </div>
                                </div>
                            </th>
                            <th class="iafwzcai-setup-th" style="border: none; background: none;"></th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>

            <!-- Filter Container -->
            <div class="iafwzcai-setup-filter-container">
                <!-- Filter Header -->
                <div class="iafwzcai-setup-filter-header" onclick="iafwzcai_toggleFilterArea()">
                    <p class="iafwzcai-setup-note-heading">Filter Criteria</p>
                    <span id="iafwzcai-setup-filter-arrow" class="iafwzcai-setup-filter-header-arrow">▼</span>
                </div>

                <!-- Filter Content -->
                <div class="iafwzcai-setup-filter-content">
                    <div class="iafwzcai-setup-filter-clear-all" onclick="iafwzcai_clearAll()">Clear All</div>
                    <div id="iafwzcai-setup-filter-group-container" class="iafwzcai-setup-filter-group-container">
                        <div class="iafwzcai-setup-filter-group">
                            <div class="iafwzcai-setup-filter-row">
                                <select class="iafwzcai-setup-filter-field">
                                    <option value="" disabled selected>Select Field</option>
                                </select>
                                <select class="iafwzcai-setup-filter-condition">
                                    <option value="" disabled selected>Choose Condition</option>
                                    <option value="contains">Contains</option>
                                    <option value="not_contains">Does Not Contain</option>
                                    <option value="equals">Equals</option>
                                    <option value="not_equals">Does Not Equal</option>
                                    <option value="starts_with">Starts With</option>
                                    <option value="ends_with">Ends With</option>
                                    <option value="greater_than">Greater Than</option>
                                    <option value="less_than">Less Than</option>
                                    <option value="is_empty">Is Empty</option>
                                    <option value="is_not_empty">Is Not Empty</option>
                                </select>
                                <input type="text" class="iafwzcai-setup-filter-value" placeholder="Enter value" />
                                <div class="iafwzcai-setup-filter-actions">
                                    <button class="iafwzcai-setup-filter-add-icon" onclick="iafwzcai_addFilter(this)">+</button>
                                    <button class="iafwzcai-setup-filter-close-icon" onclick="iafwzcai_removeFilter(this)">×</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Filter Container -->
            <div class="iafwzcai-setup-note">
                <p><strong>Note:</strong> If <em>Double Opt-in</em> is enabled, Zoho Campaigns will send a confirmation email to the user. The contact will be added to the list only after they confirm. To add contacts directly without confirmation, disable <em>Double Opt-in</em> under <strong>Settings &gt; General &gt; Manage Opt-in</strong>.</p>

            </div>
            <!-- Submit Button -->
            <div class="iafwzcai-auth-button-container" id="iafwzcai-setup-button">
                <button type="submit" class="iafwzcai-auth-button" onclick="iafwzcai_handleButtonClick(this)">
                    <?php esc_html_e('Save Mapping', 'integrate-with-zoho-campaigns'); ?>
                </button>
            </div>
        </div>
    </div>
</div>