Merge pull request #96 from JonnyWong16/dev

More stylized homepage statistics and other style changes
This commit is contained in:
drzoidberg33 2015-08-19 23:29:58 +02:00
commit 9adf5cc39a
16 changed files with 1184 additions and 955 deletions

File diff suppressed because it is too large Load diff

View file

@ -287,6 +287,7 @@
if(getCookie('graphDate')) { if(getCookie('graphDate')) {
var current_range = getCookie('graphDate'); var current_range = getCookie('graphDate');
$('input[name=date-options][value=' + current_range + ']').prop('checked', true).trigger('click'); $('input[name=date-options][value=' + current_range + ']').prop('checked', true).trigger('click');
$('.days').html(current_range);
} }
if(getCookie('graphTab')) { if(getCookie('graphTab')) {
var current_tab = getCookie('graphTab'); var current_tab = getCookie('graphTab');

View file

@ -66,6 +66,8 @@
var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] }); var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] });
$(colvis.button()).appendTo('div.colvis-button-bar'); $(colvis.button()).appendTo('div.colvis-button-bar');
clearSearchButton('history_table', history_table);
$('#row-edit-mode').click(function() { $('#row-edit-mode').click(function() {
if ($(this).hasClass('active')) { if ($(this).hasClass('active')) {
$('.delete-control').each(function() { $('.delete-control').each(function() {

View file

@ -43,6 +43,8 @@
} }
history_table = $('#history_table').DataTable(history_table_modal_options); history_table = $('#history_table').DataTable(history_table_modal_options);
clearSearchButton('history_table', history_table);
}); });
</script> </script>
% else: % else:

View file

@ -64,173 +64,189 @@ DOCUMENTATION :: END
% if a['stat_id'] == 'top_tv' and a['rows']: % if a['stat_id'] == 'top_tv' and a['rows']:
<div class="home-platforms-instance"> <div class="home-platforms-instance">
<li> <li>
<span> <div class="home-platforms-instance-info">
<a href="info?item_id=${a['rows'][0]['rating_key']}"> <div class="home-platforms-instance-name">
% if a['rows'][0]['grandparent_thumb']: <h4>Most Watched TV</h4>
<img class="home-platforms-instance-poster" <h5><a href="info?item_id=${a['rows'][0]['rating_key']}">
src="pms_image_proxy?img=${a['rows'][0]['grandparent_thumb']}&width=162&height=240&fallback=poster"> ${a['rows'][0]['title']}
</a></h5>
</div>
<div class="user-platforms-instance-playcount">
% if a['stat_type'] == 'total_plays':
<h3>${a['rows'][0]['total_plays']}</h3>
<p> plays</p>
% else: % else:
<img class="home-platforms-instance-poster" src="interfaces/default/images/poster.png"> ${a['rows'][0]['total_duration'] | hd}
% endif % endif
</a> </div>
</span>
<div class="home-platforms-instance-name">
<h4>Most Watched TV</h4>
<h5><a href="info?item_id=${a['rows'][0]['rating_key']}">
${a['rows'][0]['title']}
</a></h5>
</div> </div>
<div class="user-platforms-instance-playcount"> <a href="info?item_id=${a['rows'][0]['rating_key']}">
% if a['stat_type'] == 'total_plays': % if a['rows'][0]['grandparent_thumb']:
<h3>${a['rows'][0]['total_plays']}</h3> <div class="home-platforms-instance-poster">
<p> plays</p> <div class="poster-face" style="background-image: url(pms_image_proxy?img=${a['rows'][0]['grandparent_thumb']}&width=300&height=450&fallback=poster);"></div>
</div>
% else: % else:
${a['rows'][0]['total_duration'] | hd} <div class="home-platforms-instance-poster">
<div class="poster-face" style="background-image: url(interfaces/default/images/poster.png);"></div>
</div>
% endif % endif
</div> </a>
</li> </li>
</div> </div>
% elif a['stat_id'] == 'popular_tv' and a['rows']: % elif a['stat_id'] == 'popular_tv' and a['rows']:
<div class="home-platforms-instance"> <div class="home-platforms-instance">
<li> <li>
<span> <div class="home-platforms-instance-info">
<a href="info?item_id=${a['rows'][0]['rating_key']}"> <div class="home-platforms-instance-name">
% if a['rows'][0]['grandparent_thumb'] != '': <h4>Most Popular TV</h4>
<img class="home-platforms-instance-poster" <h5><a href="info?item_id=${a['rows'][0]['rating_key']}">
src="pms_image_proxy?img=${a['rows'][0]['grandparent_thumb']}&width=162&height=240&fallback=poster"> ${a['rows'][0]['title']}
% else: </a></h5>
<img class="home-platforms-instance-poster" src="interfaces/default/images/poster.png"> </div>
% endif <div class="user-platforms-instance-playcount">
</a> <h3>${a['rows'][0]['users_watched']}</h3>
</span> <p> users</p>
<div class="home-platforms-instance-name"> </div>
<h4>Most Popular TV</h4>
<h5><a href="info?item_id=${a['rows'][0]['rating_key']}">
${a['rows'][0]['title']}
</a></h5>
</div>
<div class="user-platforms-instance-playcount">
<h3>${a['rows'][0]['users_watched']}</h3>
<p> users</p>
</div> </div>
<a href="info?item_id=${a['rows'][0]['rating_key']}">
% if a['rows'][0]['grandparent_thumb'] != '':
<div class="home-platforms-instance-poster">
<div class="poster-face" style="background-image: url(pms_image_proxy?img=${a['rows'][0]['grandparent_thumb']}&width=300&height=450&fallback=poster);"></div>
</div>
% else:
<div class="home-platforms-instance-poster">
<div class="poster-face" style="background-image: url(interfaces/default/images/poster.png);"></div>
</div>
% endif
</a>
</li> </li>
</div> </div>
% elif a['stat_id'] == 'top_movies' and a['rows']: % elif a['stat_id'] == 'top_movies' and a['rows']:
<div class="home-platforms-instance"> <div class="home-platforms-instance">
<li> <li>
<span> <div class="home-platforms-instance-info">
<a href="info?item_id=${a['rows'][0]['rating_key']}"> <div class="home-platforms-instance-name">
% if a['rows'][0]['thumb']: <h4>Most Watched Movie</h4>
<img class="home-platforms-instance-poster" <h5><a href="info?item_id=${a['rows'][0]['rating_key']}">
src="pms_image_proxy?img=${a['rows'][0]['thumb']}&width=162&height=240&fallback=poster"> ${a['rows'][0]['title']}
</a></h5>
</div>
<div class="user-platforms-instance-playcount">
% if a['stat_type'] == 'total_plays':
<h3>${a['rows'][0]['total_plays']}</h3>
<p> plays</p>
% else: % else:
<img class="home-platforms-instance-poster" src="interfaces/default/images/poster.png"> ${a['rows'][0]['total_duration'] | hd}
% endif % endif
</a> </div>
</span>
<div class="home-platforms-instance-name">
<h4>Most Watched Movie</h4>
<h5><a href="info?item_id=${a['rows'][0]['rating_key']}">
${a['rows'][0]['title']}
</a></h5>
</div> </div>
<div class="user-platforms-instance-playcount"> <a href="info?item_id=${a['rows'][0]['rating_key']}">
% if a['stat_type'] == 'total_plays': % if a['rows'][0]['thumb']:
<h3>${a['rows'][0]['total_plays']}</h3> <div class="home-platforms-instance-poster">
<p> plays</p> <div class="poster-face" style="background-image: url(pms_image_proxy?img=${a['rows'][0]['thumb']}&width=300&height=450&fallback=poster);"></div>
</div>
% else: % else:
${a['rows'][0]['total_duration'] | hd} <div class="home-platforms-instance-poster">
<div class="poster-face" style="background-image: url(interfaces/default/images/poster.png);"></div>
</div>
% endif % endif
</div> </a>
</li> </li>
</div> </div>
% elif a['stat_id'] == 'popular_movies' and a['rows']: % elif a['stat_id'] == 'popular_movies' and a['rows']:
<div class="home-platforms-instance"> <div class="home-platforms-instance">
<li> <li>
<span> <div class="home-platforms-instance-info">
<a href="info?item_id=${a['rows'][0]['rating_key']}"> <div class="home-platforms-instance-name">
% if a['rows'][0]['thumb']: <h4>Most Popular Movie</h4>
<img class="home-platforms-instance-poster" <h5><a href="info?item_id=${a['rows'][0]['rating_key']}">
src="pms_image_proxy?img=${a['rows'][0]['thumb']}&width=162&height=240&fallback=poster"> ${a['rows'][0]['title']}
% else: </a></h5>
<img class="home-platforms-instance-poster" src="interfaces/default/images/poster.png"> </div>
% endif <div class="user-platforms-instance-playcount">
</a> <h3>${a['rows'][0]['users_watched']}</h3>
</span> <p> users</p>
<div class="home-platforms-instance-name"> </div>
<h4>Most Popular Movie</h4>
<h5><a href="info?item_id=${a['rows'][0]['rating_key']}">
${a['rows'][0]['title']}
</a></h5>
</div>
<div class="user-platforms-instance-playcount">
<h3>${a['rows'][0]['users_watched']}</h3>
<p> users</p>
</div> </div>
<a href="info?item_id=${a['rows'][0]['rating_key']}">
% if a['rows'][0]['thumb']:
<div class="home-platforms-instance-poster">
<div class="poster-face" style="background-image: url(pms_image_proxy?img=${a['rows'][0]['thumb']}&width=300&height=450&fallback=poster);"></div>
</div>
% else:
<div class="home-platforms-instance-poster">
<div class="poster-face" style="background-image: url(interfaces/default/images/poster.png);"></div>
</div>
% endif
</a>
</li> </li>
</div> </div>
% elif a['stat_id'] == 'top_users' and a['rows']: % elif a['stat_id'] == 'top_users' and a['rows']:
<div class="home-platforms-instance"> <div class="home-platforms-instance">
<li> <li>
<span> <div class="home-platforms-instance-info">
% if a['rows'][0]['user_id']: <div class="home-platforms-instance-name">
<a href="user?user_id=${a['rows'][0]['user_id']}"> <h4>Most Active User</h4>
% else: <h5>
<a href="user?user=${a['rows'][0]['user']}"> % if a['rows'][0]['user_id']:
% endif <a href="user?user_id=${a['rows'][0]['user_id']}">
% if a['rows'][0]['thumb'] != '':
<img class="home-platforms-instance-oval" src="${a['rows'][0]['thumb']}"
class="poster-face">
% else: % else:
<img class="home-platforms-instance-oval" <a href="user?user=${a['rows'][0]['user']}">
src="interfaces/default/images/gravatar-default.png">
% endif
</a>
</span>
<div class="home-platforms-instance-name">
<h4>Most Active User</h4>
<h5>
% if a['rows'][0]['user_id']:
<a href="user?user_id=${a['rows'][0]['user_id']}">
% else:
<a href="user?user=${a['rows'][0]['user']}">
% endif % endif
${a['rows'][0]['friendly_name']} ${a['rows'][0]['friendly_name']}
</a> </a>
</h5> </h5>
</div>
<div class="user-platforms-instance-playcount">
% if a['stat_type'] == 'total_plays':
<h3>${a['rows'][0]['total_plays']}</h3>
<p> plays</p>
% else:
${a['rows'][0]['total_duration'] | hd}
% endif
</div>
</div> </div>
<div class="user-platforms-instance-playcount"> % if a['rows'][0]['user_id']:
% if a['stat_type'] == 'total_plays': <a href="user?user_id=${a['rows'][0]['user_id']}">
<h3>${a['rows'][0]['total_plays']}</h3> % else:
<p> plays</p> <a href="user?user=${a['rows'][0]['user']}">
% endif
% if a['rows'][0]['thumb'] != '':
<div class="home-platforms-instance-poster">
<div class="home-platforms-instance-oval" style="background-image: url(${a['rows'][0]['thumb']});">
</div>
% else: % else:
${a['rows'][0]['total_duration'] | hd} <div class="home-platforms-instance-poster">
<div class="home-platforms-instance-oval" style="background-image: url(interfaces/default/images/gravatar-default.png);">
</div>
% endif % endif
</div> </a>
</li> </li>
</div> </div>
% elif a['stat_id'] == 'top_platforms' and a['rows']: % elif a['stat_id'] == 'top_platforms' and a['rows']:
<div class="home-platforms-instance"> <div class="home-platforms-instance">
<li> <li>
<div id="platform-stat"> <div class="home-platforms-instance-info">
<img class="home-platforms-instance-box" src="interfaces/default/images/platforms/default.png"> <div class="home-platforms-instance-name">
<h4>Most Active Platform</h4>
<h5>${a['rows'][0]['platform_type']}</h5>
</div>
<div class="user-platforms-instance-playcount">
% if a['stat_type'] == 'total_plays':
<h3>${a['rows'][0]['total_plays']}</h3>
<p> plays</p>
% else:
${a['rows'][0]['total_duration'] | hd}
% endif
</div>
</div> </div>
<div class="home-platforms-instance-name"> <div id="platform-stat" class="home-platforms-instance-poster">
<h4>Most Active Platform</h4> <div class="home-platforms-instance-box" style="background-image: url(interfaces/default/images/platforms/default.png);">
<h5>${a['rows'][0]['platform_type']}</h5>
</div>
<div class="user-platforms-instance-playcount">
% if a['stat_type'] == 'total_plays':
<h3>${a['rows'][0]['total_plays']}</h3>
<p> plays</p>
% else:
${a['rows'][0]['total_duration'] | hd}
% endif
</div> </div>
</li> </li>
</div> </div>
<script> <script>
$("#platform-stat").html("<img class='home-platforms-instance-box' src='" + getPlatformImagePath('${a['rows'][0]['platform_type']}') + "'>"); $("#platform-stat").html("<div class='home-platforms-instance-box' style='background-image: url(" + getPlatformImagePath('${a['rows'][0]['platform_type']}') + ");'>");
</script> </script>
% endif % endif
% endfor % endfor

View file

@ -21,7 +21,7 @@
<div class="padded-header"> <div class="padded-header">
<h3>Statistics <small>Last ${config['home_stats_length']} days</small></h3> <h3>Statistics <small>Last ${config['home_stats_length']} days</small></h3>
</div> </div>
<div id="home-stats" class="user-platforms"> <div id="home-stats" class="home-platforms">
<div class='text-muted'><i class="fa fa-refresh fa-spin"></i> Loading stats...</div> <div class='text-muted'><i class="fa fa-refresh fa-spin"></i> Loading stats...</div>
<br> <br>
</div> </div>

View file

@ -30,6 +30,7 @@ genres Returns an array of genres.
actors Returns an array of actors. actors Returns an array of actors.
directors Returns an array of directors. directors Returns an array of directors.
studio Returns the name of the studio. studio Returns the name of the studio.
originally_available_at Returns the air date of the item.
DOCUMENTATION :: END DOCUMENTATION :: END
</%doc> </%doc>
@ -53,46 +54,58 @@ DOCUMENTATION :: END
<div class="row"> <div class="row">
<div class="col-md-9"> <div class="col-md-9">
<div class="summary-content-poster hidden-xs hidden-sm"> <div class="summary-content-poster hidden-xs hidden-sm">
% if data['type'] == 'episode': % if data['type'] == 'episode' and data['parent_thumb']:
<img src="pms_image_proxy?img=${data['parent_thumb']}&width=300&height=450&fallback=poster"> <div class="poster-face" style="background-image: url(pms_image_proxy?img=${data['parent_thumb']}&width=300&height=450&fallback=poster);"></div>
% elif data['type'] == 'episode':
<div class="poster-face" style="background-image: url(pms_image_proxy?img=${data['grandparent_thumb']}&width=300&height=450&fallback=poster);"></div>
% else: % else:
<img src="pms_image_proxy?img=${data['thumb']}&width=300&height=450&fallback=poster"> <div class="poster-face" style="background-image: url(pms_image_proxy?img=${data['thumb']}&width=300&height=450&fallback=poster);"></div>
% endif % endif
</div> </div>
<div class="summary-content"> <div class="summary-content">
<div class="summary-content-title"> <div class="summary-content-title">
% if data['type'] == 'movie': % if data['type'] == 'movie':
<h1>${data['title']} (${data['year']})</h1> <h1>${data['title']}</h1>
% elif data['type'] == 'season': % elif data['type'] == 'season':
<h1>${data['parent_title']} (${data['title']})</h1> <h1>${data['parent_title']} (${data['title']})</h1>
% elif data['type'] == 'episode': % elif data['type'] == 'episode':
<h1>${data['grandparent_title']} (Season ${data['parent_index']}, Episode <h1>${data['grandparent_title']} - ${data['title']}
${data['index']}) "${data['title']}"</h1> (Season ${data['parent_index']}, Episode ${data['index']})</h1>
% else: % else:
<h1>${data['title']}</h1> <h1>${data['title']}</h1>
% endif % endif
</div> </div>
% if data['type'] == 'movie': % if (data['type'] == 'movie' or data['type'] == 'show' or data['type'] == 'episode') and data['rating']:
<div id="stars" class="rateit hidden-xs hidden-sm" data-rateit-value="" <div id="stars" class="rateit hidden-xs hidden-sm" data-rateit-value=""
data-rateit-ispreset="true" data-rateit-readonly="true"></div> data-rateit-ispreset="true" data-rateit-readonly="true"></div>
% endif % endif
<div class="summary-content-details-wrapper"> <div class="summary-content-details-wrapper">
<div class="summary-content-director"> <div class="summary-content-director">
% if data['type'] == 'episode' or data['type'] == 'movie': % if (data['type'] == 'episode' or data['type'] == 'movie') and data['directors']:
% if data['directors']:
Directed by <strong> ${data['directors'][0]}</strong> Directed by <strong> ${data['directors'][0]}</strong>
% else:
Directed by <strong> unknown</strong>
% endif % endif
% elif data['type'] == 'show' or data['type'] == 'season': </div>
<div class="summary-content-studio">
% if (data['type'] == 'show' or data['type'] == 'movie') and data['studio']:
Studio <strong> ${data['studio']}</strong> Studio <strong> ${data['studio']}</strong>
% endif % endif
</div> </div>
<div class="summary-content-airdate">
% if data['type'] == 'movie':
Year <strong> ${data['year']}</strong>
% elif data['type'] == 'show':
Aired <strong> ${data['year']}</strong>
% elif data['type'] == 'episode':
Aired <strong> <span id="airdate">${data['originally_available_at']}</span></strong>
% endif
</div>
<div class="summary-content-duration"> <div class="summary-content-duration">
Runtime <strong> <span id="runtime">${data['duration']}</span> mins</strong> Runtime <strong> <span id="runtime">${data['duration']}</span> mins</strong>
</div> </div>
<div class="summary-content-content-rating"> <div class="summary-content-content-rating">
% if (data['type'] == 'episode' or data['type'] == 'movie' or data['type'] == 'show') and data['content_rating']:
Rated <strong> ${data['content_rating']} </strong> Rated <strong> ${data['content_rating']} </strong>
% endif
</div> </div>
</div> </div>
<div class="summary-content-summary"> <div class="summary-content-summary">
@ -100,9 +113,23 @@ DOCUMENTATION :: END
</div> </div>
</div> </div>
</div> </div>
% if data['type'] == 'episode':
<div class="col-md-3"> <div class="col-md-3">
<div class="summary-content-people-wrapper hidden-xs hidden-sm"> <div class="summary-content-people-wrapper hidden-xs hidden-sm">
% if (data['type'] == 'movie' or data['type'] == 'show') and data['genres']:
<div class="summary-content-genres">
<strong>Genres</strong>
<ul>
% for genre in data['genres']:
% if loop.index < 5:
<li>
${genre}
</li>
% endif
% endfor
</ul>
</div>
% endif
% if (data['type'] == 'episode' or data['type'] == 'movie') and data['writers']:
<div class="summary-content-writers"> <div class="summary-content-writers">
<strong>Written by</strong> <strong>Written by</strong>
<ul> <ul>
@ -115,42 +142,23 @@ DOCUMENTATION :: END
% endfor % endfor
</ul> </ul>
</div> </div>
</div> % endif
</div> % if (data['type'] == 'movie' or data['type'] == 'show') and data['actors']:
% elif data['type'] == 'movie' or data['type'] == 'show':
<div class="col-md-3">
<div class="summary-content-people-wrapper hidden-xs hidden-sm">
<div class="summary-content-actors"> <div class="summary-content-actors">
<strong>Genres</strong> <strong>Starring</strong>
<ul> <ul>
% for genre in data['genres']: % for actor in data['actors']:
% if loop.index < 5: % if loop.index < 5:
<li> <li>
${genre} ${actor}
</li> </li>
% endif % endif
% endfor % endfor
</ul> </ul>
</div> </div>
<div class="summary-content-people-wrapper hidden-xs hidden-sm"> % endif
<div class="summary-content-actors">
<strong>Starring</strong>
<ul>
% for actor in data['actors']:
% if loop.index < 5:
<li>
${actor}
</li>
% endif
% endfor
</ul>
</div>
</div>
</div> </div>
</div> </div>
% elif data['type'] == 'season':
<div class="col-md-3"></div>
% endif
</div> </div>
</div> </div>
</div> </div>
@ -164,7 +172,7 @@ DOCUMENTATION :: END
<div class='col-md-12'> <div class='col-md-12'>
<div class='table-card-header'> <div class='table-card-header'>
<div class="header-bar"> <div class="header-bar">
<span>Watch history for <strong>${data['title']}</strong></span> <span>Watch History for <strong>${data['title']}</strong></span>
</div> </div>
<div class="colvis-button-bar hidden-xs"> <div class="colvis-button-bar hidden-xs">
</div> </div>
@ -203,7 +211,7 @@ DOCUMENTATION :: END
<div class='col-md-12'> <div class='col-md-12'>
<div class='table-card-header'> <div class='table-card-header'>
<div class="header-bar"> <div class="header-bar">
<span>Episode list for <strong>${data['title']}</strong></span> <span>Episode List for <strong>${data['title']}</strong></span>
</div> </div>
</div> </div>
<div class='table-card-back'> <div class='table-card-back'>
@ -228,13 +236,14 @@ DOCUMENTATION :: END
<%def name="javascriptIncludes()"> <%def name="javascriptIncludes()">
<script src="interfaces/default/js/jquery.rateit.min.js"></script> <script src="interfaces/default/js/jquery.rateit.min.js"></script>
<script src="interfaces/default/js/jquery.dataTables.min.js"></script> <script src="interfaces/default/js/jquery.dataTables.min.js"></script>
<script src="interfaces/default/js/jquery-ui.min.js"></script>
<script src="interfaces/default/js/dataTables.colVis.js"></script> <script src="interfaces/default/js/dataTables.colVis.js"></script>
<script src="interfaces/default/js/dataTables.bootstrap.min.js"></script> <script src="interfaces/default/js/dataTables.bootstrap.min.js"></script>
<script src="interfaces/default/js/dataTables.bootstrap.pagination.js"></script> <script src="interfaces/default/js/dataTables.bootstrap.pagination.js"></script>
<script src="interfaces/default/js/moment-with-locale.js"></script> <script src="interfaces/default/js/moment-with-locale.js"></script>
% if data: % if data:
% if data['type'] == 'movie': % if data['type'] == 'movie' or data['type'] == 'show' or data['type'] == 'episode':
<script> <script>
// Convert rating to 5 star rating type // Convert rating to 5 star rating type
var starRating = Math.round(${data['rating']} / 2) var starRating = Math.round(${data['rating']} / 2)
@ -258,6 +267,8 @@ DOCUMENTATION :: END
var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] }); var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] });
$(colvis.button()).appendTo('div.colvis-button-bar'); $(colvis.button()).appendTo('div.colvis-button-bar');
clearSearchButton('history_table', history_table);
}); });
</script> </script>
% elif data['type'] == 'show': % elif data['type'] == 'show':
@ -276,6 +287,8 @@ DOCUMENTATION :: END
history_table = $('#history_table').DataTable(history_table_options); history_table = $('#history_table').DataTable(history_table_options);
var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] }); var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] });
$(colvis.button()).appendTo('div.colvis-button-bar'); $(colvis.button()).appendTo('div.colvis-button-bar');
clearSearchButton('history_table', history_table);
}); });
</script> </script>
% endif % endif
@ -294,6 +307,7 @@ DOCUMENTATION :: END
</script> </script>
% endif % endif
<script> <script>
$("#airdate").html(moment($("#airdate")).format('MMM DD, YYYY'));
$("#runtime").html(millisecondsToMinutes($("#runtime").html(), true)); $("#runtime").html(millisecondsToMinutes($("#runtime").html(), true));
</script> </script>
% endif % endif

