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 shared components

Browse source
This commit is contained in:
Luke Pulverenti 2016-07-28 22:42:42 -04:00
parent bcd1e109e0
commit c59b4c5a08
10 changed files with 1298 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -14,12 +14,12 @@
},
"devDependencies": {},
"ignore": [],
"version": "1.4.127",
"_release": "1.4.127",
"version": "1.4.128",
"_release": "1.4.128",
"_resolution": {
"type": "version",
"tag": "1.4.127",
"commit": "90c7b31f36c7c56406492a2c396c879817ce0303"
"tag": "1.4.128",
"commit": "75f2667ad68265aa1f8c28127bbbeacfc22a21a6"
},
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
"_target": "^1.2.0",

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

@ -0,0 +1,220 @@
.card {
text-transform: none;
background-color: transparent !important;
background: none !important;
margin: 0;
padding: 0;
display: block;
color: inherit !important;
box-shadow: none !important;
outline: none !important;
cursor: pointer;
contain: style;
}
.verticalItemsContainer .card {
contain: layout style;
}
.card, .card:focus {
font-weight: inherit !important;
}
button.card {
border: 0 !important;
font-size: inherit !important;
font-family: inherit !important;
}
.cardScalable {
position: relative;
}
.backdropCard .cardPadder, .smallBackdropCard .cardPadder, .overflowBackdropCard .cardPadder {
padding-bottom: 56.25%;
}
.squareCard .cardPadder {
padding-bottom: 100%;
}
.letterBoxCard .cardPadder {
padding-bottom: 75%;
}
.portraitCard .cardPadder {
padding-bottom: 150%;
}
.bannerCard .cardPadder {
padding-bottom: 18.5%;
}
.card .cardBox {
padding: 0 !important;
margin: 0;
transition: none !important;
border-radius: 0 !important;
border: 3px solid transparent;
will-change: transform;
/* Needed to keep the cardOverlayTarget from showing outside the bounds while it animates */
overflow: hidden;
}
.round .cardBox {
border: .7em solid transparent;
}
.round .cardImageContainer {
border: .15em solid transparent;
}
.card:focus {
position: relative !important;
z-index: 10 !important;
}
.card:focus .cardBox {
border-color: transparent;
}
.cardImageContainer, .round:focus .cardImageContainer {
border-color: #fff;
}
.round .cardBox {
transition: transform 180ms ease-out !important;
-webkit-transform-origin: center center;
transform-origin: center center;
}
.layout-tv .round:focus .cardBox {
transform: scale(1.34, 1.34);
}
/*.card[focused]:not(.noScale) .cardBox, .card:focus:not(.noScale) .cardBox {
animation:SHW .2s;
animation-fill-mode: both;
}*/
.dimunselected .card .cardImageContainer {
-webkit-filter: brightness(50%);
filter: brightness(50%);
transition: filter, -webkit-filter 600ms ease-out !important;
}
.dimunselected .card:focus .cardImageContainer {
-webkit-filter: initial;
filter: initial;
transition: filter, -webkit-filter 600ms ease-out !important;
}
.cardImageContainer {
background-size: contain;
background-repeat: no-repeat;
background-position: center bottom;
display: -ms-flex;
display: -webkit-flex;
display: flex;
align-items: center;
justify-content: center;
position: relative;
background-clip: content-box !important;
}
.scalableCard .cardImageContainer {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: auto !important;
height: auto !important;
}
.round .cardImageContainer, .round .cardImage {
border-radius: 1000px;
}
.cardImage.coveredImage, .cardImageContainer.coveredImage, .coveredImage .cardImage {
background-size: 100% 100%;
background-position: center center;
}
.coveredImage.noScale, .coveredImage.noScale .cardImage {
background-size: cover;
}
.cardFooter {
padding: .25em .25em;
}
.innerCardFooter {
background: rgba(0,0,0,.7);
position: absolute;
bottom: 0;
left: 0;
text-align: left;
z-index: 1;
overflow: hidden;
max-width: 100%;
}
.fullInnerCardFooter {
right: 0;
}
.cardText {
padding: .25em .35em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.cardText + .cardText {
padding-top: .1em;
}
.cardText {
color: inherit;
}
.innerCardFooter .cardText, .cardImageContainer .cardText {
color: #fff;
}
.cardCenteredText {
white-space: normal;
}
.cardImage {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-size: contain;
background-repeat: no-repeat;
background-position: center bottom;
}
.cardImageIcon {
width: 12vh;
height: 12vh;
font-size: 12vh;
color: #fff;
position: relative;
top: -8%;
}
.card .indicators {
right: .5vh;
top: .5vh;
position: absolute;
display: flex;
align-items: center;
}
.emptyCardImageContainer {
font-size: 90%;
}

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

@ -0,0 +1,836 @@
define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'mediaInfo', 'focusManager', 'indicators', 'globalize', 'emby-button', 'css!./card'],
function (datetime, imageLoader, connectionManager, itemHelper, mediaInfo, focusManager, indicators, globalize) {
function setShapeHorizontal(items, options) {
var primaryImageAspectRatio = imageLoader.getPrimaryImageAspectRatio(items) || 0;
if (primaryImageAspectRatio && primaryImageAspectRatio < .85) {
options.shape = 'portraitCard';
if (options.rows !== 0) {
options.rows = 2;
}
}
else if (primaryImageAspectRatio && primaryImageAspectRatio > 1.34) {
options.shape = 'backdropCard';
if (options.rows !== 0) {
options.rows = 3;
}
}
else {
options.shape = 'squareCard';
if (options.rows !== 0) {
options.rows = 3;
}
}
}
function setShapeVertical(items, options) {
var primaryImageAspectRatio = imageLoader.getPrimaryImageAspectRatio(items) || 0;
if (options.preferThumb) {
options.shape = 'backdropCard';
}
else if (primaryImageAspectRatio && primaryImageAspectRatio < .85) {
options.shape = 'portraitCard';
}
else if (primaryImageAspectRatio && primaryImageAspectRatio > 1.34) {
options.shape = 'backdropCard';
}
else {
options.shape = 'squareCard';
}
}
function setWidth(isVertical, options) {
if (options.width) {
return;
}
if (isVertical) {
if (options.shape == 'backdropCard') {
options.width = options.thumbWidth;
}
else if (options.shape == 'portraitCard') {
options.width = options.portraitWidth;
}
else if (options.shape == 'squareCard') {
options.width = options.squareWidth;
}
}
else {
if (options.shape == 'backdropCard') {
options.width = 500;
}
else if (options.shape == 'portraitCard') {
options.width = 243;
}
else if (options.shape == 'squareCard') {
options.width = 242;
}
}
}
function buildCardsHtml(items, options) {
var apiClient = connectionManager.currentApiClient();
var html = buildCardsHtmlInternal(items, apiClient, options);
return html;
}
function buildCardsHtmlInternal(items, apiClient, options) {
var isVertical;
if (options.shape == 'autoVertical') {
isVertical = true;
setShapeVertical(items, options);
}
else if (options.shape == 'auto') {
setShapeHorizontal(items, options);
}
setWidth(isVertical, options);
if (options.indexBy == 'Genres') {
return buildCardsByGenreHtmlInternal(items, apiClient, options);
}
var className = 'card';
if (options.shape) {
className += ' ' + options.shape;
}
var html = '';
var itemsInRow = 0;
var currentIndexValue;
var hasOpenRow;
var hasOpenSection;
for (var i = 0, length = items.length; i < length; i++) {
var item = items[i];
if (options.indexBy) {
var newIndexValue = '';
if (options.indexBy == 'PremiereDate') {
if (item.PremiereDate) {
try {
newIndexValue = getDisplayDateText(datetime.parseISO8601Date(item.PremiereDate));
} catch (err) {
}
}
}
else if (options.indexBy == 'Genres') {
newIndexValue = item.Name;
}
else if (options.indexBy == 'ProductionYear') {
newIndexValue = item.ProductionYear;
}
else if (options.indexBy == 'CommunityRating') {
newIndexValue = item.CommunityRating ? (Math.floor(item.CommunityRating) + (item.CommunityRating % 1 >= .5 ? .5 : 0)) + '+' : null;
}
if (newIndexValue != currentIndexValue) {
if (hasOpenRow) {
html += '</div>';
hasOpenRow = false;
itemsInRow = 0;
}
if (hasOpenSection) {
html += '</div>';
if (isVertical) {
html += '</div>';
}
hasOpenSection = false;
}
if (isVertical) {
html += '<div class="verticalSection">';
} else {
html += '<div class="horizontalSection">';
}
if (isVertical) {
html += '<h2>' + newIndexValue + '</h2>';
} else {
html += '<div class="sectionTitle">' + newIndexValue + '</div>';
}
if (isVertical) {
html += '<div class="itemsContainer verticalItemsContainer">';
}
currentIndexValue = newIndexValue;
hasOpenSection = true;
}
}
if (options.rows && itemsInRow == 0) {
if (hasOpenRow) {
html += '</div>';
hasOpenRow = false;
}
html += '<div class="cardColumn">';
hasOpenRow = true;
}
var cardClass = className;
html += buildCard(i, item, apiClient, options, cardClass);
itemsInRow++;
if (options.rows && itemsInRow >= options.rows) {
html += '</div>';
hasOpenRow = false;
itemsInRow = 0;
}
}
if (hasOpenRow) {
html += '</div>';
}
if (hasOpenSection) {
html += '</div>';
if (isVertical) {
html += '</div>';
}
}
return html;
}
function buildCardsByGenreHtmlInternal(items, apiClient, options) {
var className = 'card';
if (options.shape) {
className += ' ' + options.shape;
}
var html = '';
var loopItems = options.genres;
for (var i = 0, length = loopItems.length; i < length; i++) {
var item = loopItems[i];
var genreLower = item.Name.toLowerCase();
var renderItems = items.filter(function (currentItem) {
return currentItem.Genres.filter(function (g) {
return g.toLowerCase() == genreLower;
}).length > 0;
});
if (!renderItems.length) {
continue;
}
html += '<div class="horizontalSection focuscontainer-down">';
html += '<div class="sectionTitle">' + item.Name + '</div>';
var showMoreButton = false;
if (renderItems.length > options.indexLimit) {
renderItems.length = Math.min(renderItems.length, options.indexLimit);
showMoreButton = true;
}
var itemsInRow = 0;
var hasOpenRow = false;
var hasOpenSection = false;
html += renderItems.map(function (renderItem) {
var currentItemHtml = '';
if (options.rows && itemsInRow == 0) {
if (hasOpenRow) {
currentItemHtml += '</div>';
hasOpenRow = false;
}
currentItemHtml += '<div class="cardColumn">';
hasOpenRow = true;
}
var cardClass = className;
currentItemHtml += buildCard(i, renderItem, apiClient, options, cardClass);
itemsInRow++;
if (options.rows && itemsInRow >= options.rows) {
currentItemHtml += '</div>';
hasOpenRow = false;
itemsInRow = 0;
}
return currentItemHtml;
}).join('');
if (showMoreButton) {
html += '<div class="listItemsMoreButtonContainer">';
html += '<button is="emby-button" class="listItemsMoreButton raised" data-parentid="' + options.parentId + '" data-indextype="Genres" data-indexvalue="' + item.Id + '">' + globalize.translate('core#More') + '</button>';
html += '</div>';
}
html += '</div>';
html += '</div>';
}
return html;
}
function getDisplayDateText(date) {
var weekday = [];
weekday[0] = globalize.translate('core#OptionSunday');
weekday[1] = globalize.translate('core#OptionMonday');
weekday[2] = globalize.translate('core#OptionTuesday');
weekday[3] = globalize.translate('core#OptionWednesday');
weekday[4] = globalize.translate('core#OptionThursday');
weekday[5] = globalize.translate('core#OptionFriday');
weekday[6] = globalize.translate('core#OptionSaturday');
var day = weekday[date.getDay()];
date = date.toLocaleDateString();
if (date.toLowerCase().indexOf(day.toLowerCase()) == -1) {
return day + " " + date;
}
return date;
}
function getDesiredAspect(shape) {
if (shape) {
shape = shape.toLowerCase();
if (shape.indexOf('portrait') != -1) {
return (2 / 3);
}
if (shape.indexOf('backdrop') != -1) {
return (16 / 9);
}
if (shape.indexOf('square') != -1) {
return 1;
}
}
return null;
}
function getCardImageUrl(item, apiClient, options) {
var width = options.width;
var height = null;
var primaryImageAspectRatio = imageLoader.getPrimaryImageAspectRatio([item]);
var forceName = false;
var imgUrl = null;
var coverImage = false;
if (options.preferThumb && item.ImageTags && item.ImageTags.Thumb) {
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Thumb",
maxWidth: width,
tag: item.ImageTags.Thumb
});
} else if (options.preferBanner && item.ImageTags && item.ImageTags.Banner) {
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Banner",
maxWidth: width,
tag: item.ImageTags.Banner
});
} else if (options.preferThumb && item.SeriesThumbImageTag && options.inheritThumb !== false) {
imgUrl = apiClient.getScaledImageUrl(item.SeriesId, {
type: "Thumb",
maxWidth: width,
tag: item.SeriesThumbImageTag
});
} else if (options.preferThumb && item.ParentThumbItemId && options.inheritThumb !== false) {
imgUrl = apiClient.getScaledImageUrl(item.ParentThumbItemId, {
type: "Thumb",
maxWidth: width,
tag: item.ParentThumbImageTag
});
} else if (options.preferThumb && item.BackdropImageTags && item.BackdropImageTags.length) {
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Backdrop",
maxWidth: width,
tag: item.BackdropImageTags[0]
});
forceName = true;
} else if (item.ImageTags && item.ImageTags.Primary) {
height = width && primaryImageAspectRatio ? Math.round(width / primaryImageAspectRatio) : null;
imgUrl = apiClient.getImageUrl(item.Id, {
type: "Primary",
maxHeight: height,
maxWidth: width,
tag: item.ImageTags.Primary
});
if (options.preferThumb && options.showTitle !== false) {
forceName = true;
}
if (primaryImageAspectRatio) {
var uiAspect = getDesiredAspect(options.shape);
if (uiAspect) {
coverImage = Math.abs(primaryImageAspectRatio - uiAspect) <= .2;
}
}
} else if (item.PrimaryImageTag) {
height = width && primaryImageAspectRatio ? Math.round(width / primaryImageAspectRatio) : null;
imgUrl = apiClient.getImageUrl(item.Id || item.ItemId, {
type: "Primary",
maxHeight: height,
maxWidth: width,
tag: item.PrimaryImageTag
});
if (options.preferThumb && options.showTitle !== false) {
forceName = true;
}
if (primaryImageAspectRatio) {
var uiAspect = getDesiredAspect(options.shape);
if (uiAspect) {
coverImage = Math.abs(primaryImageAspectRatio - uiAspect) <= .2;
}
}
}
else if (item.ParentPrimaryImageTag) {
imgUrl = apiClient.getImageUrl(item.ParentPrimaryImageItemId, {
type: "Primary",
maxWidth: width,
tag: item.ParentPrimaryImageTag
});
}
else if (item.AlbumId && item.AlbumPrimaryImageTag) {
width = primaryImageAspectRatio ? Math.round(height * primaryImageAspectRatio) : null;
imgUrl = apiClient.getScaledImageUrl(item.AlbumId, {
type: "Primary",
maxHeight: height,
maxWidth: width,
tag: item.AlbumPrimaryImageTag
});
if (primaryImageAspectRatio) {
var uiAspect = getDesiredAspect(options.shape);
if (uiAspect) {
coverImage = Math.abs(primaryImageAspectRatio - uiAspect) <= .2;
}
}
}
else if (item.Type == 'Season' && item.ImageTags && item.ImageTags.Thumb) {
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Thumb",
maxWidth: width,
tag: item.ImageTags.Thumb
});
}
else if (item.BackdropImageTags && item.BackdropImageTags.length) {
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Backdrop",
maxWidth: width,
tag: item.BackdropImageTags[0]
});
} else if (item.ImageTags && item.ImageTags.Thumb) {
imgUrl = apiClient.getScaledImageUrl(item.Id, {
type: "Thumb",
maxWidth: width,
tag: item.ImageTags.Thumb
});
} else if (item.SeriesThumbImageTag) {
imgUrl = apiClient.getScaledImageUrl(item.SeriesId, {
type: "Thumb",
maxWidth: width,
tag: item.SeriesThumbImageTag
});
} else if (item.ParentThumbItemId) {
imgUrl = apiClient.getThumbImageUrl(item.ParentThumbItemId, {
type: "Thumb",
maxWidth: width,
tag: item.ParentThumbImageTag
});
}
return {
imgUrl: imgUrl,
forceName: forceName,
coverImage: coverImage
};
}
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
function buildCard(index, item, apiClient, options, className) {
className += " itemAction";
if (options.scalable) {
className += " scalableCard";
}
var imgInfo = getCardImageUrl(item, apiClient, options);
var imgUrl = imgInfo.imgUrl;
var cardImageContainerClass = 'cardImageContainer';
if (options.coverImage || imgInfo.coverImage) {
cardImageContainerClass += ' coveredImage';
if (item.MediaType == 'Photo' || item.Type == 'PhotoAlbum' || item.Type == 'Folder') {
cardImageContainerClass += ' noScale';
}
}
if (!imgUrl) {
cardImageContainerClass += ' emptyCardImageContainer defaultCardColor' + getRandomInt(1, 5);
}
var separateCardBox = options.scalable;
if (!separateCardBox) {
cardImageContainerClass += " cardBox";
}
// cardBox can be it's own separate element if an outer footer is ever needed
var cardImageContainerOpen = imgUrl ? ('<div class="' + cardImageContainerClass + ' lazy" data-src="' + imgUrl + '">') : ('<div class="' + cardImageContainerClass + '">');
var cardImageContainerClose = '</div>';
if (separateCardBox) {
cardImageContainerOpen = '<div class="cardBox"><div class="cardScalable"><div class="cardPadder"></div><div class="cardContent">' + cardImageContainerOpen;
cardImageContainerClose += '</div></div></div>';
}
var indicatorsHtml = '';
indicatorsHtml += indicators.getTimerIndicator(item);
if (options.showGroupCount) {
indicatorsHtml += indicators.getChildCountIndicatorHtml(item, {
minCount: 1
});
}
else {
indicatorsHtml += indicators.getPlayedIndicatorHtml(item);
}
if (indicatorsHtml) {
cardImageContainerOpen += '<div class="indicators">' + indicatorsHtml + '</div>';
}
var showTitle = options.showTitle || imgInfo.forceName || item.Type == 'PhotoAlbum';
var showParentTitle = options.showParentTitle || (imgInfo.forceName && item.Type == 'Episode');
if (!imgUrl) {
var defaultName = item.EpisodeTitle ? item.Name : itemHelper.getDisplayName(item);
cardImageContainerOpen += '<div class="cardText cardCenteredText">' + defaultName + '</div>';
}
var nameHtml = '';
if (showParentTitle) {
nameHtml += '<div class="cardText">' + (item.EpisodeTitle ? item.Name : (item.SeriesName || item.Album || item.AlbumArtist || item.GameSystem || "")) + '</div>';
}
if (showTitle) {
var nameClass = 'cardText';
nameHtml += '<div class="' + nameClass + '">' + itemHelper.getDisplayName(item) + '</div>';
}
var innerCardFooterClass = 'innerCardFooter';
var progressHtml = indicators.getProgressBarHtml(item);
if (progressHtml) {
nameHtml += progressHtml;
innerCardFooterClass += " fullInnerCardFooter";
}
var innerCardFooter = '';
if (nameHtml && imgUrl) {
innerCardFooter += '<div class="' + innerCardFooterClass + '">';
innerCardFooter += nameHtml;
innerCardFooter += '</div>';
}
var data = '';
var action = options.action || 'link';
var tagName = 'button';
var prefix = (item.SortName || item.Name || '')[0];
if (prefix) {
prefix = prefix.toUpperCase();
}
var timerAttributes = '';
if (item.TimerId) {
timerAttributes += ' data-timerid="' + item.TimerId + '"';
}
if (item.SeriesTimerId) {
timerAttributes += ' data-seriestimerid="' + item.SeriesTimerId + '"';
}
var positionTicksData = item.UserData && item.UserData.PlaybackPositionTicks ? (' data-positionticks="' + item.UserData.PlaybackPositionTicks + '"') : '';
var collectionIdData = options.collectionId ? (' data-collectionid="' + options.collectionId + '"') : '';
var playlistIdData = options.playlistId ? (' data-playlistid="' + options.playlistId + '"') : '';
return '\
<' + tagName + ' data-index="' + index + '"' + timerAttributes + ' data-action="' + action + '" data-isfolder="' + (item.IsFolder || false) + '" data-serverid="' + (item.ServerId) + '" data-id="' + (item.Id || item.ItemId) + '" data-type="' + item.Type + '" data-mediatype="' + item.MediaType + '"' + positionTicksData + collectionIdData + playlistIdData + ' data-prefix="' + prefix + '" class="' + className + '"> \
' + cardImageContainerOpen + innerCardFooter + data + cardImageContainerClose + '\
</' + tagName + '>';
}
function buildCards(items, options) {
// Abort if the container has been disposed
if (!document.body.contains(options.itemsContainer)) {
return;
}
if (options.parentContainer) {
if (items.length) {
options.parentContainer.classList.remove('hide');
} else {
options.parentContainer.classList.add('hide');
return;
}
}
var apiClient = connectionManager.currentApiClient();
var html = buildCardsHtmlInternal(items, apiClient, options);
if (html) {
if (options.itemsContainer.cardBuilderHtml != html) {
options.itemsContainer.innerHTML = html;
if (items.length < 50) {
options.itemsContainer.cardBuilderHtml = html;
} else {
options.itemsContainer.cardBuilderHtml = null;
}
}
imageLoader.lazyChildren(options.itemsContainer);
} else {
options.itemsContainer.innerHTML = html;
options.itemsContainer.cardBuilderHtml = null;
}
if (options.autoFocus) {
focusManager.autoFocus(options.itemsContainer, true);
}
if (options.indexBy == 'Genres') {
options.itemsContainer.addEventListener('click', onItemsContainerClick);
}
}
function parentWithClass(elem, className) {
while (!elem.classList || !elem.classList.contains(className)) {
elem = elem.parentNode;
if (!elem) {
return null;
}
}
return elem;
}
function onItemsContainerClick(e) {
var listItemsMoreButton = parentWithClass(e.target, 'listItemsMoreButton');
if (listItemsMoreButton) {
var value = listItemsMoreButton.getAttribute('data-indexvalue');
var parentid = listItemsMoreButton.getAttribute('data-parentid');
Emby.Page.showGenre({
ParentId: parentid,
Id: value
});
}
}
function ensureIndicators(card, indicatorsElem) {
if (indicatorsElem) {
return indicatorsElem;
}
indicatorsElem = card.querySelector('.indicators');
if (!indicatorsElem) {
var cardImageContainer = card.querySelector('.cardImageContainer');
indicatorsElem = document.createElement('div');
indicatorsElem.classList.add('indicators');
cardImageContainer.appendChild(indicatorsElem);
}
return indicatorsElem;
}
function updateUserData(card, userData) {
var type = card.getAttribute('data-type');
var enableCountIndicator = type == 'Series' || type == 'BoxSet' || type == 'Season';
var indicatorsElem;
if (userData.Played) {
var playedIndicator = card.querySelector('.playedIndicator');
if (!playedIndicator) {
playedIndicator = document.createElement('div');
playedIndicator.classList.add('playedIndicator');
indicatorsElem = ensureIndicators(card, indicatorsElem);
indicatorsElem.appendChild(playedIndicator);
}
playedIndicator.innerHTML = '<i class="md-icon">check</i>';
} else {
var playedIndicator = card.querySelector('.playedIndicator');
if (playedIndicator) {
playedIndicator.parentNode.removeChild(playedIndicator);
}
}
if (userData.UnplayedItemCount) {
var countIndicator = card.querySelector('.countIndicator');
if (!countIndicator) {
countIndicator = document.createElement('div');
countIndicator.classList.add('countIndicator');
indicatorsElem = ensureIndicators(card, indicatorsElem);
indicatorsElem.appendChild(countIndicator);
}
countIndicator.innerHTML = userData.UnplayedItemCount;
} else if (enableCountIndicator) {
var countIndicator = card.querySelector('.countIndicator');
if (countIndicator) {
countIndicator.parentNode.removeChild(countIndicator);
}
}
var progressHtml = indicators.getProgressBarHtml({
Type: type,
UserData: userData,
MediaType: 'Video'
});
if (progressHtml) {
var itemProgressBar = card.querySelector('.itemProgressBar');
if (!itemProgressBar) {
itemProgressBar = document.createElement('div');
itemProgressBar.classList.add('itemProgressBar');
var innerCardFooter = card.querySelector('.innerCardFooter');
if (!innerCardFooter) {
innerCardFooter = document.createElement('div');
innerCardFooter.classList.add('innerCardFooter');
var cardImageContainer = card.querySelector('.cardImageContainer');
cardImageContainer.appendChild(innerCardFooter);
}
innerCardFooter.appendChild(itemProgressBar);
}
itemProgressBar.innerHTML = progressHtml;
}
else {
var itemProgressBar = card.querySelector('.itemProgressBar');
if (itemProgressBar) {
itemProgressBar.parentNode.removeChild(itemProgressBar);
}
}
}
function onUserDataChanged(userData) {
var cards = document.querySelectorAll('.card[data-id="' + userData.ItemId + '"]');
for (var i = 0, length = cards.length; i < length; i++) {
updateUserData(cards[i], userData);
}
}
return {
buildCardsHtml: buildCardsHtml,
buildCards: buildCards,
onUserDataChanged: onUserDataChanged
};
});

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

