From c582fd4d82bfd3f281e1aa3e0ddfa19c5b6e6bfb Mon Sep 17 00:00:00 2001
From: Jan Grewe <jan@faked.org>
Date: Sat, 18 Jan 2014 20:23:29 +0100
Subject: [PATCH] load shows in increments (infinite scroll) don't lazyload
preloaded artwork (first 5 shows)
---
api.php | 2 +-
css/mediarack.css | 3 ++-
js/mediarack.js | 53 +++++++++++++++++++++++++++++++----------------
3 files changed, 38 insertions(+), 20 deletions(-)
diff --git a/api.php b/api.php
index 453377a..b07ed49 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 90aeb7c..26e5da8 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 bd7f9b4..6324d33 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);
}
);
}
--
GitLab