jekyll-theme-conference 2.4.1 → 2.5.4

data/_includes/js/conference-map.js

@@ -1,17 +1,18 @@
-var map;
+window.conference.mapConfig = (function() {
 
-(function() {
-    var map_provider = "{{ site.conference.location.map.map_provider | default: 'OpenStreetMap.Mapnik' }}";
-    var home_coord = [{{ site.conference.location.map.home_coord }}];
-    var default_zoom = {{ site.conference.location.map.default_zoom | default: 17 }};
+    let map;
 
-    if (document.getElementById('map')) {
-        map = L.map('map').setView(home_coord, default_zoom);
+    let mapProvider = "{{ site.conference.location.map.map_provider | default: 'OpenStreetMap.Mapnik' }}";
+    let homeCoord = [{{ site.conference.location.map.home_coord }}];
+    let zoomLevel = {{ site.conference.location.map.default_zoom | default: 17 }};
 
-        L.tileLayer.provider(map_provider).addTo(map);
+    let setup = function (elId) {
+        map = L.map(elId).setView(homeCoord, zoomLevel);
+
+        L.tileLayer.provider(mapProvider).addTo(map);
 
         L.easyButton('far fa-star', function(){
-            map.setView(home_coord, default_zoom);
+            map.flyTo(homeCoord, zoomLevel);
         }, '{{ site.data.lang[site.conference.lang].location.focus_conf | default: "Center map on conference location" }}').addTo(map);
 
         L.control.locate({
@@ -20,5 +21,25 @@ var map;
                 title: '{{ site.data.lang[site.conference.lang].location.focus_me | default: "Show me where I am" }}'
             }
         }).addTo(map);
-    }
+    };
+
+    let init = function () {
+        elId = 'map';
+
+        if (document.getElementById(elId)) {
+            setup(elId);
+            window.conference.map = map;
+        }
+    };
+
+    return {
+        init: init,
+        default: {
+            mapProvider: mapProvider,
+            homeCoord: homeCoord,
+            zoomLevel: zoomLevel
+        }
+    };
 })();
+
+window.conference.mapConfig.init();

data/_includes/js/conference-modal.js

@@ -1,14 +1,15 @@
-(function() {
-    $('#link-modal').on('show.bs.modal', function (event) {
-        var button = $(event.relatedTarget);
+window.conference.modal = (function () {
 
-        var href = button.data('href');
-        var header = button.data('header');
-        var title = button.data('title');
-        var footer = button.data('footer');
-        var desc = button.data('desc');
+    let show = function (el, event) {
+        let button = $(event.relatedTarget);
 
-        var modal = $(this);
+        let href = button.data('href');
+        let header = button.data('header');
+        let title = button.data('title');
+        let footer = button.data('footer');
+        let desc = button.data('desc');
+
+        let modal = $(el);
         modal.find('iframe').attr('src', href);
 
         if (header) {
@@ -18,25 +19,45 @@
             modal.find('.modal-title').text(title);
         }
         else {
-            modal.find('.modal-title').text('')
+            modal.find('.modal-title').text('');
         }
 
         if (footer) {
-            modal.find('.modal-footer').removeClass('d-none')
+            modal.find('.modal-footer').removeClass('d-none');
             modal.find('.modal-description').html(footer);
         }
         else if (desc) {
-            modal.find('.modal-footer').removeClass('d-none')
+            modal.find('.modal-footer').removeClass('d-none');
             modal.find('.modal-description').text(desc);
         }
         else {
-            modal.find('.modal-footer').addClass('d-none')
+            modal.find('.modal-footer').addClass('d-none');
         }
-    });
-    $('#link-modal').on('hide.bs.modal', function (event) {
-        var modal = $(this);
+    };
+
+    let hide = function (el, event) {
+        let modal = $(el);
+
         modal.find('.modal-title').text('');
         modal.find('iframe').attr('src', '');
         modal.find('.modal-description').html('');
-    });
+    };
+
+    let init = function() {
+        elSel = '#link-modal';
+
+        $(elSel).on('show.bs.modal', function (event) {
+            show(this, event);
+        });
+        $(elSel).on('hide.bs.modal', function (event) {
+            hide(this, event);
+        });
+    };
+
+    return {
+        init: init
+    };
+
 })();
+
+window.conference.modal.init();

data/_includes/js/conference.js

@@ -9,8 +9,11 @@
 // Vertical Scroll Sync: Syncscroll
 {% include js/syncscroll.js %}
 
+// Global app variable
+window.conference = {};
+
+// Map Display Framework: Leaflet
 {% if site.conference.location.hide != true and site.conference.location.map.enable %}
-    // Map Display Framework: Leaflet
     {% include js/leaflet.js %}
     {% include js/leaflet-easybutton.js %}
     {% include js/leaflet-locatecontrol.js %}
@@ -21,3 +24,8 @@
 
 // Bootstrap Extension: Modals
 {% include js/conference-modal.js %}
+
+// Live
+{% if site.conference.live %}
+    {% include js/conference-live.js %}
+{% endif %}

data/_includes/partials/checks.html

@@ -4,7 +4,7 @@
   {% unless site.conference.lang == "en" %}
     {% assign errors = errors | push : "The internationalization file containing different strings for this template seems to be missing. Have you copied the `_data/lang.yml` file from the [theme's repository](https://github.com/DigitaleGesellschaft/jekyll-theme-conference/blob/master/_data/lang.yml) to you local website folder?" %}
   {% endunless %}
-{% elsif site.data.lang.version < 2 %}
+{% elsif site.data.lang.version < 4 %}
   {% assign errors = errors | push : "The internationalization file in `_data/lang.yml` seems to be outdated and does not correspond to the current version of the theme. Grab the current version from the [theme's repository](https://github.com/DigitaleGesellschaft/jekyll-theme-conference/blob/master/_data/lang.yml)." %}
 {% endunless %}
 {% unless site.conference.lang == "en" or site.conference.lang == "de" or site.conference.lang == "fr" or site.conference.lang == "pt" %}
@@ -30,5 +30,5 @@
 
 {% assign main_category_size = site.conference.talks.main_categories | size %}
 {% if main_category_size == 0 %}
-  {% assign errors = errors | push : "Your `_config.yml` configuration file does not define any main category for your talks. Have you set the `conference.talks.main_categories` property? See also [Talk Settings](https://github.com/DigitaleGesellschaft/jekyll-theme-conference/#talk-settings-main-categories-and-icons) section in the theme's README file." %}
+  {% assign errors = errors | push : "Your `_config.yml` configuration file does not define any main category for your talks. Have you set the `conference.talks.main_categories` property? See also [Talk Settings](https://github.com/DigitaleGesellschaft/jekyll-theme-conference/#talk-settings) section in the theme's README file." %}
 {% endif %}

data/_includes/partials/footer.html

@@ -11,8 +11,8 @@
             <span aria-hidden="true">&times;</span>
           </button>
         </div>
-        <div class="modal-body">
-          <iframe src="" frameborder="0" allowfullscreen></iframe>
+        <div class="modal-body embed-responsive embed-responsive-16by9">
+          <iframe class="embed-responsive-item" src="" allowfullscreen></iframe>
         </div>
         <div class="modal-footer justify-content-start">
           <p class="modal-description"></p>
@@ -21,7 +21,12 @@
     </div>
   </div>
 
-  <script src="{{ site.baseurl }}/assets/js/main.js"></script>
+  {% if site.conference.live.streaming %}
+    {% include partials/live-modal.html %}
+  {% endif %}
+
+  <!-- Append build time to avoid caching of live program embedded in JavaScript file -->
+  <script src="{{ site.baseurl }}/assets/js/main.js?t={{ site.time | date: "%s" }}"></script>
 
 </body>
 </html>

data/_includes/partials/get_conf_time.html

@@ -0,0 +1,54 @@
+{% for room in site.data.program %}
+  {% assign t = room.talks | first %}
+  {% include partials/get_talk_time.html %}
+
+  {% assign update_var = false %}
+
+  {% unless conf_start_hour %}
+    {% assign update_var = true %}
+  {% else %}
+    {% if talk_start_hour < conf_start_hour %}
+      {% assign update_var = true %}
+    {% elsif talk_start_hour == conf_start_hour and talk_start_min < conf_start_min %}
+      {% assign update_var = true %}
+    {% endif %}
+  {% endunless %}
+
+  {% if update_var %}
+    {% assign conf_start_hour = talk_start_hour %}
+    {% assign conf_start_min = talk_start_min %}
+  {% endif %}
+
+  {% assign t = room.talks | last %}
+  {% include partials/get_talk_time.html %}
+
+  {% assign update_var = false %}
+
+  {% unless conf_end_hour %}
+    {% assign update_var = true %}
+  {% else %}
+    {% if talk_end_hour > conf_end_hour %}
+      {% assign update_var = true %}
+    {% elsif talk_end_hour == conf_end_hour and talk_end_min > conf_end_min %}
+      {% assign update_var = true %}
+    {% endif %}
+  {% endunless %}
+
+  {% if update_var %}
+    {% assign conf_end_hour = talk_end_hour %}
+    {% assign conf_end_min = talk_end_min %}
+  {% endif %}
+{% endfor %}
+
+{% if conf_start_min < 10 %}
+  {% assign conf_start = conf_start_hour | append: ":0" | append: conf_start_min %}
+{% else %}
+  {% assign conf_start = conf_start_hour | append: ":" | append: conf_start_min %}
+{% endif %}
+{% if conf_end_min < 10 %}
+  {% assign conf_end = conf_end_hour | append: ":0" | append: conf_end_min %}
+{% else %}
+  {% assign conf_end = conf_end_hour | append: ":" | append: conf_end_min %}
+{% endif %}
+
+{% assign conf_duration_min = conf_end_hour | minus: conf_start_hour | times: 60 | minus: conf_start_min | plus: conf_end_min %}

data/_includes/partials/get_link.html

@@ -1,4 +1,5 @@
 
+{% assign link_disabled = link.disabled %}
 {% assign link_icon = link.icon %}
 {% assign link_iframe = link.iframe %}
 
@@ -59,14 +60,17 @@
 
   {% endif %}
 
+{% else %}
+  {% assign link_disabled = true %}
+
 {% endif %}
 
 {% capture link_tag -%}
   {%- if link.disabled -%}
-    <a class="disabled{% if link_styleclass %} {{ link_styleclass }}{% endif %}">
+    <a class="disabled{% if link_styleclass %} {{ link_styleclass }}{% endif %}" href="#">
 
   {%- elsif link_iframe -%}
-    <a class="cursor-pointer{% if link_styleclass %} {{ link_styleclass }}{% endif %}" title="{{ link.name }}" data-toggle="modal" data-target="#link-modal" data-href="{{ link_href }}" {% if modal_header -%}
+    <a {% if link_styleclass %}class="{{ link_styleclass }}"{% endif %} title="{{ link.name }}" data-toggle="modal" data-target="#link-modal" data-href="{{ link_href }}" href="#" {% if modal_header -%}
       data-header="{{ modal_header | strip_newlines | escape }}"
     {%- elsif modal_title -%}
       data-title="{{ modal_title }}"
@@ -85,3 +89,5 @@
 
   {%- endif -%}
 {%- endcapture %}
+
+{% assign link_styleclass = "" %}

data/_includes/partials/get_timestamp.html

@@ -0,0 +1,4 @@
+{% assign datetime_start = site.conference.live.date | append: " " | append: time_start | append: " " | append: site.conference.live.timezone %}
+{% assign timestamp_start = datetime_start | date: "%s" %}
+{% assign datetime_end = site.conference.live.date | append: " " | append: time_end | append: " " | append: site.conference.live.timezone %}
+{% assign timestamp_end = datetime_end | date: "%s" %}

data/_includes/partials/header.html

@@ -8,8 +8,21 @@
   <title>
     {% unless page.name contains '.' %}{{ page.name }} - {% else %}{% if page.title %}{{ page.title }} - {% endif %}{% endunless %}{{ site.title }}
   </title>
+  <meta name="description" content="{{ site.description }}" />
 
   <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/main.css" />
+
+  {%- if site.conference.live -%}
+    <link rel="prefetch" href="{{ site.baseurl }}/assets/icons/live.svg" />
+  {%- endif -%}
+
+  {%- if site.conference.live.streaming -%}
+    {%- for room in site.rooms -%}
+      {%- if room.live -%}
+        <link rel="preconnect" href="{{ room.live }}" />
+      {%- endif -%}
+    {%- endfor -%}
+  {%- endif -%}
 </head>
 
 <body class="pb-4">

data/_includes/partials/live-modal.html

@@ -0,0 +1,51 @@
+<div class="modal fade" id="stream-modal" tabindex="-1" role="dialog" aria-labelledby="link-modal-label" aria-hidden="true">
+  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
+    <div class="modal-content">
+
+      <div class="modal-header">
+        <h5 class="modal-title">
+          {{ site.data.lang[site.conference.lang].live.streaming | default: "Live Stream" }}
+        </h5>
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
+      </div>
+
+      <div class="modal-body embed-responsive embed-responsive-16by9">
+        <iframe class="embed-responsive-item" src="" allowfullscreen></iframe>
+        <div id="stream-placeholder" class="embed-responsive-item d-none justify-content-center align-items-center">
+          <div></div>
+        </div>
+      </div>
+
+      <div class="modal-footer flex-column justify-content-start d-none live-past" id="stream-info" data-time="">
+        <div class="my-0 small align-self-start live-time" id="stream-info-time" data-time=""></div>
+        <div class="pl-3 align-self-start" id="stream-info-color">
+          <p class="mb-0">
+            <a class="text-reset" href="#" id="stream-info-talk"></a>
+          </p>
+          <p class="font-weight-light mb-0" id="stream-info-speakers"></p>
+        </div>
+      </div>
+
+      <div class="modal-footer justify-content-around">
+        {% for r in site.data.program %}
+          {% assign room = site.rooms | where: 'name', r.room | first %}
+
+          <a id="stream-button{{ forloop.index }}" href="#" class="btn btn-outline-primary d-none d-sm-inline {% unless room.live %}disabled{% endunless %}" role="button" data-room="{{ room.name }}">
+            {{ room.name }}
+          </a>
+        {% endfor %}
+        <div class="form-group w-100 d-block d-sm-none">
+          <select class="form-control" id="stream-select">
+            {% for r in site.data.program %}
+              {% assign room = site.rooms | where: 'name', r.room | first %}
+              <option {% unless room.live %}disabled{% endunless %}>{{ room.name }}</option>
+            {% endfor %}
+          </select>
+        </div>
+      </div>
+
+    </div>
+  </div>
+</div>

data/_includes/partials/live_button.html

@@ -0,0 +1,19 @@
+{% if site.conference.live %}
+  {% assign time_start = t.time_start %}
+  {% assign time_end = t.time_end %}
+  {% include partials/get_timestamp.html %}
+
+  {%- if site.conference.live.streaming -%}
+    <a title="{{ link.name }}" data-toggle="modal" data-target="#stream-modal" data-room="{{ r.room }}" href="#"
+  {%- else -%}
+    <span
+  {%- endif %} class="live-show live-button badge badge-dark font-weight-normal text-left d-none {{ live_button_styleclass }}" data-start="{{ timestamp_start }}" data-end="{{ timestamp_end }}">
+    <object data="{{ site.baseurl }}/assets/icons/live.svg" type="image/svg+xml">!</object>
+    {{ site.data.lang[site.conference.lang].live.live | default: "Live" }}
+  {%- if site.conference.live.streaming -%}
+    </a>
+  {%- else -%}
+    </span>
+  {%- endif -%}
+  {% assign live_button_styleclass = "" %}
+{% endif %}

data/_includes/partials/navbar.html

@@ -10,6 +10,7 @@
     <div class="collapse navbar-collapse" id="navbarSupportedContent">
       <ul class="navbar-nav mr-auto">
         {% for link in site.conference.navigation.links %}
+
           {% if link.menu %}
             <li class="nav-item dropdown">
               <a class="nav-link dropdown-toggle" href="#" id="navbar-dropdown{{ forloop.index0 }}" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
@@ -26,6 +27,36 @@
                 {% endfor %}
               </div>
             </li>
+
+          {% elsif link.live %}
+            {% include partials/get_conf_time.html %}
+            {% assign time_start = conf_start %}
+            {% assign time_end = conf_end %}
+            {% include partials/get_timestamp.html %}
+
+            {% assign offset_start = site.conference.live.streaming.start_early | default: 0 %}
+            {% assign offset_end = site.conference.live.streaming.end_late | default: 0 %}
+            {% assign timestamp_start = offset_start | times: -60 | plus: timestamp_start %}
+            {% assign timestamp_end = offset_end | times: 60 | plus: timestamp_end %}
+
+            <li class="nav-item live-show d-none" data-start="{{ timestamp_start }}" data-end="{{ timestamp_end }}">
+              {% if site.conference.live.streaming %}
+                <a class="nav-link" title="{% if link.name %}{{ link.name }}{% else %}{{ site.data.lang[site.conference.lang].live.streaming | default: "Live Stream" }}{% endif %}" data-toggle="modal" data-target="#stream-modal" data-room="" href="#">
+              {% else %}
+                {% assign link_styleclass = "nav-link" %}
+                {% include partials/get_link.html %}
+                {{ link_tag }}
+              {% endif %}
+
+                {{ link.name | default: "" }}
+
+                <span class="live-button badge badge-dark font-weight-normal text-left">
+                  <object data="{{ site.baseurl }}/assets/icons/live.svg" type="image/svg+xml">!</object>
+                  {{ site.data.lang[site.conference.lang].live.live | default: "Live" }}
+                </span>
+              </a>
+            </li>
+
           {% else %}
             <li class="nav-item {% if page.url contains link.relative_url %}active{% endif %}">
               {% assign link_styleclass = "nav-link" %}

data/_includes/partials/show_room.html

@@ -1,5 +1,5 @@
 {% if room.hide or site.conference.location.hide %}
-  <span class="badge badge-light font-weight-normal"><i class="far fa-square"></i> {{ room.name }}</span><!--
+  <span class="badge badge-light font-weight-normal text-left"><i class="far fa-square"></i>&nbsp;{{ room.name }}</span><!--
 {% else %}
-  <a href="{{ room.url | prepend: site.baseurl }}" class="badge badge-light font-weight-normal"><i class="far fa-square"></i> {{ room.name }}</a><!--
+  <a href="{{ room.url | prepend: site.baseurl }}" class="badge badge-light font-weight-normal"><i class="far fa-square"></i>&nbsp;{{ room.name }}</a><!--
 {% endif %}-->

data/_includes/partials/show_talk_duration.html

@@ -1,3 +1,3 @@
-<span class="badge badge-light font-weight-normal">
-  <i class="fas fa-stopwatch"></i> {{ talk_duration_min }}min
+<span class="badge badge-light font-weight-normal text-left">
+  <i class="fas fa-stopwatch"></i>&nbsp;{{ talk_duration_min }}min
 </span>

data/_includes/partials/show_talk_time.html

@@ -1,3 +1,3 @@
-<a href="{{ site.conference.program.url | prepend: site.baseurl }}" class="badge badge-light font-weight-normal">
-  <i class="far fa-clock"></i> {{ talk_start_hour }}:{% if talk_start_min == 0 %}0{%endif %}{{ talk_start_min }}
+<a href="{{ site.conference.program.url | prepend: site.baseurl }}" class="badge badge-light font-weight-normal text-left">
+  <i class="far fa-clock"></i>&nbsp;{{ talk_start_hour }}:{% if talk_start_min == 0 %}0{%endif %}{{ talk_start_min }}
 </a>