@ -0,0 +1,115 @@
define(['datetime', 'imageLoader', 'itemShortcuts'], function (datetime, imageLoader, itemShortcuts) {
function buildChapterCardsHtml(item, chapters, options) {
var className = 'card scalableCard itemAction chapterCard';
var mediaStreams = ((item.MediaSources || [])[0] || {}).MediaStreams || [];
var videoStream = mediaStreams.filter(function (i) {
return i.Type == 'Video';
})[0] || {};
var shape = 'backdropCard';
if (videoStream.Width && videoStream.Height) {
if ((videoStream.Width / videoStream.Height) <= 1.34) {
shape = 'squareCard';
}
}
className += ' ' + shape;
if (options.block || options.rows) {
className += ' block';
}
var html = '';
var itemsInRow = 0;
for (var i = 0, length = chapters.length; i < length; i++) {
if (options.rows && itemsInRow == 0) {
html += '<div class="cardColumn">';
}
var chapter = chapters[i];
html += buildChapterCard(item, chapter, options, className);
itemsInRow++;
if (options.rows && itemsInRow >= options.rows) {
itemsInRow = 0;
html += '</div>';
}
}
return html;
}
function buildChapterCard(item, chapter, options, className) {
var imgUrl = chapter.images ? chapter.images.primary : '';
var cardImageContainerClass = 'cardImageContainer';
if (options.coverImage) {
cardImageContainerClass += ' coveredImage';
}
var dataAttributes = ' data-action="play" data-isfolder="' + item.IsFolder + '" data-id="' + item.Id + '" data-serverid="' + item.ServerId + '" data-type="' + item.Type + '" data-mediatype="' + item.MediaType + '" data-positionticks="' + chapter.StartPositionTicks + '"';
var cardImageContainer = imgUrl ? ('<div class="' + cardImageContainerClass + ' lazy" data-src="' + imgUrl + '">') : ('<div class="' + cardImageContainerClass + '">');
var nameHtml = '';
nameHtml += '<div class="cardText">' + chapter.Name + '</div>';
nameHtml += '<div class="cardText">' + datetime.getDisplayRunningTime(chapter.StartPositionTicks) + '</div>';
var html = '\
<button type="button" class="' + className + '"' + dataAttributes + '> \
<div class="cardBox">\
<div class="cardScalable">\
<div class="cardPadder"></div>\
<div class="cardContent">\
' + cardImageContainer + '\
</div>\
<div class="innerCardFooter">\
' + nameHtml + '\
</div>\
</div>\
</div>\
</div>\
</button>'
;
return html;
}
function buildChapterCards(item, chapters, options) {
// Abort if the container has been disposed
if (!document.body.contains(options.parentContainer)) {
return;
}
if (options.parentContainer) {
if (chapters.length) {
options.parentContainer.classList.remove('hide');
} else {
options.parentContainer.classList.add('hide');
return;
}
}
var html = buildChapterCardsHtml(item, chapters, options);
options.itemsContainer.innerHTML = html;
imageLoader.lazyChildren(options.itemsContainer);
itemShortcuts.off(options.itemsContainer);
itemShortcuts.on(options.itemsContainer);
}
return {
buildChapterCards: buildChapterCards
};
});

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

