diff options
-rw-r--r-- | app/birds/views.py | 8 | ||||
-rw-r--r-- | design/sass/_birds.scss | 14 | ||||
-rw-r--r-- | design/templates/details/bird.html | 20 |
3 files changed, 39 insertions, 3 deletions
diff --git a/app/birds/views.py b/app/birds/views.py index ea789fc..4d7f59e 100644 --- a/app/birds/views.py +++ b/app/birds/views.py @@ -39,5 +39,11 @@ class BirdDetailView(DetailView): bird__slug=self.kwargs['slug'] ) except BirdAudio.DoesNotExist: - return context + pass + try: + context['sighting'] = BirdSighting.objects.get( + bird__slug=self.kwargs['slug'] + ) + except BirdSighting.DoesNotExist: + pass return context diff --git a/design/sass/_birds.scss b/design/sass/_birds.scss index 8e82411..9662f7c 100644 --- a/design/sass/_birds.scss +++ b/design/sass/_birds.scss @@ -19,3 +19,17 @@ } .audio small { display: block;} } + +.birds { + .map { + margin: 0 auto; + width: 99%; + height: 200px; + @include constrain_wide; + @include breakpoint(beta) { + @include constrain_narrow; + } + } +} + + diff --git a/design/templates/details/bird.html b/design/templates/details/bird.html index 0a91317..9676683 100644 --- a/design/templates/details/bird.html +++ b/design/templates/details/bird.html @@ -1,13 +1,29 @@ {% extends 'base.html' %} {% block extrahead %} +<style> +#detail-map-canvas { height: 100%;} +</style> {% endblock %} +{% block bodyid %}class="birds"{%endblock%} {% block primary %} <main> -{{object.common_name}} +<article> +<h1>{{object.common_name}}</h1> +<p id="endnode">Seen by {% for person in sighting.seen_by.all %}<a href="/birds/{{person}}/">{{person}}</a>{%if forloop.last %}{%else%}{% if forloop.revcounter == 2 %}, and {%else%}, {%endif%}{%endif%}{%endfor%}</p> + <audio autoplay="autoplay" controls="controls"> <source src="/media/{{recording.audio}}" /> </audio> - +</article> </main> {% endblock %} +{% block js %} +<script src="/media/js/leaflet-master/leaflet-mod.js"></script> +<script src="/media/js/detail.min.js"></script> +<script type="text/javascript"> +window.onload = function() { + createBirdMap({{sighting.latitude}},{{sighting.longitude}}, 12, { type:'point', lat:'{{sighting.latitude}}', lon:'{{sighting.longitude}}'}); return false; +} +</script> +{% endblock %} |