View file

@ -30,25 +30,20 @@ DOCUMENTATION :: END
<ul class="season-episodes-instance list-unstyled"> <ul class="season-episodes-instance list-unstyled">
% for a in data['episode_list']: % for a in data['episode_list']:
<li> <li>
<div class="season-episodes-poster"> <a href="info?item_id=${a['rating_key']}">
<div class="season-episodes-poster-face"> <div class="season-episodes-poster">
<a href="info?item_id=${a['rating_key']}"> <div class="season-episodes-poster-face" style="background-image: url(pms_image_proxy?img=${a['thumb']}&width=410&height=230);">
<img src="pms_image_proxy?img=${a['thumb']}&width=410&height=230" class="season-episodes-poster-face"> <div class="season-episodes-card-overlay">
</a> <div class="season-episodes-season">
</div> Episode ${a['index']}
<div class="season-episodes-card-overlay"> </div>
<div class="season-episodes-season"> </div>
Episode ${a['index']}
</div> </div>
</div> </div>
</div> <div class="season-episodes-instance-text-wrapper">
<div class="season-episodes-instance-text-wrapper"> <h3>${a['title']}</h3>
<div class="season-episodes-title">
<a href="info?item_id=${a['rating_key']}">
"${a['title']}"
</a>
</div> </div>
</div> </a>
</li> </li>
% endfor % endfor
</ul> </ul>

