<?php
/**
 * Mageplaza
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the mageplaza.com license that is
 * available through the world-wide-web at this URL:
 * https://www.mageplaza.com/LICENSE.txt
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade this extension to newer
 * version in the future.
 *
 * @category    Mageplaza
 * @package     Mageplaza_AbandonedCart
 * @copyright   Copyright (c) Mageplaza (https://www.mageplaza.com/)
 * @license     https://www.mageplaza.com/LICENSE.txt
 */

use Mageplaza\AbandonedCart\Block\Customer\AbandonedCartPhone;
use Mageplaza\AbandonedCart\Helper\Data;

/** @var AbandonedCartPhone $block */

$isAbandonedCartNumber = $block->isEnableAbandonedCartNumber();
$abandonedCartNumber   = $block->getCustomerAbandonedCartPhone();
$isEnableHyvaTheme     = $this->helper(Data::class)->isEnabledHyvaTheme();
?>

<?php if ($isAbandonedCartNumber && $isEnableHyvaTheme): ?>
    <div class="py-8" >
        <legend class="legend customer-attributes">
            <span><?= $block->escapeHtml(__('Additional Information')) ?></span>
        </legend>
        <div class="field phone_number required">
            <label class="label" for="phone_number">
                <span><?= $block->escapeHtml(__('Abandonment Cart Phone Number')) ?></span>
            </label>
            <div class="control">
                <input type="text"
                       name="mp_abandoned_cart_phone"
                       id="mp_abandoned_cart_phone"
                       required
                       title="<?= $block->escapeHtmlAttr(__('Abandonment Cart Phone Number')) ?>"
                       class="input-text"
                       data-validate='{"mp-validate-phone-number": true}'
                       value="<?= /* @noEscape */  $abandonedCartNumber ?>"
                       @input.debounce="onChange"
                />
                <div id="mp_abandoned_cart_phone_error"></div>
            </div>
        </div>
        <div id="mp_abandoned_cart_error_msg"></div>
    </div>
    <script>
        window.addEventListener('DOMContentLoaded', () => {
            var phoneNumber = document.querySelector("#mp_abandoned_cart_phone");
            let initCountryCode = '';
            function initData () {
                fetch('https://get.geojs.io/v1/ip/geo.js')
                .then((response) => response.text())
                .then((result) => {
                    initCountryCode = result.match(/"country_code":"([^"]+)"/)[1];
                    initField(initCountryCode);
                    sessionStorage.setItem("countryCode", initCountryCode);
                });
            }

            function initField (initCountryCode) {
                const iti  = intlTelInput(phoneNumber, {
                    initialCountry: initCountryCode,
                    countrySearch: false,
                });

                phoneNumber.addEventListener('countrychange', (e) => {
                    const countryCode = iti.getSelectedCountryData().iso2;
                    sessionStorage.setItem("countryCode", countryCode);

                });

                var createCusBtn= document.querySelector('.form-create-account .action.submit');
                if(createCusBtn) {
                    createCusBtn.addEventListener('click', function (event) {
                        phoneNumber.value = iti.getNumber();
                    });
                }


                var editCusBtn= document.querySelector('.form-edit-account .action.save');
                if(editCusBtn) {
                    editCusBtn.addEventListener('click', function (event) {
                        phoneNumber.value = iti.getNumber();
                    });
                }

            }
            hyva.formValidation.addRule('mp-validate-phone-number', (value, options) => {
                const phoneNumber = value.trim().replace(' ', '');
                var filter = /^[0-9+]+$/;
                if (phoneNumber && !phoneNumber.toString().match(filter)) {
                    return '<?= $escaper->escapeJs(__('Not a valid Phone Number')) ?>';
                }
                return true;
            });


            initData();

        });
    </script>
<?php endif; ?>
