From 5e15884d8fe8c3a529d81a3d3524ac6c745e2e0b Mon Sep 17 00:00:00 2001 From: JonnyWong16 Date: Sat, 27 Feb 2016 01:00:12 -0800 Subject: [PATCH] Fix scrollers when items don't fill up the row --- data/interfaces/default/css/plexpy.css | 5 ++-- data/interfaces/default/index.html | 22 ++++++++++++-- data/interfaces/default/library.html | 41 +++++++++++++++++++++----- data/interfaces/default/user.html | 20 +++++++++++-- 4 files changed, 73 insertions(+), 15 deletions(-) diff --git a/data/interfaces/default/css/plexpy.css b/data/interfaces/default/css/plexpy.css index 8e43f251..9cb75630 100644 --- a/data/interfaces/default/css/plexpy.css +++ b/data/interfaces/default/css/plexpy.css @@ -2764,7 +2764,9 @@ a.no-highlight:hover { float: left; } .btn-gray.disabled, -.btn-gray.disabled:hover { +.btn-gray.disabled:focus, +.btn-gray.disabled:hover, +.btn-gray.disabled:active { color: #323232; cursor: default; } @@ -2774,6 +2776,5 @@ a.no-highlight:hover { } #recently-added-row-scroller, #recently-watched-row-scroller { - width: 8750px; position: relative; } \ No newline at end of file diff --git a/data/interfaces/default/index.html b/data/interfaces/default/index.html index 71958e47..a430bfcc 100644 --- a/data/interfaces/default/index.html +++ b/data/interfaces/default/index.html @@ -50,7 +50,7 @@
  • - +

    • Recently Added

    @@ -131,6 +131,7 @@ data: { count : 50 }, complete: function(xhr, status) { $("#recentlyAdded").html(xhr.responseText); + highlightAddedScrollerButton(); } }); } @@ -147,14 +148,29 @@ } }); + function highlightAddedScrollerButton() { + var scroller = $("#recently-added-row-scroller"); + var numElems = scroller.find("li").length; + scroller.width(numElems * 175); + if (scroller.width() > $("body").find(".container-fluid").width()) { + $("#recently-added-page-right").removeClass("disabled"); + } else { + $("#recently-added-page-right").addClass("disabled"); + } + } + + $(window).resize(function () { + highlightAddedScrollerButton(); + }); + var leftTotal = 0; $(".paginate").click(function (e) { e.preventDefault(); var scroller = $("#recently-added-row-scroller"); var containerWidth = $("body").find(".container-fluid").width(); var scrollAmount = $(this).data("id") * parseInt((containerWidth - 15) / 175) * 175; - var leftMax = -(parseInt(scroller.width()) + scrollAmount); - + var leftMax = Math.min(-parseInt(scroller.width()) + Math.abs(scrollAmount), 0); + leftTotal = Math.max(Math.min(leftTotal + scrollAmount, 0), leftMax); scroller.animate({ left: leftTotal }, 250); diff --git a/data/interfaces/default/library.html b/data/interfaces/default/library.html index 95026667..0293f96d 100644 --- a/data/interfaces/default/library.html +++ b/data/interfaces/default/library.html @@ -123,7 +123,7 @@ DOCUMENTATION :: END
  • - +
    • @@ -148,7 +148,7 @@ DOCUMENTATION :: END
  • - +
    • @@ -486,6 +486,7 @@ DOCUMENTATION :: END }, complete: function(xhr, status) { $("#library-recently-watched").html(xhr.responseText); + highlightWatchedScrollerButton(); } }); } @@ -501,15 +502,39 @@ DOCUMENTATION :: END }, complete: function(xhr, status) { $("#library-recently-added").html(xhr.responseText); + highlightAddedScrollerButton(); } }); } recentlyWatched(); recentlyAdded(); + + function highlightWatchedScrollerButton() { + var scroller = $("#recently-watched-row-scroller"); + var numElems = scroller.find("li").length; + scroller.width(numElems * 175); + if (scroller.width() > $("#library-recently-watched").width()) { + $("#recently-watched-page-right").removeClass("disabled"); + } else { + $("#recently-watched-page-right").addClass("disabled"); + } + } + + function highlightAddedScrollerButton() { + var scroller = $("#recently-added-row-scroller"); + var numElems = scroller.find("li").length; + scroller.width(numElems * 175); + if (scroller.width() > $("#library-recently-added").width()) { + $("#recently-added-page-right").removeClass("disabled"); + } else { + $("#recently-added-page-right").addClass("disabled"); + } + } + $(window).resize(function() { - recentlyWatched(); - recentlyAdded(); + highlightWatchedScrollerButton(); + highlightAddedScrollerButton(); }); $('div.art-face').animate({ opacity: 0.2 }, { duration: 1000 }); @@ -519,8 +544,8 @@ DOCUMENTATION :: END e.preventDefault(); var scroller = $("#recently-watched-row-scroller"); var containerWidth = $("#library-recently-watched").width(); - var scrollAmount = $(this).data("id") * parseInt((containerWidth - 15) / 175) * 175; - var leftMax = -(parseInt(scroller.width()) + scrollAmount); + var scrollAmount = $(this).data("id") * parseInt(containerWidth / 175) * 175; + var leftMax = Math.min(-parseInt(scroller.width()) + Math.abs(scrollAmount), 0); leftTotalWatched = Math.max(Math.min(leftTotalWatched + scrollAmount, 0), leftMax); scroller.animate({ left: leftTotalWatched }, 250); @@ -543,8 +568,8 @@ DOCUMENTATION :: END e.preventDefault(); var scroller = $("#recently-added-row-scroller"); var containerWidth = $("#library-recently-added").width(); - var scrollAmount = $(this).data("id") * parseInt((containerWidth - 15) / 175) * 175; - var leftMax = -(parseInt(scroller.width()) + scrollAmount); + var scrollAmount = $(this).data("id") * parseInt(containerWidth / 175) * 175; + var leftMax = Math.min(-parseInt(scroller.width()) + Math.abs(scrollAmount), 0); leftTotalAdded = Math.max(Math.min(leftTotalAdded + scrollAmount, 0), leftMax); scroller.animate({ left: leftTotalAdded }, 250); diff --git a/data/interfaces/default/user.html b/data/interfaces/default/user.html index 7f4b6ce7..49a878e6 100644 --- a/data/interfaces/default/user.html +++ b/data/interfaces/default/user.html @@ -489,19 +489,35 @@ from plexpy import helpers }, complete: function(xhr, status) { $("#user-recently-watched").html(xhr.responseText); + highlightWatchedScrollerButton(); } }); } recentlyWatched(); + function highlightWatchedScrollerButton() { + var scroller = $("#recently-watched-row-scroller"); + var numElems = scroller.find("li").length; + scroller.width(numElems * 175); + if (scroller.width() > $("#user-recently-watched").width()) { + $("#recently-watched-page-right").removeClass("disabled"); + } else { + $("#recently-watched-page-right").addClass("disabled"); + } + } + + $(window).resize(function() { + highlightWatchedScrollerButton(); + }); + var leftTotal = 0; $(".paginate").click(function (e) { e.preventDefault(); var scroller = $("#recently-watched-row-scroller"); var containerWidth = $("#user-recently-watched").width(); - var scrollAmount = $(this).data("id") * parseInt((containerWidth - 15) / 175) * 175; - var leftMax = -(parseInt(scroller.width()) + scrollAmount); + var scrollAmount = $(this).data("id") * parseInt(containerWidth / 175) * 175; + var leftMax = Math.min(-parseInt(scroller.width()) + Math.abs(scrollAmount), 0); leftTotal = Math.max(Math.min(leftTotal + scrollAmount, 0), leftMax); scroller.animate({ left: leftTotal }, 250);