{* views/templates/admin/configure.tpl *}
<div class="panel">
    <div class="panel-heading">
        <i class="icon-link"></i> {l s='Product Link Checker Configuration' mod='productlinkchecker'}
    </div>

    <div class="alert alert-info">
        <h4><i class="icon-key"></i> {l s='Your Security Token' mod='productlinkchecker'}</h4>
        <p>{l s='Use this token to access the link generators below. Keep it secret!' mod='productlinkchecker'}</p>
        <p><strong>{$security_token|escape:'html':'UTF-8'}</strong></p>
    </div>

    <div class="panel">
        <div class="panel-heading">
            <i class="icon-cogs"></i> {l s='URL Generator' mod='productlinkchecker'}
        </div>

        <!-- Nav tabs -->
        <ul class="nav nav-tabs" role="tablist">
            <li role="presentation" class="active"><a href="#products" aria-controls="products" role="tab" data-toggle="tab"><i class="icon-tags"></i> {l s='Product Links' mod='productlinkchecker'}</a></li>
            <li role="presentation"><a href="#categories" aria-controls="categories" role="tab" data-toggle="tab"><i class="icon-folder"></i> {l s='Category Links' mod='productlinkchecker'}</a></li>
        </ul>

        <!-- Tab panes -->
        <div class="tab-content">
            {* --- PRODUCT URL BUILDER --- *}
            <div role="tabpanel" class="tab-pane active" id="products">
                <form class="form-horizontal" id="product-url-builder">
                    <h4>{l s='1. Select Filters' mod='productlinkchecker'}</h4>
                    <div class="form-group">
                        <label class="col-lg-3 control-label">{l s='Shop' mod='productlinkchecker'}</label>
                        <div class="col-lg-9">
                            <select name="plc_id_shop" class="plc-builder-input" data-type="product">
                                <option value="">{l s='All Shops' mod='productlinkchecker'}</option>
                                {foreach from=$shops item=shop}
                                    <option value="{$shop.id_shop|intval}">{$shop.name|escape:'html':'UTF-8'}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-lg-3 control-label">{l s='Language' mod='productlinkchecker'}</label>
                        <div class="col-lg-9">
                            <select name="plc_id_lang" class="plc-builder-input" data-type="product">
                                <option value="">{l s='All Languages' mod='productlinkchecker'}</option>
                                {foreach from=$languages item=lang}
                                    <option value="{$lang.id_lang|intval}">{$lang.name|escape:'html':'UTF-8'}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                     <div class="form-group">
                        <label class="col-lg-3 control-label">{l s='Status' mod='productlinkchecker'}</label>
                        <div class="col-lg-9">
                             <span class="switch prestashop-switch fixed-width-lg">
                                <input type="radio" name="plc_only_active" id="plc_only_active_prod_on" value="1" class="plc-builder-input" data-type="product">
                                <label for="plc_only_active_prod_on">{l s='Active Only' mod='productlinkchecker'}</label>
                                <input type="radio" name="plc_only_active" id="plc_only_active_prod_off" value="" class="plc-builder-input" data-type="product" checked="checked">
                                <label for="plc_only_active_prod_off">{l s='All' mod='productlinkchecker'}</label>
                                <a class="slide-button btn"></a>
                            </span>
                        </div>
                    </div>

                    <hr>
                    <h4>{l s='2. Select Data Fields to Include' mod='productlinkchecker'}</h4>
                     <div class="form-group">
                        <div class="col-lg-9 col-lg-offset-3">
                            {foreach from=$product_fields key=key item=label}
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" name="{$key|escape:'html':'UTF-8'}" value="1" class="plc-builder-input" data-type="product"> {$label|escape:'html':'UTF-8'}
                                    </label>
                                </div>
                            {/foreach}
                        </div>
                    </div>
                    
                    <hr>
                    <h4>{l s='3. Generated URL' mod='productlinkchecker'}</h4>
                    <div class="form-group">
                         <div class="col-lg-12">
                            <div class="input-group">
                                <input type="text" id="generated-url-product" class="form-control" readonly>
                                <span class="input-group-btn">
                                    <button class="btn btn-default" type="button" onclick="copyToClipboard('product')">
                                        <i class="icon-copy"></i> {l s='Copy' mod='productlinkchecker'}
                                    </button>
                                    <a href="#" id="open-url-product" target="_blank" class="btn btn-primary">
                                        <i class="icon-external-link"></i> {l s='Open' mod='productlinkchecker'}
                                    </a>
                                </span>
                            </div>
                         </div>
                    </div>
                </form>
            </div>

            {* --- CATEGORY URL BUILDER --- *}
            <div role="tabpanel" class="tab-pane" id="categories">
                 <form class="form-horizontal" id="category-url-builder">
                    <h4>{l s='1. Select Filters' mod='productlinkchecker'}</h4>
                    <div class="form-group">
                        <label class="col-lg-3 control-label">{l s='Shop' mod='productlinkchecker'}</label>
                        <div class="col-lg-9">
                            <select name="plc_id_shop" class="plc-builder-input" data-type="category">
                                <option value="">{l s='All Shops' mod='productlinkchecker'}</option>
                                {foreach from=$shops item=shop}
                                    <option value="{$shop.id_shop|intval}">{$shop.name|escape:'html':'UTF-8'}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-lg-3 control-label">{l s='Language' mod='productlinkchecker'}</label>
                        <div class="col-lg-9">
                            <select name="plc_id_lang" class="plc-builder-input" data-type="category">
                                <option value="">{l s='All Languages' mod='productlinkchecker'}</option>
                                {foreach from=$languages item=lang}
                                    <option value="{$lang.id_lang|intval}">{$lang.name|escape:'html':'UTF-8'}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                     <div class="form-group">
                        <label class="col-lg-3 control-label">{l s='Status' mod='productlinkchecker'}</label>
                        <div class="col-lg-9">
                             <span class="switch prestashop-switch fixed-width-lg">
                                <input type="radio" name="plc_only_active" id="plc_only_active_cat_on" value="1" class="plc-builder-input" data-type="category">
                                <label for="plc_only_active_cat_on">{l s='Active Only' mod='productlinkchecker'}</label>
                                <input type="radio" name="plc_only_active" id="plc_only_active_cat_off" value="" class="plc-builder-input" data-type="category" checked="checked">
                                <label for="plc_only_active_cat_off">{l s='All' mod='productlinkchecker'}</label>
                                <a class="slide-button btn"></a>
                            </span>
                        </div>
                    </div>

                    <hr>
                    <h4>{l s='2. Select Data Fields to Include' mod='productlinkchecker'}</h4>
                     <div class="form-group">
                        <div class="col-lg-9 col-lg-offset-3">
                            {foreach from=$category_fields key=key item=label}
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" name="{$key|escape:'html':'UTF-8'}" value="1" class="plc-builder-input" data-type="category"> {$label|escape:'html':'UTF-8'}
                                    </label>
                                </div>
                            {/foreach}
                        </div>
                    </div>
                    
                    <hr>
                    <h4>{l s='3. Generated URL' mod='productlinkchecker'}</h4>
                    <div class="form-group">
                         <div class="col-lg-12">
                            <div class="input-group">
                                <input type="text" id="generated-url-category" class="form-control" readonly>
                                <span class="input-group-btn">
                                    <button class="btn btn-default" type="button" onclick="copyToClipboard('category')">
                                        <i class="icon-copy"></i> {l s='Copy' mod='productlinkchecker'}
                                    </button>
                                    <a href="#" id="open-url-category" target="_blank" class="btn btn-primary">
                                        <i class="icon-external-link"></i> {l s='Open' mod='productlinkchecker'}
                                    </a>
                                </span>
                            </div>
                         </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
    // Base URLs and token from Smarty
    const baseUrls = {
        product: '{$product_controller_url|escape:'javascript':'UTF-8'}',
        category: '{$category_controller_url|escape:'javascript':'UTF-8'}'
    };
    const token = '{$security_token|escape:'javascript':'UTF-8'}';

    // Function to build the URL based on selected options
    const buildUrl = (type) => {
        let baseUrl = baseUrls[type];
        let params = new URLSearchParams();
        params.append('token', token);

        const form = document.getElementById(type + '-url-builder');
        const inputs = form.querySelectorAll('.plc-builder-input');

        inputs.forEach(input => {
            if (input.type === 'checkbox' || input.type === 'radio') {
                if (input.checked && input.value) {
                    params.append(input.name, input.value);
                }
            } else { // select
                if (input.value) {
                    params.append(input.name, input.value);
                }
            }
        });
        
        const finalUrl = baseUrl + '?' + params.toString();

        document.getElementById('generated-url-' + type).value = finalUrl;
        document.getElementById('open-url-' + type).href = finalUrl;
    };
    
    // Attach event listeners to all inputs
    document.querySelectorAll('.plc-builder-input').forEach(input => {
        input.addEventListener('change', (event) => {
            buildUrl(event.target.dataset.type);
        });
    });

    // Initial build for both tabs on page load
    buildUrl('product');
    buildUrl('category');
});

// Simple copy to clipboard function
function copyToClipboard(type) {
    const urlInput = document.getElementById('generated-url-' + type);
    urlInput.select();
    document.execCommand('copy');
    // Optional: show a small feedback message
    showSuccessMessage('{l s="URL copied to clipboard!" mod='productlinkchecker' js=1}');
}
</script>