<?php
/**
 * @author 1902 Software
 * @copyright Copyright © 2023 1902 Software (https://1902software.com/magento/)
 * @package WriteTextAI_WriteTextAI
 */
?>

<?php
/**
 * @var WriteTextAI\WriteTextAI\Block\Adminhtml\Setup\Index $block
 */
?>

<div class="wtai-stepper-container">
    <div class="wtai-stepper-title"><?= $block->escapeHtml(__('Extension setup guide')) ?></div>
    <div class="wtai-stepper">
        <div class="wtai-step <?= /* @noEscape */ $block->getStepClass(1) ?>">
            <div class="wtai-indicator">
                <div class="wtai-circle">
                    <span><?= $block->escapeHtml('1') ?></span>
                </div>
                <div class="wtai-line"></div>
            </div>
            <div class="wtai-content">
                <div class="wtai-header">
                    <div class="wtai-title-container">
                        <div class="wtai-step-number"><?= $block->escapeHtml(__('Step 1')) ?></div>
                        <div class="wtai-step-title">
                            <?=$block->escapeHtml(__('Connect your WriteText.ai account')) ?>
                        </div>
                    </div>
                    <div class="wtai-completed-badge"><?= $block->escapeHtml(__('Completed')) ?></div>
                </div>
                <div class="wtai-content-content">
                    <p><?= /** @noEscape */ sprintf(
                        "%s <strong>%s</strong>", 
                        __('Link this site to your WriteText.ai account to start generating and publishing texts.'),
                        __('We only access your product and category details—never customer data.')) ?>
                    </p>
                    <div class="wtai-login-register">
                        <div class="wtai-account-name">
                            <a href="<?= $block->escapeHtmlAttr($block->getCurrentUrl()) ?>" target="_blank">
                                <?= $block->escapeHtml($block->getCurrentHost()) ?>
                            </a>
                        </div>
                        <button type="button" id="wtaiLoginRegisterButton">
                            <?= $block->escapeHtml(__('Log in / Sign up')) ?>
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <div class="wtai-step <?= /* @noEscape */ $block->getStepClass(2) ?>">
            <div class="wtai-indicator">
                <div class="wtai-circle">
                    <span><?= $block->escapeHtml('2') ?></span>
                </div>
                <div class="wtai-line"></div>
            </div>
            <div class="wtai-content">
                <div class="wtai-header">
                    <div class="wtai-title-container">
                        <div class="wtai-step-number"><?= $block->escapeHtml(__('Step 2')) ?></div>
                        <div class="wtai-step-title"><?= $block->escapeHtml(__('Map text fields')) ?></div>
                    </div>
                    <div class="wtai-completed-badge"><?= $block->escapeHtml(__('Completed')) ?></div>
                </div>
                <div class="wtai-content-content">
                    <p>
                        <b><?= /* @noEscape */ __('Select the fields in Magento where'
                            . ' WriteText.ai will save your text.') ?></b><br/>
                        <?= $block->escapeHtml(__("By default, the standard Magento fields"
                        . " are selected, but you can map them to other fields if needed.")) ?></p>
                    <p>
                        <b><?= /* @noEscape */ __('Open Graph text') ?></b><br/>
                        <?= /* @noEscape */ __("Open Graph text is what appears in the preview"
                        . " when your product page is shared on social media platforms like Facebook,"
                        . " X, or LinkedIn. Since Magento does not have a native Open Graph field,"
                        . " WriteText.ai uses the <b>Short Description</b> by default.") ?></p>
                    <p>
                        <?= /* @noEscape */ __('If you are using an SEO module, the module may pull'
                        . ' Open Graph data from other fields such as the <b>Meta Description</b>,'
                        . ' <b>Description</b>, or <b>Short Description</b>, depending on its settings.'
                        . ' In that case, WriteText.ai will follow the SEO module’s configuration.') ?>
                    </p>
                    <p>
                        <?= /* @noEscape */ __('If your SEO module uses a different field,'
                        . ' check the box for <b>Custom Open Graph text field</b>. This will enable'
                        . ' a dropdown where you can select the custom field being used for Open'
                        . ' Graph text. ') ?>
                    </p>
                    <?= /* @noEscape */ $block->getChildHtml('wtai.step2') ?>
                </div>
            </div>
        </div>
        <!-- <div class="wtai-step <?= /* @noEscape */ $block->getStepClass(3) ?>">
            <div class="wtai-indicator">
                <div class="wtai-circle">
                    <span><?= $block->escapeHtml('3') ?></span>
                </div>
                <div class="wtai-line"></div>
            </div>
            <div class="wtai-content">
                <div class="wtai-header">
                    <div class="wtai-title-container">
                        <div class="wtai-step-number"><?= $block->escapeHtml(__('Step 3')) ?></div>
                        <div class="wtai-step-title"><?= $block->escapeHtml(__('Configure global settings and preferences')) ?></div>
                    </div>
                    <div class="wtai-completed-badge"><?= $block->escapeHtml(__('Completed')) ?></div>
                </div>
                <div class="wtai-content-content">
                    <p><?= $block->escapeHtml(__('Almost done! Before you begin generating text,'
                        .' configure global settings and assign a template to your store.'
                        .' You can always change settings later in WriteText.ai > Settings;'
                        .' for templates, you can assign or unassign templates to this store'
                        .' via your platform.writetext.ai account.')) ?></p>
                    <?php if ($block->isLoggedIn()): ?>
                        <?= /* @noEscape */ $block->getChildHtml('wtai.step3') ?>
                    <?php endif; ?>
                </div>
            </div>
        </div>
        <div class="wtai-step <?= /* @noEscape */ $block->getStepClass(4) ?>">
            <div class="wtai-indicator">
                <div class="wtai-circle">
                    <span><?= $block->escapeHtml('4') ?></span>
                </div>
                <div class="wtai-line"></div>
            </div>
            <div class="wtai-content">
                <div class="wtai-header">
                    <div class="wtai-title-container">
                        <div class="wtai-step-number"><?= $block->escapeHtml(__('Step 4')) ?></div>
                        <div class="wtai-step-title"><?= $block->escapeHtml(__('All done!')) ?></div>
                    </div>
                    <div class="wtai-completed-badge"><?= $block->escapeHtml(__('Completed')) ?></div>
                </div>
                <div class="wtai-content-content">
                    <p><?= $block->escapeHtml(__('You can now start generating text with WriteText.ai.')) ?></p>
                    <?= /* @noEscape */ $block->getChildHtml('wtai.step4') ?>
                </div>
            </div>
        </div> -->
    </div>
</div>
<?= /* @noEscape */ $block->getChildHtml('wtai.premium.popup') ?>

<script>
    require([
        'jquery'
    ], function ($) {
        $('#wtaiLoginRegisterButton').click(function () {
            window.location.href = "<?= $block->escapeJs($block->getLoginRegisterUrl()) ?>";
        });
    });
</script>
