{% extends 'base.html' %} {% load typogrify_tags %} {% load comments %} {% block pagetitle %}{{object.title|title|smartypants|safe}} - Luxagraf, Writing{%comment%}{% if object.country_name == "United States" %}{{object.location_name|smartypants|safe}}, {{object.state_name}}{%else%}{{object.location_name|smartypants|safe}}, {{object.country_name}}{%endif%}{%endcomment%}{% endblock %} {% block metadescription %}{% autoescape on %}{{object.meta_description|striptags|safe}}{% endautoescape %}{% endblock %} {%block extrahead%} <link rel="canonical" href="https://luxagraf.net{{object.get_absolute_url}}" /> <meta name="ICBM" content="{{object.latitude}}, {{object.longitude}}" /> <meta name="geo.position" content="{{object.latitude}}; {{object.longitude}}" /> <meta name="geo.placename" content="{% if object.country.name == "United States" %}{{object.location.name|smartypants|safe}}, {{object.state.name}}{%else%}{{object.location.name|smartypants|safe}}, {{object.country.name}}{%endif%}"> <meta name="geo.region" content="{{object.country.iso2}}{%if object.state.code != '' %}-{{object.state.code}}{%endif%}"> <meta property="og:type" content="article" /> <meta property="og:title" content="{{object.title|safe}}" /> <meta property="og:url" content="https://luxagraf.net{{object.get_absolute_url}}" /> <meta property="og:description" content="{{object.meta_description}}" /> <meta property="article:published_time" content="{{object.pub_date|date:'c'}}" /> <meta property="article:author" content="Luxagraf" /> <meta property="og:site_name" content="Luxagraf" />{% for image in object.get_images %} <meta property="og:image" content="{{image}}" />{% endfor %} <meta property="og:locale" content="en_US" /> <meta name="twitter:card" content="summary_large_image"/> <meta name="twitter:description" content="{{object.meta_description}}"/> <meta name="twitter:title" content="{{object.title|safe}}"/> <meta name="twitter:site" content="@luxagraf"/> <meta name="twitter:domain" content="luxagraf"/> <meta name="twitter:image:src" content="{{object.get_image_url}}"/> <meta name="twitter:creator" content="@luxagraf"/> {%endblock%} {%block htmlclass%}{% with object.template_name as t %} class="{%if t == 1 or t == 3 or t == 5 %}double{%else%}single{%endif%}{%if t == 2 or t == 3 %} dark{%endif%}{%if t == 4 or t == 5 %} black{%endif%}"{%endwith%}{%endblock%} {% block primary %} <main role="main" id="main"> <article class="h-entry hentry post--article{% with object.get_template_name_display as t %}{%if t == "double" or t == "double-dark" %} post--article--double{%endif%}{%endwith%}" itemscope itemType="http://schema.org/Article"> <header id="header" class="post--header {% with object.get_template_name_display as t %}{%if t == "double" or t == "double-dark" %}post--header--double{%endif%}{%endwith%}"> <h1 class="p-name entry-title post--title" itemprop="headline">{%if object.template_name == 1 or object.template_name == 3 %}{{object.title|smartypants|safe}}{%else%}{{object.title|smartypants|widont|safe}}{%endif%}</h1> <time class="dt-published published dt-updated post--date" datetime="{{object.pub_date|date:'c'}}" itemprop="datePublished">{{object.pub_date|date:"F"}} <span>{{object.pub_date|date:"j, Y"}}</span></time> <p class="p-author author hide" itemprop="author"><span class="byline-author" itemscope itemtype="http://schema.org/Person"><span itemprop="name">Scott Gilbertson</span></span></p> <aside class="p-location h-adr adr post--location" itemprop="contentLocation" itemscope itemtype="http://schema.org/Place"> {% if object.country.name == "United States" %}<span class="p-locality locality">{{object.location.name|smartypants|safe}}</span>, <a class="p-region region" href="/jrnl/united-states/" title="travel writing from the United States">{{object.state.name|safe}}</a>, <span class="p-country-name">U.S.</span>{%else%}<span class="p-region">{{object.location.name|smartypants|safe}}</span>, <a class="p-country-name country-name" href="/jrnl/{{object.country.slug}}/" title="travel writing from {{object.country.name}}">{{object.country.name|safe}}</a>{%endif%} <span style="display: none;" itemprop="geo" itemscope itemtype="http://schema.org/GeoCoordinates"> <data itemprop="latitude" class="p-latitude" value="{{object.latitude}}">{{object.latitude}}</data> <data itemprop="longitude" class="p-longitude" value="{{object.longitude}}">{{object.longitude}}</data> </span> {% with object.get_template_name_display as t %}{%if t == "single" or t == "single-dark" %} – <a href="" onclick="showMap({{object.latitude}}, {{object.longitude}}, { type:'point', lat:'{{object.latitude}}', lon:'{{object.longitude}}'}); return false;" title="see a map">Map</a>{%endif%}{%endwith%} </aside> </header> <div id="article" class="e-content entry-content post--body post--body--{% with object.template_name as t %}{%if t == 0 or t == 2 %}single{%endif%}{%if t == 1 or t == 3 %}double{%endif%}{%endwith%}" itemprop="articleBody"> {{object.body_html|safe|smartypants|widont}} </div> <div class="entry-footer">{%if wildlife %} <aside id="wildlife"> <h3>Fauna and Flora</h3> {% regroup wildlife by ap.apclass.get_kind_display as wildlife_list %} <ul> {% for object_list in wildlife_list %} <li class="grouper">{{object_list.grouper}}<ul> {% for object in object_list.list %} <li><a href="{% url 'sightings:detail' object.ap.slug %}">{{object}}</a></li> {% endfor %}</ul> {% endfor %}</ul> </aside> {% endif %}{%if object.field_notes.all %} <aside id="field_notes"> <h3>Field Notes</h3> <ul>{% for obj in object.field_notes.all %} <li><a href="{% url 'sketches:detail' year=obj.pub_date.year month=obj.pub_date|date:"m" slug=obj.slug %}">{{obj}}</a></li> {% endfor %}</ul> </aside>{% endif %} {%if object.books.all %} <aside id="recommended-reading"> <h3>Recommended Reading</h3> <ul>{% for obj in object.books.all %} <li><a href="{% url 'books:detail' slug=obj.slug %}"><img src="{{obj.get_small_image_url}}" /></a></li> {% endfor %}</ul> </aside>{% endif %} </div> </article> {% with object.get_next_published as next %} {% with object.get_previous_published as prev %} <nav id="page-navigation"> <ul>{% if prev%} <li id="prev"><span class="bl">Previous:</span> <a href="{{ prev.get_absolute_url }}" rel="prev" title=" {{prev.title}}">{{prev.title|safe}}</a> </li>{%endif%}{% if next%} <li id="next"><span class="bl">Next:</span> <a href="{{ next.get_absolute_url }}" rel="next" title=" {{next.title}}">{{next.title|safe}}</a> </li>{%endif%} </ul> </nav>{%endwith%}{%endwith%} {% comment %} <div class="mailing-list--wrapper"> <h5>If you enjoyed this, you should join the mailing list…</h5> {% include 'mailing_list.html' %} </div> {% endcomment %} </main> {% if object.enable_comments %} {% get_comment_count for object as comment_count %} {%if comment_count > 0 %} <p class="comments--header">{{comment_count}} Comment{{ comment_count|pluralize }}</p> {% render_comment_list for object %} {%endif%} {% render_comment_form for object %} {% else %} <p class="comments--header" style="text-align: center">Sorry, comments have been disabled for this post.</p> {%endif%} {% endblock %} {% block js %} <script src="/media/js/lightbox.js" type="text/javascript"></script> <script> var opts= { //nextOnClick: false, captions: true, onload: function(){ var im = document.getElementById("jslghtbx-contentwrapper"); var link = im.appendChild(document.createElement('a')) link.href = im.firstChild.src; link.innerHTML= "open "; link.target = "_blank"; link.setAttribute('class', 'p-link'); im.appendChild(link); } }; var lightbox = new Lightbox(); lightbox.load(opts); </script> {% with object.get_template_name_display as t %}{%if t == "single" or t == "single-dark" %} <script src="/media/js/leaflet-master/leaflet-mod.js"></script> <script src="/media/js/detail.min.js"></script> {%endif%}{%endwith%} <script type="text/javascript"> window.onload = function() { {% if object.enable_comments %} {% get_comment_count for object as comment_count %} {%if comment_count > 0 %} //delay loading of gravatar images using noscript data-hash attribute dataattr = document.getElementsByClassName("datahashloader"); for(var i=0; i<dataattr.length; i++) { var c = dataattr[i].parentNode; var img = document.createElement("img"); img.src = 'https://images.luxagraf.net/gravcache/' + dataattr[i].getAttribute('data-hash') + '.jpg'; img.className += "gravatar"; c.insertBefore(img, c.childNodes[3]); } {%endif%} {%endif%} {% with object.get_template_name_display as t %}{%if t == "single" or t == "single-dark" %} createMap(); var open = false; {%endif%}{%endwith%} {% if object.has_video %} var tester = document.getElementsByClassName("vidauto"); var wrapper = document.getElementById('wrapper'); var dist = 100; window.onscroll = function() { for (var i=0; i<tester.length; i++) { checkVisible(tester[i]) ? tester[i].play() : tester[i].pause(); } }; function checkVisible(elm) { var rect = elm.getBoundingClientRect(); var viewHeight = Math.max(document.documentElement.clientHeight, window.innerHeight); return !(rect.bottom < 0 || rect.top - viewHeight >= 0); } {%endif%} } </script> {% with object.template_name as t %}{%if t == 1 or t == 3 %} <script src="/media/js/hyphenate.min.js" type="text/javascript"></script> {%endif%}{%endwith%}{%endblock%}