mirror of
https://github.com/Tautulli/Tautulli.git
synced 2025-07-16 02:02:58 -07:00
304 lines
15 KiB
HTML
304 lines
15 KiB
HTML
<%inherit file="base.html"/>
|
|
<%!
|
|
from plexpy import helpers
|
|
%>
|
|
|
|
<%def name="headIncludes()">
|
|
<link rel="stylesheet" href="interfaces/default/css/plexwatch-tables.css">
|
|
</%def>
|
|
|
|
<%def name="body()">
|
|
|
|
<div class="container-fluid">
|
|
<div class="row-fluid">
|
|
<div class="span12">
|
|
<div class="wellheader-bg">
|
|
<div class="dashboard-wellheader-no-chevron">
|
|
<h2><i class="fa fa-history"></i> History</h2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class='container-fluid'>
|
|
<div class='row-fluid'>
|
|
<div class='span12'>
|
|
<div class='wellbg'>
|
|
<table class="display" id="history_table" width="100%">
|
|
<thead>
|
|
<tr>
|
|
<th align='left' id="id"><i class='fa fa-sort'></i> ID</th>
|
|
<th align='left' id="time"><i class='fa fa-sort'></i> Time</th>
|
|
<th align='left' id="user"><i class='fa fa-sort'></i> User</th>
|
|
<th align='left' id="platform"><i class='fa fa-sort'></i> Platform</th>
|
|
<th align='left' id="ip_address"><i class='fa fa-sort'></i> IP Address</th>
|
|
<th align='left' id="title"><i class='fa fa-sort'></i> Title</th>
|
|
<th align='left' id="started"><i class='fa fa-sort'></i> Started</th>
|
|
<th align='left' id="paused"><i class='fa fa-sort'></i> Paused</th>
|
|
<th align='left' id="stopped"><i class='fa fa-sort'></i> Stopped</th>
|
|
<th align='left' id="duration"><i class='fa fa-sort'></i> Duration</th>
|
|
<th align='left' id="percent_complete"> Completed</th>
|
|
<th align='left' id="rating_key"> RatingKey</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
<div id="info-modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="info-modal" aria-hidden="true">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-remove"></i></button>
|
|
<h3 id="myModalLabel">Stream Info: <strong><span id="modal-stream-info"></span></strong></h3>
|
|
</div>
|
|
<div class="modal-body" id="modal-text">
|
|
<div class="span4">
|
|
<h4>Stream Details</h4>
|
|
<ul>
|
|
<h5>Video</h5>
|
|
<li>Stream Type: <strong><span id="transcode_video_dec"></span></strong></li>
|
|
<li>Video Resolution: <strong><span id="transcode_video_resolution"></span>p</strong></li>
|
|
<li>Video Codec: <strong><span id="transcode_video_codec"></span></strong></li>
|
|
<li>Video Width: <strong><span id="transcode_video_width"></span></strong></li>
|
|
<li>Video Height: <strong><span id="transcode_video_height"></span></strong></li>
|
|
</ul>
|
|
<ul>
|
|
<h5>Audio</h5>
|
|
<li>Stream Type: <strong><span id="transcode_audio_dec"></span></strong></li>
|
|
<li>Audio Codec: <strong><span id="transcode_audio_codec"></span></strong></li>
|
|
<li>Audio Channels: <strong><span id="transcode_audio_channels"></span></strong></li>
|
|
</ul>
|
|
</div>
|
|
<div class="span4">
|
|
<h4>Media Source Details</h4>
|
|
<li>Container: <strong><span id="media_container"></span></strong></li>
|
|
<li>Resolution: <strong><span id="media_resolution"></span>p</strong></li>
|
|
<li>Bitrate: <strong><span id="media_bitrate"></span> kbps</strong></li>
|
|
</div>
|
|
<div class="span4">
|
|
<h4>Video Source Details</h4>
|
|
<ul>
|
|
<li>Width: <strong><span id="video_width"></span></strong></li>
|
|
<li>Height: <strong><span id="video_height"></span></strong></li>
|
|
<li>Aspect Ratio: <strong><span id="video_aspect"></span></strong></li>
|
|
<li>Video Frame Rate: <strong><span id="video_framerate"></span></strong></li>
|
|
<li>Video Codec: <strong><span id="video_codec"></span></strong></li>
|
|
</ul>
|
|
<ul></ul>
|
|
<h4>Audio Source Details</h4>
|
|
<ul>
|
|
<li>Audio Codec: <strong><span id="audio_codec"></span></strong></li>
|
|
<li>Audio Channels: <strong><span id="audio_channels"></span></strong></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</%def>
|
|
|
|
|
|
<%def name="javascriptIncludes()">
|
|
|
|
<script src="interfaces/default/js/jquery.dataTables.min.js"></script>
|
|
<script src="interfaces/default/js/jquery.dataTables.bootstrap.pagination.integration.js"></script>
|
|
<script src="interfaces/default/js/moment-with-locale.js"></script>
|
|
<script>
|
|
$(document).ready(function() {
|
|
|
|
var history_table;
|
|
|
|
history_table = $('#history_table').DataTable({
|
|
"destroy": true,
|
|
"language": {
|
|
"search": "Search: ",
|
|
"lengthMenu":"Show _MENU_ entries per page",
|
|
"info":"Showing _START_ to _END_ of _TOTAL_ entries",
|
|
"infoEmpty":"Showing 0 to 0 of 0 entries",
|
|
"infoFiltered":"(filtered from _MAX_ total entries)",
|
|
"emptyTable": "No data in table",
|
|
},
|
|
"stateSave": true,
|
|
"sPaginationType": "bootstrap",
|
|
"processing": false,
|
|
"serverSide": true,
|
|
"pageLength": 10,
|
|
"order": [ 1, 'desc'],
|
|
"ajax": {
|
|
"url": "getHistory.json"
|
|
},
|
|
"columnDefs": [
|
|
{
|
|
"targets": [0],
|
|
"data":"id",
|
|
"visible": false
|
|
},
|
|
{
|
|
"targets": [1],
|
|
"data":"date",
|
|
"createdCell": function (td, cellData, rowData, row, col) {
|
|
if (rowData['stopped'] === null) {
|
|
$(td).addClass('currentlyWatching');
|
|
$(td).html('Currently watching...');
|
|
} else {
|
|
$(td).html(moment(cellData,"X").format("${date_format}"));
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"targets": [2],
|
|
"data":"user"
|
|
},
|
|
{
|
|
"targets": [3],
|
|
"data":"platform",
|
|
"createdCell": function (td, cellData, rowData, row, col) {
|
|
if (cellData !== '') {
|
|
$(td).html('<a href="#info-modal" data-toggle="modal"><span data-toggle="tooltip" data-placement="left" title="Stream Info" id="stream-info" class="badge badge-inverse"><i class="fa fa-info"></i></span></a> '+cellData);
|
|
}
|
|
},
|
|
"className": "modal-control"
|
|
},
|
|
{
|
|
"targets": [4],
|
|
"data":"ip_address",
|
|
"createdCell": function (td, cellData, rowData, row, col) {
|
|
if ((cellData == '') || (cellData == '0')) {
|
|
$(td).html('n/a');
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"targets": [5],
|
|
"data":"title",
|
|
"createdCell": function (td, cellData, rowData, row, col) {
|
|
if (cellData !== '') {
|
|
$(td).html('<a href="info?rating_key=' + rowData['rating_key'] + '">' + cellData + '</a>');
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"targets": [6],
|
|
"data":"started",
|
|
"render": function ( data, type, full ) {
|
|
return moment(data, "X").format("${time_format}");
|
|
}
|
|
},
|
|
{
|
|
"targets": [7],
|
|
"data":"paused",
|
|
"render": function ( data, type, full ) {
|
|
return Math.round(moment.duration(data, 'seconds').as('minutes')) + ' mins';
|
|
}
|
|
},
|
|
{
|
|
"targets": [8],
|
|
"data":"stopped",
|
|
"render": function ( data, type, full ) {
|
|
if (data !== null) {
|
|
return moment(data, "X").format("${time_format}");
|
|
} else {
|
|
return data;
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"targets": [9],
|
|
"data":"duration",
|
|
"render": function ( data, type, full ) {
|
|
if (data !== null) {
|
|
return Math.round(moment.duration(data, 'seconds').as('minutes')) + ' mins';
|
|
} else {
|
|
return data;
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"targets": [10],
|
|
"data":"percent_complete",
|
|
"orderable": false,
|
|
"render": function ( data, type, full ) {
|
|
if (data < 95) {
|
|
return '<span class="badge">'+Math.round(data)+'%</span>';
|
|
} else {
|
|
return '<span class="badge">100%</span>';
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"targets": [11],
|
|
"data":"rating_key",
|
|
"visible": false
|
|
}
|
|
],
|
|
"drawCallback": function (settings) {
|
|
// Jump to top of page
|
|
$('html,body').scrollTop(0);
|
|
$('#ajaxMsg').addClass('success').fadeOut();
|
|
},
|
|
"preDrawCallback": function(settings) {
|
|
$('#ajaxMsg').html("<div class='msg'><span class='ui-icon ui-icon-check'></span>Fetching rows...</div>");
|
|
$('#ajaxMsg').addClass('success').fadeIn();
|
|
}
|
|
});
|
|
|
|
$('#history_table').on('mouseenter', 'td.modal-control span', function () {
|
|
$(this).tooltip();
|
|
} );
|
|
|
|
$('#history_table').on('click', 'td.modal-control', function () {
|
|
var tr = $(this).parents('tr');
|
|
var row = history_table.row( tr );
|
|
var rowData = row.data();
|
|
|
|
$.ajax({
|
|
url: 'getStreamDetails',
|
|
type: 'GET',
|
|
data: {id: rowData['id']},
|
|
success: function(data) {
|
|
$('#modal-stream-info').html(rowData['title']+' ('+rowData['user']+')');
|
|
|
|
$('#media_container').html(data.data.opt.Media['@container']);
|
|
$('#media_resolution').html(data.data.opt.Media['@videoResolution']);
|
|
$('#media_bitrate').html(data.data.opt.Media['@bitrate']);
|
|
|
|
if (data.data.opt.TranscodeSession) {
|
|
$('#transcode_video_dec').html(data.data.opt.TranscodeSession['@videoDecision']);
|
|
$('#transcode_video_resolution').html(data.data.opt.TranscodeSession['@height']);
|
|
$('#transcode_video_codec').html(data.data.opt.TranscodeSession['@videoCodec']);
|
|
$('#transcode_video_width').html(data.data.opt.TranscodeSession['@width']);
|
|
$('#transcode_video_height').html(data.data.opt.TranscodeSession['@height']);
|
|
|
|
$('#transcode_audio_dec').html(data.data.opt.TranscodeSession['@audioDecision']);
|
|
$('#transcode_audio_codec').html(data.data.opt.TranscodeSession['@audioCodec']);
|
|
$('#transcode_audio_channels').html(data.data.opt.TranscodeSession['@audioChannels']);
|
|
} else {
|
|
$('#transcode_video_dec').html('Direct Play');
|
|
$('#transcode_video_resolution').html(data.data.opt.Media['@videoResolution']);
|
|
$('#transcode_video_codec').html(data.data.opt.Media.Part.Stream[0]['@codec']);
|
|
$('#transcode_video_width').html(data.data.opt.Media['@width']);
|
|
$('#transcode_video_height').html(data.data.opt.Media['@height']);
|
|
|
|
$('#transcode_audio_dec').html('Direct Play');
|
|
$('#transcode_audio_codec').html(data.data.opt.Media['@audioCodec']);
|
|
$('#transcode_audio_channels').html(data.data.opt.Media['@audioChannels']);
|
|
}
|
|
|
|
$('#video_width').html(data.data.opt.Media['@width']);
|
|
$('#video_height').html(data.data.opt.Media['@height']);
|
|
$('#video_aspect').html(data.data.opt.Media['@aspectRatio']);
|
|
$('#video_framerate').html(data.data.opt.Media['@videoFrameRate']);
|
|
$('#video_codec').html(data.data.opt.Media['@videoCodec']);
|
|
|
|
$('#audio_codec').html(data.data.opt.Media['@audioCodec']);
|
|
$('#audio_channels').html(data.data.opt.Media['@audioChannels']);
|
|
}
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
|
|
</%def>
|