{include file="orderforms/hostique/common.tpl"}

<div id="order-standard_cart" class="order-shell order-shell--checkout-register order-shell--domain-register-modern">
    <section class="hostique-domain-hero-card">
        <div class="hostique-domain-hero-card__copy">
            <h1>Choose a Domain</h1>
            <p>Find your new domain name. Enter your name or keywords below to check availability.</p>
        </div>
        <a href="{$WEB_ROOT}/cart.php?a=view" class="hostique-domain-hero-card__cart">
            <i class="fas fa-shopping-cart"></i>
            <span>Shopping Cart</span>
        </a>
    </section>

    <section class="hostique-domain-search-shell">
        <div class="hostique-domain-search-shell__content">
            <div class="hostique-domain-search-shell__heading">
                <span class="hostique-domain-search-shell__badge"><i class="fas fa-globe"></i></span>
                <h2>Find your perfect domain name</h2>
            </div>

            <form method="post" action="{$WEB_ROOT}/cart.php" id="frmDomainChecker" class="hostique-domain-search-shell__form">
                <input type="hidden" name="a" value="checkDomain">

                {if $showAdvancedSearchOptions}
                    <div class="hostique-domain-search-advanced">
                        <textarea name="message"
                            id="message"
                            title="{lang key='domainSearch.domainOrAiPrompt'}"
                            data-placement="left"
                            data-trigger="manual"
                            placeholder="{lang key='domainSearch.domainOrAiInstruction'}">{$message}</textarea>
                        <div class="hostique-domain-search-advanced__actions">
                            <select name="tlds[]" class="multiselect multiselect-filter" multiple="multiple" data-placeholder="{lang key='domainSearch.tlds'}" data-min-selection="1">
                                {foreach $tlds as $tld}
                                    <option{if in_array($tld, $selectedTlds)} selected {if count($selectedTlds) <= 1}disabled="disabled"{/if}{/if} value="{$tld}">{$tld}</option>
                                {/foreach}
                            </select>
                            <select name="maxLength" class="multiselect" data-placeholder="{lang key='domainSearch.maxLength'}">
                                {foreach $searchLengths as $len}
                                    <option value="{$len}" {if $maxLength === $len}selected{/if}>{$len}</option>
                                {/foreach}
                            </select>
                            <label class="hostique-domain-search-advanced__safe">
                                <input type="checkbox" class="no-icheck" name="filter" {if $safeSearchSelected}checked{/if}>
                                <span>{lang key="domainSearch.safeSearch"}</span>
                            </label>
                            <button type="submit" id="btnCheckAvailability" class="btn btn-primary domain-check-availability{$captcha->getButtonClass($captchaForm)}">
                                {lang key='search'}
                            </button>
                        </div>
                    </div>
                {else}
                    <div class="hostique-domain-search-shell__bar">
                        <div class="hostique-domain-search-shell__field">
                            <input type="text" name="domain" class="form-control" placeholder="Enter your new domain name" value="{$lookupTerm}" id="inputDomain" data-toggle="tooltip" data-placement="left" data-trigger="manual" title="{lang key='orderForm.domainOrKeyword'}" />
                        </div>
                        <label class="hostique-domain-search-shell__suffix" for="hostiqueTldSelect">
                            <select id="hostiqueTldSelect" class="hostique-domain-search-shell__suffix-select" aria-label="Choose domain extension">
                                {if $spotlightTlds}
                                    {foreach $spotlightTlds as $data}
                                        <option value="{$data.tld}"{if $data.tld eq '.com'} selected{/if}>{$data.tld}</option>
                                    {/foreach}
                                {elseif $featuredTlds}
                                    {foreach $featuredTlds as $tldinfo}
                                        <option value="{$tldinfo.tld}"{if $tldinfo.tld eq '.com'} selected{/if}>{$tldinfo.tld}</option>
                                    {/foreach}
                                {elseif $pricing && $pricing['pricing']}
                                    {foreach $pricing['pricing'] as $tld => $price}
                                        <option value=".{$tld}"{if $tld eq 'com'} selected{/if}>.{$tld}</option>
                                    {/foreach}
                                {else}
                                    <option value=".com" selected>.com</option>
                                    <option value=".net">.net</option>
                                    <option value=".org">.org</option>
                                {/if}
                            </select>
                            <i class="fas fa-chevron-down"></i>
                        </label>
                        <button type="submit" id="btnCheckAvailability" class="btn btn-primary domain-check-availability{$captcha->getButtonClass($captchaForm)}">{$LANG.search}</button>
                    </div>
                {/if}

                {if $captcha->isEnabled() && $captcha->isEnabledForForm($captchaForm) && !$captcha->recaptcha->isInvisible()}
                    <div class="captcha-container hostique-domain-search-shell__captcha" id="captchaContainer">
                        {if $captcha->recaptcha->isEnabled()}
                            <div class="text-center">
                                <div class="form-group recaptcha-container"></div>
                            </div>
                        {else}
                            <div class="default-captcha default-captcha-register-margin">
                                <p>{lang key="cartSimpleCaptcha"}</p>
                                <div>
                                    <img id="inputCaptchaImage" src="{$systemurl}includes/verifyimage.php" align="middle" />
                                    <input id="inputCaptcha" type="text" name="code" maxlength="6" class="form-control input-sm" data-toggle="tooltip" data-placement="right" data-trigger="manual" title="{lang key='orderForm.required'}" />
                                </div>
                            </div>
                        {/if}
                    </div>
                {/if}
            </form>
        </div>

        <div class="hostique-domain-search-shell__art" aria-hidden="true">
            <div class="hostique-domain-search-shell__globe"></div>
            <div class="hostique-domain-search-shell__tile">
                <strong>WWW</strong>
                <i class="fas fa-search"></i>
            </div>
        </div>
    </section>

    <section class="hostique-domain-results-card">
        <div class="domain-pricing hostique-domain-results-card__compat" aria-hidden="true"></div>
        <div class="hostique-domain-results-card__section">
            <div class="hostique-domain-results-card__heading">
                <h2>Popular Extensions</h2>
            </div>

            <div class="hostique-domain-extension-grid">
                {if $spotlightTlds}
                    {foreach $spotlightTlds as $data}
                        <span class="hostique-domain-extension-chip" data-tld="{$data.tld}" role="button" tabindex="0">
                            <strong>{$data.tld}</strong>
                            <small>{if is_object($data.register)}{$data.register->toPrefixed()}{elseif $data.register}{$data.register}{else}--{/if}</small>
                        </span>
                    {/foreach}
                {elseif $featuredTlds}
                    {foreach $featuredTlds as $tldinfo}
                        <span class="hostique-domain-extension-chip" data-tld="{$tldinfo.tld}" role="button" tabindex="0">
                            <strong>{$tldinfo.tld}</strong>
                            <small>{if is_object($tldinfo.register)}{$tldinfo.register->toPrefixed()}{else}{lang key='domainregnotavailable'}{/if}</small>
                        </span>
                    {/foreach}
                {elseif $pricing && $pricing['pricing']}
                    {assign var=hostiqueExtensionCount value=0}
                    {foreach $pricing['pricing'] as $tld => $price}
                        {if $hostiqueExtensionCount < 8}
                            <span class="hostique-domain-extension-chip" data-tld=".{$tld}" role="button" tabindex="0">
                                <strong>.{$tld}</strong>
                                <small>
                                    {if isset($price.register) && current($price.register) > 0}
                                        {current($price.register)}
                                    {elseif isset($price.register) && current($price.register) == 0}
                                        {lang key='orderfree'}
                                    {else}
                                        {lang key='na'}
                                    {/if}
                                </small>
                            </span>
                            {assign var=hostiqueExtensionCount value=$hostiqueExtensionCount+1}
                        {/if}
                    {/foreach}
                {/if}
                <a href="#hostique-domain-pricing" class="hostique-domain-extension-chip hostique-domain-extension-chip--action">
                    <i class="fas fa-th-large"></i>
                    <span>View All</span>
                </a>
            </div>
        </div>

        <div class="hostique-domain-results-card__divider"></div>

        <div class="hostique-domain-results-card__section">
            <div class="hostique-domain-results-card__heading hostique-domain-results-card__heading--inline">
                <div>
                    <h2>Domain Suggestions</h2>
                </div>
                <span class="hostique-domain-results-card__availability" data-domain-availability-pill>Search to View</span>
            </div>

            <div id="DomainSearchResults" class="w-hidden">
                <div id="searchDomainInfo" class="domain-checker-result-headline">
                    <p id="primaryLookupSearching" class="domain-lookup-loader domain-lookup-primary-loader domain-searching"><i class="fas fa-spinner fa-spin"></i> {lang key='orderForm.searching'}...</p>
                    <div id="primaryLookupResult" class="domain-lookup-result w-hidden">
                        <p class="domain-invalid domain-checker-invalid">{lang key='orderForm.domainLetterOrNumber'}<span class="domain-length-restrictions">{lang key='orderForm.domainLengthRequirements'}</span></p>
                        <p class="domain-unavailable domain-checker-unavailable">{lang key='orderForm.domainIsUnavailable'}</p>
                        <p class="domain-tld-unavailable domain-checker-unavailable">{lang key='orderForm.domainHasUnavailableTld'}</p>
                        <p class="domain-available domain-checker-available">{$LANG.domainavailablemessage}</p>
                        <a class="domain-contact-support btn btn-primary">{$LANG.domainContactUs}</a>
                        <div id="idnLanguageSelector" class="form-group idn-language-selector w-hidden">
                            <div class="row">
                                <div class="col-sm-10 col-sm-offset-1 col-lg-8 col-lg-offset-2 offset-sm-1 offset-lg-2">
                                    <div class="margin-10 text-center">
                                        {lang key='cart.idnLanguageDescription'}
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-8 col-lg-6 col-sm-offset-2 col-lg-offset-3 offset-sm-2 offset-lg-3">
                                    <select name="idnlanguage" class="form-control">
                                        <option value="">{lang key='cart.idnLanguage'}</option>
                                        {foreach $idnLanguages as $idnLanguageKey => $idnLanguage}
                                            <option value="{$idnLanguageKey}">{lang key='idnLanguage.'|cat:$idnLanguageKey}</option>
                                        {/foreach}
                                    </select>
                                    <div class="field-error-msg">
                                        {lang key='cart.selectIdnLanguageForRegister'}
                                    </div>
                                </div>
                            </div>
                        </div>
                        <p class="domain-price">
                            <span class="price"></span>
                            <button class="btn btn-primary btn-add-to-cart" data-whois="0" data-domain="">
                                <span class="to-add">{$LANG.addtocart}</span>
                                <span class="loading">
                                    <i class="fas fa-spinner fa-spin"></i> {lang key='loading'}
                                </span>
                                <span class="added"><i class="far fa-shopping-cart"></i> {lang key='domaincheckeradded'}</span>
                                <span class="unavailable">{$LANG.domaincheckertaken}</span>
                            </button>
                        </p>
                        <p class="domain-error domain-checker-unavailable"></p>
                    </div>
                </div>

                {if $spotlightTlds}
                    <div id="spotlightTlds" class="spotlight-tlds clearfix">
                        <div class="spotlight-tlds-container">
                            {foreach $spotlightTlds as $key => $data}
                                <div class="spotlight-tld-container spotlight-tld-container-{$spotlightTlds|count}">
                                    <div id="spotlight{$data.tldNoDots}" class="spotlight-tld">
                                        {if $data.group}
                                            <div class="spotlight-tld-{$data.group}">{$data.groupDisplayName}</div>
                                        {/if}
                                        {$data.tld}
                                        <span class="domain-lookup-loader domain-lookup-spotlight-loader">
                                            <i class="fas fa-spinner fa-spin"></i>
                                        </span>
                                        <div class="domain-lookup-result">
                                            <button type="button" class="btn unavailable w-hidden" disabled="disabled">
                                                {lang key='domainunavailable'}
                                            </button>
                                            <button type="button" class="btn invalid w-hidden" disabled="disabled">
                                                {lang key='domainunavailable'}
                                            </button>
                                            <span class="available price w-hidden">{$data.register}</span>
                                            <button type="button" class="btn btn-add-to-cart w-hidden" data-whois="0" data-domain="">
                                                <span class="to-add">{lang key='orderForm.add'}</span>
                                                <span class="loading">
                                                    <i class="fas fa-spinner fa-spin"></i> {lang key='loading'}
                                                </span>
                                                <span class="added"><i class="far fa-shopping-cart"></i> {lang key='domaincheckeradded'}</span>
                                                <span class="unavailable">{$LANG.domaincheckertaken}</span>
                                            </button>
                                            <button type="button" class="btn btn-primary domain-contact-support w-hidden">
                                                {lang key='domainChecker.contactSupport'}
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            {/foreach}
                        </div>
                    </div>
                {/if}

                <div class="suggested-domains{if !$showSuggestionsContainer} w-hidden{/if}">
                    <div class="panel-heading card-header">
                        <div class="hostique-suggestions-heading">
                            <span class="hostique-suggestions-heading__icon" aria-hidden="true">
                                <i class="fas fa-lightbulb"></i>
                            </span>
                            <div class="hostique-suggestions-heading__copy">
                                <strong>{lang key='orderForm.suggestedDomains'}</strong>
                                <span>Curated alternatives based on your search</span>
                            </div>
                        </div>
                    </div>
                    <div id="suggestionsLoader" class="panel-body card-body domain-lookup-loader domain-lookup-suggestions-loader">
                        <i class="fas fa-spinner fa-spin"></i> Generating suggestions for you...
                    </div>
                    <div class="panel-body card-body domain-lookup-message domain-lookup-suggestions-message">
                        {lang key='domainSearch.errors.noSuggestions'}
                    </div>
                    <div id="domainSuggestions" class="domain-lookup-result list-group w-hidden">
                        <div class="domain-suggestion list-group-item w-hidden">
                            <span class="hostique-domain-suggestion__status" aria-hidden="true">
                                <i class="fas fa-check"></i>
                            </span>
                            <span class="hostique-domain-suggestion__main">
                                <span class="hostique-domain-suggestion__name">
                                    <span class="domain"></span><span class="extension"></span>
                                </span>
                                <span class="promo w-hidden">
                                    <span class="sales-group-hot w-hidden">{lang key='domainCheckerSalesGroup.hot'}</span>
                                    <span class="sales-group-new w-hidden">{lang key='domainCheckerSalesGroup.new'}</span>
                                    <span class="sales-group-sale w-hidden">{lang key='domainCheckerSalesGroup.sale'}</span>
                                </span>
                            </span>
                            <div class="actions">
                                <span class="price"></span>
                                <button type="button" class="btn btn-add-to-cart" data-whois="1" data-domain="">
                                    <span class="to-add">{$LANG.addtocart}</span>
                                    <span class="loading">
                                        <i class="fas fa-spinner fa-spin"></i> {lang key='loading'}
                                    </span>
                                    <span class="added"><i class="far fa-shopping-cart"></i> {lang key='domaincheckeradded'}</span>
                                    <span class="unavailable">{$LANG.domaincheckertaken}</span>
                                </button>
                                <button type="button" class="btn btn-primary domain-contact-support w-hidden">
                                    {lang key='domainChecker.contactSupport'}
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="panel-footer card-footer more-suggestions text-center w-hidden">
                        <a id="moreSuggestions" href="#" onclick="return hostiqueLoadMoreSuggestions();">View More Suggestions <i class="fas fa-chevron-down"></i></a>
                        <span id="noMoreSuggestions" class="no-more small w-hidden">{lang key='domaincheckernomoresuggestions'}</span>
                    </div>
                    <div class="text-center domain-suggestions-warning">
                        <p>{lang key='domainssuggestionswarnings'}</p>
                    </div>
                </div>
            </div>

            <div class="hostique-order-results-empty" data-domain-results-placeholder>
                <i class="fas fa-search"></i>
                <p>Search for a domain to see live availability, pricing, and smart suggestions.</p>
            </div>
        </div>
    </section>

    <section class="hostique-domain-promo-grid">
        <article class="hostique-domain-promo-card">
            <span class="hostique-domain-promo-card__icon"><i class="fas fa-server"></i></span>
            <div class="hostique-domain-promo-card__copy">
                <h2>Add Web Hosting</h2>
                <p>Choose from a range of web hosting packages designed to fit every budget.</p>
                <a href="{$WEB_ROOT}/cart.php" class="hostique-domain-promo-card__link">
                    <span>Explore packages</span>
                    <i class="fas fa-arrow-right"></i>
                </a>
            </div>
        </article>
        <article class="hostique-domain-promo-card">
            <span class="hostique-domain-promo-card__icon"><i class="fas fa-globe"></i></span>
            <div class="hostique-domain-promo-card__copy">
                <h2>Transfer your domain to us</h2>
                <p>Transfer now to extend your domain by 1 year and keep everything under one roof.</p>
                <a href="{$WEB_ROOT}/cart.php?a=add&domain=transfer" class="hostique-domain-promo-card__link">
                    <span>Transfer a domain</span>
                    <i class="fas fa-arrow-right"></i>
                </a>
                <small>* Excludes certain TLDs and recently renewed domains</small>
            </div>
        </article>
    </section>

    <section id="hostique-domain-pricing" class="hostique-order-footer-strip">
        <div class="hostique-order-footer-strip__lead">
            <span>Need help? Our support team is here for you.</span>
            <strong>24/7 Live Chat</strong>
        </div>
        <div class="hostique-order-footer-strip__stats">
        </div>
        <div class="hostique-order-footer-strip__trust">
            <span>Trusted by thousands</span>
            <strong class="hostique-order-footer-strip__stars" aria-label="5 stars">
                <i class="fas fa-star"></i>
                <i class="fas fa-star"></i>
                <i class="fas fa-star"></i>
                <i class="fas fa-star"></i>
                <i class="fas fa-star"></i>
            </strong>
            <strong>★★★★★</strong>
        </div>
    </section>
