github/plexpy
1
0
Fork 0
mirror of https://github.com/Tautulli/Tautulli.git synced 2025-08-19 04:49:36 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Add network and bandwidth to current activity

Browse source 
* Move quality profile to info bar
This commit is contained in:
JonnyWong16 2017-08-07 11:25:26 -07:00
commit 862c9cea87
3 changed files with 37 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

12
data/interfaces/default/css/plexpy.css
View file

@ -611,7 +611,7 @@ textarea.form-control:focus {
a .poster-face:hover, a .poster-face:hover,
a .cover-face:hover, a .cover-face:hover,
a .users-poster-face:hover { a .users-poster-face:hover {
webkit-box-shadow: inset 0 0 0 2px #e9a049; -webkit-box-shadow: inset 0 0 0 2px #e9a049;
-moz-box-shadow: inset 0 0 0 2px #e9a049; -moz-box-shadow: inset 0 0 0 2px #e9a049;
box-shadow: inset 0 0 0 2px #e9a049; box-shadow: inset 0 0 0 2px #e9a049;
} }
@ -642,7 +642,8 @@ a .users-poster-face:hover {
box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 2px #e9a049; box-shadow: 0 0 4px rgba(0,0,0,.3),inset 0 0 0 2px #e9a049;
} }
.dashboard-instance.hover .dashboard-activity-poster-info-bar, .dashboard-instance.hover .dashboard-activity-poster-info-bar,
.dashboard-instance.hover .dashboard-activity-terminate-bar { .dashboard-instance.hover .dashboard-activity-terminate-bar,
.dashboard-instance.hover .dashboard-activity-terminate-session {
opacity: 1; opacity: 1;
} }
.dashboard-instance.hover .dashboard-activity-progress-bar { .dashboard-instance.hover .dashboard-activity-progress-bar {
@ -793,7 +794,7 @@ a .users-poster-face:hover {
opacity: 0; opacity: 0;
-webkit-transition: all .2s; -webkit-transition: all .2s;
transition: all .2s; transition: all .2s;
z-index: 0W; z-index: -2;
} }
.dashboard-activity-terminate-session { .dashboard-activity-terminate-session {
width: 50px; width: 50px;
@ -803,9 +804,12 @@ a .users-poster-face:hover {
left: 0; left: 0;
font-size: 30px; font-size: 30px;
color: #eee; color: #eee;
z-index: 1;
text-align: center; text-align: center;
padding-top: 5px; padding-top: 5px;
opacity: 0;
-webkit-transition: all .2s;
transition: all .2s;
z-index: 1;
} }
.dashboard-activity-terminate-session:hover { .dashboard-activity-terminate-session:hover {
color: #e9a049; color: #e9a049;

45
data/interfaces/default/current_activity_instance.html
View file

@ -106,20 +106,18 @@ DOCUMENTATION :: END
% else: % else:
<div class="dashboard-activity-poster-face" style="background-image: url(${data['art']});"></div> <div class="dashboard-activity-poster-face" style="background-image: url(${data['art']});"></div>
% endif % endif
% if _session['user_group'] == 'admin' and plexpy.CONFIG.PMS_PLEXPASS:
<div class="dashboard-activity-terminate-bar">
<div class="dashboard-activity-terminate-session" id="terminate-button-${data['session_key']}" data-key="${data['session_key']}" data-id="${data['session_id']}" style="display: none;">
<span class="btn-terminate-session" data-toggle="tooltip" title="Terminate Stream">
<i class="fa fa-times"></i>
</span>
</div>
</div>
% endif
<div class="dashboard-activity-button-info"> <div class="dashboard-activity-button-info">
<button type="button" class="btn btn-activity-info btn-lg" data-target="#stream-${data['session_key']}" data-key="${data['session_key']}"> <button type="button" class="btn btn-activity-info btn-lg" data-target="#stream-${data['session_key']}" data-key="${data['session_key']}">
<i class="fa fa-info-circle"></i> <i class="fa fa-info-circle"></i>
</button> </button>
</div> </div>
% if _session['user_group'] == 'admin' and plexpy.CONFIG.PMS_PLEXPASS:
<div class="dashboard-activity-terminate-session" id="terminate-button-${data['session_key']}" data-key="${data['session_key']}" data-id="${data['session_id']}">
<span class="btn-terminate-session" data-toggle="tooltip" title="Terminate Stream">
<i class="fa fa-times"></i>
</span>
</div>
% endif
<div id="stream-${data['session_key']}" class="dashboard-activity-info-details-overlay"> <div id="stream-${data['session_key']}" class="dashboard-activity-info-details-overlay">
<div class="dashboard-activity-info-details-content"> <div class="dashboard-activity-info-details-content">
<div id="platform-${data['session_key']}" title="${data['platform']}"> <div id="platform-${data['session_key']}" title="${data['platform']}">
@ -131,11 +129,11 @@ DOCUMENTATION :: END
<strong>${data['player']}</strong><br /> <strong>${data['player']}</strong><br />
<span id="overlay-play-state-${data['session_key']}"> <span id="overlay-play-state-${data['session_key']}">
% if data['state'] == 'playing': % if data['state'] == 'playing':
State &nbsp;<strong>Playing</strong> ${'(' + data['quality_profile'] + ')' if data['media_type'] != 'track' else ''} State &nbsp;<strong>Playing</strong>
% elif data['state'] == 'paused': % elif data['state'] == 'paused':
State &nbsp;<strong>Paused</strong> ${'(' + data['quality_profile'] + ')' if data['media_type'] != 'track' else ''} State &nbsp;<strong>Paused</strong>
% elif data['state'] == 'buffering': % elif data['state'] == 'buffering':
State &nbsp;<strong>Buffering</strong> ${'(' + data['quality_profile'] + ')' if data['media_type'] != 'track' else ''} State &nbsp;<strong>Buffering</strong>
% endif % endif
</span> </span>
</div> </div>
@ -195,24 +193,29 @@ DOCUMENTATION :: END
</div> </div>
</div> </div>
</div> </div>
<div class="dashboard-activity-terminate-bar">
</div>
% if data['media_type'] != 'photo': % if data['media_type'] != 'photo':
<div class="dashboard-activity-poster-info-bar"> <div class="dashboard-activity-poster-info-bar">
<div class="dashboard-activity-poster-info-ip-address"> <div class="dashboard-activity-poster-info-ip-address">
% if data['ip_address']: Quality:
<span>IP: ${data['ip_address']}</span> <span id="stream-quality-${data['session_key']}">
% else: ${data['quality_profile'] if data['media_type'] != 'track' else ''}
<span>IP: N/A</span> </span>
% endif
<br /> <br />
% if data['ip_address']:
IP: ${data['ip_address']} (${data['location'].upper()} - <span id="stream-bandwidth-${data['session_key']}">${data['bandwidth']}</span> kbps)
% else:
IP: N/A
% endif
</div>
<div class="dashboard-activity-poster-info-time">
ETA: ETA:
<span id="stream-eta-${data['session_key']}"> <span id="stream-eta-${data['session_key']}">
<script> <script>
$("#stream-eta-${data['session_key']}").html(moment().add(parseInt("${data['duration']}") - parseInt("${data['view_offset']}"), 'milliseconds').format(time_format)); $("#stream-eta-${data['session_key']}").html(moment().add(parseInt("${data['duration']}") - parseInt("${data['view_offset']}"), 'milliseconds').format(time_format));
</script> </script>
</span> </span><br /><span class="progress_time" id="stream-view-offset-${data['session_key']}">
</div>
<div class="dashboard-activity-poster-info-time">
<span class="progress_time" id="stream-view-offset-${data['session_key']}">
<script> <script>
$("#stream-view-offset-${data['session_key']}").html(millisecondsToMinutes(parseInt("${data['view_offset']}"), false)); $("#stream-view-offset-${data['session_key']}").html(millisecondsToMinutes(parseInt("${data['view_offset']}"), false));
</script> </script>

11
data/interfaces/default/index.html
View file

@ -267,8 +267,7 @@
var overlay_state = 'State &nbsp;<strong>Unknown</strong>'; var overlay_state = 'State &nbsp;<strong>Unknown</strong>';
var state_icon = '<i class="fa fa-fw fa-question-circle"></i>&nbsp;'; var state_icon = '<i class="fa fa-fw fa-question-circle"></i>&nbsp;';
} }
var q = (s.media_type != 'track') ? ' (' + s.quality_profile + ')' : ''; $('#overlay-play-state-' + key).html(overlay_state);
$('#overlay-play-state-' + key).html(overlay_state + q);
$('#play-state-' + key).html(state_icon); $('#play-state-' + key).html(state_icon);
% if config['pms_use_bif']: % if config['pms_use_bif']:
@ -351,6 +350,10 @@
} }
$('#transcode-state-' + key).html(ts); $('#transcode-state-' + key).html(ts);
// update the stream quality profile and bandwidth
$('#stream-quality-' + key).html((s.media_type != 'track') ? s.quality_profile : '');
$('#stream-bandwidth-' + key).html(s.bandwidth);
// update the stream progress times // update the stream progress times
$('#stream-eta-' + key).html(moment().add(parseInt(s.duration) - parseInt(s.view_offset), 'milliseconds').format(time_format)); $('#stream-eta-' + key).html(moment().add(parseInt(s.duration) - parseInt(s.view_offset), 'milliseconds').format(time_format));
$('#stream-view-offset-' + key).html(millisecondsToMinutes(s.view_offset, false)); $('#stream-view-offset-' + key).html(millisecondsToMinutes(s.view_offset, false));
@ -426,15 +429,11 @@
$('#currentActivity').on('mouseover', '.dashboard-hover-container', function () { $('#currentActivity').on('mouseover', '.dashboard-hover-container', function () {
$(this).closest('.dashboard-instance').addClass('hover'); $(this).closest('.dashboard-instance').addClass('hover');
var key = $(this).closest('.dashboard-instance').data('key'); var key = $(this).closest('.dashboard-instance').data('key');
if (!($('#stream-' + key).is(':visible'))) {
$('#terminate-button-' + key).fadeIn(200);
}
}); });
$('#currentActivity').on('mouseleave', '.dashboard-hover-container', function () { $('#currentActivity').on('mouseleave', '.dashboard-hover-container', function () {
var key = $(this).closest('.dashboard-instance').data('key'); var key = $(this).closest('.dashboard-instance').data('key');
if (!($('#stream-' + key).is(':visible'))) { if (!($('#stream-' + key).is(':visible'))) {
$(this).closest('.dashboard-instance').removeClass('hover'); $(this).closest('.dashboard-instance').removeClass('hover');
$('#terminate-button-' + key).fadeOut(200);
} }
}); });