1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

Lazy loading enabled

All pages with lots of images now have lazy loading enabled. The
"animation" was removed since it made for a bit of an odd experience one
the 2nd visit to a page. On pages with lots of images this has a nice
impact as it only loads the images that the user can see initially. As a
user scrolls it loads the next ones up. It saves a lot of extra requests
initially.
This commit is contained in:
Tim Hobbs 2014-04-09 20:47:57 -07:00
parent ab0941be90
commit f893f175cb
11 changed files with 41 additions and 31 deletions

View file

@ -1144,11 +1144,6 @@ a.itemTag:hover {
margin-left: .5em;
}
.lazy {
opacity: 0;
transition: opacity .3s ease-in;
}
@media all and (min-height: 500px) {
.alphabetPicker {

View file

@ -34,7 +34,8 @@
showTitle: true,
showParentTitle: true,
overlayText: true,
selectionPanel: true
selectionPanel: true,
lazy: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');

View file

@ -33,7 +33,8 @@
shape: "portrait",
context: 'movies',
showTitle: true,
centerText: true
centerText: true,
lazy: true
});
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount);

View file

@ -34,7 +34,8 @@
context: 'movies',
showTitle: true,
showItemCounts: true,
coverImage: true
coverImage: true,
lazy: true
});
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount, false, [], false);

View file

@ -35,7 +35,8 @@
shape: "backdrop",
preferThumb: true,
context: 'movies',
selectionPanel: true
selectionPanel: true,
lazy: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
@ -45,7 +46,8 @@
items: result.Items,
shape: "banner",
preferBanner: true,
context: 'movies'
context: 'movies',
lazy: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
@ -69,7 +71,8 @@
showTitle: true,
timeline: true,
centerText: true,
selectionPanel: true
selectionPanel: true,
lazy: true
});
$('.itemsContainer', page).addClass('timelineItemsContainer');
}
@ -384,12 +387,4 @@
updateFilterControls(this);
});
$(function () {
$("body").on("create", function () {
$(".lazy").unveil(200, function () {
this.style.opacity = 1;
});
});
});
})(jQuery, document);

View file

@ -32,7 +32,8 @@
context: 'music',
showTitle: true,
coverImage: true,
centerText: true
centerText: true,
lazy: true
});
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount);

View file

@ -31,7 +31,8 @@
context: 'music',
showTitle: true,
coverImage: true,
centerText: true
centerText: true,
lazy: true
});
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount);
@ -119,4 +120,10 @@
updateFilterControls(this);
});
$(function () {
$("body").on("create", function () {
$(".lazy").unveil(200);
});
});
})(jQuery, document);

View file

@ -32,7 +32,8 @@
preferThumb: true,
context: 'music',
showItemCounts: true,
centerText: true
centerText: true,
lazy: true
});
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount);

View file

@ -1386,6 +1386,10 @@ $(function () {
ApiClient.closeWebSocket();
}
});
$("body").on("create", function () {
$(".lazy").unveil(200);
});
});
Dashboard.jQueryMobileInit();
@ -1428,4 +1432,3 @@ $(document).on('pagebeforeshow', ".page", function () {
Dashboard.refreshSystemInfoFromServer();
}
});

View file

@ -34,7 +34,8 @@
context: 'tv',
showTitle: true,
showItemCounts: true,
coverImage: true
coverImage: true,
lazy: true
});
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount, false, [], false);

View file

@ -34,7 +34,8 @@
items: result.Items,
shape: "backdrop",
preferThumb: true,
context: 'tv'
context: 'tv',
lazy: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
@ -45,7 +46,8 @@
items: result.Items,
shape: "banner",
preferBanner: true,
context: 'tv'
context: 'tv',
lazy: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
@ -56,7 +58,8 @@
shape: "portrait",
context: 'tv',
showTitle: true,
centerText: true
centerText: true,
lazy: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
@ -67,7 +70,8 @@
shape: "portrait",
context: 'tv',
timeline: true,
showTitle: true
showTitle: true,
lazy: true
});
$('.itemsContainer', page).addClass('timelineItemsContainer');