From cebdf37a8a922b34b0b77dfc4d1d17c19e9dc076 Mon Sep 17 00:00:00 2001
From: Julian Rother <julianr@fsmpi.rwth-aachen.de>
Date: Thu, 26 Jul 2018 01:15:10 +0200
Subject: [PATCH] Started livestream config modal

---
 server.py             |   3 +-
 templates/course.html | 109 ++++++++++++++++++++++++++++++++++++++++--
 templates/macros.html |   7 +++
 3 files changed, 113 insertions(+), 6 deletions(-)

diff --git a/server.py b/server.py
index 314a639..d6e16eb 100644
--- a/server.py
+++ b/server.py
@@ -256,7 +256,8 @@ def course(id=None, handle=None):
 			LEFT JOIN responsible ON (responsible.user_id = users.id AND responsible.course_id = ?)
 			WHERE users.fsacc != "" AND users.level > 0
 			ORDER BY responsible DESC, users.realname ASC''', course['id'])
-	return render_template('course.html', course=course, lectures=lectures, videos=videos, chapters=chapters, responsible=responsible)
+	live_sources = query('SELECT * FROM live_sources WHERE NOT deleted')
+	return render_template('course.html', course=course, lectures=lectures, videos=videos, chapters=chapters, responsible=responsible, live_sources=live_sources)
 
 @app.route('/faq')
 @register_navbar('FAQ', icon='question-sign')
diff --git a/templates/course.html b/templates/course.html
index f82419e..7a61330 100644
--- a/templates/course.html
+++ b/templates/course.html
@@ -107,6 +107,7 @@
 	</ul>
 </div>
 {% if ismod() %}
+
 <div class="modal fade" id="editperm" tabindex="-1" role="dialog">
 	<div class="modal-dialog" role="document">
 		<div class="modal-content">
@@ -130,28 +131,126 @@
 					<input class="col-xs-12 passwordinput authuser" type="text" placeholder="Benutzername">
 					<input class="col-xs-10 passwordinput authpassword" type="text" placeholder="Passwort">
 					<button class="col-xs-2 passwordinput authpgen" type="button" onclick="$('.authpassword',this.parentNode).val(moderator.permissioneditor.randompw());"><span class="fa fa-refresh" aria-hidden="true"></span></button>
-
 					<input class="col-xs-12 authl2p" type="text" placeholder="Lernraum" style="display: none;">
-
 					<button class="col-xs-4" onclick="moderator.permissioneditor.addbtnclick(this)">Add</button>
 					<button class="col-xs-4" onclick="moderator.permissioneditor.updatebtnclick(this)">Update</button>
 					<button class="col-xs-4" onclick="moderator.permissioneditor.delbtnclick(this)">Delete</button>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
 
-
+<div class="modal fade" id="editstream" tabindex="-1" role="dialog">
+	<div class="modal-dialog" role="document">
+		<div class="modal-content">
+			<div class="modal-header">
+				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+				<h4 class="modal-title">Livestream einrichten</h4>
+			</div>
+			<div class="modal-body">
+				<form id="editstream-form">
+				<div class="row" style="padding-left: 10px; padding-right: 10px;" data-id="-1" data-type="-1">
+					{% for snum in [1,2] %}
+					<div class="col-xs-6">
+						<label>Quelle {{ snum }}</label>
+						<select name="source{{ snum }}" class="form-control source-select">
+							<option value="">Nichts</option>
+							{% for source in live_sources %}
+							<option value="{{ source.id }}">{{ source.name }}</option>
+							{% endfor %}
+						</select>
+						<img src="{{ config.VIDEOPREFIX }}/thumbnail/s_none.jpg" style="width: 100%; margin-bottom: 0.5em; margin-top: 0.5em"/>
+						<select name="source{{ snum }}_audiomode" class="form-control">
+							<option selected value="unchanged">Audio unverändert</option>
+							<option value="left">Nur linke Tonspur</option>
+							<option value="right">Nur rechte Tonspur</option>
+							<option value="mix">Monomix aller Tonspuren</option>
+						</select>
+					</div>
+					{% endfor %}
+					<div class="col-xs-12" style="margin-top: 1em">
+						<label>Video</label>
+						<select name="videomode" class="form-control">
+							<option value="1" selected>Nur Quelle 1</option>
+							<option value="2">Nur Quelle 2</option>
+							<option value="sidebyside">Side-by-Side (Quelle 1 groß, 1/3 von 2 daneben)</option>
+						</select>
+						<div class="checkbox"><label><input name="video_showlogo" type="checkbox" checked>Video AG-Logo einblenden</label></div>
+					</div>
+					<div class="col-xs-12" style="margin-top: 1em">
+						<label>Audio</label>
+						<select name="audiomode" class="form-control">
+							<option value="1" selected>Quelle 1</option>
+							<option value="2">Quelle 2</option>
+							<option value="splitstereo">Quelle 1 links, 2 rechts</option>
+							<option value="mix">Mix beider Quellen</option>
+						</select>
+						<div class="checkbox"><label><input name="audio_normalize" type="checkbox">Lautstärke normalisieren</label></div>
+					</div>
+					<div class="col-xs-12" style="margin-top: 1em">
+						<label>Ausgabeformat</label>
+						<select name="outputmode" class="form-control">
+							<option selected value="multi">1080p/720p/360p (Standard)</option>
+							<option value="720p">Nur 720p</option>
+						</select>
+					</div>
+					<div class="col-xs-12" style="margin-top: 1em">
+						<label>Weitere Einstellungen</label>
+						<div class="checkbox"><label><input name="autostart" type="checkbox" checked>Automatisch starten</label></div>
+					</div>
 				</div>
+				</form>
+			</div>
+			<div class="modal-footer">
+				<button type="button" id="editstream-submit" class="btn btn-primary">Speichern</button>
 			</div>
 		</div>
 	</div>
 </div>
+
 <script>
-{% if ismod() %}
+function editstream_update() {
+	$('#editstream .source-select').each(function () {
+		$(this).siblings('img').prop('src', '{{ config.VIDEOPREFIX }}/thumbnail/s_'+$(this).val()+'.jpg');
+	});
+};
+function editstream_dump() {
+	var res = {};
+	$("#editstream input:checkbox[name!='']").each(function () {
+		res[$(this).attr('name')] = $(this).prop('checked');
+	});
+	$("#editstream select[name!='']").each(function () {
+		res[$(this).attr('name')] = $(this).val();
+	});
+	return JSON.stringify(res);
+};
+function editstream_load(data) {
+	var obj = JSON.parse(data);
+	$("#editstream input:checkbox[name!='']").each(function () {
+		if ($(this).attr('name') in obj)
+			$(this).prop('checked', obj[$(this).attr('name')]);
+	});
+	$("#editstream select[name!='']").each(function () {
+		if ($(this).attr('name') in obj)
+			$(this).val(obj[$(this).attr('name')]);
+	});
+};
+$('#editstream .source-select').on('change', editstream_update);
+$('#editstream-submit').on('click', function () {
+	var tmp = editstream_dump();
+	console.log(tmp);
+	$("#editstream-form")[0].reset();
+	console.log(editstream_dump());
+	editstream_load(tmp);
+	console.log(editstream_dump());
+});
 $('#responsible-select').multiselect({enableCaseInsensitiveFiltering: true,
 		maxHeight: 200, numberDisplayed: 5, nonSelectedText: 'Niemand',
 		nSelectedText: 'ausgewählt', allSelectedText: false,
 		onChange: function(option, checked, select) {
 			moderator.api.set_map('responsible', {{ course.id }}, option.val(), checked);
 		}})
-{% endif %}
 $.ajax({
 	method: "GET",
 	url: "{{url_for('stats_generic', req="lecture_views", param=course.id)}}",
diff --git a/templates/macros.html b/templates/macros.html
index 73edad9..684638d 100644
--- a/templates/macros.html
+++ b/templates/macros.html
@@ -260,6 +260,13 @@ $('#embedcodebtn').popover(
 						<li class="pull-right">
 							{{ moderator_delete(['lectures',lecture.id,'deleted']) }}
 						</li>
+						{% if ismod() %}
+						<li class="pull-right">
+							<button class="btn btn-default" data-toggle="modal" data-target="#editstream">
+								<span class="glyphicon glyphicon-transfer"></span>
+							</button>
+						</li>
+						{% endif %}
 					</ul>
 				</li>
 				{% if ismod() %}
-- 
GitLab