90 lines
3.6 KiB
Plaintext
90 lines
3.6 KiB
Plaintext
---
|
|
layout: layouts/been.njk
|
|
title: Been
|
|
permalink: /been/
|
|
description: All past check-ins captured by this site via Micropub.
|
|
withSidebar: true
|
|
leafletMap: true
|
|
---
|
|
{% set checkins = whereCheckins.checkins or [] %}
|
|
|
|
<div class="been-page">
|
|
<header class="mb-6 sm:mb-8">
|
|
<h1 class="text-2xl sm:text-3xl md:text-4xl font-bold text-surface-900 dark:text-surface-100 mb-2">Been</h1>
|
|
<p class="p-summary text-lg text-surface-600 dark:text-surface-400">
|
|
All past check-ins captured by this site via Micropub.
|
|
</p>
|
|
</header>
|
|
|
|
{% set mapPoints = [] %}
|
|
{% for c in checkins %}
|
|
{% if c.latitude and c.longitude %}
|
|
{% set mapPoints = (mapPoints.push({name: c.name, lat: c.latitude, lng: c.longitude, url: c.venueWebsiteUrl}), mapPoints) %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
|
|
{% if mapPoints.length %}
|
|
<div id="checkin-map" class="mb-8 rounded-lg overflow-hidden border border-surface-200 dark:border-surface-700" style="height: 420px;" aria-label="Map of past check-ins"></div>
|
|
<script>
|
|
var checkinPoints = {{ mapPoints | dump | safe }};
|
|
</script>
|
|
<script>
|
|
(function() {
|
|
L.Icon.Default.mergeOptions({
|
|
iconUrl: '/css/images/marker-icon.png',
|
|
iconRetinaUrl: '/css/images/marker-icon-2x.png',
|
|
shadowUrl: '/css/images/marker-shadow.png'
|
|
});
|
|
var map = L.map('checkin-map');
|
|
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
|
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
|
|
maxZoom: 19
|
|
}).addTo(map);
|
|
function escHtml(s) {
|
|
return String(s).replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"');
|
|
}
|
|
var cluster = L.markerClusterGroup({ maxClusterRadius: 40 });
|
|
var markers = checkinPoints.map(function(p) {
|
|
var safeName = escHtml(p.name);
|
|
var safeUrl = (p.url && p.url.indexOf('https://') === 0) ? p.url : '';
|
|
var popup = safeUrl
|
|
? '<a href="' + safeUrl + '" target="_blank" rel="noopener">' + safeName + '</a>'
|
|
: safeName;
|
|
return L.marker([p.lat, p.lng]).bindPopup(popup);
|
|
});
|
|
markers.forEach(function(m) { cluster.addLayer(m); });
|
|
map.addLayer(cluster);
|
|
map.fitBounds(cluster.getBounds().pad(0.2), { maxZoom: 13 });
|
|
})();
|
|
</script>
|
|
{% endif %}
|
|
|
|
{% if checkins.length %}
|
|
<ul class="divide-y divide-surface-200 dark:divide-surface-700" aria-label="Past check-ins">
|
|
{% for checkin in checkins %}
|
|
<li class="py-3">
|
|
<div class="font-medium text-surface-900 dark:text-surface-100">
|
|
{% if checkin.venueWebsiteUrl %}
|
|
<a href="{{ checkin.venueWebsiteUrl }}" target="_blank" rel="noopener" class="hover:underline">{{ checkin.name }}</a>
|
|
{% else %}
|
|
{{ checkin.name }}
|
|
{% endif %}
|
|
{% if checkin.isPrivate %}<span class="ml-2 text-xs text-amber-700 dark:text-amber-400">(private)</span>{% endif %}
|
|
</div>
|
|
<div class="text-sm text-surface-600 dark:text-surface-400 mt-0.5">
|
|
{% if checkin.locationText %}{{ checkin.locationText }}{% if checkin.postalCode %}, {{ checkin.postalCode }}{% endif %}{% elif checkin.postalCode %}{{ checkin.postalCode }}{% endif %}
|
|
{% if checkin.published %}
|
|
<span class="mx-1">·</span><time datetime="{{ checkin.published }}">{{ checkin.published | date("MMM d, yyyy") }}</time>
|
|
{% endif %}
|
|
</div>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% else %}
|
|
<p class="text-surface-600 dark:text-surface-400">No past check-ins found.</p>
|
|
{% endif %}
|
|
<p class="mt-2 text-sm">
|
|
<a href="/where/" class="text-accent-700 hover:underline">Back to newest check-in →</a>
|
|
</p>
|
|
</div>
|