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

<?php
    use WriteTextAI\WriteTextAI\ViewModel\Premium;
    use WriteTextAI\WriteTextAI\ViewModel\Settings;
?>

<?php
/** @var Premium $premium */
/** @var Settings $settings */

$settings = $block->getSettings();
$premium = $block->getPremium();

$rules = $settings->getSettings('rules');
$ads = $premium->getAds();
//$adsFullWidth = $premium->getAdsFullWidth();
$adLink = $ads['link'] ?? '#';
$adImageUrl = $ads['imageUrl'] ?? '';
?>

<div class="wtai-wtai-accordions wtai-accordions wtai-keywords-attributes" data-bind="scope: 'wtaiAccordions'">
    <?php foreach ($block->getChildNames() as $childName): ?>
        <?php
            $childBlock = $block->getChildBlock($childName);
            $className = str_replace('.', '-', $childName) . '-block';
        ?>
        <div class="wtai-accordion-block <?= /* @noEscape */ $className ?>"
            data-bind="css: {
                'wtai-disabled':
                    !hasProAccess() &&
                    '<?= $escaper->escapeHtmlAttr($childBlock->getData('pro')) ?>'
            }">
            <div data-role="collapsible" class="admin__collapsible-block-wrapper">
                <div class="admin__collapsible-title" data-role="title">
                    <span
                        class="wtai-step"
                        data-bind="hidden: guideSteps"
                    ><?= $escaper->escapeHtml(__($childBlock->getData('step'))) ?></span>
                    <h4><?= $escaper->escapeHtml(__($childBlock->getData('title'))) ?></h4>
                    <div class="admin__field-tooltip wtai-small 
                        <?= ($childName === 'wtai.keywords') ? 'big' : '' ?>"
                    >
                        <a class="admin__field-tooltip-action" href="#" data-toggle="dropdown"></a>
                        <div class="admin__field-tooltip-content" data-target="dropdown" data-bind="
                            <?php if ($childName !== 'wtai.attributes'): ?>
                                visible: hasProAccess()
                            <?php endif; ?>
                        ">
                            <div class="wtai-content-wrapper">
                                <?= /* @noEscape */ $childBlock->getTooltip()->getTooltip($childName) ?>
                            </div>
                        </div>
                    </div>
                    <div class="wtai-trigger" data-role="trigger"></div>
                    <?php if ($childBlock->getData('pro')): ?>
                        <?= $childBlock->getChildBlock('wtai.pro.badge.' . $childName)->toHtml() ?>
                    <?php endif; ?>
                    <?php if ($childName === 'wtai.keywords'): ?>
                        <div class="wtai-accordion-right">
                            <div class="wtai-item">
                                <span class="wtai-label"><?= $escaper->escapeHtml(__('Language')) ?></span>
                                <span class="wtai-value" data-bind="text: language"></span>
                            </div>
                            <div class="wtai-separator">|</div>
                            <div class="wtai-item">
                                <span class="wtai-label"><?= $escaper->escapeHtml(__('Country')) ?></span>
                                <span class="wtai-value" data-bind="text: country"></span>
                            </div>
                        </div>
                    <?php endif; ?>
                </div>
            </div>
            <div data-role="content">
                <?= /* @noEscape */ $childBlock->toHtml() ?>
            </div>
        </div>
        <?php if ($childName === 'wtai.attributes' && $adImageUrl): ?>
            <div class="wtai-premium-ads" data-bind="visible: showAds()" style="display: none;">
                <span class="wtai-stop-ads"><?= $escaper->escapeHtml(__("Stop seeing ads")) ?></span>
                <a href="<?= $escaper->escapeHtmlAttr($adLink) ?>" target="_blank">
                    <picture>
                        <!-- Desktop - 1440px and up -->
                        <source srcset="<?= $escaper->escapeHtmlAttr($adImageUrl)?>"
                            media="(min-width: 1440px)">

                        <!-- Desktop - 1180px and up -->
                        <source srcset="<?= $escaper->escapeHtmlAttr($adImageUrl)?>"
                            media="(min-width: 1180px)">
                        
                        <!-- Mid-desktop - 768px and up -->
                        <source srcset="<?= $escaper->escapeHtmlAttr($adImageUrl)?>"
                            media="(min-width: 768px)">
                        
                        <!-- Fallback/default image for smaller screens -->
                        <img src="<?= $escaper->escapeHtmlAttr($adImageUrl)?>"
                            alt="1902 Software Ads">
                    </picture>
                </a>
            </div>
        <?php endif; ?>
    <?php endforeach ?>
</div>
<script type="text/x-magento-init">
    {
        "*": {
            "Magento_Ui/js/core/app": {
                "components": {
                    "wtaiAccordions": {
                        "component": "WriteTextAI_WriteTextAI/js/edit/accordion",
                        "rules": <?= /* @noEscape */ json_encode($rules) ?>,
                        "freeTrialMembershipType": "<?= $escaper->escapeJs(Premium::MEMBERSHIP_TYPE_FREE_TRIAL) ?>"
                    }
                }
            }
        }
    }
</script>
