{% include top.html %} <body class=“default-page page-review page-{{ page.title | downcase | replace:' ','_' | replace: '!','' }}”>

<link href="https://api.tiles.mapbox.com/mapbox.js/{{site.mapboxjs}}/mapbox.css" rel="stylesheet" />
<link href='https://api.mapbox.com/mapbox.js/plugins/leaflet-markercluster/{{site.leafletjs}}/MarkerCluster.css' rel='stylesheet' />
<link href='https://api.mapbox.com/mapbox.js/plugins/leaflet-markercluster/{{site.leafletjs}}/MarkerCluster.Default.css' rel='stylesheet' />
<script src="https://api.tiles.mapbox.com/mapbox.js/{{site.mapboxjs}}/mapbox.js"></script>
<script src='https://api.mapbox.com/mapbox.js/plugins/leaflet-markercluster/{{site.leafletjs}}/leaflet.markercluster.js'></script>

{% include header.html %}
<div class="content" id="content">
  <div class="container">
    <h1>{{ page.title }}</h1>
    {% assign playlistsCounter = 0 %}
    {% assign adventuresCounter = 0 %}
    {% assign codeCounter = 0 %}
    {% assign notesCounter = 0 %}
    {% assign teachingCounter = 0 %}
    {% assign epicurean = 0 %}

    {% assign playlistThumbs = '' %}

    {% for post in site.posts reversed %}
    {% capture year %}{{post.date | date: "%Y"}}{% endcapture %}
    {% capture pageYear %}{{ page.title }}{% endcapture %}
    {% if year == pageYear %}
    {% if post.categories[0] == 'playlists' %}{% assign playlistsCounter = playlistsCounter | plus:1 %}{% endif %}
    {% if post.categories[0] == 'adventures' %}{% assign adventuresCounter = adventuresCounter | plus:1 %}{% endif %}
    {% if post.categories[0] == 'code' %}{% assign codeCounter = codeCounter | plus:1 %}{% endif %}
    {% if post.categories[0] == 'notes' %}{% assign notesCounter = notesCounter | plus:1 %}{% endif %}
    {% if post.categories[0] == 'epicurean' %}{% assign epicureanCounter = epicureanCounter | plus:1 %}{% endif %}
    {% if post.categories[0] == 'teaching' %}{% assign teachingCounter = teachingCounter | plus:1 %}{% endif %}
    {% endif %}
    {% endfor %}

    <p class="review-text">
      {% if adventuresCounter > 0 %}I had {{ adventuresCounter }} adventure{% if adventuresCounter > 1 %}s{% endif %}.{% endif %}
      {% if codeCounter > 0 %}I wrote about code {{ codeCounter }} time{% if codeCounter > 1 %}s{% endif %}.{% endif %}
      {% if teachingCounter > 0 %}I taught {{ teachingCounter }} class{% if teachingCounter > 1 %}es{% endif %}.{% endif %}
      {% if notesCounter > 0 %}I wrote {{notesCounter}} note{% if notesCounter > 1 %}s{% endif %}.{% endif %}
      {% if epicureanCounter > 0 %}I made {{epicureanCounter}} new treat{% if epicureanCounter > 1 %}s{% endif %}.{% endif %}
      {% if playlistsCounter > 0 %}I made {{ playlistsCounter }} playlist{% if playlistsCounter > 1 %}s{% endif %}.{% endif %}
      <!-- note about any life events -->
      {% for post in site.data.life %}{% capture year %}{{ post.date | date: "%Y" }}{% endcapture %}{% capture pageYear %}{{ page.title }}{% endcapture %}{% if year == pageYear %}{{post.note}}{% endif %}{% endfor %}
    </p>
  </div>
    <div class="review-thumbs">
      {% for post in site.posts reversed %}
      {% capture year %}{{ post.date | date: "%Y" }}{% endcapture %}
      {% capture pageYear %}{{ page.title }}{% endcapture %}
      {% if year == pageYear %}
      <a href="{{post.url}}" style="background-image:url({{site.assets}}{{post.image}})" class="review-thumb" data-date="{{post.date | date: "%m%d"}}" title="{{post.title}}"></a>
      {% endif %}
      {% endfor %}

      <!-- loop through other places images -->
      {% for post in site.data.other-places %}
      {% capture year %}{{ post.date | date: "%Y" }}{% endcapture %}
      {% capture pageYear %}{{ page.title }}{% endcapture %}
      {% if year == pageYear %}
      <a href="{{post.url}}" style="background-image:url({{post.image}})" class="review-thumb" data-date="{{post.date | date: "%m%d"}}" title="{{post.title}}">{% include icons/instagram.svg %}</a>
      {% endif %}
      {% endfor %}

      <!-- loop through life events -->
      {% for post in site.data.life %}
      {% capture year %}{{ post.date | date: "%Y" }}{% endcapture %}
      {% capture pageYear %}{{ page.title }}{% endcapture %}
      {% if year == pageYear %}{% assign icon = post.icon | prepend: 'icons/' | append: '.svg' %}
      <a href="{{post.url}}" style="background-image:url({{post.image}})" class="review-thumb" data-date="{{post.date | date: "%m%d"}}" title="{{post.title}}">{% include {{icon}} %}</a>
      {% endif %}
      {% endfor %}

    </div>
    <div id="map" class="map"></div>
  </div>

  <div class="container">
    {% for data in site.data.top-ten %}{% if data.year == page.title %}

    {% if data.tripit %}
    <h2>Travel</h2>
    {% for tripit in data.tripit %}
    <p>I went on {{tripit.trips}} trips over {{tripit.days}} days that spanned {{tripit.cities}} cities and {{tripit.countries}} countries. In total, I traveled {{tripit.distance}} miles.</p>
    {% endfor %}
    {% endif %}

    {% if data.topnine %}
    <h2>Instagram top 9</h2>
    <div class="topnine-thumbs">
    {% for img in data.topnine %}<a href="{{img}}" style="background-image:url({{img}}media/?size=l)" class="topnine-thumb">{% include icons/instagram.svg %}</a>{% endfor %}
    </div>
    {% endif %}

    {% if data.favorites %}
    <h2>Favorites</h2>
    <ul>{% for fav in data.favorites %}<li>{% for f in fav %}<a href="{{f[1]}}">{{f[0]}}</a>{% endfor %}</li>{% endfor %}</ul>
    {% endif %}

    {% if data.albums.size > 0 %}<h2>Most listened albums</h2>
    <ol>{% for album in data.albums %}<li>{{album}}</li>{% endfor %}</ol>{% endif %}
    <h2>Most listened tracks</h2>
    {% assign img = page.title | append: '.png' %}
    {% include img.html src=img alt="most listened tracks album art" %}
    {% if data.spotify %} {% include icons/music.svg %} <a href="{{ data.spotify }}" class="playlist-rdio">Listen on Spotify</a>{% endif %}
    <ol>{% for track in data.tracks %}<li>{{track}}</li>{% endfor %}</ol>
    {% endif %}{% endfor %}

    <div class="post-prev-next">
      {% assign lastYear = pageYear | minus: 1 %}
      {% assign nextYear = pageYear | plus: 1  %}
      {% if site.years contains lastYear %}<a href="/{{ lastYear }}" class="post-prev pull-left">{% include icons/angle-left.svg %} <span class="post-prev-title">{{ lastYear }}</span></a>{% endif %}
      {% if site.years contains nextYear %}<a href="/{{ nextYear }}" class="post-next pull-right text-right"> <span class="post-next-title">{{ nextYear }}</span> {% include icons/angle-right.svg %}</a>{% endif %}
    </div>
  </div>

  <script>
  L.mapbox.accessToken = '{{site.mapbox-token}}';
  var map = L.mapbox.map('map', '{{site.mapid}}');

  map.scrollWheelZoom.disable();

  var overlays = L.layerGroup().addTo(map);

  var featureLayer = L.mapbox.featureLayer()
  .loadURL('/map/adventures.geojson');

  featureLayer.on('ready', function(e) {
    change();
    layers = e.target;
    cluster()
  });

  featureLayer.on('layeradd', function(e) {
    var marker = e.layer,
    feature = marker.feature;
    // Create custom popup content
    var popupContent =  '<a target="_blank" class="popup external-'+feature.properties.external+'" href="' + feature.properties.url + '">' +
    '<img alt="'+ feature.properties.title +'+" src="{{site.assets}}' + feature.properties.image + '" /><h2 class="text-center">'+feature.properties.title+'</h2></a>';

    // http://leafletjs.com/reference.html#popup
    marker.bindPopup(popupContent,{
      minWidth: 150,
      closeButton: false
    });

  });

  function change() {
    var on = ["{{pageYear}}"];
    featureLayer.setFilter(function (f) {
      return on.indexOf(f.properties['year']) !== -1;
    });
    map.fitBounds(featureLayer.getBounds());
    return false;
  }

  function cluster() {
    var clusterGroup = new L.MarkerClusterGroup().addTo(overlays);
    layers.eachLayer(function(layer) {
      clusterGroup.addLayer(layer);
    });
  }
  </script>

</div>
{% include footer.html %}
{% include end.html %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/tinysort/2.2.2/tinysort.min.js"></script>
<script>
tinysort('.review-thumbs>a',{data:'date'});
</script>

</body> </html>