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 cards

Browse source
This commit is contained in:
Luke Pulverenti 2016-08-12 01:59:45 -04:00
parent c0e29e7542
commit 43a0e6ccea
6 changed files with 32 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -37,13 +37,9 @@
} }
.vertical-wrap .card { .vertical-wrap .card {
contain: strict; contain: layout style;
} }
.layout-tv .vertical-wrap .card {
contain: layout style;
}
.cardScalable { .cardScalable {
position: relative; position: relative;
} }
@ -71,10 +67,16 @@
border: 3px solid transparent; border: 3px solid transparent;
} }
.layout-tv .cardBox { .cardBox-focustransform {
will-change: transform; will-change: transform;
/*transition: transform 200ms ease-out;*/
} }
/*.card:focus > .cardBox-focustransform {
transition-delay: 50ms;
transform: scale(1.16, 1.16);
}*/
@media all and (min-width: 600px) { @media all and (min-width: 600px) {
.cardBox-mobile { .cardBox-mobile {

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

@ -1043,6 +1043,8 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'mediaInfo
if (!layoutManager.tv) { if (!layoutManager.tv) {
cardBoxClass += ' cardBox-mobile'; cardBoxClass += ' cardBox-mobile';
} else {
cardBoxClass += ' cardBox-focustransform';
} }
var footerCssClass; var footerCssClass;

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

@ -1,4 +1,4 @@
define(['datetime', 'imageLoader', 'connectionManager', 'itemShortcuts'], function (datetime, imageLoader, connectionManager, itemShortcuts) { define(['datetime', 'imageLoader', 'connectionManager', 'itemShortcuts', 'layoutManager'], function (datetime, imageLoader, connectionManager, itemShortcuts, layoutManager) {
function buildChapterCardsHtml(item, chapters, options) { function buildChapterCardsHtml(item, chapters, options) {
@ -84,9 +84,15 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemShortcuts'], functi
nameHtml += '<div class="cardText">' + chapter.Name + '</div>'; nameHtml += '<div class="cardText">' + chapter.Name + '</div>';
nameHtml += '<div class="cardText">' + datetime.getDisplayRunningTime(chapter.StartPositionTicks) + '</div>'; nameHtml += '<div class="cardText">' + datetime.getDisplayRunningTime(chapter.StartPositionTicks) + '</div>';
var cardBoxCssClass = 'cardBox';
if (layoutManager.tv) {
cardBoxCssClass += ' cardBox-focustransform';
}
var html = '\ var html = '\
<button type="button" class="' + className + '"' + dataAttributes + '> \ <button type="button" class="' + className + '"' + dataAttributes + '> \
<div class="cardBox">\ <div class="' + cardBoxCssClass + '">\
<div class="cardScalable">\ <div class="cardScalable">\
<div class="cardPadder-'+ shape + '"></div>\ <div class="cardPadder-'+ shape + '"></div>\
<div class="cardContent">\ <div class="cardContent">\

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

@ -1,4 +1,4 @@
define(['imageLoader', 'itemShortcuts', 'connectionManager'], function (imageLoader, itemShortcuts, connectionManager) { define(['imageLoader', 'itemShortcuts', 'connectionManager', 'layoutManager'], function (imageLoader, itemShortcuts, connectionManager, layoutManager) {
function buildPeopleCardsHtml(people, options) { function buildPeopleCardsHtml(people, options) {
@ -77,9 +77,15 @@ define(['imageLoader', 'itemShortcuts', 'connectionManager'], function (imageLoa
nameHtml += '<div class="cardText cardText-secondary">&nbsp;</div>'; nameHtml += '<div class="cardText cardText-secondary">&nbsp;</div>';
} }
var cardBoxCssClass = 'visualCardBox cardBox';
if (layoutManager.tv) {
cardBoxCssClass += ' cardBox-focustransform';
}
var html = '\ var html = '\
<button type="button" data-isfolder="' + person.IsFolder + '" data-type="' + person.Type + '" data-action="link" data-id="' + person.Id + '" data-serverid="' + serverId + '" raised class="' + className + '"> \ <button type="button" data-isfolder="' + person.IsFolder + '" data-type="' + person.Type + '" data-action="link" data-id="' + person.Id + '" data-serverid="' + serverId + '" raised class="' + className + '"> \
<div class="visualCardBox cardBox">\ <div class="' + cardBoxCssClass + '">\
<div class="cardScalable">\ <div class="cardScalable">\
<div class="cardPadder-portrait"></div>\ <div class="cardPadder-portrait"></div>\
<div class="cardContent">\ <div class="cardContent">\

7
dashboard-ui/bower_components/emby-webcomponents/cardbuilder/roundcard.css vendored
View file

@ -1,5 +1,8 @@
.cardBox-round { .cardBox-round {
border: .7em solid transparent !important; border: .7em solid transparent !important;
}
.cardBox-focustransform {
transition: transform 180ms ease-out !important; transition: transform 180ms ease-out !important;
-webkit-transform-origin: center center; -webkit-transform-origin: center center;
transform-origin: center center; transform-origin: center center;
@ -9,11 +12,11 @@
border: .15em solid transparent; border: .15em solid transparent;
} }
.cardImageContainer, .card-round:focus .cardImageContainer { .cardImageContainer-round, .card-round:focus .cardImageContainer {
border-color: #fff; border-color: #fff;
} }
.layout-tv .card-round:focus .cardBox { .card-round:focus > .cardBox-focustransform {
transform: scale(1.34, 1.34); transform: scale(1.34, 1.34);
} }

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

@ -36,7 +36,7 @@
if (data) { if (data) {
console.log('Found backdrop id list in cache. Key: ' + key) console.log('Found backdrop id list in cache. Key: ' + key);
data = JSON.parse(data); data = JSON.parse(data);
return Promise.resolve(data); return Promise.resolve(data);
} else { } else {