index.html

---
layout: home
---
{% assign total_talks = 0 %}

{% for conference in site.data.conferences %}
  {% assign total_talks = total_talks | plus: site.data[conference.id].size %}
{% endfor %}

<p>
<input type="text" id="search"></input>&nbsp;&nbsp;<span id="matches" style="none"></span>
</p>

<p><b>Stats</b></p>
<ul>
<li>Total talks: {{ total_talks }}</li>
<li>Total conferences: {{ site.data.conferences.size }}</li>
<li>Total speakers: {{ site.data.speakers.size }}</li>
</ul>

<h2 id="{{ conference.id }}">{{ conference.title }}</h2>

<p><b>Conferences quick links</b></p>
<ul>
{% for conference in site.data.conferences %}
<li>
<a href="#{{ conference['id'] }}">{{ conference['title'] }}</a><br>
</li>
{% endfor %}
</ul>

<hr>

{% for conference in site.data.conferences %}
  <h2 id="{{ conference.id }}">{{ conference.title }}</h2>
  <ul>
  {% assign talks = site.data[conference.id] | sort: 'talk_title' %}

  {% for talk in talks %}
    {% if talk.processed == false %}
      {% continue %}
    {% else %}
      <li id="{{ talk.video_id | replace: '-', '_' | prepend: 'id_'}}" class="talk" data-duration="{{ talk.video_duration }}">
        <a href="#{{ talk.video_id }}" class="anchor">#</a>
        {% if talk.video_platform == "vimeo" %}
          <a href="https://vimeo.com/{{ talk.video_id }}" title="{{ talk.talk_title }}">{{ talk.talk_title }}</a>
        {% else %}
          <a href="https://youtu.be/{{ talk.video_id }}" title="{{ talk.talk_title }}">{{ talk.talk_title }}</a>
        {% endif %}
        <div class="video_details">
          {% if talk.video_platform != "vimeo" %}
            {% if talk.video_duration_seconds %}
              {{ talk.video_duration_seconds | to_string | divided_by: 60 | plus: 100 | slice: 1, 2 }}:{{ talk.video_duration_seconds | to_string | modulo: 60 | plus: 100 | slice: 1, 2 }}
            {% endif %}
            •
            {% if talk.video_view_count %}
              <span title="{{ talk.video_view_count }} views as of {{ site.time }}">
                <i class="far fa-eye"></i>&nbsp;{{ talk.video_view_count }}
              </span>
            {% endif %}
            •
          {% endif %}

          {% for speaker_id in talk.speakers %}
            {% assign speaker = site.data.speakers | where: "id", speaker_id | first %}

            {% include link_to_speaker.html speaker=speaker %}

            {% unless forloop.last %} •{% endunless %}
          {% endfor %}

          {% if talk.elixirforum_topic_id %}
            •
            <a href="https://elixirforum.com/t/{{ talk.elixirforum_topic_id }}" title="Official discussion on ElixirForum">Discussion</a>
          {% endif %}
        </div>
      </li>
    {% endif %}
  {% endfor %}
  </ul>
{% endfor %}

<hr>

<script src='https://cdn.jsdelivr.net/npm/fuse.js@6.4.0'>
</script>

<script>
  window.talks = [];

  {% for conference in site.data.conferences %}
    {% for talk in site.data[conference.id] %}
      window.talks.push({{ talk | jsonify }});
    {% endfor %}
  {% endfor %}

  window.s = new Fuse(window.talks, {
    keys: ["talk_title"],
    minMatchCharLength: 2,
    threshold: 0.0
  });

  const input = document.getElementById('search');

  input.addEventListener('keyup', function(e) {
    let search_results = s.search(e.target.value);
    let selector = search_results.map(e => `#id_${e.item.video_id}`).join(",").replace(/-/gi,"_");

    if (search_results.length > 0) {
      document.getElementById('matches').innerHTML = `${search_results.length} results found`;
      document.querySelectorAll("li.talk").forEach(e => e.setAttribute("style", "display: none"));
      document.querySelectorAll(selector).forEach(e => e.setAttribute("style", "display: block"));
    } else {
      document.getElementById('matches').innerHTML = "";
      document.querySelectorAll("li.talk").forEach(e => e.setAttribute("style", "display: block"));
    }
  });

</script>


2020. Created by <a href="https://twitter.com/gmile">@gmile</a>.