<?php
function easychat_onboarding_e($value) {
    return htmlspecialchars((string)$value, ENT_QUOTES, 'UTF-8');
}

$gift_status = isset($onboarding_gift_status) ? (string)$onboarding_gift_status : '';
$gift_email = isset($onboarding_gift_email) ? (string)$onboarding_gift_email : '';
$gift_locked = isset($onboarding_gift_locked) && (string)$onboarding_gift_locked === '1';
$news_email = isset($onboarding_news_email) ? (string)$onboarding_news_email : $gift_email;
$services_checked = isset($onboarding_services_consent) && (string)$onboarding_services_consent === '1';
$install_code = isset($onboarding_install_code) ? (string)$onboarding_install_code : '';
$news_checked = isset($onboarding_news_consent) && (string)$onboarding_news_consent === '1';
$onboarding_locale = $easychat_locale ?? 'ru';
$gift_title = $gift_status === 'issued'
    ? easychat_t('onboarding.gift_issued_title', [], $onboarding_locale)
    : easychat_t('onboarding.gift_title', [], $onboarding_locale);
$gift_text = $gift_status === 'issued'
    ? easychat_t('onboarding.gift_issued_text', [], $onboarding_locale)
    : easychat_t('onboarding.gift_text', [], $onboarding_locale);
