jekyll-theme-conference 3.0.2 → 3.1.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 2db4dc4680aa85647500757325334eb2e5e4db739cf56247839bed4ebcbd281c
-  data.tar.gz: aecfefef9ad494d5ed8069e5fd1ce504ca1a3c33b21b8a150bb73c9e4bf37f40
+  metadata.gz: d6dfd46bcf846b9381cf7a9f0b88a063339e1ba62ca33bfd979c56b2ffb20621
+  data.tar.gz: 9d6fb33e2b5d0c1c690af32947d7c93f8ae3003f78b0c179d28ed7e3dfe825c9
 SHA512:
-  metadata.gz: 10b0fe0bf595f54070bf936326d5498b7d0c79a8668f61251f5695bff52ea281a69889af57ebed2e3904d4d6f2323ea5447b479078a554c03c633861858e2fc2
-  data.tar.gz: ad815822f66b57d2f2a3919ee0f3d5771d6898c427cb275e38259fa2849eeeeb3ab1002ba9d92e95cd7cf766711c08523356e7f75d717776885c33279f4458b9
+  metadata.gz: 8b8ace8e151d2bac7f2a4f2624f8ab947cbb255c4c40de094e60ebb0205d87a5047bb33de6faea4deff3276ba6e6d0cea9f1bc920c0bacbc7946bcf999a251de
+  data.tar.gz: 96ee3c142c692447badd23a59244614d272f34ff86092fbe138465ac4257484de610ea3b2db9718b4fe7fbe7ff8179d7e69969818e1eba947c58cf3b7a7cfbb5

data/README.md

