Add recently added media type toggles to homepage

This commit is contained in:
JonnyWong16 2017-08-02 21:12:59 -07:00
parent 0c481fc005
commit e0b78adfee
6 changed files with 131 additions and 79 deletions

View file

@ -91,18 +91,21 @@
</li> </li>
</ul> </ul>
<div class="btn-group pull-left" data-toggle="buttons" id="recently-added-toggles" style="margin-right: 3px"> <div class="btn-group pull-left" data-toggle="buttons" id="recently-added-toggles" style="margin-right: 3px">
<label class="btn btn-dark disabled" id="recently-added-label-movies"> <label class="btn btn-dark active" id="recently-added-label-all">
<input type="checkbox" class="recently-added-toggle" name="recently-added-toggle-movies" id="recently-added-toggle-movies" value="movies" data-type="movie" autocomplete="off"> Movies <input type="radio" name="recently-added-toggle" id="recently-added-toggle-all" value="" autocomplete="off"> All
</label> </label>
<label class="btn btn-dark disabled" id="recently-added-label-tv"> <label class="btn btn-dark" id="recently-added-label-movies">
<input type="checkbox" class="recently-added-toggle" name="recently-added-toggle-tv" id="recently-added-toggle-tv" value="tv" data-type="season" autocomplete="off"> TV Shows <input type="radio" name="recently-added-toggle" id="recently-added-toggle-movie" value="movie" autocomplete="off"> Movies
</label> </label>
<label class="btn btn-dark disabled" id="recently-added-label-music"> <label class="btn btn-dark" id="recently-added-label-tv">
<input type="checkbox" class="recently-added-toggle" name="recently-added-toggle-music" id="recently-added-toggle-music" value="music" data-type="album" autocomplete="off"> Music <input type="radio" name="recently-added-toggle" id="recently-added-toggle-show" value="show" autocomplete="off"> TV Shows
</label>
<label class="btn btn-dark" id="recently-added-label-music">
<input type="radio" name="recently-added-toggle" id="recently-added-toggle-music" value="artist" autocomplete="off"> Music
</label> </label>
</div> </div>
<div class="input-group pull-left" style="width: 1px;" id="recently-added-count-selection"> <div class="input-group pull-left" style="width: 1px;" id="recently-added-count-selection">
<input type="number" class="form-control" name="recently-added-count" id="recently-added-count" value="${config['home_stats_recently_added_count']}" min="1" max="50" data-default="50" data-toggle="tooltip" title="Min: 1 item<br>Max: 50 items" /> <input type="number" class="form-control" name="recently-added-count" id="recently-added-count" value="${config['home_stats_recently_added_count']}" min="1" max="100" data-default="50" data-toggle="tooltip" title="Min: 1 item<br>Max: 100 items" />
<span class="input-group-addon btn-dark inactive">items</span> <span class="input-group-addon btn-dark inactive">items</span>
</div> </div>
</div> </div>
@ -542,75 +545,24 @@
% endif % endif
% if 'recently_added' in config['home_sections']: % if 'recently_added' in config['home_sections']:
<script> <script>
function recentlyAdded(recently_added_count) { function recentlyAdded(recently_added_count, recently_added_type) {
$.ajax({ $.ajax({
url: 'get_recently_added', url: 'get_recently_added',
type: "GET", type: 'GET',
async: true, async: true,
data: { count : recently_added_count }, data: {
count: recently_added_count,
type: recently_added_type
},
complete: function (xhr, status) { complete: function (xhr, status) {
$("#recentlyAdded").html(xhr.responseText); $("#recentlyAdded").html(xhr.responseText);
highlightAddedScrollerButton(); highlightAddedScrollerButton();
if ($('.dashboard-recent-media-instance li[data-type=movie]').length) {
$('#recently-added-label-movies').removeClass('disabled').addClass('active');
$('#recently-added-toggle-movies').prop('checked', true);
}
if ($('.dashboard-recent-media-instance li[data-type=season]').length) {
$('#recently-added-label-tv').removeClass('disabled').addClass('active');
$('#recently-added-toggle-tv').prop('checked', true);
}
if ($('.dashboard-recent-media-instance li[data-type=album]').length) {
$('#recently-added-label-music').removeClass('disabled').addClass('active');
$('#recently-added-toggle-music').prop('checked', true);
}
$('#recently-added-toggles').on('change', '.recently-added-toggle', function () {
var scroller = $("#recently-added-row-scroller");
var media_type = $(this).data('type');
var margin_right = $(this).prop('checked') ? '25px' : 0;
var toggle_items = $('.dashboard-recent-media-instance li[data-type=' + media_type + ']');
var containerWidth = $("body").find(".container-fluid").width();
console.log(margin_right)
if (margin_right == 0) {
toggle_items.stop().animate({ width: 'toggle', marginRight: margin_right }, 1000, function () {
toggle_items.hide();
var scroller_width = $('.dashboard-recent-media-instance li:visible').length * 175;
scroller.width(scroller_width);
if (scroller_width < containerWidth) {
$("#recently-added-page-right").addClass("disabled").blur();
} else {
$("#recently-added-page-right").removeClass("disabled");
}
})
} else {
scroller.width(50 * 175);
toggle_items.stop().animate({ width: 'toggle', marginRight: margin_right }, 1000, function () {
toggle_items.show();
var scroller_width = $('.dashboard-recent-media-instance li:visible').length * 175;
scroller.width(scroller_width);
if (scroller_width < containerWidth) {
$("#recently-added-page-right").addClass("disabled").blur();
} else {
$("#recently-added-page-right").removeClass("disabled");
}
})
}
leftTotal = 0;
scroller.animate({ left: leftTotal }, 1000);
$("#recently-added-page-left").addClass("disabled").blur();
$(this).toggleClass('text-muted').blur();
});
} }
}); });
} }
var recently_added_count = $('#recently-added-count').val(); var recently_added_count = $('#recently-added-count').val();
recentlyAdded(recently_added_count); var recently_added_type = '';
recentlyAdded(recently_added_count, recently_added_type);
function highlightAddedScrollerButton() { function highlightAddedScrollerButton() {
var scroller = $("#recently-added-row-scroller"); var scroller = $("#recently-added-row-scroller");
@ -651,10 +603,18 @@
} }
}); });
$('#recently-added-toggles').on('change', function () {
$('#recently-added-toggles > label').removeClass('active');
selected_filter = $('input[name=recently-added-toggle]:checked', '#recently-added-toggles');
$(selected_filter).closest('label').addClass('active');
recently_added_type = $(selected_filter).val();
recentlyAdded(recently_added_count, recently_added_type);
});
$('#recently-added-count').change(function () { $('#recently-added-count').change(function () {
forceMinMax($(this)); forceMinMax($(this));
recently_added_count = $(this).val(); recently_added_count = $(this).val();
recentlyAdded(recently_added_count); recentlyAdded(recently_added_count, recently_added_type);
$.post('set_home_stats_config', { recently_added_count: recently_added_count }); $.post('set_home_stats_config', { recently_added_count: recently_added_count });
}); });

