import tippy from 'tippy.js';


const showEventData = (info) => {
    if (
        info.event.url === ''
        && info.event.extendedProps.location === undefined
        && info.event.extendedProps.url === undefined
    ) {
        return
    }

    info.jsEvent.preventDefault();

    const popup = tippy(
        info.el,
        {
            content: `
                <div class="p-2 flex flex-col gap-3 text-white">
                    ${
                        (info.event.extendedProps.location !== undefined) ?
                        `
                            <div class="flex gap-2 items-baseline">
                                <i class="ico--location" aria-label="Místo konání"></i>
                                <div>${info.event.extendedProps.location}</div>
                            </div>
                        ` : ''
                    }
                    ${
                        (info.event.extendedProps.description !== undefined) ?
                        `
                            <div class="flex gap-2 items-baseline">
                                <i class="ico--info" aria-label="Popis"></i>
                                <div>${info.event.extendedProps.description}</div>
                            </div>
                        ` : ''
                    }
                    ${
                        (info.event.url !== '') ?
                        `
                            <div class="flex gap-2 items-baseline">
                                <i class="ico--link" aria-label="Adresa"></i>
                                <a class="underline cursor-pointer" href="${info.event.url}">${info.event.url}</a>
                            </div>
                        ` : ''
                    }
                </div>
            `,
            trigger: (
                (
                    info.event.url !== ''
                    && info.event.extendedProps.location === undefined
                    && info.event.extendedProps.url === undefined
                ) ?
                'hover' : 'click'
            ),
            allowHTML: true,
            interactive: true
        }
    );

    popup.show();
} 

export { showEventData }