@ -0,0 +1,110 @@
define(['imageLoader', 'itemShortcuts'], function (imageLoader, itemShortcuts) {
function buildPeopleCardsHtml(people, options) {
var className = 'card portraitCard personCard';
if (options.block || options.rows) {
className += ' block';
}
var html = '';
var itemsInRow = 0;
var serverId = options.serverId;
for (var i = 0, length = people.length; i < length; i++) {
if (options.rows && itemsInRow == 0) {
html += '<div class="cardColumn">';
}
var person = people[i];
html += buildPersonCard(person, serverId, options, className);
itemsInRow++;
if (options.rows && itemsInRow >= options.rows) {
itemsInRow = 0;
html += '</div>';
}
}
return html;
}
function buildPersonCard(person, serverId, options, className) {
className += " itemAction scalableCard";
var imgUrl = person.images ? person.images.primary : '';
var cardImageContainerClass = 'cardImageContainer';
if (options.coverImage) {
cardImageContainerClass += ' coveredImage';
}
var cardImageContainer = imgUrl ? ('<div class="' + cardImageContainerClass + ' lazy" data-src="' + imgUrl + '">') : ('<div class="' + cardImageContainerClass + '">');
var nameHtml = '';
nameHtml += '<div class="cardText">' + person.Name + '</div>';
if (person.Role) {
nameHtml += '<div class="cardText">as ' + person.Role + '</div>';
}
else if (person.Type) {
nameHtml += '<div class="cardText">' + Globalize.translate('core#' + person.Type) + '</div>';
} else {
nameHtml += '<div class="cardText">&nbsp;</div>';
}
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 + '"> \
<div class="cardBox">\
<div class="cardScalable">\
<div class="cardPadder"></div>\
<div class="cardContent">\
' + cardImageContainer + '\
</div>\
</div>\
</div>\
<div class="cardFooter">\
' + nameHtml + '\
</div>\
</div>\
</button>'
;
return html;
}
function buildPeopleCards(items, options) {
// Abort if the container has been disposed
if (!document.body.contains(options.parentContainer)) {
return;
}
if (options.parentContainer) {
if (items.length) {
options.parentContainer.classList.remove('hide');
} else {
options.parentContainer.classList.add('hide');
return;
}
}
var html = buildPeopleCardsHtml(items, options);
options.itemsContainer.innerHTML = html;
imageLoader.lazyChildren(options.itemsContainer);
itemShortcuts.off(options.itemsContainer);
itemShortcuts.on(options.itemsContainer);
}
return {
buildPeopleCards: buildPeopleCards
};
});