View file

@ -348,3 +348,12 @@ Accordion.prototype.dropdown = function(e) {
$el.find('.submenu').not($next).slideUp().parent().removeClass('open'); $el.find('.submenu').not($next).slideUp().parent().removeClass('open');
}; };
} }
function clearSearchButton(tableName, table) {
$('#' + tableName + '_filter').find('input[type=search]')
.wrap('<div class="input-group" role="group" aria-label="Search"></div>')
.after('<span class="input-group-btn"><button class="btn btn-form" data-toggle="button" aria-pressed="false" autocomplete="off" id="clear-search-' + tableName + '"><i class="fa fa-remove"></i></button></span>')
$('#clear-search-' + tableName).click(function() {
table.search('').draw();
});
}

View file

@ -86,8 +86,9 @@ from plexpy import helpers
$(document).ready(function() { $(document).ready(function() {
LoadPlexPyLogs(); LoadPlexPyLogs();
clearSearchButton('log_table', log_table);
}); });
function LoadPlexPyLogs() { function LoadPlexPyLogs() {
log_table_options.ajax = { log_table_options.ajax = {
"url": "getLog" "url": "getLog"
@ -105,11 +106,13 @@ from plexpy import helpers
$("#plexpy-logs-btn").click(function() { $("#plexpy-logs-btn").click(function() {
$("#clear-logs").show(); $("#clear-logs").show();
LoadPlexPyLogs(); LoadPlexPyLogs();
clearSearchButton('log_table', log_table);
}); });
$("#plex-logs-btn").click(function() { $("#plex-logs-btn").click(function() {
$("#clear-logs").hide(); $("#clear-logs").hide();
LoadPlexLogs(); LoadPlexLogs();
clearSearchButton('plex_log_table', plex_log_table);
}); });
$("#clear-logs").click(function() { $("#clear-logs").click(function() {

View file

@ -57,9 +57,10 @@
"url": "get_sync" "url": "get_sync"
} }
sync_table = $('#sync_table').DataTable(sync_table_options); sync_table = $('#sync_table').DataTable(sync_table_options);
var colvis = new $.fn.dataTable.ColVis( sync_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark' } ); var colvis = new $.fn.dataTable.ColVis( sync_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark' } );
$( colvis.button() ).appendTo('div.colvis-button-bar'); $( colvis.button() ).appendTo('div.colvis-button-bar');
clearSearchButton('sync_table', sync_table);
}); });
</script> </script>
</%def> </%def>

View file

@ -103,7 +103,7 @@ from plexpy import helpers
<div class="col-md-12"> <div class="col-md-12">
<div class="table-card-header"> <div class="table-card-header">
<div class="header-bar"> <div class="header-bar">
<span><i class="fa fa-history"></i> Recently watched</span> <span><i class="fa fa-history"></i> Recently Watched</span>
</div> </div>
</div> </div>
<div class="table-card-back"> <div class="table-card-back">
@ -240,6 +240,33 @@ from plexpy import helpers
<script src="interfaces/default/js/tables/user_ips.js"></script> <script src="interfaces/default/js/tables/user_ips.js"></script>
<script src="interfaces/default/js/tables/sync_table.js"></script> <script src="interfaces/default/js/tables/sync_table.js"></script>
<script> <script>
function recentlyWatched() {
var widthVal = $('body').find("#user-recently-watched").width();
var tmp = (widthVal-32) / 180;
if (tmp > 0) {
containerSize = parseInt(tmp);
} else {
containerSize = 1;
}
% if data['user_id']:
var user_id = ${data['user_id']};
% else:
var user_id = null;
% endif
// Populate recently watched
$.ajax({
url: 'get_user_recently_watched',
async: true,
data: { user_id: user_id, user: '${data['username']}', limit: containerSize },
complete: function(xhr, status) {
$("#user-recently-watched").html(xhr.responseText);
}
});
}
$(document).ready(function () { $(document).ready(function () {
% if data['user_id']: % if data['user_id']:
@ -270,16 +297,6 @@ from plexpy import helpers
} }
}); });
// Populate recently watched
$.ajax({
url: 'get_user_recently_watched',
async: true,
data: { user_id: user_id, user: '${data['username']}' },
complete: function(xhr, status) {
$("#user-recently-watched").html(xhr.responseText);
}
});
$( "#history-tab-btn" ).one( "click", function() { $( "#history-tab-btn" ).one( "click", function() {
// Build watch history table // Build watch history table
history_table_options.ajax = { history_table_options.ajax = {
@ -297,6 +314,8 @@ from plexpy import helpers
var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] }); var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] });
$(colvis.button()).appendTo('#button-bar-history'); $(colvis.button()).appendTo('#button-bar-history');
clearSearchButton('history_table', history_table);
}); });
$( "#ip-tab-btn" ).one( "click", function() { $( "#ip-tab-btn" ).one( "click", function() {
@ -312,6 +331,8 @@ from plexpy import helpers
} }
} }
user_ip_table = $('#user_ip_table').DataTable(user_ip_table_options); user_ip_table = $('#user_ip_table').DataTable(user_ip_table_options);
clearSearchButton('user_ip_table', user_ip_table);
}); });
$( "#sync-tab-btn" ).one( "click", function() { $( "#sync-tab-btn" ).one( "click", function() {
@ -324,10 +345,12 @@ from plexpy import helpers
} }
} }
sync_table = $('#sync_table').DataTable(sync_table_options); sync_table = $('#sync_table').DataTable(sync_table_options);
history_table.column(1).visible(false); sync_table.column(1).visible(false);
var colvis_sync = new $.fn.dataTable.ColVis( sync_table, { buttonText: '<i class="fa fa-columns"> Select columns</i>', buttonClass: 'btn btn-dark' } ); var colvis_sync = new $.fn.dataTable.ColVis( sync_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark' } );
$( colvis_sync.button() ).appendTo('#button-bar-sync'); $( colvis_sync.button() ).appendTo('#button-bar-sync');
clearSearchButton('sync_table', sync_table);
}); });
// Load edit user modal // Load edit user modal
@ -356,6 +379,11 @@ from plexpy import helpers
}); });
} }
}); });
recentlyWatched();
$(window).resize(function() {
recentlyWatched();
});
}); });
</script> </script>
</%def> </%def>