@@ -18,6 +18,41 @@ The theme was originally created for the yearly Winterkongress conference of the
 - [Demo: Winterkongress](https://digitale-gesellschaft.ch/kongress/)
 
 
+## Table of Contents
+
+- [Installation](#installation)
+  * [Gem-based Method](#gem-based-method)
+  * [Remote Theme Method](#remote-theme-method)
+- [Setup](#setup)
+  * [Jump Start](#jump-start)
+  * [Automatic Import](#automatic-import)
+  * [Automatic Build](#automatic-build)
+- [Configuration](#configuration)
+  * [Theme Verification](#theme-verification)
+  * [Collection URLs](#collection-urls)
+  * [Language](#language)
+  * [Navigation Bar](#navigation-bar)
+  * [Main Landing Page](#main-landing-page)
+  * [Information Boxes](#information-boxes)
+  * [Live Indications & Streaming](#live-indications---streaming)
+  * [Talk Settings](#talk-settings)
+  * [Speaker Settings](#speaker-settings)
+  * [Location Settings](#location-settings)
+  * [Program Settings](#program-settings)
+- [Content](#content)
+  * [Schedule / Program](#schedule---program)
+  * [Talks](#talks)
+  * [Speakers](#speakers)
+  * [Rooms](#rooms)
+  * [Links](#links)
+- [Overview Pages](#overview-pages)
+  * [Location / Room Overview](#location---room-overview)
+  * [Live Stream Overview](#live-stream-overview)
+  * [Additional Pages](#additional-pages)
+- [Design](#design)
+- [License](#license)
+
+
 ## Installation
 
 There are three ways to install: As a [Gem-based theme](https://jekyllrb.com/docs/themes/#understanding-gem-based-themes), as a [remote theme](https://github.blog/2017-11-29-use-any-theme-with-github-pages/) (GitHub Pages compatible), or by cloning/forking this repository and reference to it directly.
@@ -130,7 +165,7 @@ There exists a Python file in this repository, `_tools/create_entries.py`, which
 
 In case you do not want to install the entire Ruby/Jekyll toolchain on your machine you can make use of [GitHub Actions](https://github.com/features/actions), Github's continuous integration platform. This repository contains multiple example Github Action configuration files in the `_tools/` folder:
 
-- `build.yml`: automatically builds and minimizes the website upon adding a new tag starting with a `v` (e.g. `v2020.01.01`). It then attaches the generated website as an archive to a release for easy downloading.
+- `build.yml`: automatically builds and minimizes the website upon adding a new tag starting with a `v` (e.g. `v2020.01.01`). It then attaches the generated website as an archive to a release for easy downloading. Requires `purgecss.config.js` to be copied to the project's root too.
 - `test.yml`: automatically tries to build the website upon a new pull request. It can thus be used as status check before merging.
 - `schedule.yml`: automatically generates the schedule and content files when a new pull request contains a `schedule.json` file (see the _Automatic Import_subsection above). Thus, it allows quick updates of the site's content from [pretalx.com](https://pretalx.com/p/about/) exports.
 
@@ -319,15 +354,16 @@ conference:
 
 In order to help users navigating the program during the congress, a _Live_ indication can be shown next to talks which are currently taking place. A small JavaScript functions keeps the site automatically up-to-date (without the need to refresh) showing the indication as soon as the talk has started and hiding it once it is over (according to the timetable indicated in the `_data/program.yml` file).
 
-This can be further extended if some of the talks have an associated live stream: Upon clicking one of the live indications a modal will open containing the corresponding live stream embedded. The URL to the live stream has to be set via `live` property in each room (see the _Content_ > _Room_ section below).
+This can be further extended if some of the talks have an associated live stream: Upon clicking one of the live indications a modal will open containing the corresponding live stream embedded. The URL to the live stream has to be set via `live` property in each room (see the _Content_ > _Room_ section below). Instead of opening the modal an external link can also be used.
 
 In order to activate the functionality, each day in the `program.yml` file must contain a `date` property (see section _Content_ > _Schedule / Program_ below) and the `live` property has to be set in the configuration file containing
 
 - how long a pause between two consecutive talks has to be for the live indication to pause (`time_stop`),
 - optionally if streaming is enabled (`streaming`) with indications
   + how many minutes the stream goes active before a talk (`time_prepend`),
-  + how many minutes the stream stays active after a talk (`time_extend`), and
-  + how long a pause between two consecutive talks has to be for the stream to pause (`time_pause`),
+  + how many minutes the stream stays active after a talk (`time_extend`),
+  + how long a pause between two consecutive talks has to be for the stream to pause (`time_pause`), and
+  + optionally an external (absolute) link to which the user will be redirected instead of opening the modal (`external`),
 - optionally a demo mode setting, whereby the JavaScript function cycles through the entire program in five minutes for demonstration purposes (`demo: true`, default: `false`).
 
 ```yaml
@@ -587,6 +623,10 @@ If you choose a different location for the overview pages you must:
 
 The `location` layout contains a map container (if not disabled, see section _Location Settings_ above) which can be customized. See the section above for further details.
 
+### Live Stream Overview
+
+The `stream-overview` layout contains all active streams on a single page (see the section _Live Indications & Streaming_ above).
+
 ### Additional Pages
 
 Additional static pages can easily be added as files and linked to via navigation bar or main landing page (see above on how to).

data/_includes/js/conference-live.js

@@ -13,6 +13,8 @@ window.conference.live = (function() {
     {%- include partials/get_talk_timestamp.html -%}
     {%- assign conf_end = timestamp_end -%}
 
+    let data;
+
     let confStart = {{ conf_start }};
     let confEnd = {{ conf_end }};
     let confDur = confEnd - confStart;
@@ -32,26 +34,43 @@ window.conference.live = (function() {
     let streamVideoTimer;
     let streamInfoTimer;
 
+    let loadData = function () {
+        // Fetch schedule from external file
+        $.getJSON('{{ site.baseurl }}/assets/js/data.json', function(json) {
+            data = json;
+        });
+    };
+
+    let getData = function () {
+        // Return data
+        return data;
+    };
+
     let mod = function (n, m) {
+        // Absolute modulo
         return ((n % m) + m) % m;
     };
 
     let timeNow = function () {
+        // Current timestamp in seconds
         return Math.floor(Date.now() / 1000);
     };
 
     let timeCont = function () {
+        // Continuous time (respecting previous pauses)
         return timeNow() - timeOffset;
     };
 
     let timeCycle = function () {
+        // Cyclic timestamp in seconds
         let actTime = timeNow();
-        let relTime = mod(actTime, durDemo + 2*durPause) / durDemo;
+        let relTime = mod(actTime, durDemo + 2*durPause) / (durDemo + 2*durPause);
         let cycleTime = mod((demoEnd - demoStart) * relTime - timeOffset, (demoEnd - demoStart)) + demoStart;
         return cycleTime;
     };
 
     let time = function () {
+        // Return app time
         if (freezeTime) {
             return timeFrozen;
         }
@@ -64,6 +83,7 @@ window.conference.live = (function() {
     };
 
     let pauseTime = function () {
+        // Pause app time
         if (!freezeTime) {
             timeFrozen = time();
             freezeTime = true;
@@ -73,6 +93,7 @@ window.conference.live = (function() {
     };
 
     let continueTime = function () {
+        // Continue app time
         if (freezeTime) {
             freezeTime = false;
             timeOffset += time() - timeFrozen;
@@ -80,18 +101,23 @@ window.conference.live = (function() {
         }
     };
 
-    let resetTime = function (timeStr) {
+    let resetTime = function () {
+        // Reset app time
         timeOffset = 0;
         freezeTime = false;
 
         startUpdate();
     };
 
-    let setTime = function (newTime, newDay=1) {
+    let setTime = function (newTime, newDay) {
+        // Set and pause app time
         pauseTime();
 
         let dayIdx;
-        if (Number.isInteger(newDay)) {
+        if (arguments.length < 2) {
+            dayIdx = 0;
+        }
+        else if (Number.isInteger(newDay)) {
             dayIdx = newDay-1;
         }
         else if (/^[0-9]{4}-[0-9]{2}-[0-9]{2}$/.test(newDay)) {
@@ -100,7 +126,7 @@ window.conference.live = (function() {
         else {
             dayIdx = data.days.find(o => o.name === newDay);
         }
-        newDate = data.days[dayIdx].date;
+        let newDate = data.days[dayIdx].date;
 
         let d = new Date(newDate);
         newTime = newTime.split(':');
@@ -111,7 +137,10 @@ window.conference.live = (function() {
         update();
     };
 
-    let getTime = function (tConvert=time()) {
+    let getTime = function () {
+        // Return app time as string
+        let tConvert = time();
+
         let d = new Date(tConvert * 1000);
         let dStr = d.toISOString().slice(0,10);
         let h = d.getHours();
@@ -121,6 +150,7 @@ window.conference.live = (function() {
     };
 
     let timeUnit = function () {
+        // App time refresh rate
         if (demo) {
             return 0.1;
         }
@@ -130,6 +160,7 @@ window.conference.live = (function() {
     };
 
     let delayStart = function (startTime) {
+        // Seconds until given startTime occurs
         let tNow = time();
         let tUnit = timeUnit();
 
@@ -149,21 +180,25 @@ window.conference.live = (function() {
     };
 
     let toggleDemo = function () {
+        // Toggle app demo mode
         demo = !demo;
         resetTime();
     };
 
     let demoOn = function () {
+        // Return app demo status
         return demo;
     };
 
     let updateLive = function () {
+        // Update status all live elements in DOM
         let tNow = time();
         let liveShow = document.getElementsByClassName('live-show');
         let liveHide = document.getElementsByClassName('live-hide');
         let liveTime = document.getElementsByClassName('live-time');
         let livePast = document.getElementsByClassName('live-past');
 
+        // Show elements for a given period
         for (let i = 0; i < liveShow.length; i++) {
             let tStarts = liveShow[i].dataset.start.split(',');
             let tEnds = liveShow[i].dataset.end.split(',');
@@ -181,6 +216,7 @@ window.conference.live = (function() {
             }
         }
 
+        // Hide elements for a given period
         for (let i = 0; i < liveHide.length; i++) {
             let tStarts = liveHide[i].dataset.start.split(',');
             let tEnds = liveHide[i].dataset.end.split(',');
@@ -200,6 +236,7 @@ window.conference.live = (function() {
             }
         }
 
+        // Update duration string for given elements
         for (let i = 0; i < liveTime.length; i++) {
             let t = liveTime[i].dataset.time;
             if (typeof t == "undefined") {
@@ -259,6 +296,7 @@ window.conference.live = (function() {
             liveTime[i].innerHTML = tStr;
         }
 
+        // Disable elements for a given period
         for (let i = 0; i < livePast.length; i++) {
             let t = livePast[i].dataset.time;
             if (typeof t == "undefined") {
@@ -278,13 +316,14 @@ window.conference.live = (function() {
             }
         }
 
+        // Cancel timer after program is over
         if (tNow > confEnd && !demo) {
-            // Cancel timer after program is over
             stopUpdateLive();
         }
     };
 
     let startUpdateLive = function () {
+        // Start update timer to update live elements in DOM
         stopUpdateLive();
         updateLive();
 
@@ -301,6 +340,7 @@ window.conference.live = (function() {
     };
 
     let stopUpdateLive = function () {
+        // stopUpdate update timer to update live elements in DOM
         if (typeof liveTimer !== "undefined") {
             clearInterval(liveTimer);
         }
@@ -312,9 +352,9 @@ window.conference.live = (function() {
         let streamExtend  = {{ site.conference.live.streaming.time_extend | default: 5 }};  // in minutes
 
         let streamModal;
-        let data;
 
         let getRoom = function (roomName) {
+            // Return room object for given room name
             if (roomName in data.rooms) {
                 return data.rooms[roomName];
             }
@@ -323,11 +363,21 @@ window.conference.live = (function() {
             }
         };
 
+        let getTalks = function (roomName) {
+            if (roomName in data.talks) {
+                return data.talks[roomName];
+            }
+            else {
+                return false;
+            }
+        };
+
         let getNextTalk = function (roomName) {
+            // Get talk object for next talk in given room
             let timeNow = time();
-            let talksHere = data.talks[roomName];
+            let talksHere = getTalks(roomName);
 
-            if (typeof talksHere !== "undefined") {
+            if (talksHere) {
                 if (timeNow < talksHere[talksHere.length-1].end) {
                     for (var i = 0; i < talksHere.length; i++) {
                         if (timeNow < talksHere[i].end) {
@@ -340,10 +390,11 @@ window.conference.live = (function() {
         };
 
         let getNextPause = function (roomName) {
+            // Get time object for next pause in given room
             let timeNow = time();
-            let talksHere = data.talks[roomName];
+            let talksHere = getTalks(roomName);
 
-            if (typeof talksHere !== "undefined") {
+            if (talksHere) {
                 if (timeNow < talksHere[talksHere.length-1].end) {
                     for (var i = 1; i < talksHere.length; i++) {
                         if (timeNow < talksHere[i].start && streamPause*60 <= talksHere[i].start - talksHere[i-1].end) {
@@ -358,25 +409,49 @@ window.conference.live = (function() {
             return false;
         };
 
-        let setStreamContent = function (content) {
+        let setStreamIframeContent = function (content) {
+            // Set stream modal iframe to show given text
             streamModal.find('iframe').attr('src', '');
             streamModal.find('iframe').addClass('d-none');
             streamModal.find('#stream-placeholder > div').text(content);
             streamModal.find('#stream-placeholder').addClass('d-flex');
         };
 
-        let setStreamSrc = function (href) {
+        let setStreamIframeSrc = function (href) {
+            // Set stream modal iframe to show given URL
             streamModal.find('iframe').attr('src', href);
             streamModal.find('#stream-placeholder').addClass('d-none').removeClass('d-flex');
             streamModal.find('iframe').removeClass('d-none');
         };
 
         let setStreamVideo = function (roomName) {
+            // Update stream modal iframe:
+            // Show stream with start/pause/end message (for given room) and keep updated
             let timeNow = time();
 
-            let talksHere = data.talks[roomName];
-            let roomStart = talksHere[0].start;
-            let roomEnd = talksHere[talksHere.length-1].end;
+            let talksHere = getTalks(roomName);
+            let roomStart, roomEnd;
+            if (talksHere) {
+                roomStart = talksHere[0].start;
+                roomEnd = talksHere[talksHere.length-1].end;
+            }
+            else {
+                // If no program for given room, take overall first and last talk
+                roomStart = 0;
+                roomEnd = 0;
+                for (let roomNameTalk in data.talks) {
+                    talksHere = getTalks(roomNameTalk);
+                    let crntRoomStart = talksHere[0].start;
+                    let crntRoomEnd = talksHere[talksHere.length-1].end;
+
+                    if (roomStart == 0 || roomStart > crntRoomStart) {
+                        roomStart = crntRoomStart;
+                    }
+                    if (roomEnd == 0 || roomEnd < crntRoomEnd) {
+                        roomEnd = crntRoomEnd;
+                    }
+                }
+            }
 
             if (typeof streamVideoTimer !== "undefined") {
                 clearInterval(streamVideoTimer);
@@ -384,7 +459,7 @@ window.conference.live = (function() {
 
             // Conference not yet started
             if (timeNow < roomStart - streamPrepend*60) {
-                setStreamContent('{{ site.data.lang[site.conference.lang].live.pre_stream | default: "Live stream has not started yet." }}');
+                setStreamIframeContent('{{ site.data.lang[site.conference.lang].live.pre_stream | default: "Live stream has not started yet." }}');
 
                 if (!freezeTime) {
                     streamVideoTimer = setTimeout(setStreamVideo, delayStart(roomStart - streamPrepend*60) * 1000, roomName);
@@ -393,7 +468,7 @@ window.conference.live = (function() {
 
             // Conference is over
             else if (timeNow > roomEnd + streamExtend*60) {
-                setStreamContent('{{ site.data.lang[site.conference.lang].live.post_stream | default: "Live stream has ended." }}');
+                setStreamIframeContent('{{ site.data.lang[site.conference.lang].live.post_stream | default: "Live stream has ended." }}');
 
                 if (!freezeTime && demo) {
                     streamVideoTimer = setTimeout(setStreamVideo, delayStart(roomEnd - streamPrepend*60) * 1000, roomName);
@@ -406,7 +481,7 @@ window.conference.live = (function() {
 
                 // Currently stream is paused
                 if (pauseNext && timeNow >= pauseNext.start + streamExtend*60 && timeNow <= pauseNext.end - streamPrepend*60) {
-                    setStreamContent('{{ site.data.lang[site.conference.lang].live.pause_stream | default: "Live stream is currently paused." }}');
+                    setStreamIframeContent('{{ site.data.lang[site.conference.lang].live.pause_stream | default: "Live stream is currently paused." }}');
 
                     if (!freezeTime) {
                         streamVideoTimer = setTimeout(setStreamVideo, delayStart(pauseNext.end - streamPrepend*60) * 1000, roomName);
@@ -415,7 +490,7 @@ window.conference.live = (function() {
                 // Currently a talk is active
                 else {
                     let room = getRoom(roomName);
-                    setStreamSrc(room.href);
+                    setStreamIframeSrc(room.href);
 
                     if (!freezeTime) {
                         if (pauseNext) {
@@ -430,6 +505,8 @@ window.conference.live = (function() {
         };
 
         let setStreamInfo = function (roomName) {
+            // Update stream modal info bar:
+            // Show next talk and speaker (for given room) and keep updated
             let timeNow = time();
             let talkNext = getNextTalk(roomName);
 
@@ -437,7 +514,7 @@ window.conference.live = (function() {
                 clearInterval(streamInfoTimer);
             }
 
-            if (timeNow >= talkNext.start - streamPause*60) {
+            if (talkNext && timeNow >= talkNext.start - streamPause*60) {
                 document.getElementById('stream-info').dataset.time = talkNext.start;
                 document.getElementById('stream-info-time').dataset.time = talkNext.start;
                 updateLive();
@@ -476,14 +553,17 @@ window.conference.live = (function() {
                         streamInfoTimer = setTimeout(setStreamInfo, delayStart(talkNext.start - streamPause*60) * 1000, roomName);
                     }
                     else if (demo) {
-                        let talksHere = data.talks[roomName];
-                        streamInfoTimer = setTimeout(setStreamInfo, delayStart(talksHere[0].start - streamPrepend*60) * 1000, roomName);
+                        let talksHere = getTalks(roomName);
+                        if (talksHere) {
+                            streamInfoTimer = setTimeout(setStreamInfo, delayStart(talksHere[0].start - streamPrepend*60) * 1000, roomName);
+                        }
                     }
                 }
             }
         };
 
         let setStream = function (roomName) {
+            // Update stream modal (iframe and info bar) for given room
             streamModal.find('.modal-footer .btn').removeClass('active');
             streamModal.find('#stream-select').val(0);
 
@@ -499,6 +579,7 @@ window.conference.live = (function() {
         };
 
         let updateStream = function () {
+            // Update stream modal for currently active room button
             if (streamModal.hasClass('show')) {
                 let activeButton = streamModal.find('.modal-footer .btn.active');
                 let roomName = activeButton.data('room');
@@ -510,6 +591,7 @@ window.conference.live = (function() {
         };
 
         let stopUpdateStream = function () {
+            // Stop stream modal update timer
             if (typeof streamVideoTimer !== "undefined") {
                 clearInterval(streamVideoTimer);
             }
@@ -518,13 +600,15 @@ window.conference.live = (function() {
             }
         };
 
-        let hideModal = function (event) {
+        let hideModal = function () {
+            // Close stream modal
             streamModal.find('iframe').attr('src', '');
             streamModal.find('.modal-footer .btn').removeClass('active');
             streamModal.find('#stream-select').selectedIndex = -1;
         };
 
         let setupStream = function () {
+            // Setup events when modal opens/closes
             streamModal = $('#stream-modal');
 
             // configure modal opening buttons
@@ -533,8 +617,8 @@ window.conference.live = (function() {
                 let roomName = button.data('room');
                 setStream(roomName);
             });
-            streamModal.on('hide.bs.modal', function (event) {
-                hideModal(event);
+            streamModal.on('hide.bs.modal', function () {
+                hideModal();
             });
 
             // configure room selection buttons in modal
@@ -552,14 +636,10 @@ window.conference.live = (function() {
                 let roomName = $(this).children('option:selected').text();
                 setStream(roomName);
             });
-
-            // load data
-            $.getJSON('{{ site.baseurl }}/assets/js/data.json', function(json) {
-                data = json;
-            });
         };
 
         let setup = function () {
+            loadData();
             startUpdateLive();
             setupStream();
         };
@@ -582,6 +662,7 @@ window.conference.live = (function() {
     {%- else -%}
 
         let setup = function () {
+            loadData();
             startUpdateLive();
         };
 
@@ -601,6 +682,7 @@ window.conference.live = (function() {
 
     return {
         init: setup,
+        getData: getData,
 
         pauseTime: pauseTime,
         continueTime: continueTime,

data/_includes/js/conference-map.js

@@ -24,7 +24,7 @@ window.conference.mapConfig = (function() {
     };
 
     let init = function () {
-        elId = 'map';
+        let elId = 'map';
 
         if (document.getElementById(elId)) {
             setup(elId);

data/_includes/js/conference-modal.js

@@ -51,7 +51,7 @@ window.conference.modal = (function () {
         }
     };
 
-    let hide = function (el, event) {
+    let hide = function (el) {
         let modal = $(el);
 
         modal.find('.modal-title h3').text('');
@@ -61,13 +61,13 @@ window.conference.modal = (function () {
     };
 
     let init = function() {
-        elSel = '#link-modal';
+        let elSel = '#link-modal';
 
         $(elSel).on('show.bs.modal', function (event) {
             show(this, event);
         });
-        $(elSel).on('hide.bs.modal', function (event) {
-            hide(this, event);
+        $(elSel).on('hide.bs.modal', function () {
+            hide(this);
         });
     };
 

data/_includes/js/conference-program.js

@@ -34,7 +34,7 @@ window.conference.program = (function() {
             }
 
             // Add current selected day as hash to URL while keeping current scrolling position
-            $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
+            $('a[data-toggle="tab"]').on('shown.bs.tab', function () {
                 updateHash(this.hash);
             });
         }

data/_includes/js/syncscroll.js

@@ -29,7 +29,7 @@ function (exports) {
         var elems = document.getElementsByClassName('syncscroll');
         var i, j, el, found, name;
         for (name in names) {
-            if (names.hasOwnProperty(name)) {
+            if (Object.prototype.hasOwnProperty.call(names, name)) {
                 for (i = 0; i < names[name].length; i++) {
                     names[name][i].removeEventListener(
                         'scroll', names[name][i].syn, 0

data/_includes/partials/modal_live.html

@@ -4,7 +4,7 @@
 
       <div class="modal-header">
         <h5 class="modal-title">
-          {{ site.data.lang[site.conference.lang].live.streaming | default: "Live Stream" }}
+          {{ site.data.lang[site.conference.lang].live.stream | default: "Live Stream" }}
         </h5>
         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
           <span aria-hidden="true">&times;</span>

data/_includes/partials/navbar.html

@@ -41,7 +41,18 @@
 
             <li class="nav-item live-show d-none" data-start="{{ live_starts }}" data-end="{{ live_ends }}">
               {%- 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="#">
+                <a class="nav-link" title="
+                  {%- if link.name -%}
+                    {{- link.name -}}
+                  {%- else -%}
+                    {{- site.data.lang[site.conference.lang].live.stream | default: "Live Stream" -}}
+                  {%- endif -%}
+                  " {% if site.conference.live.streaming.external -%}
+                    href="{{ site.conference.live.streaming.external }}"
+                  {%- else -%}
+                    data-toggle="modal" data-target="#stream-modal" data-room="{{ r.name }}" href="#"
+                  {%- endif -%}
+                  >
               {%- else %}
                 {%- assign link_styleclass = "nav-link" -%}
                 {%- include partials/get_link.html %}

data/_includes/partials/show_live_button.html

@@ -2,7 +2,11 @@
   {%- include partials/get_talk_timestamp.html -%}
 
   {%- if site.conference.live.streaming -%}
-    <a title="{{ link.name }}" data-toggle="modal" data-target="#stream-modal" data-room="{{ r.name }}" href="#"
+    <a title="{{ link.name }}" {% if site.conference.live.streaming.external -%}
+      href="{{ site.conference.live.streaming.external }}"
+    {%- else -%}
+      data-toggle="modal" data-target="#stream-modal" data-room="{{ r.name }}" href="#"
+    {%- endif -%}
   {%- else -%}
     <span
   {%- endif %} class="live-show live-button badge badge-dark font-weight-normal text-center d-none {{ live_button_styleclass }}" data-start="{{ timestamp_start }}" data-end="{{ timestamp_end }}">

data/_layouts/data.html

@@ -12,13 +12,19 @@
     ],
 
     "rooms": {
+    {%- assign first_room = true -%}
     {%- for room in site.rooms %}
-        {%- if room.live %}
+        {%- if room.live -%}
+            {%- unless first_room -%}
+                ,
+            {%- else -%}
+                {%- assign first_room = false -%}
+            {%- endunless %}
         "{{ room.name }}": {
             "id": {{ forloop.index }},
             "name": "{{ room.name }}",
             "href": "{{ room.live }}"
-        }{%- unless forloop.last -%},{%- endunless %}
+        }
         {%- endif -%}
     {%- endfor %}
     },
@@ -41,18 +47,24 @@
     },
 
     "talks": {
+    {%- assign first_room = true -%}
     {%- for room in site.rooms -%}
-        {%- assign room_has_talks = false %}
+        {%- assign first_talk = true -%}
         {%- for d in site.data.program.days -%}
             {%- for r in d.rooms -%}
                 {%- if room.name == r.name and room.live %}
 
-                    {%- unless room_has_talks %}
+                    {%- if first_talk -%}
+                        {%- unless first_room -%}
+                            ,
+                        {%- else -%}
+                            {%- assign first_room = false -%}
+                        {%- endunless %}
         "{{ room.name | replace: '"', '\"' }}": [
-                        {%- assign room_has_talks = true %}
+                        {%- assign first_talk = false %}
                     {%- else -%}
                         ,
-                    {%- endunless -%}
+                    {%- endif -%}
 
                     {%- for t in r.talks %}
                         {%- assign talk = site.talks | where: 'name', t.name | first %}
@@ -82,9 +94,9 @@
             {%- endfor -%}
         {%- endfor -%}
 
-        {%- if room_has_talks %}
-        ]{%- unless forloop.last -%},{%- endunless -%}
-        {%- endif -%}
+        {%- unless first_talk %}
+        ]
+        {%- endunless -%}
     {%- endfor %}
     }
 }

data/_layouts/home.html

@@ -23,11 +23,12 @@
 
     {% if site.conference.main.links %}
       <div class="lead d-print-none">
+      {% assign btn_default = 'btn btn-outline-primary btn-lg mt-2 ml-1' %}
       {% for link in site.conference.main.links %}
 
         {% if link.menu %}
           <div class="dropdown d-inline">
-            <a class="btn btn-outline-primary btn-lg mt-2 dropdown-toggle" href="#" role="button" id="main-dropdown{{ forloop.index0 }}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+            <a class="{{ btn_default }} dropdown-toggle" href="#" role="button" id="main-dropdown{{ forloop.index0 }}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
               {{ link.name }}
             </a>
             <div class="dropdown-menu" aria-labelledby="main-dropdown{{ forloop.index0 }}">
@@ -48,20 +49,20 @@
           {%- if link.name -%}
             {%- assign link_name = link.name -%}
           {%- else -%}
-            {%- assign link_name =  site.data.lang[site.conference.lang].live.streaming | default: "Live Stream" -%}
+            {%- assign link_name =  site.data.lang[site.conference.lang].live.stream | default: "Live Stream" -%}
           {%- endif -%}
 
           {%- if link.name_inactive -%}
-            <span class="live-hide btn btn-outline-primary btn-lg mt-2 disabled" data-start="{{ live_starts }}" data-end="{{ live_ends }}">
+            <span class="live-hide {{ btn_default }} disabled" data-start="{{ live_starts }}" data-end="{{ live_ends }}">
               {{ link.name_inactive }}
             </span>
           {%- endif -%}
 
           <span class="live-show d-none" data-start="{{ live_starts }}" data-end="{{ live_ends }}">
             {% if site.conference.live.streaming %}
-              <a class="btn btn-outline-primary btn-lg mt-2" title="{{ link_name }}" data-toggle="modal" data-target="#stream-modal" data-room="" href="#">
+              <a class="{{ btn_default }}" title="{{ link_name }}" data-toggle="modal" data-target="#stream-modal" data-room="" href="#">
             {% else %}
-              {% assign link_styleclass = "btn btn-outline-primary btn-lg mt-2" %}
+              {% assign link_styleclass = "{{ btn_default }}" %}
               {% include partials/get_link.html %}
               {{ link_tag }}
             {% endif %}
@@ -71,7 +72,7 @@
           </span>
 
         {% else %}
-          {% assign link_styleclass = "btn btn-outline-primary btn-lg mt-2" %}
+          {% assign link_styleclass = btn_default %}
           {% include partials/get_link.html %}
           {{ link_tag }}
             {{ link.name }}

data/_layouts/stream-overview.html

@@ -0,0 +1,42 @@
+{% include partials/header.html %}
+
+  <h1 class="display-5 mb-4">
+    {% if page.title %}
+      {{ page.title }}
+    {% else %}
+      {{ site.data.lang[site.conference.lang].live.stream | default: "Live Streams" }}
+    {% endif %}
+  </h1>
+
+  {{ content }}
+
+  {%- assign nbr_streams = 0 -%}
+  {%- for room in site.rooms -%}
+    {%- if room.live -%}
+      {%- assign mod_nbr_streams = nbr_streams | modulo: 2 -%}
+      {%- if mod_nbr_streams == 0 %}
+  <div class="row">
+      {%- endif %}
+
+    <div class="col-md">
+      <h3>{{ room.name }}</h3>
+      <div class="embed-responsive embed-responsive-16by9">
+        <iframe class="embed-responsive-item" src="{{ room.live }}" allowfullscreen></iframe>
+      </div>
+    </div>
+
+      {%- if mod_nbr_streams == 1 %}
+  </div>
+      {%- endif -%}
+
+      {%- assign nbr_streams = nbr_streams | plus: 1 -%}
+    {%- endif -%}
+  {%- endfor %}
+
+  {% assign mod_nbr_streams = nbr_streams | modulo: 2 %}
+  {%- if mod_nbr_streams == 1 %}
+    <div class="col-md"></div>
+  </div>
+  {%- endif %}
+
+{% include partials/footer.html %}

data/_sass/conference.scss

@@ -79,6 +79,12 @@ ul.btn-group {
 
 // General
 
+//   Keep images in container
+main.container img {
+  max-width: 100%;
+  height: auto;
+}
+
 //   No bottom margin on info-bar
 .alert > p:last-of-type {
   margin-bottom: 0;
@@ -135,19 +141,21 @@ ul.btn-group {
 
   // Column widths
   th, td {
+    // Total available container width is 1110px
+
     // Width of columns with content (default)
-    width: 220px;
-    min-width: 220px;
+    width: 245px;
+    min-width: 245px;
 
     // Spacing between columns
     &.col-space {
-      width: 10px;
-      min-width: 10px;
+      width: 15px;
+      min-width: 15px;
     }
     // Width of first column containing timestamps
     &.col-title {
-      width: 4.5em;
-      min-width: 4.5em;
+      width: 70px;
+      min-width: 70px;
     }
   }
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-theme-conference
 version: !ruby/object:Gem::Version
-  version: 3.0.2
+  version: 3.1.2
 platform: ruby
 authors:
 - Lorenz Schmid
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2020-12-14 00:00:00.000000000 Z
+date: 2021-02-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -108,6 +108,7 @@ files:
 - _layouts/room.html
 - _layouts/speaker-overview.html
 - _layouts/speaker.html
+- _layouts/stream-overview.html
 - _layouts/talk-overview.html
 - _layouts/talk.html
 - _sass/bootstrap/_alert.scss
@@ -278,7 +279,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.1.4
+rubygems_version: 3.2.3
 signing_key: 
 specification_version: 4
 summary: Jekyll template for a conference website containing program, speaker, talks