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

Improvements to the quality of artworks and user images - Part 2 (#512)

Browse source 
* Improved the overall appearance of user images

* Rounded photo in 'My profile' page

* Improved quality of media artwork

* fix some minor bugs introduced from a merge conflict
This commit is contained in:
Fernando 2019-10-13 21:46:22 +02:00 • committed by Anthony Lavado
parent f6617cb28c
commit e538a6d62c
13 changed files with 29 additions and 62 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/components/activitylog.js
View file

@ -13,8 +13,7 @@ define(["events", "globalize", "dom", "datetime", "userSettings", "serverNotific
if (entry.UserId && entry.UserPrimaryImageTag) {
html += '<i class="listItemIcon md-icon" style="width:2em!important;height:2em!important;padding:0;color:transparent;background-color:' + color + ";background-image:url('" + apiClient.getUserImageUrl(entry.UserId, {
type: "Primary",
tag: entry.UserPrimaryImageTag,
height: 40
tag: entry.UserPrimaryImageTag
}) + "');background-repeat:no-repeat;background-position:center center;background-size: cover;\">dvr</i>"
} else {
html += '<i class="listItemIcon md-icon" style="background-color:' + color + '">' + icon + '</i>';

15
src/components/backdrop/backdrop.js
View file

@ -173,19 +173,6 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'css!./style']
currentLoadingBackdrop = instance;
}
var standardWidths = [480, 720, 1280, 1440, 1920];
function getBackdropMaxWidth() {
var width = dom.getWindowSize().innerWidth;
var roundScreenTo = 100;
if (standardWidths.indexOf(width) !== -1) {
return width;
}
width = Math.floor(width / roundScreenTo) * roundScreenTo;
return Math.min(width, 1920);
}
function getItemImageUrls(item, imageOptions) {
imageOptions = imageOptions || {};
@ -195,7 +182,6 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'css!./style']
return apiClient.getScaledImageUrl(item.BackdropItemId || item.Id, Object.assign(imageOptions, {
type: "Backdrop",
tag: imgTag,
maxWidth: getBackdropMaxWidth(),
index: index
}));
});
@ -206,7 +192,6 @@ define(['browser', 'connectionManager', 'playbackManager', 'dom', 'css!./style']
return apiClient.getScaledImageUrl(item.ParentBackdropItemId, Object.assign(imageOptions, {
type: "Backdrop",
tag: imgTag,
maxWidth: getBackdropMaxWidth(),
index: index
}));
});

5
src/components/cardbuilder/card.css
View file

@ -232,9 +232,10 @@ button {
left: 0;
right: 0;
bottom: 0;
background-size: contain;
background-size: cover;
background-repeat: no-repeat;
background-position: center bottom;
background-position: center;
border: none;
}
.cardImage-img {

23
src/components/cardbuilder/cardBuilder.js
View file

@ -471,7 +471,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Thumb",
maxWidth: width,
tag: item.ImageTags.Thumb
});
@ -479,7 +478,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Banner",
maxWidth: width,
tag: item.ImageTags.Banner
});
@ -487,7 +485,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Disc",
maxWidth: width,
tag: item.ImageTags.Disc
});
@ -495,7 +492,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Logo",
maxWidth: width,
tag: item.ImageTags.Logo
});
@ -503,7 +499,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.ParentLogoItemId, {
type: "Logo",
maxWidth: width,
tag: item.ParentLogoImageTag
});
@ -511,7 +506,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.SeriesId, {
type: "Thumb",
maxWidth: width,
tag: item.SeriesThumbImageTag
});
@ -519,7 +513,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.ParentThumbItemId, {
type: "Thumb",
maxWidth: width,
tag: item.ParentThumbImageTag
});
@ -527,7 +520,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Backdrop",
maxWidth: width,
tag: item.BackdropImageTags[0]
});
@ -537,7 +529,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.ParentBackdropItemId, {
type: "Backdrop",
maxWidth: width,
tag: item.ParentBackdropImageTags[0]
});
@ -547,8 +538,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Primary",
maxHeight: height,
maxWidth: width,
tag: item.ImageTags.Primary
});
@ -569,8 +558,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.PrimaryImageItemId || item.Id || item.ItemId, {
type: "Primary",
maxHeight: height,
maxWidth: width,
tag: item.PrimaryImageTag
});
@ -589,7 +576,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.ParentPrimaryImageItemId, {
type: "Primary",
maxWidth: width,
tag: item.ParentPrimaryImageTag
});
}
@ -597,7 +583,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.SeriesId, {
type: "Primary",
maxWidth: width,
tag: item.SeriesPrimaryImageTag
});
}
@ -607,8 +592,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.AlbumId, {
type: "Primary",
maxHeight: height,
maxWidth: width,
tag: item.AlbumPrimaryImageTag
});
@ -623,7 +606,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Thumb",
maxWidth: width,
tag: item.ImageTags.Thumb
});
@ -632,7 +614,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Backdrop",
maxWidth: width,
tag: item.BackdropImageTags[0]
});
@ -640,7 +621,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Thumb",
maxWidth: width,
tag: item.ImageTags.Thumb
});
@ -648,7 +628,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.SeriesId, {
type: "Thumb",
maxWidth: width,
tag: item.SeriesThumbImageTag
});
@ -656,7 +635,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.ParentThumbItemId, {
type: "Thumb",
maxWidth: width,
tag: item.ParentThumbImageTag
});
@ -664,7 +642,6 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgUrl = apiClient.getScaledImageUrl(item.ParentBackdropItemId, {
type: "Backdrop",
maxWidth: width,
tag: item.ParentBackdropImageTags[0]
});

9
src/components/emby-button/emby-button.css
View file

@ -147,15 +147,14 @@
vertical-align: middle;
}
.paper-icon-button-light > img {
width: 1.72em;
/* Can't use 100% height or it will stretch past the boundaries in safari */
/*height: 100%;*/
.paper-icon-button-light > div {
max-height: 100%;
/* Make sure its on top of the ripple */
transform: scale(1.8);
position: relative;
z-index: 1;
vertical-align: middle;
display: inline;
margin: 0 auto;
}
.emby-button-foreground {