View file

@ -70,7 +70,7 @@ DOCUMENTATION :: END
<h3> <h3>
<a href="info?rating_key=${item['grandparent_rating_key']}" title="${item['grandparent_title']}">${item['grandparent_title']}</a> <a href="info?rating_key=${item['grandparent_rating_key']}" title="${item['grandparent_title']}">${item['grandparent_title']}</a>
</h3> </h3>
<h3> <h3 class="text-muted">
<a href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a> <a href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3> </h3>
<h3 class="text-muted"> <h3 class="text-muted">
@ -82,6 +82,7 @@ DOCUMENTATION :: END
<a href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a> <a href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3> </h3>
<h3 class="text-muted">${item['year']}</h3> <h3 class="text-muted">${item['year']}</h3>
<h3 class="text-muted">&nbsp;</h3>
% endif % endif
</div> </div>
% elif item['media_type'] == 'album': % elif item['media_type'] == 'album':
@ -104,6 +105,7 @@ DOCUMENTATION :: END
<h3 class="text-muted"> <h3 class="text-muted">
<a class="text-muted" href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a> <a class="text-muted" href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3> </h3>
<h3 class="text-muted">&nbsp;</h3>
</div> </div>
</a> </a>
% endif % endif

View file

@ -59,11 +59,38 @@ DOCUMENTATION :: END
<a href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a> <a href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3> </h3>
<h3 class="text-muted">${item['year']}</h3> <h3 class="text-muted">${item['year']}</h3>
<h3 class="text-muted">&nbsp;</h3>
</div>
% elif item['media_type'] == 'show':
<a href="info?rating_key=${item['rating_key']}" title="${item['parent_title']}">
<div class="dashboard-recent-media-poster">
<div class="dashboard-recent-media-poster-face" style="background-image: url(pms_image_proxy?img=${item['thumb']}&width=300&height=450&fallback=poster);">
<div class="dashboard-recent-media-overlay">
<div class="dashboard-recent-media-overlay-text" id="added_at-${item['rating_key']}">
<script>
$('#added_at-${item['rating_key']}').text('Added ' + moment(${item['added_at']}, "X").fromNow())
</script>
</div>
</div>
</div>
% if _session['user_group'] == 'admin':
<span class="overlay-refresh-image" title="Refresh image"><i class="fa fa-refresh refresh_pms_image"></i></span>
% endif
</div>
</a>
<div class="dashboard-recent-media-metacontainer">
<h3>
<a href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3>
<h3 class="text-muted">
${item['child_count']} Seasons
</h3>
<h3 class="text-muted">&nbsp;</h3>
</div> </div>
% elif item['media_type'] == 'season': % elif item['media_type'] == 'season':
<a href="info?rating_key=${item['rating_key']}" title="${item['parent_title']}"> <a href="info?rating_key=${item['rating_key']}" title="${item['parent_title']}">
<div class="dashboard-recent-media-poster"> <div class="dashboard-recent-media-poster">
<div class="dashboard-recent-media-poster-face" style="background-image: url(pms_image_proxy?img=${item['parent_thumb']}&width=300&height=450&fallback=poster);"> <div class="dashboard-recent-media-poster-face" style="background-image: url(pms_image_proxy?img=${item['thumb'] or item['parent_thumb']}&width=300&height=450&fallback=poster);">
<div class="dashboard-recent-media-overlay"> <div class="dashboard-recent-media-overlay">
<div class="dashboard-recent-media-overlay-text" id="added_at-${item['rating_key']}"> <div class="dashboard-recent-media-overlay-text" id="added_at-${item['rating_key']}">
<script> <script>
@ -84,6 +111,37 @@ DOCUMENTATION :: END
<h3 class="text-muted"> <h3 class="text-muted">
<a class="text-muted" href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a> <a class="text-muted" href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3> </h3>
<h3 class="text-muted">&nbsp;</h3>
</div>
% elif item['media_type'] == 'episode':
<a href="info?rating_key=${item['rating_key']}" title="${item['title']}">
<div class="dashboard-recent-media-poster">
<div class="dashboard-recent-media-poster-face" style="background-image: url(pms_image_proxy?img=${item['grandparent_thumb']}&width=300&height=450&fallback=poster);">
<div class="dashboard-recent-media-overlay">
<div class="dashboard-recent-media-overlay-text" id="added_at-${item['rating_key']}">
<script>
$('#added_at-${item['rating_key']}').text('Added ' + moment(${item['added_at']}, "X").fromNow())
</script>
</div>
</div>
</div>
% if _session['user_group'] == 'admin':
<span class="overlay-refresh-image" title="Refresh image"><i class="fa fa-refresh refresh_pms_image"></i></span>
% endif
</div>
</a>
<div class="dashboard-recent-media-metacontainer">
<h3>
<a href="info?rating_key=${item['grandparent_rating_key']}" title="${item['grandparent_title']}">${item['grandparent_title']}</a>
</h3>
<h3 class="text-muted">
<a href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3>
<h3 class="text-muted">
<a href="info?rating_key=${item['parent_rating_key']}" title="Season ${item['parent_media_index']}">S${item['parent_media_index']}</a>
&middot;
<a href="info?rating_key=${item['rating_key']}" title="Episode ${item['media_index']}">E${item['media_index']}</a>
</h3>
</div> </div>
% elif item['media_type'] == 'album': % elif item['media_type'] == 'album':
<a href="info?rating_key=${item['rating_key']}" title="${item['parent_title']}"> <a href="info?rating_key=${item['rating_key']}" title="${item['parent_title']}">
@ -109,6 +167,7 @@ DOCUMENTATION :: END
<h3 class="text-muted"> <h3 class="text-muted">
<a class="text-muted" href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a> <a class="text-muted" href="info?rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3> </h3>
<h3 class="text-muted">&nbsp;</h3>
</div> </div>
% endif % endif
</li> </li>

