<?php
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}
?>

<script defer>
    document.addEventListener('DOMContentLoaded', function() {
        const useProductNameAsSku = "<?php echo esc_attr(get_option('useProductNameAsSku')); ?>";

        const vendorCode = useProductNameAsSku === 'true'
            ? "<?php global $product; echo esc_js($product->get_name()); ?>"
            : "<?php global $product; echo esc_js($product->get_sku()); ?>";

        let className = "<?php echo esc_attr(get_option('wizartEntryPointClassName')); ?>";

        const server_address = 'https://pim-client.wizart.ai';
        const api_token = "<?php echo esc_attr(get_option('token')); ?>";
        const availableVendorCodes = server_address + '/api/articles/available-vendor-codes';

        <?php
        $wizart_parameters = array(
            'context' => get_option('context'),
            'locale' => get_option('locale'),
            'room_uuid' => get_option('roomUuid'),
            'open_first_room' => get_option('openFirstRoom'),
            'deactivate_custom_photo' => get_option('deactivateCustomPhoto'),
        );
        $wizart_parameters = array_filter($wizart_parameters, function($value) {
            return !empty($value);
        });
        ?>
        const parameters = JSON.stringify(<?php echo wp_json_encode($wizart_parameters); ?>);

        const elementSelector = "<?php echo esc_attr(get_option('wizartEntryElementSelector')); ?>";
        const elementsSelector = "<?php echo esc_attr(get_option('wizartEntryElementsSelector')); ?>";

        const element = elementSelector ? document.querySelector(elementSelector) : null;
        let elements;

        if (elementsSelector.includes(',')) {
            elements = elementsSelector.split(',').map(selector => {
                return [...document.querySelectorAll(selector.trim())];
            }).flat();
        } else if (elementsSelector) {
            elements = document.querySelectorAll(elementsSelector);
        }

        const entryPoint = new window.WEntryPoint({
            token: api_token,
            vendorCode: vendorCode,
            ...(element && elements
                    ? { element: element, elements: [...elements] }
                    : element
                        ? { element: element }
                        : elements && elements.length > 0
                            ? { elements: [...elements] }
                            : {}
            ),
        });

        entryPoint.render({
            title: "<?php echo esc_attr(get_option('wizartEntryPointTitle')); ?>",
            parameters: parameters,
            tooltipTitle: "<?php echo esc_attr(get_option('wizartEntryPointTooltipTitle')); ?>",
            tooltipPosition: "<?php echo esc_attr(get_option('wizartEntryPointTooltipPosition')); ?>",
            tooltipDisable: <?php echo get_option('wizartEntryPointTooltipDisable') ? 'true' : 'false'; ?>,
            glitterDisable: <?php echo get_option('wizartEntryPointGlitterDisable') ? 'true' : 'false'; ?>,
            className: className,
            borderRadius: "<?php echo esc_attr(get_option('wizartEntryPointBorderRadius')); ?>",
            background: "<?php echo esc_attr(get_option('wizartEntryPointBackground')); ?>",
            color: "<?php echo esc_attr(get_option('wizartEntryPointColor')); ?>",
            width: "<?php echo esc_attr(get_option('wizartEntryPointWidth')); ?>",
            height: "<?php echo esc_attr(get_option('wizartEntryPointHeight')); ?>",
            border: "<?php echo esc_attr(get_option('wizartEntryPointBorder')); ?>",
            image: "<?php echo esc_attr(get_option('wizartEntryPointImage')); ?>",
            onloadCallback: <?php echo get_option('wizartEntryPointOnloadCallback')
                ? '"' . esc_attr(get_option('wizartEntryPointOnloadCallback')) . '"'
                : 'null'; ?>,
            onCloseCallback: <?php echo get_option('wizartEntryPointOnCloseCallback')
                ? '"' . esc_attr(get_option('wizartEntryPointOnCloseCallback')) . '"'
                : 'null'; ?>,
            onButtonClick: <?php echo get_option('wizartEntryPointOnButtonClick')
                ? '"' . esc_attr(get_option('wizartEntryPointOnButtonClick')) . '"'
                : 'null'; ?>,
            insertElementPosition: "<?php echo esc_attr(get_option('wizartEntryPointInsertElementPosition')); ?>",
            iframeElementSelector: "<?php echo esc_attr(get_option('wizartEntryPointIframeElementSelector')); ?>",
            insertIframeElementPosition: "<?php echo esc_attr(get_option('wizartEntryPointInsertIframeElementPosition')); ?>",
        });

        checkVendorCodes(availableVendorCodes, vendorCode, api_token, className)
            .then(result => {
                if (result === true) {
                    const elements = document.querySelectorAll(`.${className}`);
                    elements.forEach(element => {
                        element.style.display = "inline-flex";
                    });
                }
            });
    });
</script>

<style>
    .<?php echo esc_attr(get_option('wizartEntryPointClassName')); ?> {
        display: none;
    }
</style>