import 'jqueryLocal';
import {Tooltip} from 'bootstrap';

$(function () {
    $(document).on('click', '.collection-add', function (event) {
        event.preventDefault();

        const button = $(this);
        //region Ajoute la ligne
        const collectionId = button.data('collection');
        const collection = $('#' + collectionId);

        const deleteButton = $(`#${collectionId}__collection_entry_add-delete_button > *`);

        const rowPrototypePlaceholder = collection.data('prototypePlaceholder');
        const rowPrototypeIndex = collection.data('prototypeIndex');
        const rowPrototypeRaw = collection.data('prototypeCode').replaceAll(new RegExp(rowPrototypePlaceholder, 'g'), rowPrototypeIndex);
        const rowPrototype = $(rowPrototypeRaw);
        const rowPrototypeDiv = rowPrototype.find('#' + collectionId + '_' + rowPrototypeIndex);
        rowPrototypeDiv.append(deleteButton.clone());

        rowPrototype.insertBefore(button.parents('.row').first());
        collection.data('prototypeIndex', rowPrototypeIndex + 1);
        //endregion
    });
    $(document).on('click', '.collection-row-delete', function (event) {
        event.preventDefault();

        const button = $(this);
        //region Masque le tooltip (si existant) du bouton, car celui-ci va être supprimé en même temps que sa ligne
        const buttonTooltip = Tooltip.getInstance(button);
        if (buttonTooltip !== null) {
            buttonTooltip.hide();
        }
        //endregion
        //region Supprime la ligne
        button.parents('.collection-row').parent().parent().remove();
        //endregion
    });
});