diff --git a/api.php b/api.php index 453377a5834f5725165902ef1e5f7efc739257c6..b07ed49a2267eeb83ab0895864f7437ad80d0218 100644 --- a/api.php +++ b/api.php @@ -5,7 +5,7 @@ if ($_GET['get'] == 'shows') { $sbdb = new SQLite3($sbPath.'/sickbeard.db'); - $shows = $sbdb->query("SELECT tvdb_id AS id, show_name AS name, location FROM tv_shows ORDER BY show_name ASC;"); + $shows = $sbdb->query("SELECT tvdb_id AS id, show_name AS name, location FROM tv_shows ORDER BY show_name ASC LIMIT ".$_GET['limit']." OFFSET ".$_GET['offset'].";"); $output = array(); while ($show = $shows->fetchArray()) { $rows = $sbdb->query("SELECT season, COUNT(episode_id) AS count FROM tv_episodes WHERE showid = '".$show['id']."' GROUP BY season ORDER BY season ASC"); diff --git a/css/mediarack.css b/css/mediarack.css index 90aeb7c9b94c23aabe87e4b629ad1837116bc437..26e5da86c89afc241294a9d497c3f6c63e8c9b08 100644 --- a/css/mediarack.css +++ b/css/mediarack.css @@ -10,6 +10,7 @@ body { .show { margin-bottom: 50px; + min-height: 200px; } .showName.panel-heading { @@ -49,7 +50,7 @@ table.episodes tr td{ } div.panel-body.lazy { - background: url('../img/no_fanart.jpg') repeat-y top center; + /* background: url('../img/no_fanart.jpg') repeat-y top center; */ background-size: 100% auto; } diff --git a/js/mediarack.js b/js/mediarack.js index bd7f9b412214a5b7b9cc9f87f0e4e601d5229cc0..6324d334762c82022266326cc9e99b30437b70ba 100644 --- a/js/mediarack.js +++ b/js/mediarack.js @@ -1,3 +1,7 @@ +var showLimit = 5; +var showOffset = 0; +var killScroll = false; + $(document).ready(function() { getShows(); @@ -10,14 +14,24 @@ $(document).ready(function() { $($(this).attr('href')).show(); }); + $(window).scroll(function(){ + if ($(window).scrollTop()+1000 >= ($(document).height() - ($(window).height()))){ + if (killScroll == false) { + killScroll = true; + getShows(); + } + } + }); + }); function getShows() { $.getJSON('api.php', { - 'get': 'shows' + 'get': 'shows', + 'limit': showLimit.toString(), + 'offset': showOffset.toString() }, function(data) { var divShows = $("#shows"); - divShows.empty(); var i = 0; $.each(data, function (key, show) { var divShowContainer = $('<div class="show panel panel-default" data-showid="'+show.id+'" id="show_'+show.id+'"></div>'); @@ -39,34 +53,37 @@ function getShows() { }); ulSeasons.append(liSeason); }); - divShowContainer.append(divShowHeader); - divShowBody.append(divShowPoster); - divShowBody.append(ulSeasons); - $("img.showLogo.lazy").lazyload({ - event: "scrollstop", + $("div.panel-body.lazy").lazyload({ + //event: "scrollstop", effect: "fadeIn", - threshold: 1500 - }); - divShowBody.lazyload({ - event: "scrollstop", + threshold: 900 + }); + $("img.showPoster.lazy").lazyload({ + //event: "scrollstop", effect: "fadeIn", - threshold: 1800 + threshold: 850 }); - $("img.showPoster.lazy").lazyload({ - event: "scrollstop", + $("img.showLogo.lazy").lazyload({ + //event: "scrollstop", effect: "fadeIn", - threshold: 1600 + threshold: 700 }); + divShowContainer.append(divShowHeader); divShowContainer.append(divShowBody); + divShowBody.append(divShowPoster); + divShowBody.append(ulSeasons); divShowContainer.append(divShowFooter); divShows.append(divShowContainer); if(i < 5) { - divShowHeader.find("img.showLogo").attr('src', 'api.php?get=logo&show='+escape(show.folder)); - divShowBody.css('background-image', 'url(api.php?get=fanart&show='+escape(show.folder)+')'); - divShowPoster.find("img.showPoster").attr('src', 'api.php?get=poster&show='+escape(show.folder)); + divShowHeader.find("img.showLogo").attr('src', 'api.php?get=logo&show='+escape(show.folder)).removeClass('lazy'); + divShowBody.css('background-image', 'url(api.php?get=fanart&show='+escape(show.folder)+')').removeClass('lazy'); + divShowPoster.find("img.showPoster").attr('src', 'api.php?get=poster&show='+escape(show.folder)).removeClass('lazy'); } i++; }); + showOffset = showOffset+showLimit; + killScroll = false; + console.log(showOffset); } ); }