1
0
Fork 0
mirror of https://github.com/web3privacy/web synced 2024-10-15 18:26:27 +02:00
web/src/pages/event/[id].astro

80 lines
3.5 KiB
Text
Raw Normal View History

2024-02-24 02:12:40 +01:00
---
import BaseLayout from '../../layouts/base.astro';
import SpeakerList from '../../components/SpeakerList.astro';
import core from '../../core.json';
import EventsExt from '../../events-ext.json';
import { dateFormat, dateInfo, dateEnd, nameRenderer, ccRenderer, eventStatus, findExt } from '../../lib/events.js';
import { marked } from 'marked';
const { id } = Astro.params;
export async function getStaticPaths() {
return core.events.map(event => ({ params: { id: event.id }}));
}
const item = core.events.find(event => event.id === id)
const status = eventStatus(item)
const ext = findExt(EventsExt, item)
---
<BaseLayout title={id} metaTitle={nameRenderer(item, true)}>
<div class="middle-pane-medium mt-10">
2024-02-24 02:24:55 +01:00
<div class="lg:flex w-full ">
<div class="lg:mr-10 mb-8 lg:mb-0">
<div><img src={ext ? ext.coverUrl : '/logo.svg'} class="rounded border border-white/20 w-80 aspect-square object-contain" class:list={[!ext ? 'p-10' : '']} /></div>
</div>
2024-02-24 02:12:40 +01:00
<div class="grow">
<h1 id="upcoming">W3PN {nameRenderer(item, true)}</h1>
<div class="flex gap-2 mb-4 text-lg">
<img src={`/flags/${item.country}.svg`} class="w-4" />
<div>
{item.city}, {item.country.toUpperCase()}
{item.coincidence &&
<span>&nbsp;- {ccRenderer(item)}</span>
}
</div>
</div>
<div>
<div>Date: <span class="text-white">{dateFormat(item.date)} {item.days ? ' - ' + dateFormat(dateEnd(item.date, item.days)) + ` (${item.days} days)` : ''}</span></div>
<div>
Venue: {item.place && <span class="text-white" set:html={marked.parseInline(item.place)}></span> || "TBD"}
{item.place && item['place-address'] &&
<span> @ </span>
<span class="text-white">{item['place-address']}</span>
}
</div>
<div>Status: <span class:list={[status.color]} class="mr-1.5 text-xs">●</span> {status.title}</div>
<div>Visitors:
{item.visitors &&
<span class="text-white">{item.visitors} people</span>
}
{!item.visitors && ext &&
<span><span class="text-white">{ext.guestCount > 0 ? (ext.guestCount + ' people') : 'n/a'}</span> {status.title === 'Pre-registration' ? 'pre-registered' : 'registered'}</span>
}
{!item.visitors && !ext &&
<span>n/a</span>
}
</div>
<div>Lead: <span class="text-white">{item.lead || 'n/a'}</span></div>
<div class="mt-4 mb-2">
{item.links?.rsvp &&
<a href={item.links.rsvp} class="button inverted"><button>{status.title === 'Pre-registration' ? 'Pre-registration' : 'Registration'}</button></a>
}
{item.links?.web &&
<a href={item.links.web} class="button inverted"><button>Website</button></a>
}
</div>
</div>
</div>
</div>
<SpeakerList {item} thumbSize="big"/>
</div>
</BaseLayout>