$onboarding_i18n = array(
    'newsEmailRequired' => easychat_t('onboarding.news_email_required', [], $onboarding_locale),
    'saving' => easychat_t('onboarding.saving', [], $onboarding_locale),
    'skipSaving' => easychat_t('onboarding.skip_saving', [], $onboarding_locale),
    'savingButton' => easychat_t('onboarding.saving_button', [], $onboarding_locale),
    'saved' => easychat_t('onboarding.saved', [], $onboarding_locale),
    'giftIssued' => easychat_t('onboarding.gift_issued_done', [], $onboarding_locale),
    'giftRetryLater' => easychat_t('onboarding.gift_retry_later', [], $onboarding_locale),
    'installCodeRetryLater' => easychat_t('onboarding.install_code_retry_later', [], $onboarding_locale),
    'saveFailed' => easychat_t('onboarding.save_failed', [], $onboarding_locale),
    'networkError' => easychat_t('onboarding.network_error', [], $onboarding_locale),
    'submitLabel' => easychat_t('onboarding.submit', [], $onboarding_locale),
    'skipLabel' => easychat_t('onboarding.skip', [], $onboarding_locale),
    'waitLabel' => easychat_t('onboarding.wait', [], $onboarding_locale),
);
?>
<div class="onboarding-page">
    <main class="onboarding-shell" aria-labelledby="onboarding-title">
        <div class="onboarding-card">
            <div class="onboarding-accent"></div>
            <div class="onboarding-head">
                <div class="onboarding-mark"><i class="fa fa-comments" aria-hidden="true"></i></div>
                <div>
                    <p class="onboarding-kicker"><?php echo easychat_onboarding_e(easychat_t('onboarding.kicker', [], $onboarding_locale)); ?></p>
                    <h1 id="onboarding-title"><?php echo easychat_onboarding_e(easychat_t('onboarding.title', [], $onboarding_locale)); ?></h1>
                    <p class="onboarding-lead"><?php echo easychat_onboarding_e(easychat_t('onboarding.lead', [], $onboarding_locale)); ?></p>
                </div>
            </div>

            <form id="onboarding-form" class="onboarding-form" method="post">
                <input type="hidden" name="csrf_token" value="<?php echo easychat_onboarding_e($easychat_csrf_token ?? ''); ?>">

                <div class="install-options onboarding-options">
                    <div class="install-option-card install-option-card-primary onboarding-option-card<?php echo $gift_locked ? ' onboarding-option-muted' : ''; ?>">
                        <div class="install-option-icon"><i class="fa fa-bolt" aria-hidden="true"></i></div>
                        <div class="install-option-content">
                            <div class="install-option-title"><?php echo easychat_onboarding_e($gift_title); ?></div>
                            <div class="install-option-text"><?php echo easychat_onboarding_e($gift_text); ?></div>
                            <div class="install-option-field">
                                <label class="form-label text-muted small" for="onboarding-admin-email"><?php echo easychat_onboarding_e(easychat_t('onboarding.gift_email_label', [], $onboarding_locale)); ?></label>
                                <input type="email" class="form-control bg-dark border-secondary text-white px-3 py-2" id="onboarding-admin-email" name="admin_email" value="<?php echo easychat_onboarding_e($gift_email); ?>" placeholder="owner@example.ru"<?php echo $gift_locked ? ' disabled' : ''; ?>>
                            </div>
                        </div>
                        <label class="install-switch" for="onboarding-claim-gift">
                            <input type="hidden" name="claim_easytokens_gift" value="0">
                            <input type="checkbox" name="claim_easytokens_gift" value="1" id="onboarding-claim-gift"<?php echo $gift_locked ? ' disabled' : ' checked'; ?>>
                            <span></span>
                        </label>
                    </div>

                    <div class="install-option-card onboarding-option-card">
                        <div class="install-option-icon"><i class="fa fa-comments" aria-hidden="true"></i></div>
                        <div class="install-option-content">
                            <div class="install-option-title"><?php echo easychat_onboarding_e(easychat_t('onboarding.start_ai_title', [], $onboarding_locale)); ?> <span class="install-option-badge"><?php echo easychat_onboarding_e(easychat_t('onboarding.recommended', [], $onboarding_locale)); ?></span></div>
                            <div class="install-option-text"><?php echo easychat_onboarding_e(easychat_t('onboarding.start_ai_text', [], $onboarding_locale)); ?></div>
                        </div>
                        <label class="install-switch" for="onboarding-start-ai">
                            <input type="hidden" name="start_ai_consultant" value="0">
                            <input type="checkbox" name="start_ai_consultant" value="1" id="onboarding-start-ai" checked>
                            <span></span>
                        </label>
                    </div>

                    <div class="install-option-card onboarding-option-card">
                        <div class="install-option-icon"><i class="fa fa-mobile" aria-hidden="true"></i></div>
                        <div class="install-option-content">
                            <div class="install-option-title"><?php echo easychat_onboarding_e(easychat_t('onboarding.services_title', [], $onboarding_locale)); ?> <span class="install-option-badge"><?php echo easychat_onboarding_e(easychat_t('onboarding.recommended', [], $onboarding_locale)); ?></span></div>
                            <div class="install-option-text"><?php echo easychat_onboarding_e(easychat_t('onboarding.services_text', [], $onboarding_locale)); ?></div>
                            <div class="install-option-note"><?php echo easychat_onboarding_e(easychat_t('onboarding.services_note', [], $onboarding_locale)); ?></div>
                            <div class="install-option-field">
                                <label class="form-label text-muted small" for="onboarding-install-code"><?php echo easychat_onboarding_e(easychat_t('onboarding.install_code_label', [], $onboarding_locale)); ?></label>
                                <input type="text" class="form-control bg-dark border-secondary text-white px-3 py-2" id="onboarding-install-code" name="install_code" value="<?php echo easychat_onboarding_e($install_code); ?>" placeholder="EC-ABCD-2345" maxlength="12" autocomplete="one-time-code" autocapitalize="characters" spellcheck="false">
                                <small class="form-text text-muted"><?php echo easychat_onboarding_e(easychat_t('onboarding.install_code_help', [], $onboarding_locale)); ?></small>
                            </div>
                        </div>
                        <label class="install-switch" for="onboarding-services-consent">
                            <input type="hidden" name="easychat_services_consent" value="0">
                            <input type="checkbox" name="easychat_services_consent" value="1" id="onboarding-services-consent"<?php echo $services_checked ? ' checked' : ''; ?>>
                            <span></span>
                        </label>
                    </div>

                    <div class="install-option-card onboarding-option-card">
                        <div class="install-option-icon"><i class="fa fa-envelope-open" aria-hidden="true"></i></div>
                        <div class="install-option-content">
                            <div class="install-option-title"><?php echo easychat_onboarding_e(easychat_t('onboarding.news_title', [], $onboarding_locale)); ?></div>
                            <div class="install-option-text"><?php echo easychat_onboarding_e(easychat_t('onboarding.news_text', [], $onboarding_locale)); ?></div>
                            <div class="install-option-field<?php echo $news_checked ? '' : ' d-none'; ?>" id="onboarding-news-email-row">
                                <label class="form-label text-muted small" for="onboarding-news-email"><?php echo easychat_onboarding_e(easychat_t('onboarding.news_email_label', [], $onboarding_locale)); ?></label>
                                <input type="email" class="form-control bg-dark border-secondary text-white px-3 py-2" id="onboarding-news-email" name="easychat_news_email" value="<?php echo easychat_onboarding_e($news_email); ?>" placeholder="owner@example.ru">
                            </div>
                        </div>
                        <label class="install-switch" for="onboarding-news-consent">
                            <input type="hidden" name="easychat_news_consent" value="0">
                            <input type="checkbox" name="easychat_news_consent" value="1" id="onboarding-news-consent"<?php echo $news_checked ? ' checked' : ''; ?>>
                            <span></span>
                        </label>
                    </div>
                </div>

                <div id="onboarding-alert" class="alert d-none onboarding-alert" role="status"></div>

                <div class="onboarding-actions">
                    <button type="button" id="onboarding-skip" class="btn btn-outline-secondary px-4 py-2 text-white border-secondary">
                        <?php echo easychat_onboarding_e(easychat_t('onboarding.skip', [], $onboarding_locale)); ?>
                    </button>
                    <button type="submit" id="onboarding-submit" class="btn btn-success px-4 py-2">
                        <i class="fa fa-check me-2" aria-hidden="true"></i> <?php echo easychat_onboarding_e(easychat_t('onboarding.submit', [], $onboarding_locale)); ?>
                    </button>
                </div>
            </form>
        </div>
    </main>
</div>

<script>
    window.EasyChatOnboardingI18n = <?php echo json_encode($onboarding_i18n, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES | JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT); ?>;
</script>
<?php echo easychat_script_tag('js/views/onboarding.js'); ?>
