mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update naming project
This commit is contained in:
Luke Pulverenti
parent
4e71751d0f
commit
5623b7c147
14 changed files with 520 additions and 179 deletions
|
|
@ -48,7 +48,7 @@
|
|||
}
|
||||
|
||||
.largeCardMargin .cardBox {
|
||||
margin: 8px;
|
||||
margin: 7px;
|
||||
}
|
||||
|
||||
/*@media all and (max-width: 600px) {
|
||||
|
|
|
|||
|
|
@ -1055,6 +1055,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
|||
|
||||
.timelineHeader {
|
||||
margin-bottom: .25em;
|
||||
line-height: 1.25em;
|
||||
line-height: initial;
|
||||
}
|
||||
|
||||
|
|
@ -1505,6 +1506,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
|||
.homeLatestTabDisabled .homeLatestTab {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.movieTrailersTabDisabled .movieTrailersTab {
|
||||
display: none !important;
|
||||
}
|
||||
|
|
@ -59,6 +59,11 @@
|
|||
return deferred.promise();
|
||||
}
|
||||
|
||||
function setBackdropImage(elem, url) {
|
||||
|
||||
elem.lazyImage(url);
|
||||
}
|
||||
|
||||
function showBackdrop(type, parentId) {
|
||||
|
||||
var apiClient = ConnectionManager.currentApiClient();
|
||||
|
|
@ -83,7 +88,7 @@
|
|||
quality: 80
|
||||
});
|
||||
|
||||
getElement().css('backgroundImage', 'url(\'' + imgUrl + '\')');
|
||||
setBackdropImage(getElement(), imgUrl);
|
||||
|
||||
} else {
|
||||
|
||||
|
|
@ -97,6 +102,22 @@
|
|||
$('.backdropContainer').css('backgroundImage', '');
|
||||
}
|
||||
|
||||
function isEnabledByDefault() {
|
||||
|
||||
if (AppInfo.hasLowImageBandwidth) {
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!$.browser.mobile) {
|
||||
return true;
|
||||
}
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
return screenWidth >= 600;
|
||||
}
|
||||
|
||||
function enabled() {
|
||||
|
||||
var userId = Dashboard.getCurrentUserId();
|
||||
|
|
@ -104,7 +125,7 @@
|
|||
var val = store.getItem('enableBackdrops-' + userId);
|
||||
|
||||
// For bandwidth
|
||||
return val == '1' || (val != '0' && !$.browser.mobile);
|
||||
return val == '1' || (val != '0' && isEnabledByDefault());
|
||||
}
|
||||
|
||||
function setBackdrops(page, items) {
|
||||
|
|
@ -135,13 +156,26 @@
|
|||
quality: 80
|
||||
});
|
||||
|
||||
getElement().css('backgroundImage', 'url(\'' + imgUrl + '\')');
|
||||
setBackdropImage(getElement(), imgUrl);
|
||||
|
||||
} else {
|
||||
$(page).removeClass('backdropPage');
|
||||
}
|
||||
}
|
||||
|
||||
function setBackdropUrl(page, url) {
|
||||
|
||||
if (url) {
|
||||
$(page).addClass('backdropPage');
|
||||
|
||||
setBackdropImage(getElement(), url);
|
||||
|
||||
} else {
|
||||
$(page).removeClass('backdropPage');
|
||||
clearBackdrop();
|
||||
}
|
||||
}
|
||||
|
||||
$(document).on('pagebeforeshow', ".page", function () {
|
||||
|
||||
var page = this;
|
||||
|
|
@ -172,7 +206,8 @@
|
|||
|
||||
window.Backdrops = {
|
||||
|
||||
setBackdrops: setBackdrops
|
||||
setBackdrops: setBackdrops,
|
||||
setBackdropUrl: setBackdropUrl
|
||||
};
|
||||
|
||||
})(jQuery, document);
|
||||
|
|
@ -663,7 +663,8 @@
|
|||
showTitle: item.Type == "MusicAlbum" || item.Type == "Game",
|
||||
borderless: item.Type == "Game",
|
||||
context: context,
|
||||
overlayText: item.Type != "MusicAlbum"
|
||||
overlayText: item.Type != "MusicAlbum",
|
||||
lazy: true
|
||||
});
|
||||
|
||||
$('#similarContent', page).html(html).lazyChildren();
|
||||
|
|
@ -837,7 +838,8 @@
|
|||
index: 'disc',
|
||||
showIndexNumber: true,
|
||||
playFromHere: true,
|
||||
defaultAction: 'playallfromhere'
|
||||
defaultAction: 'playallfromhere',
|
||||
lazy: true
|
||||
});
|
||||
trigger = true;
|
||||
|
||||
|
|
@ -849,7 +851,8 @@
|
|||
showTitle: false,
|
||||
centerText: true,
|
||||
context: context,
|
||||
overlayText: true
|
||||
overlayText: true,
|
||||
lazy: true
|
||||
});
|
||||
}
|
||||
else if (item.Type == "Season") {
|
||||
|
|
@ -860,7 +863,8 @@
|
|||
displayAsSpecial: item.Type == "Season" && item.IndexNumber,
|
||||
context: context,
|
||||
playFromHere: true,
|
||||
overlayText: true
|
||||
overlayText: true,
|
||||
lazy: true
|
||||
});
|
||||
}
|
||||
else if (item.Type == "GameSystem") {
|
||||
|
|
@ -869,7 +873,8 @@
|
|||
shape: "auto",
|
||||
showTitle: true,
|
||||
centerText: true,
|
||||
context: context
|
||||
context: context,
|
||||
lazy: true
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -974,7 +979,8 @@
|
|||
shape: shape,
|
||||
showTitle: true,
|
||||
centerText: true,
|
||||
context: context
|
||||
context: context,
|
||||
lazy: true
|
||||
});
|
||||
html += '</div>';
|
||||
|
||||
|
|
@ -1127,7 +1133,7 @@
|
|||
|
||||
$('#themeVideosCollapsible', page).show();
|
||||
|
||||
$('#themeVideosContent', page).html(getVideosHtml(items, user)).trigger('create');
|
||||
$('#themeVideosContent', page).html(getVideosHtml(items, user)).lazyChildren().trigger('create');
|
||||
} else {
|
||||
$('#themeVideosCollapsible', page).hide();
|
||||
}
|
||||
|
|
@ -1149,7 +1155,7 @@
|
|||
|
||||
$('#musicVideosCollapsible', page).show();
|
||||
|
||||
$('#musicVideosContent', page).html(getVideosHtml(result.Items, user)).trigger('create');
|
||||
$('#musicVideosContent', page).html(getVideosHtml(result.Items, user)).lazyChildren().trigger('create');
|
||||
} else {
|
||||
$('#musicVideosCollapsible', page).hide();
|
||||
}
|
||||
|
|
@ -1165,7 +1171,7 @@
|
|||
|
||||
$('#additionalPartsCollapsible', page).show();
|
||||
|
||||
$('#additionalPartsContent', page).html(getVideosHtml(result.Items, user)).trigger('create');
|
||||
$('#additionalPartsContent', page).html(getVideosHtml(result.Items, user)).lazyChildren().trigger('create');
|
||||
} else {
|
||||
$('#additionalPartsCollapsible', page).hide();
|
||||
}
|
||||
|
|
@ -1212,7 +1218,7 @@
|
|||
html += '<div class="cardPadder"></div>';
|
||||
|
||||
html += '<div class="cardContent">';
|
||||
html += '<div class="cardImage" style="background-image:url(\'' + imgUrl + '\');"></div>';
|
||||
html += '<div class="cardImage lazy" data-src="' + imgUrl + '"></div>';
|
||||
|
||||
html += '<div class="cardFooter">';
|
||||
html += '<div class="cardText">' + chapterName + '</div>';
|
||||
|
|
@ -1239,7 +1245,7 @@
|
|||
html += '<p style="margin: 0;padding-left: .5em;"><button class="moreScenes" data-inline="true" data-mini="true">' + Globalize.translate('ButtonMoreItems') + '</button></p>';
|
||||
}
|
||||
|
||||
$('#scenesContent', page).html(html).trigger('create');
|
||||
$('#scenesContent', page).html(html).trigger('create').lazyChildren();
|
||||
}
|
||||
|
||||
function renderMediaSources(page, item) {
|
||||
|
|
@ -1439,7 +1445,7 @@
|
|||
html += '<div class="cardPadder"></div>';
|
||||
|
||||
html += '<div class="cardContent">';
|
||||
html += '<div class="cardImage" style="background-image:url(\'' + imgUrl + '\');"></div>';
|
||||
html += '<div class="cardImage lazy" data-src="' + imgUrl + '"></div>';
|
||||
|
||||
html += '<div class="cardFooter">';
|
||||
html += '<div class="cardText">' + item.Name + '</div>';
|
||||
|
|
@ -1478,7 +1484,7 @@
|
|||
|
||||
ApiClient.getSpecialFeatures(user.Id, item.Id).done(function (specials) {
|
||||
|
||||
$('#specialsContent', page).html(getVideosHtml(specials, user, limit, "moreSpecials")).trigger('create');
|
||||
$('#specialsContent', page).html(getVideosHtml(specials, user, limit, "moreSpecials")).lazyChildren().trigger('create');
|
||||
|
||||
});
|
||||
}
|
||||
|
|
@ -1514,7 +1520,7 @@
|
|||
imgUrl = "css/images/items/list/person.png";
|
||||
}
|
||||
|
||||
html += '<div class="tileImage" style="background-image:url(\'' + imgUrl + '\');"></div>';
|
||||
html += '<div class="tileImage lazy" data-src="' + imgUrl + '"></div>';
|
||||
|
||||
|
||||
|
||||
|
|
@ -1547,7 +1553,7 @@
|
|||
html += '<p style="margin: 0;padding-left: .5em;"><button class="morePeople" data-inline="true" data-mini="true">' + Globalize.translate('ButtonMoreItems') + '</button></p>';
|
||||
}
|
||||
|
||||
$('#castContent', page).html(html).trigger('create');
|
||||
$('#castContent', page).html(html).lazyChildren().trigger('create');
|
||||
}
|
||||
|
||||
function play(startPosition) {
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@
|
|||
|
||||
var itemsPromise = ApiClient.getItems(userId, query);
|
||||
|
||||
$.when(parentItemPromise, itemsPromise).done(function(r1, r2) {
|
||||
$.when(parentItemPromise, itemsPromise).done(function (r1, r2) {
|
||||
|
||||
var item = r1[0];
|
||||
currentItem = item;
|
||||
|
|
@ -55,8 +55,6 @@
|
|||
context = 'folders';
|
||||
}
|
||||
|
||||
var defaultAction = currentItem.Type == 'PhotoAlbum' ? 'photoslideshow' : null;
|
||||
|
||||
if (view == "Backdrop") {
|
||||
|
||||
html = LibraryBrowser.getPosterViewHtml({
|
||||
|
|
@ -65,8 +63,7 @@
|
|||
showTitle: true,
|
||||
centerText: true,
|
||||
preferBackdrop: true,
|
||||
context: context,
|
||||
defaultAction: defaultAction
|
||||
context: context
|
||||
});
|
||||
}
|
||||
else if (view == "Poster") {
|
||||
|
|
@ -75,8 +72,7 @@
|
|||
shape: "auto",
|
||||
showTitle: true,
|
||||
centerText: true,
|
||||
context: context,
|
||||
defaultAction: defaultAction
|
||||
context: context
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -158,51 +154,15 @@
|
|||
$('#selectPageSize', page).val(query.Limit).selectmenu('refresh');
|
||||
}
|
||||
|
||||
function startSlideshow(page, index) {
|
||||
function onListItemClick(e) {
|
||||
|
||||
index += (query.StartIndex || 0);
|
||||
var page = $(this).parents('.page');
|
||||
var info = LibraryBrowser.getListItemInfo(this);
|
||||
|
||||
var userId = Dashboard.getCurrentUserId();
|
||||
|
||||
var localQuery = $.extend({}, query);
|
||||
localQuery.StartIndex = 0;
|
||||
localQuery.Limit = null;
|
||||
localQuery.MediaTypes = "Photo";
|
||||
localQuery.Recursive = true;
|
||||
localQuery.Filters = "IsNotFolder";
|
||||
|
||||
ApiClient.getItems(userId, localQuery).done(function(result) {
|
||||
|
||||
showSlideshow(page, result.Items, index);
|
||||
});
|
||||
if (info.mediaType == 'Photo') {
|
||||
Photos.startSlideshow(page, query, info.id);
|
||||
return false;
|
||||
}
|
||||
|
||||
function showSlideshow(page, items, index) {
|
||||
|
||||
var slideshowItems = items.map(function (item) {
|
||||
|
||||
var imgUrl = ApiClient.getScaledImageUrl(item.Id, {
|
||||
|
||||
tag: item.ImageTags.Primary,
|
||||
type: 'Primary'
|
||||
|
||||
});
|
||||
|
||||
return {
|
||||
title: item.Name,
|
||||
href: imgUrl
|
||||
};
|
||||
});
|
||||
|
||||
index = Math.max(index || 0, 0);
|
||||
|
||||
Dashboard.loadSwipebox().done(function () {
|
||||
|
||||
$.swipebox(slideshowItems, {
|
||||
initialIndexOnArray: index,
|
||||
hideBarsDelay: 30000
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on('pageinit', "#itemListPage", function () {
|
||||
|
|
@ -272,9 +232,7 @@
|
|||
reloadItems(page);
|
||||
});
|
||||
|
||||
$('.itemsContainer', page).on('photoslideshow', function (e, index) {
|
||||
startSlideshow(page, index);
|
||||
});
|
||||
$(page).on('click', '.mediaItem', onListItemClick);
|
||||
|
||||
}).on('pageshow', "#itemListPage", function () {
|
||||
|
||||
|
|
|
|||
|
|
@ -722,7 +722,7 @@
|
|||
defaultAction = null;
|
||||
}
|
||||
}
|
||||
var defaultActionAttribute = defaultAction ? (' data-action="' + defaultAction + '" class="itemWithAction"') : '';
|
||||
var defaultActionAttribute = defaultAction ? (' data-action="' + defaultAction + '" class="itemWithAction mediaItem"') : ' class="mediaItem"';
|
||||
html += '<a' + defaultActionAttribute + ' href="' + href + '">';
|
||||
|
||||
var imgUrl;
|
||||
|
|
@ -1462,6 +1462,8 @@
|
|||
|
||||
var anchorCssClass = "cardContent";
|
||||
|
||||
anchorCssClass += ' mediaItem';
|
||||
|
||||
if (options.defaultAction) {
|
||||
anchorCssClass += ' itemWithAction';
|
||||
}
|
||||
|
|
@ -1651,6 +1653,25 @@
|
|||
return html;
|
||||
},
|
||||
|
||||
getListItemInfo: function (elem) {
|
||||
|
||||
var elemWithAttributes = elem;
|
||||
|
||||
while (!elemWithAttributes.getAttribute('data-itemid')) {
|
||||
elemWithAttributes = elemWithAttributes.parentNode;
|
||||
}
|
||||
|
||||
var itemId = elemWithAttributes.getAttribute('data-itemid');
|
||||
var index = elemWithAttributes.getAttribute('data-index');
|
||||
var mediaType = elemWithAttributes.getAttribute('data-mediatype');
|
||||
|
||||
return {
|
||||
id: itemId,
|
||||
index: index,
|
||||
mediaType: mediaType
|
||||
};
|
||||
},
|
||||
|
||||
getCardTextLines: function (lines, cssClass, forceLines) {
|
||||
|
||||
var html = '';
|
||||
|
|
@ -2546,7 +2567,14 @@
|
|||
}
|
||||
}
|
||||
|
||||
var screenWidth = $(window).width();
|
||||
|
||||
// Take a guess about whether we should lazy load or not
|
||||
if (screenWidth > 600) {
|
||||
html += "<img class='itemDetailImage' src='" + url + "' />";
|
||||
} else {
|
||||
html += "<img class='itemDetailImage lazy' data-src='" + url + "' src='css/images/empty.png' />";
|
||||
}
|
||||
|
||||
if (href) {
|
||||
html += "</a>";
|
||||
|
|
@ -2594,6 +2622,8 @@
|
|||
elem.addClass('portraitDetailImageContainer');
|
||||
elem.removeClass('squareDetailImageContainer');
|
||||
}
|
||||
|
||||
elem.lazyChildren();
|
||||
},
|
||||
|
||||
getMiscInfoHtml: function (item) {
|
||||
|
|
@ -2849,8 +2879,7 @@
|
|||
tag: item.BackdropImageTags[0]
|
||||
});
|
||||
|
||||
$('#itemBackdrop', page).removeClass('noBackdrop').css('background-image', 'url("' + imgUrl + '")');
|
||||
|
||||
$('#itemBackdrop', page).removeClass('noBackdrop').lazyImage(imgUrl);
|
||||
}
|
||||
else if (item.ParentBackdropItemId && item.ParentBackdropImageTags && item.ParentBackdropImageTags.length) {
|
||||
|
||||
|
|
@ -2861,7 +2890,7 @@
|
|||
maxWidth: screenWidth
|
||||
});
|
||||
|
||||
$('#itemBackdrop', page).removeClass('noBackdrop').css('background-image', 'url("' + imgUrl + '")');
|
||||
$('#itemBackdrop', page).removeClass('noBackdrop').lazyImage(imgUrl);
|
||||
|
||||
}
|
||||
else {
|
||||
|
|
|
|||
|
|
@ -887,40 +887,13 @@
|
|||
|
||||
itemsContainer.trigger('playallfromhere', [index]);
|
||||
}
|
||||
else if (action == 'setplaylistindex') {
|
||||
|
||||
index = elemWithAttributes.getAttribute('data-index');
|
||||
|
||||
closeContextMenu();
|
||||
|
||||
MediaController.currentPlaylistIndex(index);
|
||||
}
|
||||
else if (action == 'photoslideshow') {
|
||||
|
||||
if (!$(elem).hasClass('card')) {
|
||||
elem = $(elem).parents('.card')[0];
|
||||
}
|
||||
|
||||
itemsContainer = $(elem).parents('.itemsContainer');
|
||||
index = $('.card', itemsContainer).get().indexOf(elem);
|
||||
|
||||
closeContextMenu();
|
||||
|
||||
itemsContainer.trigger('photoslideshow', [index]);
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function resetCardImage() {
|
||||
|
||||
this.style.backgroundImage = "url('css/images/empty.png')";
|
||||
}
|
||||
|
||||
function resetImages(page) {
|
||||
|
||||
$('cardImage', page).remove();
|
||||
//$('.cardImage', page).each(resetCardImage);
|
||||
}
|
||||
|
||||
$(document).on('pageinit', ".libraryPage", function () {
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@
|
|||
url += "&height=" + (userButtonHeight * Math.max(devicePixelRatio || 1, 2));
|
||||
}
|
||||
|
||||
html += '<img src="' + url + '" style="border-radius: 1000px; height:' + userButtonHeight + 'px;" />';
|
||||
html += '<div class="lazy" data-src="' + url + '" style="width:' + userButtonHeight + 'px;height:' + userButtonHeight + 'px;background-size:contain;background-repeat:no-repeat;background-position:center center;border-radius:1000px;"></div>';
|
||||
} else {
|
||||
html += '<div class="fa fa-user"></div>';
|
||||
}
|
||||
|
|
@ -76,7 +76,7 @@
|
|||
html += '</div>';
|
||||
|
||||
$(document.body).prepend(html);
|
||||
$('.viewMenuBar').trigger('create');
|
||||
$('.viewMenuBar').trigger('create').lazyChildren();
|
||||
|
||||
$(document).trigger('headercreated');
|
||||
bindMenuEvents();
|
||||
|
|
@ -294,7 +294,7 @@
|
|||
url += "&width=" + (imgWidth * Math.max(devicePixelRatio || 1, 2));
|
||||
}
|
||||
|
||||
html += '<img style="max-width:' + imgWidth + 'px;vertical-align:middle;margin-right:.8em;border-radius: 50px;" src="' + url + '" />';
|
||||
html += '<div class="lazy" data-src="' + url + '" style="width:' + imgWidth + 'px;height:' + imgWidth + 'px;background-size:contain;background-repeat:no-repeat;background-position:center center;border-radius:1000px;vertical-align:middle;margin-right:.8em;display:inline-block;"></div>';
|
||||
} else {
|
||||
html += '<span class="fa fa-user sidebarLinkIcon"></span>';
|
||||
}
|
||||
|
|
@ -330,7 +330,7 @@
|
|||
|
||||
$(document.body).append(html);
|
||||
|
||||
panel = $('#libraryPanel').panel({}).trigger('create');
|
||||
panel = $('#libraryPanel').panel({}).lazyChildren().trigger('create');
|
||||
|
||||
updateLibraryMenu();
|
||||
}
|
||||
|
|
@ -546,7 +546,7 @@
|
|||
$('.libraryViewNav', page).addClass('bottomLibraryViewNav');
|
||||
$(page).addClass('noSecondaryNavPage');
|
||||
|
||||
$(function() {
|
||||
$(function () {
|
||||
|
||||
$('.footer').addClass('footerOverBottomTabs');
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1493,6 +1493,10 @@
|
|||
nowPlayingItem.BackdropItemId = item.Id;
|
||||
nowPlayingItem.BackdropImageTag = item.BackdropImageTags[0];
|
||||
}
|
||||
else if (item.ParentBackdropImageTags && item.ParentBackdropImageTags.length) {
|
||||
nowPlayingItem.BackdropItemId = item.ParentBackdropItemId;
|
||||
nowPlayingItem.BackdropImageTag = item.ParentBackdropImageTags[0];
|
||||
}
|
||||
|
||||
if (imageTags.Thumb) {
|
||||
|
||||
|
|
@ -1628,7 +1632,7 @@
|
|||
return true;
|
||||
}
|
||||
|
||||
if ($.browser.android || ($.browser.webkit && !$.browser.chrome)) {
|
||||
if ($.browser.mobile) {
|
||||
return false;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -386,6 +386,8 @@
|
|||
MediaController.removeFromPlaylist(index);
|
||||
loadPlaylist(page);
|
||||
});
|
||||
|
||||
$(page).on('click', '.mediaItem', onListItemClick);
|
||||
}
|
||||
|
||||
function onPlaybackStart(e, state) {
|
||||
|
|
@ -524,6 +526,7 @@
|
|||
$('.itemName', page).html(item ? MediaController.getNowPlayingNameHtml(item) : '');
|
||||
|
||||
var url;
|
||||
var backdropUrl = null;
|
||||
|
||||
if (!item) {
|
||||
}
|
||||
|
|
@ -557,7 +560,20 @@
|
|||
return;
|
||||
}
|
||||
|
||||
if (item && item.BackdropImageTag) {
|
||||
|
||||
backdropUrl = ApiClient.getScaledImageUrl(item.BackdropItemId, {
|
||||
type: "Backdrop",
|
||||
maxWidth: $(window).width(),
|
||||
tag: item.BackdropImageTag,
|
||||
index: 0
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
setImageUrl(page, url);
|
||||
|
||||
Backdrops.setBackdropUrl(page, backdropUrl);
|
||||
}
|
||||
|
||||
function setImageUrl(page, url) {
|
||||
|
|
@ -631,38 +647,73 @@
|
|||
|
||||
var html = '';
|
||||
|
||||
//ApiClient.getItems(Dashboard.getCurrentUserId(), {
|
||||
ApiClient.getItems(Dashboard.getCurrentUserId(), {
|
||||
|
||||
// SortBy: "SortName",
|
||||
// SortOrder: "Ascending",
|
||||
// IncludeItemTypes: "Audio",
|
||||
// Recursive: true,
|
||||
// Fields: "PrimaryImageAspectRatio,SortName,MediaSourceCount,IsUnidentified,SyncInfo",
|
||||
// StartIndex: 0,
|
||||
// ImageTypeLimit: 1,
|
||||
// EnableImageTypes: "Primary,Backdrop,Banner,Thumb",
|
||||
// Limit: 100
|
||||
SortBy: "SortName",
|
||||
SortOrder: "Ascending",
|
||||
IncludeItemTypes: "Audio",
|
||||
Recursive: true,
|
||||
Fields: "PrimaryImageAspectRatio,SortName,MediaSourceCount,IsUnidentified,SyncInfo",
|
||||
StartIndex: 0,
|
||||
ImageTypeLimit: 1,
|
||||
EnableImageTypes: "Primary,Backdrop,Banner,Thumb",
|
||||
Limit: 100
|
||||
|
||||
//}).done(function (result) {
|
||||
|
||||
// html += LibraryBrowser.getListViewHtml({
|
||||
// items: result.Items,
|
||||
// smallIcon: true,
|
||||
// defaultAction: 'setplaylistindex'
|
||||
// });
|
||||
|
||||
// $(".playlist", page).html(html).trigger('create').lazyChildren();
|
||||
//});
|
||||
}).done(function (result) {
|
||||
|
||||
html += LibraryBrowser.getListViewHtml({
|
||||
items: MediaController.playlist(),
|
||||
smallIcon: true,
|
||||
defaultAction: 'play'
|
||||
items: result.Items,
|
||||
smallIcon: true
|
||||
});
|
||||
|
||||
$(".playlist", page).html(html).trigger('create').lazyChildren();
|
||||
});
|
||||
|
||||
//html += LibraryBrowser.getListViewHtml({
|
||||
// items: MediaController.playlist(),
|
||||
// smallIcon: true
|
||||
//});
|
||||
|
||||
$(".playlist", page).html(html).trigger('create').lazyChildren();
|
||||
}
|
||||
|
||||
function onListItemClick(e) {
|
||||
|
||||
var info = LibraryBrowser.getListItemInfo(this);
|
||||
|
||||
MediaController.currentPlaylistIndex(info.index);
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function getBackdropUrl(item) {
|
||||
|
||||
var screenWidth = Math.max(screen.height, screen.width);
|
||||
|
||||
if (item.BackdropImageTags && item.BackdropImageTags.length) {
|
||||
|
||||
return ApiClient.getScaledImageUrl(item.Id, {
|
||||
type: "Backdrop",
|
||||
index: 0,
|
||||
maxWidth: screenWidth,
|
||||
tag: item.BackdropImageTags[0]
|
||||
});
|
||||
|
||||
}
|
||||
else if (item.ParentBackdropItemId && item.ParentBackdropImageTags && item.ParentBackdropImageTags.length) {
|
||||
|
||||
return ApiClient.getScaledImageUrl(item.ParentBackdropItemId, {
|
||||
type: 'Backdrop',
|
||||
index: 0,
|
||||
maxWidth: screenWidth,
|
||||
tag: item.ParentBackdropImageTags[0]
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
return null;
|
||||
};
|
||||
|
||||
$(document).on('pageinit', "#nowPlayingPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
|
@ -673,6 +724,8 @@
|
|||
|
||||
var page = this;
|
||||
|
||||
currentImgUrl = null;
|
||||
|
||||
var tab = getParameterByName('tab');
|
||||
if (tab) {
|
||||
$('.tabButton' + tab, page).trigger('click');
|
||||
|
|
|
|||
|
|
@ -40,8 +40,6 @@
|
|||
|
||||
updateFilterControls(page);
|
||||
|
||||
var defaultAction = query.MediaTypes == 'Photo' ? 'photoslideshow' : null;
|
||||
|
||||
// Poster
|
||||
html = LibraryBrowser.getPosterViewHtml({
|
||||
items: result.Items,
|
||||
|
|
@ -49,8 +47,7 @@
|
|||
context: getParameterByName('context') || 'photos',
|
||||
showTitle: false,
|
||||
centerText: true,
|
||||
lazy: true,
|
||||
defaultAction: defaultAction
|
||||
lazy: true
|
||||
});
|
||||
|
||||
var elem = $('#items', page).html(html).lazyChildren();
|
||||
|
|
@ -137,13 +134,11 @@
|
|||
query.ParentId = getParameterByName('parentId') || LibraryMenu.getTopParentId();
|
||||
}
|
||||
|
||||
function startSlideshow(page, index) {
|
||||
|
||||
index += (query.StartIndex || 0);
|
||||
function startSlideshow(page, itemQuery, startItemId) {
|
||||
|
||||
var userId = Dashboard.getCurrentUserId();
|
||||
|
||||
var localQuery = $.extend({}, query);
|
||||
var localQuery = $.extend({}, itemQuery);
|
||||
localQuery.StartIndex = 0;
|
||||
localQuery.Limit = null;
|
||||
localQuery.MediaTypes = "Photo";
|
||||
|
|
@ -152,11 +147,11 @@
|
|||
|
||||
ApiClient.getItems(userId, localQuery).done(function (result) {
|
||||
|
||||
showSlideshow(page, result.Items, index);
|
||||
showSlideshow(page, result.Items, startItemId);
|
||||
});
|
||||
}
|
||||
|
||||
function showSlideshow(page, items, index) {
|
||||
function showSlideshow(page, items, startItemId) {
|
||||
|
||||
var slideshowItems = items.map(function (item) {
|
||||
|
||||
|
|
@ -173,9 +168,16 @@
|
|||
};
|
||||
});
|
||||
|
||||
index = Math.max(index || 0, 0);
|
||||
var index = items.map(function (i) {
|
||||
return i.Id;
|
||||
|
||||
Dashboard.loadSwipebox().done(function() {
|
||||
}).indexOf(startItemId);
|
||||
|
||||
if (index == -1) {
|
||||
index = 0;
|
||||
}
|
||||
|
||||
Dashboard.loadSwipebox().done(function () {
|
||||
|
||||
$.swipebox(slideshowItems, {
|
||||
initialIndexOnArray: index,
|
||||
|
|
@ -184,6 +186,17 @@
|
|||
});
|
||||
}
|
||||
|
||||
function onListItemClick(e) {
|
||||
|
||||
var page = $(this).parents('.page');
|
||||
var info = LibraryBrowser.getListItemInfo(this);
|
||||
|
||||
if (info.mediaType == 'Photo') {
|
||||
Photos.startSlideshow(page, query, info.id);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
$(document).on('pageinit', "#photosPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
|
@ -205,6 +218,8 @@
|
|||
reloadItems(page);
|
||||
});
|
||||
|
||||
$(page).on('click', '.mediaItem', onListItemClick);
|
||||
|
||||
$('.chkStandardFilter', this).on('change', function () {
|
||||
|
||||
var filterName = this.getAttribute('data-filter');
|
||||
|
|
@ -247,10 +262,6 @@
|
|||
reloadItems(page);
|
||||
});
|
||||
|
||||
$('.itemsContainer', page).on('photoslideshow', function (e, index) {
|
||||
startSlideshow(page, index);
|
||||
});
|
||||
|
||||
}).on('pagebeforeshow', "#photosPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
|
@ -284,4 +295,8 @@
|
|||
updateFilterControls(this);
|
||||
});
|
||||
|
||||
window.Photos = {
|
||||
startSlideshow: startSlideshow
|
||||
};
|
||||
|
||||
})(jQuery, document);
|
||||
|
|
@ -645,7 +645,7 @@ var Dashboard = {
|
|||
url += "&width=" + (imgWidth * Math.max(window.devicePixelRatio || 1, 2));
|
||||
}
|
||||
|
||||
html += '<img style="max-width:' + imgWidth + 'px;vertical-align:middle;margin-right:.5em;border-radius: 50px;" src="' + url + '" />';
|
||||
html += '<div class="lazy" data-src="' + url + '" style="width:' + imgWidth + 'px;height:' + imgWidth + 'px;background-size:contain;background-repeat:no-repeat;background-position:center center;border-radius:1000px;vertical-align:middle;margin-right:.8em;display:inline-block;"></div>';
|
||||
}
|
||||
html += user.name;
|
||||
html += '</h3>';
|
||||
|
|
@ -669,7 +669,7 @@ var Dashboard = {
|
|||
|
||||
$(document.body).append(html);
|
||||
|
||||
var elem = $('#userFlyout').panel({}).trigger('create').panel("open").on("panelclose", function () {
|
||||
var elem = $('#userFlyout').panel({}).lazyChildren().trigger('create').panel("open").on("panelclose", function () {
|
||||
|
||||
$(this).off("panelclose").remove();
|
||||
});
|
||||
|
|
@ -1363,7 +1363,7 @@ var Dashboard = {
|
|||
|
||||
if (AppInfo.hasLowImageBandwidth) {
|
||||
|
||||
quality -= 20;
|
||||
quality -= 10;
|
||||
|
||||
if (isBackdrop) {
|
||||
quality -= 10;
|
||||
|
|
@ -1383,8 +1383,6 @@ var Dashboard = {
|
|||
name = "Chrome";
|
||||
} else if ($.browser.safari) {
|
||||
name = "Safari";
|
||||
} else if ($.browser.webkit) {
|
||||
name = "WebKit";
|
||||
} else if ($.browser.msie) {
|
||||
name = "Internet Explorer";
|
||||
} else if ($.browser.opera) {
|
||||
|
|
@ -1527,8 +1525,9 @@ var AppInfo = {};
|
|||
AppInfo.enableFooterNotifications = true;
|
||||
}
|
||||
|
||||
AppInfo.enableUserImage = !AppInfo.hasLowImageBandwidth || !isCordova;
|
||||
AppInfo.enableHeaderImages = AppInfo.enableUserImage;
|
||||
//AppInfo.enableUserImage = !AppInfo.hasLowImageBandwidth || !isCordova;
|
||||
AppInfo.enableUserImage = true;
|
||||
AppInfo.enableHeaderImages = !AppInfo.hasLowImageBandwidth || !isCordova;
|
||||
}
|
||||
|
||||
function initializeApiClient(apiClient) {
|
||||
|
|
|
|||
8
dashboard-ui/thirdparty/browser.js
vendored
8
dashboard-ui/thirdparty/browser.js
vendored
|
|
@ -907,7 +907,7 @@
|
|||
ua = ua.toLowerCase();
|
||||
|
||||
var match = /(chrome)[ \/]([\w.]+)/.exec(ua) ||
|
||||
/(webkit)[ \/]([\w.]+)/.exec(ua) ||
|
||||
/(safari)[ \/]([\w.]+)/.exec(ua) ||
|
||||
/(opera)(?:.*version|)[ \/]([\w.]+)/.exec(ua) ||
|
||||
/(msie) ([\w.]+)/.exec(ua) ||
|
||||
ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec(ua) ||
|
||||
|
|
@ -920,7 +920,7 @@
|
|||
|
||||
var browser = match[1] || "";
|
||||
|
||||
if (ua.indexOf("like gecko") != -1 && ua.indexOf('webkit') == -1 && ua.indexOf('opera') == -1) {
|
||||
if (ua.indexOf("like gecko") != -1 && ua.indexOf('webkit') == -1 && ua.indexOf('opera') == -1 && ua.indexOf('chrome') == -1 && ua.indexOf('safari') == -1) {
|
||||
browser = "msie";
|
||||
}
|
||||
|
||||
|
|
@ -945,10 +945,8 @@
|
|||
}
|
||||
|
||||
// Chrome is Webkit, but Webkit is also Safari.
|
||||
if (browser.chrome) {
|
||||
if (browser.chrome || $.browser.safari) {
|
||||
browser.webkit = true;
|
||||
} else if (browser.webkit) {
|
||||
browser.safari = true;
|
||||
}
|
||||
|
||||
var md = new MobileDetect(userAgent);
|
||||
|
|
|
|||
295
dashboard-ui/thirdparty/jquery.unveil-custom.js
vendored
295
dashboard-ui/thirdparty/jquery.unveil-custom.js
vendored
|
|
@ -8,7 +8,9 @@
|
|||
* https://github.com/luis-almeida
|
||||
*/
|
||||
|
||||
; (function ($) {
|
||||
(function ($) {
|
||||
|
||||
var unveilId = 0;
|
||||
|
||||
$.fn.unveil = function (threshold, callback) {
|
||||
|
||||
|
|
@ -18,18 +20,14 @@
|
|||
images = this,
|
||||
loaded;
|
||||
|
||||
unveilId++;
|
||||
var eventNamespace = 'unveil' + unveilId;
|
||||
|
||||
this.one("unveil", function () {
|
||||
var elem = this;
|
||||
var elemType = elem.tagName;
|
||||
var source = elem.getAttribute(attrib);
|
||||
if (source) {
|
||||
if (elemType === "DIV") {
|
||||
|
||||
elem.style.backgroundImage = "url('" + source + "')";
|
||||
|
||||
} else {
|
||||
elem.setAttribute("src", source);
|
||||
}
|
||||
ImageStore.setImageInto(elem, source);
|
||||
elem.setAttribute("data-src", '');
|
||||
}
|
||||
});
|
||||
|
|
@ -37,8 +35,8 @@
|
|||
function unveil() {
|
||||
var inview = images.filter(function () {
|
||||
var $e = $(this);
|
||||
if ($e.is(":hidden")) return;
|
||||
|
||||
if ($e.is(":hidden")) return;
|
||||
var wt = $w.scrollTop(),
|
||||
wb = wt + $w.height(),
|
||||
et = $e.offset().top,
|
||||
|
|
@ -49,10 +47,15 @@
|
|||
|
||||
loaded = inview.trigger("unveil");
|
||||
images = images.not(loaded);
|
||||
|
||||
if (!images.length) {
|
||||
$w.off('scroll.' + eventNamespace);
|
||||
$w.off('resize.' + eventNamespace);
|
||||
}
|
||||
}
|
||||
|
||||
$w.on('scroll.unveil', unveil);
|
||||
$w.on('resize.unveil', unveil);
|
||||
$w.on('scroll.' + eventNamespace, unveil);
|
||||
$w.on('resize.' + eventNamespace, unveil);
|
||||
|
||||
unveil();
|
||||
|
||||
|
|
@ -62,8 +65,274 @@
|
|||
|
||||
$.fn.lazyChildren = function () {
|
||||
|
||||
$(".lazy", this).unveil(0);
|
||||
var lazyItems = $(".lazy", this);
|
||||
|
||||
if (lazyItems.length) {
|
||||
lazyItems.unveil(0);
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
$.fn.lazyImage = function (url) {
|
||||
|
||||
return this.attr('data-src', url).unveil(0);
|
||||
};
|
||||
|
||||
})(window.jQuery || window.Zepto);
|
||||
|
||||
(function () {
|
||||
|
||||
// IndexedDB
|
||||
var indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.OIndexedDB || window.msIndexedDB,
|
||||
dbVersion = 1.0;
|
||||
|
||||
var dbName = "emby3";
|
||||
var imagesStoreName = "images";
|
||||
|
||||
function createObjectStore(dataBase) {
|
||||
// Create an objectStore
|
||||
console.log("Creating objectStore");
|
||||
dataBase.createObjectStore(imagesStoreName);
|
||||
}
|
||||
|
||||
function openDb() {
|
||||
|
||||
var deferred = $.Deferred();
|
||||
|
||||
// Create/open database
|
||||
var request = indexedDB.open(dbName, dbVersion);
|
||||
|
||||
request.onerror = function (event) {
|
||||
|
||||
console.log("Error creating/accessing IndexedDB database");
|
||||
deferred.reject();
|
||||
};
|
||||
|
||||
request.onsuccess = function (event) {
|
||||
console.log("Success creating/accessing IndexedDB database");
|
||||
|
||||
var db = request.result || event.target.result;
|
||||
|
||||
db.onerror = function (event) {
|
||||
console.log("Error creating/accessing IndexedDB database");
|
||||
};
|
||||
|
||||
// Interim solution for Google Chrome to create an objectStore. Will be deprecated
|
||||
if (db.setVersion) {
|
||||
if (db.version != dbVersion) {
|
||||
var setVersion = db.setVersion(dbVersion);
|
||||
setVersion.onsuccess = function () {
|
||||
createObjectStore(db);
|
||||
deferred.resolveWith(null, [db]);
|
||||
};
|
||||
} else {
|
||||
deferred.resolveWith(null, [db]);
|
||||
}
|
||||
} else {
|
||||
deferred.resolveWith(null, [db]);
|
||||
}
|
||||
}
|
||||
|
||||
// For future use. Currently only in latest Firefox versions
|
||||
request.onupgradeneeded = function (event) {
|
||||
createObjectStore(event.target.result);
|
||||
};
|
||||
|
||||
return deferred.promise();
|
||||
}
|
||||
|
||||
function indexedDbImageStore() {
|
||||
|
||||
var self = this;
|
||||
|
||||
var openPromise = openDb().done(function (db) {
|
||||
|
||||
self._db = db;
|
||||
});
|
||||
|
||||
self.addImageToDatabase = function (blob, key) {
|
||||
|
||||
console.log("addImageToDatabase");
|
||||
|
||||
// Open a transaction to the database
|
||||
var transaction = self.db().transaction([imagesStoreName], "readwrite");
|
||||
|
||||
// Put the blob into the dabase
|
||||
var put = transaction.objectStore(imagesStoreName).put(blob, key);
|
||||
};
|
||||
|
||||
self.revokeUrl = function (url) {
|
||||
|
||||
// Get window.URL object
|
||||
var URL = window.URL || window.webkitURL;
|
||||
URL.revokeObjectURL(url);
|
||||
};
|
||||
|
||||
self.db = function () {
|
||||
|
||||
return self._db;
|
||||
};
|
||||
|
||||
self.get = function (key) {
|
||||
|
||||
var deferred = DeferredBuilder.Deferred();
|
||||
|
||||
var transaction = self.db().transaction([imagesStoreName], "readonly");
|
||||
|
||||
// Open a transaction to the database
|
||||
var getRequest = transaction.objectStore(imagesStoreName).get(key);
|
||||
|
||||
getRequest.onsuccess = function (event) {
|
||||
|
||||
var imgFile = event.target.result;
|
||||
|
||||
if (imgFile) {
|
||||
deferred.resolveWith(null, [imgFile]);
|
||||
} else {
|
||||
deferred.reject();
|
||||
}
|
||||
};
|
||||
|
||||
getRequest.onerror = function () {
|
||||
deferred.reject();
|
||||
};
|
||||
|
||||
return deferred.promise();
|
||||
};
|
||||
|
||||
self.getImageUrl = function (originalUrl) {
|
||||
|
||||
console.log('getImageUrl:' + originalUrl);
|
||||
|
||||
var key = CryptoJS.SHA1(originalUrl).toString();
|
||||
|
||||
var deferred = DeferredBuilder.Deferred();
|
||||
|
||||
self.get(key).done(function (url) {
|
||||
|
||||
deferred.resolveWith(null, [url]);
|
||||
|
||||
}).fail(function () {
|
||||
|
||||
self.downloadImage(originalUrl, key).done(function () {
|
||||
self.get(key).done(function (url) {
|
||||
|
||||
deferred.resolveWith(null, [url]);
|
||||
|
||||
}).fail(function () {
|
||||
|
||||
deferred.reject();
|
||||
});
|
||||
}).fail(function () {
|
||||
|
||||
deferred.reject();
|
||||
});
|
||||
});
|
||||
|
||||
return deferred.promise();
|
||||
};
|
||||
|
||||
self.downloadImage = function (url, key) {
|
||||
|
||||
var deferred = DeferredBuilder.Deferred();
|
||||
|
||||
console.log('downloadImage:' + url);
|
||||
|
||||
// Create XHR
|
||||
var xhr = new XMLHttpRequest();
|
||||
|
||||
xhr.open("GET", url, true);
|
||||
// Set the responseType to blob
|
||||
xhr.responseType = "arraybuffer";
|
||||
|
||||
xhr.addEventListener("load", function () {
|
||||
|
||||
if (xhr.status === 200) {
|
||||
console.log("Image retrieved");
|
||||
|
||||
try {
|
||||
|
||||
var arr = new Uint8Array(this.response);
|
||||
|
||||
// Convert the int array to a binary string
|
||||
// We have to use apply() as we are converting an *array*
|
||||
// and String.fromCharCode() takes one or more single values, not
|
||||
// an array.
|
||||
var raw = String.fromCharCode.apply(null, arr);
|
||||
|
||||
// This works!!!
|
||||
var b64 = btoa(raw);
|
||||
var dataURL = "data:image/jpeg;base64," + b64;
|
||||
|
||||
// Put the received blob into IndexedDB
|
||||
self.addImageToDatabase(dataURL, key);
|
||||
deferred.resolve();
|
||||
} catch (err) {
|
||||
deferred.reject();
|
||||
}
|
||||
}
|
||||
}, false);
|
||||
|
||||
// Send XHR
|
||||
xhr.send();
|
||||
return deferred.promise();
|
||||
};
|
||||
|
||||
self.setImageInto = function (elem, url) {
|
||||
|
||||
//if (!self.db()) {
|
||||
// if (elem.tagName === "DIV") {
|
||||
|
||||
// elem.style.backgroundImage = "url('" + url + "')";
|
||||
|
||||
// } else {
|
||||
// elem.setAttribute("src", url);
|
||||
// }
|
||||
// return;
|
||||
//}
|
||||
|
||||
openPromise.done(function () {
|
||||
|
||||
self.getImageUrl(url).done(function (localUrl) {
|
||||
|
||||
if (elem.tagName === "DIV") {
|
||||
|
||||
elem.style.backgroundImage = "url('" + localUrl + "')";
|
||||
|
||||
} else {
|
||||
elem.setAttribute("src", localUrl);
|
||||
}
|
||||
|
||||
}).fail(function() {
|
||||
new simpleImageStore().setImageInto(elem, url);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
};
|
||||
}
|
||||
|
||||
function simpleImageStore() {
|
||||
|
||||
var self = this;
|
||||
|
||||
self.setImageInto = function (elem, url) {
|
||||
|
||||
if (elem.tagName === "DIV") {
|
||||
|
||||
elem.style.backgroundImage = "url('" + url + "')";
|
||||
|
||||
} else {
|
||||
elem.setAttribute("src", url);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
if ($.browser.safari && indexedDB) {
|
||||
window.ImageStore = new indexedDbImageStore();
|
||||
} else {
|
||||
window.ImageStore = new simpleImageStore();
|
||||
}
|
||||
|
||||
})();
|
||||
Loading…
Add table
Add a link
Reference in a new issue