@@ -0,0 +1,157 @@
1+{% extends "base.html" %}
2+{% import "macros/macros.html" as macros %}
5+ <meta name="og:title" content="Events - {{ config.title }}">
6+ <title>Events - {{ config.title }}</title>
9+{% block description %}
10+ <meta name="og:description" content="Events facilitated by the Urbit Foundation.">
11+ <meta name="description" content="Events facilitated by the Urbit Foundation.">
12+{% endblock description %}
15+{% set posts = get_section(path="events/_index.md") %}
17+<nav class="mt4 full fourth-1-lg mb3 mb0-m mb0-l mb0-xl fixed-xl">
18+ <a class="gray3" href="/">Urbit</a>
19+ <span class="gray3"> / </span>
20+ <a href="/events/">Events</a>
22+ {% include "partials/navigation-search.html" %}
24+ <ol id="event_months" class="pa0" style="position: sticky; top: 0;"></ol>
27+<section class="full c4-12-lg pt4">
29+ <section id="upcoming" class="grid12"></section>
31+ <section id="past" class="grid12"></section>
33+ {% for page in posts.pages %}
34+ <article data-date="{{ page.date }}" id="event-{{ page.slug }}" class="event mb4 c1-10-lg full {% if page.extra.pinned %}bg-gray4 na3 pa3{% endif %}">
35+ <a href="{{ page.permalink }}" class="no-underline bb-0 grid12">
36+ <h1 class="full">{{ page.title }}</h1>
37+ <div class="measure-wide full c1-8-lg">
38+ {% if page.extra.description %}
39+ <p class="lh-copy">{{ page.extra.description }}</p>
41+ {{ macros::event_metadata(page=page, classes="mt2")}}
43+ {% if page.extra.image %}
44+ <img class="db mv2 h4 ba obj-cover full c8-13-lg" src="{{ page.extra.image }}" />
51+ const upcoming = document.getElementById('upcoming');
52+ const past = document.getElementById('past');
53+ const upcomingEvents = [];
54+ const pastEvents = [];
55+ Array.from(document.querySelectorAll('article[data-date')).forEach(function (article) {
56+ article.parentElement.removeChild(article);
57+ const articleDate = Date.parse(article.dataset.date);
58+ if(articleDate - Date.now() > 0) {
59+ upcomingEvents.push([articleDate, article]);
61+ pastEvents.push([articleDate, article]);
65+ upcomingEvents.sort(function (articleA, articleB) {
66+ return articleA[0] - articleB[0];
69+ pastEvents.sort(function (articleA, articleB) {
70+ return articleB[0] - articleA[0];
73+ const upcomingHeader = document.createElement('h2');
74+ upcomingHeader.className = 'mb4 full';
75+ upcomingHeader.innerText = 'Upcoming Events';
76+ upcoming.appendChild(upcomingHeader);
78+ upcomingEvents.forEach(function (event) {
79+ upcoming.appendChild(event[1]);
82+ const pastHeader = document.createElement('h2');
83+ pastHeader.className = 'mb4 full';
84+ pastHeader.innerText = 'Past Events';
85+ past.appendChild(pastHeader);
87+ pastEvents.forEach(function (event) {
88+ past.appendChild(event[1]);
107+ const wrapper = document.getElementById('event_months');
109+ Array.from(document.querySelectorAll('article[data-date]')).forEach(function (event) {
110+ const date = new Date(Date.parse(event.dataset.date));
111+ const year = date.getFullYear();
112+ if (!years.hasOwnProperty(year)) {
115+ const month = date.getMonth();
116+ if (!years[year].hasOwnProperty(month)) {
117+ years[year][month] = [];
119+ years[year][month].push(event.id);
121+ Object.keys(years).reverse().forEach(function (year) {
122+ const yearItem = document.createElement('li');
123+ yearItem.className = 'pt2';
124+ const header = document.createElement('span');
125+ header.className = 'f5';
126+ header.innerText = year;
127+ yearItem.appendChild(header);
128+ const monthList = document.createElement('ol');
129+ monthList.className = 'pa0 months';
130+ yearItem.appendChild(monthList);
131+ Object.keys(years[year]).reverse().forEach(function (month) {
132+ const monthItem = document.createElement('li');
133+ monthItem.className = 'pt1';
134+ const header = document.createElement('span');
135+ header.className = 'f6';
136+ header.innerText = monthMap[month];
137+ monthItem.appendChild(header);
138+ const articleList = document.createElement('ol');
139+ articleList.className = 'pa0 articles';
140+ monthItem.appendChild(articleList);
141+ monthList.appendChild(monthItem);
142+ years[year][month].forEach(function (id) {
143+ const articleItem = document.createElement('li');
144+ const link = document.createElement('a');
145+ link.className = 'bb f6 gray1';
146+ link.href = `#${id}`;
147+ link.innerText = document.getElementById(id).querySelector('h1').innerText;
148+ articleItem.appendChild(link);
149+ articleList.appendChild(articleItem);
152+ wrapper.appendChild(yearItem);
156+{% include "partials/footer.html" %}
157+{% endblock content %}