View file

@ -59,7 +59,7 @@ DOCUMENTATION :: END
<h3> <h3>
<a href="info?rating_key=${item['grandparent_rating_key']}" title="${item['grandparent_title']}">${item['grandparent_title']}</a> <a href="info?rating_key=${item['grandparent_rating_key']}" title="${item['grandparent_title']}">${item['grandparent_title']}</a>
</h3> </h3>
<h3 title="${item['title']}"> <h3 class="text-muted" title="${item['title']}">
<a href="info?source=history&rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a> <a href="info?source=history&rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3> </h3>
<h3 class="text-muted"> <h3 class="text-muted">
@ -71,6 +71,7 @@ DOCUMENTATION :: END
<a href="info?source=history&rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a> <a href="info?source=history&rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3> </h3>
<h3 class="text-muted">${item['year']}</h3> <h3 class="text-muted">${item['year']}</h3>
<h3 class="text-muted">&nbsp;</h3>
% endif % endif
</div> </div>
% else: % else:
@ -110,7 +111,7 @@ DOCUMENTATION :: END
<h3 title="${item['grandparent_title']}"> <h3 title="${item['grandparent_title']}">
<a href="info?rating_key=${item['grandparent_rating_key']}" title="${item['grandparent_title']}">${item['grandparent_title']}</a> <a href="info?rating_key=${item['grandparent_rating_key']}" title="${item['grandparent_title']}">${item['grandparent_title']}</a>
</h3> </h3>
<h3 title="${item['title']}"> <h3 class="text-muted" title="${item['title']}">
<a href="info?source=history&rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a> <a href="info?source=history&rating_key=${item['rating_key']}" title="${item['title']}">${item['title']}</a>
</h3> </h3>
<h3 class="text-muted"> <h3 class="text-muted">

