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

update card layouts

Browse source
This commit is contained in:
Luke Pulverenti 2016-12-01 12:38:13 -05:00
parent 99ae92bad7
commit 3a7fbb7777
14 changed files with 155 additions and 58 deletions
Download patch file Download diff file Expand all files Collapse all files

8
dashboard-ui/bower_components/emby-apiclient/.bower.json vendored
View file

@ -16,12 +16,12 @@
},
"devDependencies": {},
"ignore": [],
"version": "1.1.94",
"_release": "1.1.94",
"version": "1.1.95",
"_release": "1.1.95",
"_resolution": {
"type": "version",
"tag": "1.1.94",
"commit": "dfd0b14c1af141e548fe2cee92a1f86967c50e8f"
"tag": "1.1.95",
"commit": "e8acc2b7fb936b9e8d54a1eda726a16806258639"
},
"_source": "https://github.com/MediaBrowser/Emby.ApiClient.Javascript.git",
"_target": "^1.1.51",

16
dashboard-ui/bower_components/emby-apiclient/appstorage-localstorage.js vendored
View file

@ -6,7 +6,10 @@
var localData;
function updateCache() {
cache.put('data', new Response(JSON.stringify(localData)));
if (cache) {
cache.put('data', new Response(JSON.stringify(localData)));
}
}
myStore.setItem = function (name, value) {
@ -38,10 +41,13 @@
try {
caches.open('embydata').then(function (result) {
cache = result;
localData = {};
});
if (self.caches) {
caches.open('embydata').then(function (result) {
cache = result;
localData = {};
});
}
} catch (err) {
console.log('Error opening cache: ' + err);

46
dashboard-ui/bower_components/emby-apiclient/sync/localsync.js vendored Normal file
View file

@ -0,0 +1,46 @@
define(['appSettings', 'connectionManager'], function (appSettings, connectionManager) {
'use strict';
var syncPromise;
return {
sync: function (options) {
if (syncPromise) {
return syncPromise;
}
return new Promise(function (resolve, reject) {
require(['multiserversync'], function (MultiServerSync) {
options = options || {};
options.cameraUploadServers = appSettings.cameraUploadServers();
syncPromise = new MultiServerSync(connectionManager).sync(options).then(function () {
syncPromise = null;
resolve();
}, function () {
syncPromise = null;
reject();
});
});
});
},
getSyncStatus: function () {
if (syncPromise != null) {
return 'Syncing';
}
return 'Idle';
}
};
});

8
dashboard-ui/bower_components/emby-webcomponents/.bower.json vendored
View file

@ -14,12 +14,12 @@
},
"devDependencies": {},
"ignore": [],
"version": "1.4.360",
"_release": "1.4.360",
"version": "1.4.362",
"_release": "1.4.362",
"_resolution": {
"type": "version",
"tag": "1.4.360",
"commit": "a6e44673685b3060947662be41de5cb36253320a"
"tag": "1.4.362",
"commit": "74f60991dce95403508b7eb84ec362226f574bc9"
},
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
"_target": "^1.2.1",

26
dashboard-ui/bower_components/emby-webcomponents/cardbuilder/card.css vendored
View file

@ -53,7 +53,7 @@ button {
position: relative;
}
.cardPadder-backdrop, .cardPadder-smallBackdrop, .cardPadder-overflowBackdrop {
.cardPadder-backdrop, .cardPadder-smallBackdrop, .cardPadder-overflowBackdrop, .cardPadder-overflowSmallBackdrop {
padding-bottom: 56.25%;
}
@ -402,6 +402,10 @@ button {
max-width: 400px;
}
.overflowSmallBackdropCard-scalable {
width: 60%;
}
.overflowSquareCard-scalable {
width: 42%;
max-width: 200px;
@ -438,6 +442,10 @@ button {
.overflowSquareCard-scalable {
width: 30%;
}
.overflowSmallBackdropCard-scalable {
width: 40%
}
}
@media all and (min-width: 640px) {
@ -449,6 +457,10 @@ button {
.overflowBackdropCard-scalable {
width: 56%;
}
.overflowSmallBackdropCard-scalable {
width: 40%
}
}
@media all and (min-width: 700px) {
@ -461,6 +473,10 @@ button {
.backdropCard-scalable {
width: 33.333333333333333333333333333333%;
}
.overflowSmallBackdropCard-scalable {
width: 30%
}
}
@media all and (min-width: 800px) {
@ -501,6 +517,10 @@ button {
width: 40%;
}
.overflowSmallBackdropCard-scalable {
width: 24%
}
.overflowSquareCard-scalable {
width: 22%;
}
@ -527,6 +547,10 @@ button {
.smallBackdropCard-scalable {
width: 16.666666666666666666666666666667%;
}
.overflowSmallBackdropCard-scalable {
width: 18%
}
}

29
dashboard-ui/bower_components/emby-webcomponents/cardbuilder/cardbuilder.js vendored
View file

@ -1,5 +1,5 @@
define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusManager', 'indicators', 'globalize', 'layoutManager', 'apphost', 'dom', 'emby-button', 'css!./card', 'paper-icon-button-light', 'clearButtonStyle'],
function (datetime, imageLoader, connectionManager, itemHelper, focusManager, indicators, globalize, layoutManager, appHost, dom) {
define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusManager', 'indicators', 'globalize', 'layoutManager', 'apphost', 'dom', 'browser', 'emby-button', 'css!./card', 'paper-icon-button-light', 'clearButtonStyle'],
function (datetime, imageLoader, connectionManager, itemHelper, focusManager, indicators, globalize, layoutManager, appHost, dom, browser) {
'use strict';
var devicePixelRatio = window.devicePixelRatio || 1;
@ -144,6 +144,20 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
return 100 / 64;
}
return 100 / 72;
case 'overflowSmallBackdrop':
if (screenWidth >= 1200) {
return 100 / 18;
}
if (screenWidth >= 1000) {
return 100 / 24;
}
if (screenWidth >= 770) {
return 100 / 30;
}
if (screenWidth >= 540) {
return 100 / 40;
}
return 100 / 60;
default:
return 4;
}
@ -1275,7 +1289,12 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
cardContentClose = '</button>';
}
if (options.vibrant && imgUrl && !vibrantSwatch) {
var vibrantAttributes = options.vibrant && imgUrl && !vibrantSwatch ?
(' data-vibrant="' + cardFooterId + '" data-swatch="db"') :
'';
// Don't use the IMG tag with safari because it puts a white border around it
if (vibrantAttributes && !browser.safari) {
cardImageContainerOpen = '<div class="' + cardImageContainerClass + '">';
var imgClass = 'cardImage cardImage-img lazy';
@ -1286,10 +1305,10 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
imgClass += ' coveredImage-img';
}
}
cardImageContainerOpen += '<img crossOrigin="Anonymous" class="' + imgClass + '" data-vibrant="' + cardFooterId + '" data-swatch="db" data-src="' + imgUrl + '" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" />';
cardImageContainerOpen += '<img crossOrigin="Anonymous" class="' + imgClass + '"' + vibrantAttributes + ' data-src="' + imgUrl + '" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" />';
} else {
cardImageContainerOpen = imgUrl ? ('<div class="' + cardImageContainerClass + ' lazy" data-src="' + imgUrl + '">') : ('<div class="' + cardImageContainerClass + '">');
cardImageContainerOpen = imgUrl ? ('<div class="' + cardImageContainerClass + ' lazy"' + vibrantAttributes + ' data-src="' + imgUrl + '">') : ('<div class="' + cardImageContainerClass + '">');
}
var cardScalableClass = options.cardLayout ? 'cardScalable visualCardBox-cardScalable' : 'cardScalable';

35
dashboard-ui/bower_components/emby-webcomponents/images/imagehelper.js vendored
View file

@ -27,7 +27,7 @@ define(['lazyLoader', 'imageFetcher', 'layoutManager', 'browser', 'appSettings',
function fillImageElement(elem, source, enableEffects) {
imageFetcher.loadImage(elem, source).then(function () {
var fillingVibrant = elem.tagName !== 'IMG' ? false : fillVibrant(elem, source);
var fillingVibrant = fillVibrant(elem, source);
if (enableFade && !layoutManager.tv && enableEffects !== false && !fillingVibrant) {
fadeIn(elem);
@ -110,14 +110,17 @@ define(['lazyLoader', 'imageFetcher', 'layoutManager', 'browser', 'appSettings',
requestIdleCallback(function () {
//var now = new Date().getTime();
var swatch = getVibrantInfo(img, url).split('|');
//console.log('vibrant took ' + (new Date().getTime() - now) + 'ms');
if (swatch.length) {
getVibrantInfoFromElement(img, url).then(function (vibrantInfo) {
var swatch = vibrantInfo.split('|');
//console.log('vibrant took ' + (new Date().getTime() - now) + 'ms');
if (swatch.length) {
var index = 0;
vibrantElement.style.backgroundColor = swatch[index];
vibrantElement.style.color = swatch[index + 1];
}
var index = 0;
vibrantElement.style.backgroundColor = swatch[index];
vibrantElement.style.color = swatch[index + 1];
}
});
});
/*
* Results into:
@ -129,6 +132,22 @@ define(['lazyLoader', 'imageFetcher', 'layoutManager', 'browser', 'appSettings',
*/
}
function getVibrantInfoFromElement(elem, url) {
if (elem.tagName === 'IMG') {
return Promise.resolve(getVibrantInfo(elem, url));
}
return new Promise(function (resolve, reject) {
var img = new Image();
img.onload = function () {
resolve(getVibrantInfo(img, url));
};
img.src = url;
});
}
function getSettingsKey(url) {
var parts = url.split('://');

9
dashboard-ui/css/librarybrowser.css
View file

@ -46,7 +46,7 @@
}
.pageWithAbsoluteTabs .pageTabContent {
padding-top: 2.2em;
padding-top: 2.6em;
}
/*.pageWithAbsoluteTabs .pageTabContent {
@ -103,13 +103,6 @@
margin-bottom: 2em;
}
@media all and (max-width: 800px) {
.hiddenSectionOnMobile {
display: none;
}
}
@media all and (min-width: 800px) {
.hiddenSectionOnNonMobile {

2
dashboard-ui/devices/ios/ios.css
View file

@ -66,7 +66,7 @@ h1, h1 a {
}
.cardImageContainer {
border-radius: 5px;
border-radius: 4px;
}
.noSecondaryNavPage .itemBackdrop {

8
dashboard-ui/scripts/indexpage.js
View file

@ -38,16 +38,16 @@
return Sections.loadRecentlyAdded(elem, user);
}
else if (section == 'librarytiles') {
return Sections.loadLibraryTiles(elem, user, 'backdrop', index, false);
return Sections.loadLibraryTiles(elem, user, 'backdrop', index);
}
else if (section == 'smalllibrarytiles') {
return Sections.loadLibraryTiles(elem, user, 'smallBackdrop', index, false);
return Sections.loadLibraryTiles(elem, user, 'smallBackdrop', index);
}
else if (section == 'smalllibrarytiles-automobile') {
return Sections.loadLibraryTiles(elem, user, 'smallBackdrop', index, true);
return Sections.loadLibraryTiles(elem, user, 'smallBackdrop', index);
}
else if (section == 'librarytiles-automobile') {
return Sections.loadLibraryTiles(elem, user, 'backdrop', index, true);
return Sections.loadLibraryTiles(elem, user, 'backdrop', index);
}
else if (section == 'librarybuttons') {
return Sections.loadlibraryButtons(elem, userId, index);

2
dashboard-ui/scripts/moviestudios.js
View file

@ -48,7 +48,7 @@
itemsContainer: elem,
shape: "backdrop",
preferThumb: true,
showTitle: false,
showTitle: true,
scalable: true,
showItemCounts: true,
centerText: true,

20
dashboard-ui/scripts/sections.js
View file

@ -396,17 +396,13 @@
});
}
function loadLibraryTiles(elem, user, shape, index, autoHideOnMobile) {
function loadLibraryTiles(elem, user, shape) {
return getUserViews(user.Id).then(function (items) {
var html = '';
if (autoHideOnMobile) {
html += '<div class="hiddenSectionOnMobile">';
} else {
html += '<div>';
}
html += '<div>';
if (items.length) {
@ -415,7 +411,7 @@
html += '</div>';
var scrollX = enableScrollX() && dom.getWindowSize().innerWidth >= 600;
var scrollX = enableScrollX() && dom.getWindowSize().innerWidth >= 500;
if (scrollX) {
html += '<div is="emby-itemscontainer" class="hiddenScrollX itemsContainer">';
@ -425,7 +421,7 @@
html += cardBuilder.getCardsHtml({
items: items,
shape: scrollX ? 'overflowBackdrop' : shape,
shape: scrollX ? 'overflowSmallBackdrop' : shape,
showTitle: true,
centerText: true,
overlayText: false,
@ -438,12 +434,6 @@
html += '</div>';
if (autoHideOnMobile) {
html += '<div class="hiddenSectionOnNonMobile" style="margin-top:1em;">';
html += getLibraryButtonsHtml(items);
html += '</div>';
}
return getAppInfo().then(function (infoHtml) {
elem.innerHTML = html + infoHtml;
@ -497,7 +487,7 @@
}
var supportsImageAnalysis = appHost.supports('imageanalysis');
var cardLayout = appHost.preferVisualCards;
var cardLayout = supportsImageAnalysis;
html += cardBuilder.getCardsHtml({
items: result.Items,

2
dashboard-ui/scripts/tvrecommended.js
View file

@ -99,7 +99,7 @@
var container = view.querySelector('#resumableItems');
var supportsImageAnalysis = appHost.supports('imageanalysis');
var cardLayout = appHost.preferVisualCards;
var cardLayout = supportsImageAnalysis;
cardBuilder.buildCards(result.Items, {
itemsContainer: container,

2
dashboard-ui/scripts/tvstudios.js
View file

@ -49,7 +49,7 @@
itemsContainer: elem,
shape: "backdrop",
preferThumb: true,
showTitle: false,
showTitle: true,
scalable: true,
showItemCounts: true,
centerText: true,