Skip to content
Permalink
Browse files

Display nearby museums on musem page

  • Loading branch information
simonw committed Nov 28, 2019
1 parent 5b6a694 commit 8059c1f3eec37e5e5420db29a045d3a3add28a84
Showing with 34 additions and 0 deletions.
  1. +16 −0 static/museums.css
  2. +18 −0 templates/row-browse-museums.html
@@ -1461,11 +1461,27 @@ span.permanently-closed {
}
.map-section {
padding-top: 1.5rem;
padding-bottom: 1.5rem;
}
.articles {
padding-top: 0;
padding-bottom: 0;
}
.articles .title {
margin-bottom: 0.5rem;
}

.nearby-section {
padding-top: 0;
padding-bottom: 0;
}
.nearby-section .card h2 {
margin-top: 0;
}
.nearby-section .card {
overflow: hidden;
}
.nearby-section .card img {
margin-left: 1.5rem;
clear: both;
}
@@ -34,6 +34,24 @@ <h3 class="title is-5"><a href="{{ article.url }}">{{ article.title }}</a></h2>
</section>
{% endif %}
<section class="section map-section"><div id="themap"></div></section>
<section class="section nearby-section">
{% for museum in sql(
"select *, haversine(latitude, longitude, " ~ museum["latitude"] ~
", " ~ museum["longitude"] ~ ", 'mi') as distance_mi " ~
"from museums where id != " ~ museum["id"] ~
" and permanently_closed is null order by distance_mi limit 3"
) %}
<div class="card box">
<div class="content">
{% if museum.photo_url %}
<a href="/browse/museums/{{ museum.id }}"><img width="200" height="100" class="is-pulled-right" src="{{ museum.photo_url }}?w=400&amp;h=200&amp;fit=crop&amp;auto=compress" alt="{{ museum.photo_alt }}"></a>
{% endif %}
<h2><a href="/browse/museums/{{ museum.id }}">{{ museum.name }}</a></h2>
<p class="distance-away">{{ museum.distance_mi|round(2) }} miles away</p>
</div>
</div>
{% endfor %}
</section>
<script>
const latitude = {{ museum.latitude }};
const longitude = {{ museum.longitude }};

0 comments on commit 8059c1f

Please sign in to comment.
You can’t perform that action at this time.