View file

@ -484,7 +484,26 @@ class PmsConnect(object):
return request return request
def get_recently_added_details(self, section_id='', start='0', count='0'): def get_hub_recently_added(self, start='0', count='0', type='', output_format=''):
"""
Return Plex hub recently added.
Parameters required: start { item number to start from }
count { number of results to return }
type { str }
Optional parameters: output_format { dict, json }
Output: array
"""
uri = '/hubs/home/recentlyAdded?X-Plex-Container-Start=%s&X-Plex-Container-Size=%s&type=%s' % (start, count, type)
request = self.request_handler.make_request(uri=uri,
proto=self.protocol,
request_type='GET',
output_format=output_format)
return request
def get_recently_added_details(self, start='0', count='0', type='', section_id=''):
""" """
Return processed and validated list of recently added items. Return processed and validated list of recently added items.
@ -492,7 +511,15 @@ class PmsConnect(object):
Output: array Output: array
""" """
if section_id: if type in ('movie', 'show', 'artist'):
if type == 'movie':
type = '1'
elif type == 'show':
type = '2'
elif type == 'artist':
type = '8'
recent = self.get_hub_recently_added(start, count, type, output_format='xml')
elif section_id:
recent = self.get_library_recently_added(section_id, start, count, output_format='xml') recent = self.get_library_recently_added(section_id, start, count, output_format='xml')
else: else:
recent = self.get_recently_added(start, count, output_format='xml') recent = self.get_recently_added(start, count, output_format='xml')
@ -529,7 +556,8 @@ class PmsConnect(object):
'thumb': helpers.get_xml_attr(item, 'thumb'), 'thumb': helpers.get_xml_attr(item, 'thumb'),
'parent_thumb': helpers.get_xml_attr(item, 'parentThumb'), 'parent_thumb': helpers.get_xml_attr(item, 'parentThumb'),
'grandparent_thumb': helpers.get_xml_attr(item, 'grandparentThumb'), 'grandparent_thumb': helpers.get_xml_attr(item, 'grandparentThumb'),
'added_at': helpers.get_xml_attr(item, 'addedAt') 'added_at': helpers.get_xml_attr(item, 'addedAt'),
'child_count': helpers.get_xml_attr(item, 'childCount')
} }
recents_list.append(recent_items) recents_list.append(recent_items)
@ -551,7 +579,8 @@ class PmsConnect(object):
'thumb': helpers.get_xml_attr(item, 'thumb'), 'thumb': helpers.get_xml_attr(item, 'thumb'),
'parent_thumb': helpers.get_xml_attr(item, 'parentThumb'), 'parent_thumb': helpers.get_xml_attr(item, 'parentThumb'),
'grandparent_thumb': helpers.get_xml_attr(item, 'grandparentThumb'), 'grandparent_thumb': helpers.get_xml_attr(item, 'grandparentThumb'),
'added_at': helpers.get_xml_attr(item, 'addedAt') 'added_at': helpers.get_xml_attr(item, 'addedAt'),
'child_count': helpers.get_xml_attr(item, 'childCount')
} }
recents_list.append(recent_items) recents_list.append(recent_items)

