Live banner

layouts/partials/components/live_banner.html

@@ -0,0 +1,51 @@
+{{ with .live_banner }}
+{{ if .enable }}
+<div class="{{ .section_class }}">
+  <h2 class="{{ .title_class }}">{{ .title }}</h2>
+  <div class="frontpage-stream-container">
+    <!-- twitch -->
+    {{ if .use_twitch }}
+    <!-- Add a placeholder for the Twitch embed -->
+    <div id="twitch-embed" style="width: 100%;height: 100%;"></div>
+
+    <!-- Load the Twitch embed JavaScript file -->
+    <script src="https://embed.twitch.tv/embed/v1.js"></script>
+
+    <!-- Create a Twitch.Embed object that will render within the "twitch-embed" element -->
+    <script type="text/javascript">
+      new Twitch.Embed("twitch-embed", {
+        width: "100%",
+        height: "100%",
+        channel: "{{ .twitch_channel }}",
+      });
+    </script>
+    {{ end }}
+    <!-- /twitch -->
+    {{ if .use_youtube }}
+    <div id="youtube-embed" style="width: 100%;height: 100%">
+      <iframe width="100%" height="100%"
+        src="https://www.youtube.com/embed/live_stream?channel={{ .youtube_channel_id }}" frameborder="0"
+        allowfullscreen>
+      </iframe>
+    </div>
+
+    {{ end }}
+
+    <!-- buttons -->
+    {{ $button_global_class := .buttons_class }}
+    {{ $buttons_row_class := .buttons_row_class }}
+    {{ if .buttons }}
+    <div class="col-10 {{ $buttons_row_class }}">
+      {{ range $i, $button := .buttons }}
+      <a href="{{ $button.link }}" class="{{ $button.class }} {{ $button_global_class }}" title="{{ $button.title }}">{{
+        if $button.icon }}<i class="{{ $button.icon }}"></i>{{ end }}{{ if ne $button.icon_only true }}{{ $button.title
+        | markdownify }}{{ end }}</a>
+      {{ end }}
+    </div>
+    {{ end }}
+    <!-- /buttons -->
+
+  </div>
+</div>
+{{ end }}
+{{ end }}