3
dashboard-ui/bower_components/emby-webcomponents/listview/listview.js vendored
View file

@ -196,9 +196,8 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan
var positionTicksData = item.UserData && item.UserData.PlaybackPositionTicks ? (' data-positionticks="' + item.UserData.PlaybackPositionTicks + '"') : '';
var collectionIdData = options.collectionId ? (' data-collectionid="' + options.collectionId + '"') : '';
var playlistIdData = options.playlistId ? (' data-playlistid="' + options.playlistId + '"') : '';
var seriesIdData = item.SeriesId ? (' data-seriesid="' + item.SeriesId + '"') : '';
html += '<' + outerTagName + ' class="' + cssClass + '" data-index="' + i + '"' + playlistItemId + ' data-action="' + action + '" data-isfolder="' + item.IsFolder + '" data-id="' + item.Id + '" data-serverid="' + item.ServerId + '" data-mediatype="' + item.MediaType + '" data-type="' + item.Type + '"' + positionTicksData + collectionIdData + playlistIdData + seriesIdData + '>';
html += '<' + outerTagName + ' class="' + cssClass + '" data-index="' + i + '"' + playlistItemId + ' data-action="' + action + '" data-isfolder="' + item.IsFolder + '" data-id="' + item.Id + '" data-serverid="' + item.ServerId + '" data-mediatype="' + item.MediaType + '" data-type="' + item.Type + '"' + positionTicksData + collectionIdData + playlistIdData + '>';
if (!clickEntireItem && options.dragHandle) {
html += '<button is="paper-icon-button-light" class="listViewDragHandle autoSize"><i class="md-icon">&#xE25D;</i></button>';

9
dashboard-ui/bower_components/emby-webcomponents/playmenu.js vendored
View file

@ -15,20 +15,13 @@ define(['actionsheet', 'datetime', 'playbackManager', 'globalize', 'appSettings'
var resumePositionTicks = item.UserData ? item.UserData.PlaybackPositionTicks : null;
var showExternalPlayer = isMobileApp && mediaType == 'Video' && !isFolder && appSettings.enableExternalPlayers();
var playableItemId = itemType == 'Program' ? channelId : itemId;
if (!resumePositionTicks && mediaType != "Audio" && !isFolder && !showExternalPlayer) {
if (itemType == 'Program') {
playbackManager.play({
ids: [channelId],
ids: [playableItemId],
serverId: serverId
});
} else {
playbackManager.play({
items: [item]
});
}
return;
}

6
dashboard-ui/bower_components/polymer/.bower.json vendored
View file

@ -31,14 +31,14 @@
"web-component-tester": "*"
},
"private": true,
"homepage": "https://github.com/Polymer/polymer",
"homepage": "https://github.com/polymer/polymer",
"_release": "1.6.0",
"_resolution": {
"type": "version",
"tag": "v1.6.0",
"commit": "8715c83bf04a228de00ec662ed43eb6141e61b91"
},
"_source": "git://github.com/Polymer/polymer.git",
"_source": "git://github.com/polymer/polymer.git",
"_target": "^1.1.0",
"_originalSource": "Polymer/polymer"
"_originalSource": "polymer/polymer"
}

7
dashboard-ui/scripts/librarybrowser.js
View file

@ -802,13 +802,6 @@
});
}
if (item.SeriesId) {
atts.push({
name: 'seriesid',
value: item.SeriesId
});
}
if (options.collectionId) {
atts.push({
name: 'collectionid',

5
dashboard-ui/scripts/site.js
View file

@ -1429,6 +1429,11 @@ var AppInfo = {};
define("backdrop", [embyWebComponentsBowerPath + "/backdrop/backdrop"], returnFirstDependency);
define("fetchHelper", [embyWebComponentsBowerPath + "/fetchhelper"], returnFirstDependency);
define("cardStyle", ['css!' + embyWebComponentsBowerPath + "/cardbuilder/card"], returnFirstDependency);
define("cardBuilder", [embyWebComponentsBowerPath + "/cardbuilder/cardbuilder"], returnFirstDependency);
define("peoplecardbuilder", [embyWebComponentsBowerPath + "/cardbuilder/peoplecardbuilder"], returnFirstDependency);
define("chaptercardbuilder", [embyWebComponentsBowerPath + "/cardbuilder/chaptercardbuilder"], returnFirstDependency);
define("tvguide", [embyWebComponentsBowerPath + "/guide/guide", 'embyRouter'], returnFirstDependency);
define("voiceDialog", [embyWebComponentsBowerPath + "/voice/voicedialog"], returnFirstDependency);
define("voiceReceiver", [embyWebComponentsBowerPath + "/voice/voicereceiver"], returnFirstDependency);