Templating links to speakers and adding speaker links to keynotes

Author: escowles

_includes/presentation_timeline.html

@@ -10,12 +10,11 @@
             <div class="cd-timeline-content">
                 <div class="row">
                     <div class="col-sm-7 col-12">
-                        {% if event.groupId == 'key-open' %}
-                            {% assign keynote = site.posts | where:"group",event.groupId %}
-                            <h2 class="cd-timeline-content-title"><a class="keynote-link" href="{{ keynote[0].url }}">{{ event.title }}</a></h2>
-                        {% elsif event.groupId == 'key-close' %}
+                        {% if event.groupId == 'key-open' or event.groupId == 'key-close' %}
                             {% assign keynote = site.posts | where:"group",event.groupId %}
+                            {% assign keynote_speaker_id = keynote[0].speakers[0] %}
                             <h2 class="cd-timeline-content-title"><a class="keynote-link" href="{{ keynote[0].url }}">{{ event.title }}</a></h2>
+                            <br/>{% include speaker_link.html speaker_id=keynote_speaker_id %}
                         {% else %}
                             <h2 class="cd-timeline-content-title">{{ event.title }}</h2>
                             <p>{{ event.description }}</p>
@@ -78,31 +77,7 @@ <h3 class="h4 talk-title"><a href="{{ talk.url }}">{{ talk.title }}</a></h3>
                             </div>
                             <div class="col-12 d-none d-md-flex flex-wrap">
                                 {% for speaker_id in talk.speakers %}
-                                    {% assign speaker = site.data.speakers | where: 'id', speaker_id | first %}
-                                    {% if speaker %}
-                                        <div class="col-sm-3 text-center">
-                                            <a href="/speakers/#{{ speaker.id }}-id">
-                                                {% if event.groupId != 'key-open' and event.groupId != 'key-close' %}
-                                                    <span>{{ speaker.name }}
-                                                    {% if speaker.pronouns %} ({{ speaker.pronouns }}){% endif %}
-                                                    </span>
-                                                {% endif %}
-                                                {% if speaker.image_alt and speaker.image_src %}
-                                                    <img class="clip-circle-speaker" src="{{ speaker.image_src }}" alt="{{ speaker.image_alt }}">
-                                                {% elsif speaker.image_src %}
-                                                    <img class="clip-circle-speaker" src="{{ speaker.image_src }}" alt="Profile image for {{ speaker.name }}">
-                                                {% else %}
-                                                    <script>
-                                                        placeholderImage("clip-circle-speaker",
-                                                            " {{ speaker.name | escape }} ",
-                                                            "/assets/img/nopics/nopic#.jpg",
-                                                            "Random placeholder for {{ speaker.name |  escape }}",
-                                                            10);
-                                                    </script>
-                                                {% endif %}
-                                            </a>
-                                        </div>
-                                    {% endif %}
+                                  {% include speaker_link.html speaker_id=speaker_id %}
                                 {% endfor %}
                             </div>
                         </div>

_includes/speaker_link.html

@@ -0,0 +1,25 @@
+{% assign speaker = site.data.speakers | where: 'id', include.speaker_id | first %}
+{% if speaker %}
+    <div class="col-sm-3 text-center">
+        <a href="/speakers/#{{ speaker.id }}-id">
+            <span>{{ speaker.name }}
+              {% if speaker.pronouns %} ({{ speaker.pronouns }}){% endif %}
+            </span>
+            {% if speaker.image_alt and speaker.image_src %}
+                <img class="clip-circle-speaker" src="{{ speaker.image_src }}" alt="{{ speaker.image_alt }}">
+            {% elsif speaker.image_src %}
+                <img class="clip-circle-speaker" src="{{ speaker.image_src }}" alt="Profile image for {{ speaker.name }}">
+            {% else %}
+                <script>
+                    placeholderImage("clip-circle-speaker",
+                        " {{ speaker.name | escape }} ",
+                        "/assets/img/nopics/nopic#.jpg",
+                        "Random placeholder for {{ speaker.name |  escape }}",
+                        10);
+                </script>
+            {% endif %}
+        </a>
+    </div>
+{% endif %}
+
+<div class="clearfix"></div>