Select Git revision
importer.py
Forked from
Video AG Infrastruktur / website
Source project has a limited visibility.
Code owners
Assign users and groups as approvers for specific file changes. Learn more.
lecture.html 5.72 KiB
{% from 'macros.html' import player %}
{% from 'macros.html' import video_download_btn %}
{% from 'macros.html' import video_embed_btn %}
{% from 'macros.html' import vtttime %}
{% from 'macros.html' import moderator_editor %}
{% from 'macros.html' import moderator_editor_time %}
{% from 'macros.html' import moderator_delete %}
{% from 'macros.html' import moderator_checkbox %}
{% set page_border = 1 -%}
{% extends "base.html" %}
{% block title %}- {{ course.title }}: {{ lecture.title}}{% endblock %}
{% block header %}
{{ super() }}
<meta property="og:image" content="{{ config.VIDEOPREFIX }}/thumbnail/l_{{lecture.id}}.jpg" />
<meta property="og:title" content="{{ course.title }}: {{ lecture.title}}" />
<meta property="og:description" content="{{ lecture.comment }}" />
{% endblock %}
{% block content %}
<div class="panel panel-default">
<div class="panel-heading">
<span class="panel-title"><strong><a href="{{url_for('course', handle=course.handle)}}#lecture-{{lecture.id}}">{{ course.title }}</a></strong>: {{ lecture.title}}</span>
</div>
<div class="panel-body">
<div class="row" style="padding: 0px;">
<div class="col-xs-12" style="padding-bottom: 5px;">
<a href="{{url_for('course', handle=course.handle)}}#lecture-{{lecture.id}}" class="btn btn-default" ><span class="fa fa-chevron-circle-left" aria-hidden="true"></span> Zur Veranstaltungsseite</a>
<ul class="list-inline pull-right">
<li>{{ video_embed_btn(lecture.id, course=course.handle) }}</li>
<li class="dropdown">{{ video_download_btn(videos) }}</li>
</ul>
</div>
</div>
<div class="row">
<div class="col-xs-12" style="padding: 0px">
{{ player(lecture, videos, get_flashed_messages(category_filter=['player']), seek=seek) }}
</div>
<div class="col-xs-12" style="padding-top: 20px">
<p>{{ moderator_editor(['lectures',lecture.id,'comment'], lecture.comment) }}</p>
</div>
<div class="col-xs-12 table-responsive" style="padding-top: 10px;">
<p>Kapitel:
<button class="btn btn-default" id="hintnewchapter">{% if ismod() %}Neues Kapitel{% else %}Kapitelmarker vorschlagen{% endif %}</button>
</p>
<table class="table table-hover">
<tr>
<th style="width: 130px;">Start</th>
<th>Kapitel</th>
{% if ismod() %}
<th>Sichtbar</th>
<th></th>
{% endif %}
</tr>
{% for c in chapters|sort(attribute='time') %}
<tr>
<td>
<a class="chapterlink" href="{{url_for('lecture', course=course.handle, id=lecture.id, t=c['time'])}}" data-seek-time="{{c['time']}}">{{ '%02d:%02d:%02d'|format( c['time']//3600, (c['time']//60)%60, c['time']%60) }}</a>
<br>
{% if ismod() %}
{{ moderator_editor(['chapters',c.id,'time'],c['time'],true) }}
{% endif %}
</td>
<td>{{ moderator_editor(['chapters',c.id,'text'],c['text']|e) }}</td>
{% if ismod() %}
<td>{{ moderator_checkbox(['chapters',c.id,'visible'], c.visible) }}</td>
<td>{{ moderator_delete(['chapters',c.id,'deleted']) }}</td>
{% endif %}
</tr>
{% endfor %}
</table>
</div>
</div>
</div>
</div>
{% if ismod() %}
<div class="panel panel-default">
<div class="panel-heading">
<a data-toggle="collapse" href="#statspanel" class="plotlyresize"><h1 class="panel-title">Statistiken</h1></a>
</div>
<div class="row panel-body collapse out panel-collapse" id="statspanel">
<div class="col-md-6 col-xs-12">
<p class="text-center">Zuschauer pro Tag</p>
<div class="plot-view" data-url="{{url_for('stats_viewsperday', req="lecture", param=lecture.id)}}"></div>
</div>
<div class="col-md-6 col-xs-12">
<p class="text-center">Zuschauer im Livestream</p>
<div class="plot-view" data-url="{{url_for('stats_generic', req="live_views", param=lecture.id)}}"></div>
</div>
</div>
</div>
{% endif %}
<script>
function hintchapterclick (src) {
$.ajax({
method: "GET",
url: $(src).data('url'),
data: $(src).serialize(),
success: function(data)
{
{% if not ismod() %}
alert("Kapitelmarker vorgeschlagen. Danke!");
{% else %}
window.location.reload();
{% endif %}
$('#hintnewchapter').click();
}
});
return false;
}
$(function() {
$( "#hintnewchapter" ).popover(
{
html:true,
title:'Kapitelmarkierung vorschlagen',
placement: 'bottom',
container: 'body',
content: function() {
var zeropad = function (num, places) {
var zero = places - num.toString().length + 1;
return Array(+(zero > 0 && zero)).join("0") + num;
};
var timestamp = videojs('videoplayer').currentTime()
var h = zeropad( Math.trunc(timestamp/3600),2);
var m = zeropad( Math.trunc((timestamp%3600)/60),2);
var s = zeropad( Math.trunc(timestamp%60),2);
var timeasstring = h+':'+m+':'+s;
return '<form method="post" data-url="{{ url_for('suggest_chapter', lectureid=lecture.id) }}" onSubmit="return hintchapterclick(this);"><input class="form-control" placeholder="00:00.000" name="time" type="text" value="'+timeasstring+'"><br><input class="form-control" placeholder="Kapitel" name="text" type="text"><br><input type="submit" class="btn btn-default" value="{% if ismod() %}Hinzufügen{% else %}Vorschlagen{% endif %}"></form>';
}
})
});
$(document).ready(function() {
$("a.reloadonclose").click(function () {
var popup = window.open(this.href, this.target);
if (!popup)
return true;
var popup_check = setInterval(function() {
if (popup.closed) {
clearInterval(popup_check);
location.reload();
};
}, 500);
return false;
});
$("a.chapterlink").click(function () {
videojs('videoplayer').currentTime($(this).data("seek-time"));
return false;
});
});
</script>
{% endblock %}