mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

fixes #513 - Fix flickering on dashboard now playing page

Browse source
This commit is contained in:
Luke Pulverenti 2013-09-03 11:34:52 -04:00
parent aaec13cc11
commit 3431c8544e
2 changed files with 48 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

4
dashboard-ui/dashboard.html
View file

@ -44,7 +44,9 @@
<div data-role="collapsible" data-content-theme="c" data-collapsed="false" style="margin-top: 2em;">
<h3>Active Connections</h3>
<div id="divConnections">
<div>
<table class="tblConnections" style="border-collapse: collapse;">
</table>
</div>
</div>

58
dashboard-ui/scripts/dashboardpage.js
View file

@ -75,21 +75,26 @@
var html = '';
if (!dashboardInfo.ActiveConnections.length) {
html += '<p>There are no users currently connected.</p>';
$('#divConnections', page).html(html).trigger('create');
return;
}
var table = $('.tblConnections', page);
html += '<table class="tblConnections" style="border-collapse:collapse;">';
$('.trSession', table).addClass('deadSession');
for (var i = 0, length = dashboardInfo.ActiveConnections.length; i < length; i++) {
var connection = dashboardInfo.ActiveConnections[i];
html += '<tr>';
var rowId = 'trSession' + connection.Id;
html += '<td style="text-align:center;">';
var elem = $('#' + rowId, page);
if (elem.length) {
DashboardPage.updateSession(elem, connection);
continue;
}
html += '<tr class="trSession" id="' + rowId + '">';
html += '<td class="clientType" style="text-align:center;">';
html += DashboardPage.getClientType(connection);
html += '</td>';
@ -99,25 +104,40 @@
html += '<div>' + connection.DeviceName + '</div>';
html += '</td>';
html += '<td>';
html += '<td class="username">';
html += connection.UserName || '';
html += '</td>';
html += '<td>';
html += DashboardPage.getNowPlayingImage(connection.NowPlayingItem);
var nowPlayingItem = connection.NowPlayingItem;
html += '<td class="nowPlayingImage">';
html += DashboardPage.getNowPlayingImage(nowPlayingItem);
html += '</td>';
html += '<td>';
html += DashboardPage.getNowPlayingText(connection, connection.NowPlayingItem);
html += '<td class="nowPlayingText">';
html += DashboardPage.getNowPlayingText(connection, nowPlayingItem);
html += '</td>';
html += '</tr>';
}
html += '</table>';
table.append(html).trigger('create');
$('#divConnections', page).html(html);
$('.deadSession', table).remove();
},
updateSession: function(row, session) {
row.removeClass('deadSession');
$('.username', row).html(session.UserName || '');
var nowPlayingItem = session.NowPlayingItem;
$('.nowPlayingText', row).html(DashboardPage.getNowPlayingText(session, nowPlayingItem)).trigger('create');
$('.nowPlayingImage', row).html(DashboardPage.getNowPlayingImage(nowPlayingItem));
},
getClientType: function (connection) {
@ -190,10 +210,7 @@
getNowPlayingImage: function (item) {
if (item) {
if (item.PrimaryImageTag) {
if (item && item.PrimaryImageTag) {
var url = ApiClient.getImageUrl(item.Id, {
type: "Primary",
height: 100,
@ -202,7 +219,6 @@
return "<img class='clientNowPlayingImage' src='" + url + "' alt='" + item.Name + "' title='" + item.Name + "' />";
}
}
return "";
},
@ -213,7 +229,7 @@
if (item) {
html += "<div>" + item.Name + "</div>";
html += "<div><a href='itemdetails.html?id=" + item.Id + "'>" + item.Name + "</a></div>";
html += "<div>";