---
layout: page
title: Video showcase
icon: video
visible: true
permalink: /video/
---

{% assign allTopics = "" | split:"|"  %}
{% for post in site.posts %}
  {% for talk in post.talks %}
    {% if talk.talk_video_url %}
      {% for topic in talk.topics %}
        {% assign talkTopics = topic | split:","  %}
        {% for talkTopic in talkTopics %}
        {% assign tt = talkTopic | strip | downcase %}
          {% unless allTopics contains tt %}
            {% assign allTopics = allTopics | push: tt %}
          {% endunless %}
        {% endfor %}
      {% endfor %}
    {% endif %}
  {% endfor %}
{% endfor %}

{% assign allTopicsABC = allTopics | sort %}

<div class="content">

  <div class="row">

    <div class="dark_bg col-md-10 col-md-offset-1">

      <div class="button-group filter-button-group">
        <button data-filter="*">show all</button>
        {% for thisTopic in allTopicsABC %}
          <button data-filter=".{{thisTopic | strip | replace: " ", "-"}}">{{thisTopic | capitalize }}</button>
        {% endfor %}
      </div>

    </div>
  </div>

  <div class="spacer"></div>

  <div class="row">
    <div class="dark_bg col-md-10 col-md-offset-1">

      <div id="video-roster" class="container-fluid">

       {% for post in site.posts %}
         {% for talk in post.talks %}
           {% if talk.talk_video_url %}
             {% assign vimeo_id = talk.talk_video_url %}
             {% assign tags = "" | split: "" %}
             {% if talk.topics %}
               {% assign tags = talk.topics | split: "," | uniq %}
             {% endif %}
          <div class="videobox {% for tag in tags %}{{tag | strip | replace: " ", "-" | downcase}} {% endfor %}{{post.location | strip | replace: " ", "-" | downcase}} col-sm-3" vimeo="{{vimeo_id}}">
            <div class="video-title">{{talk.artist}}</div>
            <div class="playbutton"></div>
            <div class="video-description"><h3>{{talk.title}}</h3><p><span class="video-session">Session #{{ post.number }}, {{post.date_text}}</span>: <span class="video-artist">{{talk.artist}}</span> / {{talk.artist_website}} – {{talk.description}}</p><p class="visible-lg">{{talk.artist_bio}}</p></div>
          </div>
           {% endif %}
         {% endfor %}
       {% endfor %}

        <div id="videotext"></div>

        <div id="videoplayer">
          <div id="player"></div>
          <div id="close-button"></div>
        </div>

    </div>

  </div>

</div> <!-- container -->

<script>
  jQuery.getScript('/js/videoplayer.js');
</script>