View file

@ -34,7 +34,7 @@ DOCUMENTATION :: END
</div> </div>
</ul> </ul>
<script> <script>
$("#user-platform-image-${a['result_id']}").html("<img class='user-platforms-instance-poster' src='" + getPlatformImagePath('${a['platform_type']}') + "'>"); $("#user-platform-image-${a['result_id']}").html("<div class='user-platforms-instance-poster' style='background-image: url(" + getPlatformImagePath('${a['platform_type']}') + ");'>");
</script> </script>
% endfor % endfor
% else: % else:

View file

@ -30,8 +30,8 @@ DOCUMENTATION :: END
<h4>Last ${a['query_days']} days</h4> <h4>Last ${a['query_days']} days</h4>
% endif % endif
<h3>${a['total_plays']}</h3> <h3>${a['total_plays']}</h3>
<p>plays</p> <p>plays</p>
<h3><strong>/</strong></h3>
<span id="total-time-${a['query_days']}"></span> <span id="total-time-${a['query_days']}"></span>
</div> </div>
</li> </li>

View file

@ -41,15 +41,20 @@
<script src="interfaces/default/js/moment-with-locale.js"></script> <script src="interfaces/default/js/moment-with-locale.js"></script>
<script src="interfaces/default/js/tables/users.js"></script> <script src="interfaces/default/js/tables/users.js"></script>
<script> <script>
users_list_table_options.ajax = { $(document).ready(function() {
"url": "get_user_list", users_list_table_options.ajax = {
type: "post", "url": "get_user_list",
data: function ( d ) { type: "post",
return { 'json_data': JSON.stringify( d ) }; data: function ( d ) {
return { 'json_data': JSON.stringify( d ) };
}
} }
}
var users_list_table = $('#users_list_table').DataTable(users_list_table_options); users_list_table = $('#users_list_table').DataTable(users_list_table_options);
clearSearchButton('users_list_table', users_list_table);
});
$("#refresh-users-list").click(function() { $("#refresh-users-list").click(function() {
$.ajax({ $.ajax({

View file

@ -449,21 +449,21 @@ class DataFactory(object):
try: try:
if user_id: if user_id:
query = 'SELECT session_history.id, session_history.media_type, session_history.rating_key, title, ' \ query = 'SELECT session_history.id, session_history.media_type, session_history.rating_key, title, ' \
'grandparent_title, thumb, parent_thumb, media_index, parent_media_index, year, started, user ' \ 'grandparent_title, thumb, parent_thumb, grandparent_thumb, media_index, parent_media_index, year, started, user ' \
'FROM session_history_metadata ' \ 'FROM session_history_metadata ' \
'JOIN session_history ON session_history_metadata.id = session_history.id ' \ 'JOIN session_history ON session_history_metadata.id = session_history.id ' \
'WHERE user_id = ? AND session_history.media_type != "track" ORDER BY started DESC LIMIT ?' 'WHERE user_id = ? AND session_history.media_type != "track" ORDER BY started DESC LIMIT ?'
result = monitor_db.select(query, args=[user_id, limit]) result = monitor_db.select(query, args=[user_id, limit])
elif user: elif user:
query = 'SELECT session_history.id, session_history.media_type, session_history.rating_key, title, ' \ query = 'SELECT session_history.id, session_history.media_type, session_history.rating_key, title, ' \
'grandparent_title, thumb, parent_thumb, media_index, parent_media_index, year, started, user ' \ 'grandparent_title, thumb, parent_thumb, grandparent_thumb, media_index, parent_media_index, year, started, user ' \
'FROM session_history_metadata ' \ 'FROM session_history_metadata ' \
'JOIN session_history ON session_history_metadata.id = session_history.id ' \ 'JOIN session_history ON session_history_metadata.id = session_history.id ' \
'WHERE user = ? AND session_history.media_type != "track" ORDER BY started DESC LIMIT ?' 'WHERE user = ? AND session_history.media_type != "track" ORDER BY started DESC LIMIT ?'
result = monitor_db.select(query, args=[user, limit]) result = monitor_db.select(query, args=[user, limit])
else: else:
query = 'SELECT session_history.id, session_history.media_type, session_history.rating_key, title, ' \ query = 'SELECT session_history.id, session_history.media_type, session_history.rating_key, title, ' \
'grandparent_title, thumb, parent_thumb, media_index, parent_media_index, year, started, user ' \ 'grandparent_title, thumb, parent_thumb, grandparent_thumb, media_index, parent_media_index, year, started, user ' \
'FROM session_history_metadata WHERE session_history.media_type != "track"' \ 'FROM session_history_metadata WHERE session_history.media_type != "track"' \
'JOIN session_history ON session_history_metadata.id = session_history.id ' \ 'JOIN session_history ON session_history_metadata.id = session_history.id ' \
'ORDER BY started DESC LIMIT ?' 'ORDER BY started DESC LIMIT ?'
@ -473,8 +473,10 @@ class DataFactory(object):
return None return None
for row in result: for row in result:
if row[1] == 'episode': if row[1] == 'episode' and row[6]:
thumb = row[6] thumb = row[6]
elif row[1] == 'episode':
thumb = row[7]
else: else:
thumb = row[5] thumb = row[5]
@ -484,11 +486,11 @@ class DataFactory(object):
'title': row[3], 'title': row[3],
'parent_title': row[4], 'parent_title': row[4],
'thumb': thumb, 'thumb': thumb,
'index': row[7], 'index': row[8],
'parent_index': row[8], 'parent_index': row[9],
'year': row[9], 'year': row[10],
'time': row[10], 'time': row[11],
'user': row[11] 'user': row[12]
} }
recently_watched.append(recent_output) recently_watched.append(recent_output)