View file

@ -350,11 +350,11 @@ class WebInterface(object):
@cherrypy.expose @cherrypy.expose
@requireAuth() @requireAuth()
def get_recently_added(self, count='0', **kwargs): def get_recently_added(self, count='0', type='', **kwargs):
try: try:
pms_connect = pmsconnect.PmsConnect() pms_connect = pmsconnect.PmsConnect()
result = pms_connect.get_recently_added_details(count=count) result = pms_connect.get_recently_added_details(count=count, type=type)
except IOError as e: except IOError as e:
return serve_template(templatename="recently_added.html", data=None) return serve_template(templatename="recently_added.html", data=None)
@ -4072,7 +4072,7 @@ class WebInterface(object):
@cherrypy.tools.json_out() @cherrypy.tools.json_out()
@requireAuth(member_of("admin")) @requireAuth(member_of("admin"))
@addtoapi("get_recently_added") @addtoapi("get_recently_added")
def get_recently_added_details(self, start='0', count='0', section_id='', **kwargs): def get_recently_added_details(self, start='0', count='0', type='', section_id='', **kwargs):
""" Get all items that where recelty added to plex. """ Get all items that where recelty added to plex.
``` ```
@ -4081,6 +4081,7 @@ class WebInterface(object):
Optional parameters: Optional parameters:
start (str): The item number to start at start (str): The item number to start at
type (str): The media type: movie, show, artist
section_id (str): The id of the Plex library section section_id (str): The id of the Plex library section
Returns: Returns:
@ -4110,7 +4111,7 @@ class WebInterface(object):
``` ```
""" """
pms_connect = pmsconnect.PmsConnect() pms_connect = pmsconnect.PmsConnect()
result = pms_connect.get_recently_added_details(start=start, count=count, section_id=section_id) result = pms_connect.get_recently_added_details(start=start, count=count, type=type, section_id=section_id)
if result: if result:
return result return result