</div>

<script>
function hostiqueComposeDomainValue() {
    var input = jQuery('#inputDomain');
    var suffixSelect = jQuery('#hostiqueTldSelect');
    var suffix = (suffixSelect.val() || '.com').trim();

    if (!input.length) {
        return '';
    }

    var raw = (input.val() || '').trim();
    if (!raw) {
        return '';
    }

    if (suffix && suffix.charAt(0) !== '.') {
        suffix = '.' + suffix;
    }

    if (suffixSelect.length) {
        var knownTlds = suffixSelect.find('option').map(function () {
            return jQuery(this).val().trim().toLowerCase();
        }).get().sort(function (a, b) {
            return b.length - a.length;
        });

        for (var i = 0; i < knownTlds.length; i++) {
            var knownTld = knownTlds[i];
            if (knownTld && raw.toLowerCase().endsWith(knownTld)) {
                raw = raw.slice(0, -knownTld.length);
                if (raw.endsWith('.')) {
                    raw = raw.slice(0, -1);
                }
                break;
            }
        }
    }

    if (raw.indexOf('.') === -1 && suffix) {
        raw += suffix;
    }

    input.val(raw);
    return raw;
}

function hostiqueSetSelectedTld(tld) {
    var suffixSelect = jQuery('#hostiqueTldSelect');
    if (!suffixSelect.length || !tld) {
        return;
    }

    suffixSelect.val(tld);
    jQuery('.hostique-domain-extension-chip[data-tld]').removeClass('is-selected');
    jQuery('.hostique-domain-extension-chip[data-tld="' + tld.replace(/"/g, '\\"') + '"]').addClass('is-selected');
}

function hostiqueNormalizeSuggestions() {
    var suggestionItems = jQuery('#domainSuggestions > .domain-suggestion').filter(function () {
        return jQuery(this).find('.domain').text().trim().length > 0;
    });

    suggestionItems.each(function (index) {
        var item = jQuery(this);
        if (index < 10) {
            item.removeClass('w-hidden').show();
        } else {
            item.addClass('w-hidden').hide();
        }
    });

    furtherSuggestions = suggestionItems.filter('.clone.w-hidden').length;

    if (furtherSuggestions > 0) {
        jQuery('div.more-suggestions').show()
            .find('a').show().end()
            .find('span.no-more').hide();
    } else {
        jQuery('div.more-suggestions')
            .find('a').hide().end()
            .find('span.no-more').show();
    }

    hostiqueRepairSuggestionRows();
}

function hostiqueLoadMoreSuggestions() {
    var hiddenSuggestions = jQuery('#domainSuggestions > .domain-suggestion.clone.w-hidden').filter(function () {
        return jQuery(this).find('.domain').text().trim().length > 0;
    }).slice(0, 10);

    if (!hiddenSuggestions.length) {
        jQuery('div.more-suggestions')
            .find('a').hide().end()
            .find('span.no-more').show();
        return false;
    }

    hiddenSuggestions.each(function () {
        jQuery(this).removeClass('w-hidden').hide().slideDown(180);
    });

    furtherSuggestions = jQuery('#domainSuggestions > .domain-suggestion.clone.w-hidden').filter(function () {
        return jQuery(this).find('.domain').text().trim().length > 0;
    }).length;

    if (!furtherSuggestions) {
        jQuery('div.more-suggestions')
            .find('a').hide().end()
            .find('span.no-more').show();
    }

    hostiqueRepairSuggestionRows();
    syncHostiqueDomainResultsPlaceholder();
    return false;
}

function hostiqueRepairSuggestionRows() {
    jQuery('#domainSuggestions > .domain-suggestion').each(function () {
        var row = jQuery(this);
        var addToCartButton = row.find('.btn-add-to-cart').first();
        var domainTarget = row.find('.domain').first();
        var extensionTarget = row.find('.extension').first();
        var suggestionDomain = (addToCartButton.attr('data-domain') || '').trim();

        if (suggestionDomain) {
            var lastDotIndex = suggestionDomain.lastIndexOf('.');
            if (lastDotIndex > 0) {
                domainTarget.text(suggestionDomain.slice(0, lastDotIndex));
                extensionTarget.text(suggestionDomain.slice(lastDotIndex));
            } else {
                domainTarget.text(suggestionDomain);
                if (!extensionTarget.text().trim()) {
                    extensionTarget.text(jQuery('#hostiqueTldSelect').val() || '.com');
                }
            }
        }

        if (!row.find('.hostique-domain-suggestion__status i').length) {
            row.find('.hostique-domain-suggestion__status').html('<i class="fas fa-check"></i>');
        }
    });
}

function syncHostiqueDomainResultsPlaceholder() {
    var results = jQuery('#DomainSearchResults');
    var placeholder = jQuery('[data-domain-results-placeholder]');
    var primaryVisible = jQuery('#primaryLookupResult').is(':visible');
    var suggestionsVisible = jQuery('.suggested-domains').is(':visible');
    var availabilityPill = jQuery('[data-domain-availability-pill]');
    var visibleSuggestionCount = jQuery('#domainSuggestions .domain').filter(function () {
        return jQuery(this).text().trim().length > 0;
    }).length;
    var availableCount = (primaryVisible ? 1 : 0) + visibleSuggestionCount;

    if (!results.length || !placeholder.length) {
        return;
    }

    var hasVisibleResults = results.is(':visible') && (primaryVisible || suggestionsVisible);
    placeholder.toggle(!hasVisibleResults);

    if (availabilityPill.length) {
        if (hasVisibleResults) {
            availabilityPill.text((availableCount || 1) + ' Available');
        } else {
            availabilityPill.text('Search to View');
        }
    }
}

jQuery(document).ready(function() {
    var hostiqueDomainForm = document.getElementById('frmDomainChecker');
    var hostiqueCheckButton = document.getElementById('btnCheckAvailability');

    if (hostiqueDomainForm) {
        hostiqueDomainForm.addEventListener('submit', hostiqueComposeDomainValue, true);
    }

    if (hostiqueCheckButton) {
        hostiqueCheckButton.addEventListener('click', hostiqueComposeDomainValue, true);
        hostiqueCheckButton.addEventListener('mousedown', hostiqueComposeDomainValue, true);
    }

    jQuery('#frmDomainChecker').on('submit', function () {
        hostiqueComposeDomainValue();
        jQuery('[data-domain-results-placeholder]').hide();
        if (!jQuery('#DomainSearchResults').is(':visible')) {
            window.setTimeout(function () {
                jQuery('#DomainSearchResults').fadeIn();
                syncHostiqueDomainResultsPlaceholder();
            }, 180);
        }
    });
    jQuery('.tld-filters a:first-child').click();
{if $lookupTerm && !$captchaError && !$invalid}
    jQuery('#btnCheckAvailability').click();
{/if}
{if $invalid}
    jQuery('#primaryLookupSearching').toggle();
    jQuery('#primaryLookupResult').children().toggle();
    jQuery('#primaryLookupResult').toggle();
    jQuery('#DomainSearchResults').toggle();
    jQuery('.domain-invalid').toggle();
{/if}
    syncHostiqueDomainResultsPlaceholder();
    hostiqueRepairSuggestionRows();
    jQuery('#btnCheckAvailability').on('click', function () {
        hostiqueComposeDomainValue();
    });
    jQuery('#inputDomain').on('keydown', function (event) {
        if (event.key === 'Enter') {
            hostiqueComposeDomainValue();
        }
    });
    hostiqueSetSelectedTld(jQuery('#hostiqueTldSelect').val() || '.com');
    jQuery('#hostiqueTldSelect').on('change', function () {
        hostiqueSetSelectedTld(jQuery(this).val());
        if (jQuery('#inputDomain').val().trim()) {
            hostiqueComposeDomainValue();
        }
    });
    jQuery(document).on('click keydown', '.hostique-domain-extension-chip[data-tld]', function (event) {
        if (event.type === 'keydown' && event.key !== 'Enter' && event.key !== ' ') {
            return;
        }
        event.preventDefault();
        hostiqueSetSelectedTld(jQuery(this).data('tld'));
    });
    jQuery(document).on('click', '#moreSuggestions', function (event) {
        event.preventDefault();
        hostiqueLoadMoreSuggestions();
    });
    jQuery('#btnCheckAvailability').on('click', function () {
        jQuery('[data-domain-results-placeholder]').hide();
        window.setTimeout(syncHostiqueDomainResultsPlaceholder, 300);
        window.setTimeout(syncHostiqueDomainResultsPlaceholder, 1000);
        window.setTimeout(syncHostiqueDomainResultsPlaceholder, 2200);
        window.setTimeout(hostiqueNormalizeSuggestions, 1200);
        window.setTimeout(hostiqueNormalizeSuggestions, 2600);
    });
    jQuery(document).on('click', '.btn-add-to-cart, #moreSuggestions', function () {
        syncHostiqueDomainResultsPlaceholder();
    });
    jQuery(document).ajaxComplete(function () {
        window.setTimeout(syncHostiqueDomainResultsPlaceholder, 150);
        window.setTimeout(hostiqueRepairSuggestionRows, 180);
        window.setTimeout(hostiqueNormalizeSuggestions, 220);
    });
    if (window.MutationObserver) {
        var domainResultsNode = document.getElementById('DomainSearchResults');
        if (domainResultsNode) {
            var resultsObserver = new MutationObserver(function () {
                syncHostiqueDomainResultsPlaceholder();
            });
            resultsObserver.observe(domainResultsNode, {
                childList: true,
                subtree: true,
                attributes: true,
                attributeFilter: ['class', 'style']
            });
        }
    }

    window.setTimeout(hostiqueRepairSuggestionRows, 120);
});

window.loadMoreSuggestions = hostiqueLoadMoreSuggestions;

{if $showAdvancedSearchOptions}
    $(document).ready(function() {
        jQuery('#frmDomainChecker .multiselect').each(function () {
            const enableFiltering = $(this).hasClass('multiselect-filter');
            const minSelection = jQuery(this).data('min-selection');
            $(this).multiselect({
                onChange: function (element) {
                    const closestSelect = element.closest('select');
                    const selectedOptions = closestSelect.find('option:selected');
                    if (minSelection === undefined) {
                        return;
                    }
                    const atMinOptions = selectedOptions.length <= minSelection;
                    const targetOptions = atMinOptions ? selectedOptions : closestSelect.find('option');
                    targetOptions.each(function () {
                        const inputElement = jQuery('input[value="' + jQuery(this).val() + '"]');
                        inputElement.prop('disabled', atMinOptions ? 'disabled' : false);
                    });
                },
                buttonText: function(options, select) {
                    return select.data('placeholder');
                },
                maxHeight: 200,
                includeFilterClearBtn: false,
                enableCaseInsensitiveFiltering: enableFiltering,
            });
        })
    });
{/if}
</script>
