From 83006f2f2cad06951ed8567b7c560ca420b657cb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andrej=20Rama=C5=A1euski?= <andrej@x2.cz>
Date: Fri, 20 Nov 2020 02:04:15 +0100
Subject: [PATCH] Nove templaty
---
templates/live.html.ep | 34 ++++++++++++++++++++++
templates/streams.html.ep | 59 +++++++++++++++++++++++++++++++++++++++
2 files changed, 93 insertions(+)
create mode 100644 templates/live.html.ep
create mode 100644 templates/streams.html.ep
diff --git a/templates/live.html.ep b/templates/live.html.ep
new file mode 100644
index 0000000..0b56660
--- /dev/null
+++ b/templates/live.html.ep
@@ -0,0 +1,34 @@
+% layout 'default';
+% title 'Živé vysílání';
+
+<div class="container pt-2 lg:pb-2 ">
+<table id="Streams"
+ class="table table--bordered"
+ data-row-style="rowStyle"
+ data-url="/api/streams?live=true">
+ <thead>
+ <tr>
+ <th data-field="name" data-width="70" data-width-unit="%">Stream</th>
+ <th data-field="publish_user_name" data-width="30" data-width-unit="%">Vysílá</th>
+ </tr>
+ </thead>
+</table>
+</div>
+
+<script>
+
+$('#Streams').bootstrapTable({
+ onClickRow: function (row) {
+ window.location.href = '/play/' + row.key;
+ },
+ formatNoMatches: function() { return '<p class="text-4xl">Aktuálně neprobíhá žádné živé vysílání</p>' },
+});
+
+setInterval(
+ function() {
+ $('#Streams').bootstrapTable('refresh', {silent: true})
+ },
+ 5000
+);
+
+</script>
diff --git a/templates/streams.html.ep b/templates/streams.html.ep
new file mode 100644
index 0000000..9242c8e
--- /dev/null
+++ b/templates/streams.html.ep
@@ -0,0 +1,59 @@
+% layout 'default';
+% title 'Seznam streamů';
+
+<h1 class="container container--default pt-4 lg:pb-4 bg-grey-300 text-grey-100 head-alt-base">Seznam streamů<h1>
+
+<div class="container pt-2 lg:pb-2 ">
+<table id="Streams"
+ class="table table--bordered"
+ data-detail-view="true"
+ data-detail-view-icon="false"
+ data-detail-view-by-click="true"
+ data-detail-formatter="streamInfo"
+ data-row-style="rowStyle"
+ data-url="/api/streams">
+ <thead>
+ <tr>
+ <th data-field="name" data-width="100" data-width-unit="%">Stream</th>
+ <th data-field="id" data-width="30" data-formatter="statusFormatter"></th>
+ </tr>
+ </thead>
+</table>
+</div>
+
+<script>
+$('#Streams').bootstrapTable({});
+
+function streamInfo(index, row, element) {
+ $.ajax({
+ url: '/streams/' + row.id,
+ type: 'get',
+ success: function(response){
+ element.html(response)
+ }
+ });
+}
+
+function rowStyle(row, index) {
+ var classes = ''
+
+ if ( row.is_live ) {
+ classes = 'Live'
+ }
+
+ return { classes: classes }
+}
+
+function statusFormatter(value, row) {
+ if (row.is_live ) {
+ return '<i class="fa fa-play-circle"></i>';
+ }
+ else if (row.is_writeable ) {
+ return '<i class="fa fa-video"></i>';
+ }
+ else {
+ return '';
+ }
+}
+
+</script>
--
GitLab