{"version":3,"file":"DGBy-ztu.js","sources":["../../../../components/content/Custom/EventTile.vue"],"sourcesContent":["<script setup>\nimport { atcb_action } from \"add-to-calendar-button\"\nimport { format } from 'date-fns-tz'\nimport formatDistanceToNow from 'date-fns/formatDistanceToNow'\nconst props = defineProps({\n    event: Object,\n    listed: Boolean\n})\nlet { page } = useContent()\n\nif (props.event) {\n    page = ref(props.event)\n}\n\nconst noDate = page.value.noDate ?? false\n\nconst date = computed(() => {\n    const eventDate = {}\n    if (Array.isArray(page.value.date)) {\n        eventDate.startDate = new Date(page.value.date[0])\n        eventDate.endDate = new Date(page.value.date[1])\n    } else {\n        eventDate.startDate = new Date(page.value.date)\n    }\n    return eventDate\n})\nconst longDate = computed(() => {\n    let longDateText = \"\"\n    longDateText = `${format(date.value.startDate, \"EEEE\")}`\n    if (date.value?.endDate) {\n        longDateText += `-${format(date.value.endDate, \"EEEE\")}`\n    }\n    longDateText += `, ${format(date.value.startDate, \"LLLL\")}`\n    longDateText += ` ${format(date.value.startDate, \"dd\")}`\n    if (date.value?.endDate) {\n        longDateText += `-${format(date.value.endDate, \"dd\")}`\n    }\n    if (page.value.timezone) {\n        const eventTime = date.value.startDate.toLocaleTimeString('en-US', { timeZone: page.value.timezone, timeZoneName: \"short\", hour: \"2-digit\", minute: \"2-digit\" })\n        /* User have same timezone as event */\n        if (Intl.DateTimeFormat().resolvedOptions().timeZone === page.value.timezone) {\n            longDateText += ` (${eventTime})`\n        } else {\n            longDateText += ` (${eventTime}, ${format(date.value.startDate, 'HH:mm (z)')})`\n        }\n    }\n    return longDateText\n})\n\nconst addToCalendar = (ev) => {\n    const config = {\n        name: `[Reminder] ${page.value.title} (Pathway)`,\n        description: `${page.value.title}, ${page.value.description}`,\n        startDate: `${format(date.value.startDate, \"yyyy-MM-dd\")}`,\n        options: [\"Google\", \"Apple\", \"Outlook.com\"],\n        location: page.value.location.long\n    }\n    if (date.value?.endDate) {\n        config.endDate = `${format(date.value.endDate, \"yyyy-MM-dd\")}`\n    }\n    if (page.value?.timezone) {\n        config.timeZone = page.value.timezone\n        const eventStartTime = date.value.startDate.toLocaleTimeString('en-US', { timeZone: page.value.timezone, hour: \"2-digit\", minute: \"2-digit\" })\n        config.startTime = eventStartTime\n        if (date.value?.endDate) {\n            const eventEndTime = date.value.endDate.toLocaleTimeString('en-US', { timeZone: page.value.timezone, hour: \"2-digit\", minute: \"2-digit\" })\n            config.endTime = eventEndTime\n        }\n    }\n    atcb_action(config, ev.currentTarget)\n}\n\n\nconst shouldShowYear = () => {\n    console.log(\"SHOULD?\")\n    const startYear = format(date.startDate, 'yyyy')\n    const currentYear = format(new Date(), 'yyyy')\n    return startYear !== currentYear\n}\n</script>\n<template>\n    <div class=\"shadow-lg max-w-3xl w-full bg-white border-[#E0DEE2] border rounded-lg relative mx-auto my-8 eventcard\">\n        <div class=\"h-[9rem]\">\n            <div class=\"absolute flex items-center top-0 left-0 w-full p-2\"\n                :class=\"[listed ? 'justify-end' : 'justify-between']\">\n                <nuxt-link to=\"/events/\" class=\"text-white\" v-if=\"!listed\">\n                    <span class=\"flex items-center gap-2 shrink-0\">\n                        <Icon name=\"ion:arrow-back\" class=\"w-5 h-5\" /> All events\n                    </span>\n                </nuxt-link>\n                <div class=\"flex gap-2 items-center drop-shadow-md\" v-if=\"!noDate\">\n                    <Icon name=\"mdi:event-star\" class=\"text-white w-5 h-5\" />\n                    <span class=\"text-white text-sm\">{{ format(date.startDate, 'dd/MM/yyyy') }}</span>\n                </div>\n            </div>\n            <img :src=\"page.banner\" alt=\"\" class=\"h-[9rem] w-full object-cover rounded-t-lg\">\n        </div>\n        <div class=\"flex items-center flex-col md:flex-row gap-4 pw-text-black p-4\">\n            <div v-if=\"!noDate\"\n                class=\"flex flex-col relative shrink-0 leading-6 z-[2] items-center justify-center w-[4.5rem] h-[4.5rem] bg-primary-100 rounded-lg text-primary-500 font-bold\">\n                <span class=\"text-[1.2rem]\">{{ format(date.startDate, 'LLL') }}</span>\n                <span class=\"text-[1.8rem]\">{{ format(date.startDate, 'dd') }}</span>\n                <span class=\"text-sm absolute -bottom-6 p-1 w-full text-center -z-[5] bg-primary-200 rounded-b-lg\"\n                    v-if=\"shouldShowYear\">{{\n                        format(date.startDate, 'yyyy') }}</span>\n            </div>\n            <div class=\"flex flex-wrap md:flex-nowrap justify-between items-center w-full text-center lg:text-left\">\n                <div class=\"text-center mx-auto md:mx-0 lg:text-left\">\n                    <nuxt-link :to=\"page._path\" class=\"font-bold text-2xl\">\n                        <h1>{{ page.title }}</h1>\n                    </nuxt-link>\n                    <p class=\"text-[#676161] pr-1\">{{ page.description }}</p>\n                </div>\n                <div class=\"mx-auto mt-4 md:mt-0\" v-if=\"!noDate\">\n                    <button type=\"button\"\n                        class=\"shadow-md hover:shadow  text-sm transition flex gap-2 items-center px-4 py-2 rounded-lg whitespace-nowrap\"\n                        @click=\"addToCalendar\">\n                        <Icon name=\"material-symbols:calendar-add-on\" /> Add to Calendar\n                    </button>\n                </div>\n\n            </div>\n        </div>\n        <div class=\"border-t py-4 mx-4\" v-if=\"!listed\">\n            <slot />\n        </div>\n        <div class=\"border-t py-4 mx-4\">\n            <div class=\"flex flex-col md:flex-row justify-between items-center text-[#928C99] leading-5\">\n                <div class=\"flex flex-col gap-2\">\n                    <div class=\"flex gap-2 items-center\" v-if=\"!noDate\">\n                        <Icon name=\"mingcute:time-line\" class=\"w-8 h-8\" />\n                        <client-only>\n                            <div class=\"flex flex-col\">\n                                <span>{{ longDate }}</span>\n                                <span class=\"text-sm\"> {{ formatDistanceToNow(date.startDate, { addSuffix: true }) }}\n                                </span>\n                            </div>\n                        </client-only>\n                    </div>\n                    <div class=\"flex gap-2 items-center\">\n                        <Icon name=\"tdesign:location\" class=\"w-8 h-8\" />\n                        <div class=\"flex flex-col\">\n                            <span> {{ page.location.short }} </span>\n                            <span class=\"text-sm\"> {{ page.location.long }} </span>\n                        </div>\n                    </div>\n                </div>\n                <nuxt-link :to=\"page._path\" v-if=\"listed\"\n                    class=\"px-6 py-4 mt-4 w-full text-center md:w-max md:mt-0 bg-primary-100 text-primary-500 font-bold rounded-lg\">\n                    Read More\n                </nuxt-link>\n                <nuxt-link :to=\"page.href\" v-else-if=\"page?.buttons?.signup\"\n                    class=\"px-6 py-4 mt-4 w-full text-center md:w-max max-w-xs md:mt-0 bg-primary-100 text-primary-500 font-bold rounded-lg\">\n                    {{ page.buttons.signup }}\n                </nuxt-link>\n            </div>\n        </div>\n    </div>\n</template>\n"],"names":["props","__props","page","useContent","ref","noDate","date","computed","eventDate","longDate","longDateText","format","_a","_b","eventTime","addToCalendar","ev","config","eventStartTime","_c","eventEndTime","atcb_action","shouldShowYear","startYear","currentYear"],"mappings":"gnDAIA,MAAMA,EAAQC,EAId,GAAI,CAAE,KAAAC,CAAM,EAAGC,EAAU,EAErBH,EAAM,QACNE,EAAOE,EAAIJ,EAAM,KAAK,GAG1B,MAAMK,EAASH,EAAK,MAAM,QAAU,GAE9BI,EAAOC,EAAS,IAAM,CACxB,MAAMC,EAAY,CAAA,EAClB,OAAI,MAAM,QAAQN,EAAK,MAAM,IAAI,GAC7BM,EAAU,UAAY,IAAI,KAAKN,EAAK,MAAM,KAAK,CAAC,CAAC,EACjDM,EAAU,QAAU,IAAI,KAAKN,EAAK,MAAM,KAAK,CAAC,CAAC,GAE/CM,EAAU,UAAY,IAAI,KAAKN,EAAK,MAAM,IAAI,EAE3CM,CACX,CAAC,EACKC,EAAWF,EAAS,IAAM,SAC5B,IAAIG,EAAe,GAUnB,GATAA,EAAe,GAAGC,EAAOL,EAAK,MAAM,UAAW,MAAM,CAAC,IAClDM,EAAAN,EAAK,QAAL,MAAAM,EAAY,UACZF,GAAgB,IAAIC,EAAOL,EAAK,MAAM,QAAS,MAAM,CAAC,IAE1DI,GAAgB,KAAKC,EAAOL,EAAK,MAAM,UAAW,MAAM,CAAC,GACzDI,GAAgB,IAAIC,EAAOL,EAAK,MAAM,UAAW,IAAI,CAAC,IAClDO,EAAAP,EAAK,QAAL,MAAAO,EAAY,UACZH,GAAgB,IAAIC,EAAOL,EAAK,MAAM,QAAS,IAAI,CAAC,IAEpDJ,EAAK,MAAM,SAAU,CACrB,MAAMY,EAAYR,EAAK,MAAM,UAAU,mBAAmB,QAAS,CAAE,SAAUJ,EAAK,MAAM,SAAU,aAAc,QAAS,KAAM,UAAW,OAAQ,SAAW,CAAA,EAE3J,KAAK,eAAc,EAAG,gBAAe,EAAG,WAAaA,EAAK,MAAM,SAChEQ,GAAgB,KAAKI,CAAS,IAE9BJ,GAAgB,KAAKI,CAAS,KAAKH,EAAOL,EAAK,MAAM,UAAW,WAAW,CAAC,GAExF,CACI,OAAOI,CACX,CAAC,EAEKK,EAAiBC,GAAO,WAC1B,MAAMC,EAAS,CACX,KAAM,cAAcf,EAAK,MAAM,KAAK,aACpC,YAAa,GAAGA,EAAK,MAAM,KAAK,KAAKA,EAAK,MAAM,WAAW,GAC3D,UAAW,GAAGS,EAAOL,EAAK,MAAM,UAAW,YAAY,CAAC,GACxD,QAAS,CAAC,SAAU,QAAS,aAAa,EAC1C,SAAUJ,EAAK,MAAM,SAAS,IACtC,EAII,IAHIU,EAAAN,EAAK,QAAL,MAAAM,EAAY,UACZK,EAAO,QAAU,GAAGN,EAAOL,EAAK,MAAM,QAAS,YAAY,CAAC,KAE5DO,EAAAX,EAAK,QAAL,MAAAW,EAAY,SAAU,CACtBI,EAAO,SAAWf,EAAK,MAAM,SAC7B,MAAMgB,EAAiBZ,EAAK,MAAM,UAAU,mBAAmB,QAAS,CAAE,SAAUJ,EAAK,MAAM,SAAU,KAAM,UAAW,OAAQ,SAAW,CAAA,EAE7I,GADAe,EAAO,UAAYC,GACfC,EAAAb,EAAK,QAAL,MAAAa,EAAY,QAAS,CACrB,MAAMC,EAAed,EAAK,MAAM,QAAQ,mBAAmB,QAAS,CAAE,SAAUJ,EAAK,MAAM,SAAU,KAAM,UAAW,OAAQ,SAAW,CAAA,EACzIe,EAAO,QAAUG,CAC7B,CACA,CACIC,EAAYJ,EAAQD,EAAG,aAAa,CACxC,EAGMM,EAAiB,IAAM,CACzB,QAAQ,IAAI,SAAS,EACrB,MAAMC,EAAYZ,EAAOL,EAAK,UAAW,MAAM,EACzCkB,EAAcb,EAAO,IAAI,KAAQ,MAAM,EAC7C,OAAOY,IAAcC,CACzB"}