update components
This commit is contained in:
parent
e305bf40c8
commit
b4f87ddb3a
8 changed files with 52 additions and 36 deletions
|
@ -15,12 +15,12 @@
|
||||||
},
|
},
|
||||||
"devDependencies": {},
|
"devDependencies": {},
|
||||||
"ignore": [],
|
"ignore": [],
|
||||||
"version": "1.4.97",
|
"version": "1.4.98",
|
||||||
"_release": "1.4.97",
|
"_release": "1.4.98",
|
||||||
"_resolution": {
|
"_resolution": {
|
||||||
"type": "version",
|
"type": "version",
|
||||||
"tag": "1.4.97",
|
"tag": "1.4.98",
|
||||||
"commit": "8b11aa9b8f073cbcd9eacf3170efce38d43a5526"
|
"commit": "6e0ce46f8c48908f94a7f32e95fee78b994c16f5"
|
||||||
},
|
},
|
||||||
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
|
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
|
||||||
"_target": "^1.2.0",
|
"_target": "^1.2.0",
|
||||||
|
|
|
@ -58,8 +58,12 @@
|
||||||
height: 3.8vh;
|
height: 3.8vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.layout-tv .playedIndicator i {
|
.layout-tv .countIndicator {
|
||||||
width: 2.6vh;
|
font-size: 80%;
|
||||||
height: 2.6vh;
|
}
|
||||||
font-size: 2.6vh;
|
|
||||||
}
|
.layout-tv .playedIndicator i {
|
||||||
|
width: 2.6vh;
|
||||||
|
height: 2.6vh;
|
||||||
|
font-size: 2.6vh;
|
||||||
|
}
|
||||||
|
|
|
@ -120,7 +120,7 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper', 'embyRouter',
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
if (options.playAllFromHere) {
|
if (options.playAllFromHere && item.Type != 'Program' && item.Type != 'TvChannel') {
|
||||||
commands.push({
|
commands.push({
|
||||||
name: globalize.translate('sharedcomponents#PlayAllFromHere'),
|
name: globalize.translate('sharedcomponents#PlayAllFromHere'),
|
||||||
id: 'playallfromhere'
|
id: 'playallfromhere'
|
||||||
|
|
|
@ -7,11 +7,14 @@
|
||||||
background-color: rgba(0, 0, 0, .85);
|
background-color: rgba(0, 0, 0, .85);
|
||||||
z-index: 998;
|
z-index: 998;
|
||||||
line-height: initial;
|
line-height: initial;
|
||||||
|
font-size: initial;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cardOverlayInner {
|
.cardOverlayInner {
|
||||||
padding: 11px 12px 10px;
|
padding: .5em;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
text-align: left;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.cardOverlayInner button:last-child {
|
.cardOverlayInner button:last-child {
|
||||||
|
|
|
@ -47,7 +47,7 @@
|
||||||
var keyframes = [
|
var keyframes = [
|
||||||
{ transform: 'translateY(0)', offset: 0 },
|
{ transform: 'translateY(0)', offset: 0 },
|
||||||
{ transform: 'translateY(100%)', offset: 1 }];
|
{ transform: 'translateY(100%)', offset: 1 }];
|
||||||
var timing = { duration: 300, iterations: 1, fill: 'forwards', easing: 'ease-out' };
|
var timing = { duration: 180, iterations: 1, fill: 'forwards', easing: 'ease-out' };
|
||||||
|
|
||||||
elem.animate(keyframes, timing).onfinish = function () {
|
elem.animate(keyframes, timing).onfinish = function () {
|
||||||
elem.classList.add('hide');
|
elem.classList.add('hide');
|
||||||
|
@ -72,12 +72,12 @@
|
||||||
var keyframes = [
|
var keyframes = [
|
||||||
{ transform: 'translateY(100%)', offset: 0 },
|
{ transform: 'translateY(100%)', offset: 0 },
|
||||||
{ transform: 'translateY(0)', offset: 1 }];
|
{ transform: 'translateY(0)', offset: 1 }];
|
||||||
var timing = { duration: 300, iterations: 1, fill: 'forwards', easing: 'ease-out' };
|
var timing = { duration: 200, iterations: 1, fill: 'forwards', easing: 'ease-out' };
|
||||||
elem.animate(keyframes, timing);
|
elem.animate(keyframes, timing);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function getOverlayHtml(item, currentUser, card) {
|
function getOverlayHtml(apiClient, item, currentUser, card) {
|
||||||
|
|
||||||
var html = '';
|
var html = '';
|
||||||
|
|
||||||
|
@ -93,12 +93,12 @@
|
||||||
var name = itemHelper.getDisplayName(item);
|
var name = itemHelper.getDisplayName(item);
|
||||||
|
|
||||||
html += '<div>';
|
html += '<div>';
|
||||||
var logoHeight = isSmallItem || isMiniItem ? 20 : 26;
|
var logoHeight = 26;
|
||||||
var imgUrl;
|
var imgUrl;
|
||||||
|
|
||||||
if (parentName && item.ParentLogoItemId) {
|
if (parentName && item.ParentLogoItemId) {
|
||||||
|
|
||||||
imgUrl = ApiClient.getScaledImageUrl(item.ParentLogoItemId, {
|
imgUrl = apiClient.getScaledImageUrl(item.ParentLogoItemId, {
|
||||||
maxHeight: logoHeight,
|
maxHeight: logoHeight,
|
||||||
type: 'logo',
|
type: 'logo',
|
||||||
tag: item.ParentLogoImageTag
|
tag: item.ParentLogoImageTag
|
||||||
|
@ -109,7 +109,7 @@
|
||||||
}
|
}
|
||||||
else if (item.ImageTags.Logo) {
|
else if (item.ImageTags.Logo) {
|
||||||
|
|
||||||
imgUrl = ApiClient.getScaledImageUrl(item.Id, {
|
imgUrl = apiClient.getScaledImageUrl(item.Id, {
|
||||||
maxHeight: logoHeight,
|
maxHeight: logoHeight,
|
||||||
type: 'logo',
|
type: 'logo',
|
||||||
tag: item.ImageTags.Logo
|
tag: item.ImageTags.Logo
|
||||||
|
@ -179,18 +179,17 @@
|
||||||
|
|
||||||
function onShowTimerExpired(elem) {
|
function onShowTimerExpired(elem) {
|
||||||
|
|
||||||
elem = elem.querySelector('a');
|
|
||||||
|
|
||||||
var innerElem = elem.querySelector('.cardOverlayTarget');
|
var innerElem = elem.querySelector('.cardOverlayTarget');
|
||||||
|
|
||||||
if (!innerElem) {
|
if (!innerElem) {
|
||||||
innerElem = document.createElement('div');
|
innerElem = document.createElement('div');
|
||||||
innerElem.classList.add('hide');
|
innerElem.classList.add('hide');
|
||||||
innerElem.classList.add('cardOverlayTarget');
|
innerElem.classList.add('cardOverlayTarget');
|
||||||
parentWithClass(elem, 'cardContent').appendChild(innerElem);
|
|
||||||
|
(elem.querySelector('.cardContent') || elem.querySelector('.cardBox')).appendChild(innerElem);
|
||||||
}
|
}
|
||||||
|
|
||||||
var dataElement = parentWithAttribute(elem, 'data-id');
|
var dataElement = elem;
|
||||||
|
|
||||||
var id = dataElement.getAttribute('data-id');
|
var id = dataElement.getAttribute('data-id');
|
||||||
var type = dataElement.getAttribute('data-type');
|
var type = dataElement.getAttribute('data-type');
|
||||||
|
@ -212,9 +211,7 @@
|
||||||
|
|
||||||
var card = elem;
|
var card = elem;
|
||||||
|
|
||||||
elem = parentWithAttribute(elem, 'data-id');
|
innerElem.innerHTML = getOverlayHtml(apiClient, item, user, card);
|
||||||
|
|
||||||
innerElem.innerHTML = getOverlayHtml(item, user, card);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
slideUpToShow(innerElem);
|
slideUpToShow(innerElem);
|
||||||
|
@ -223,8 +220,15 @@
|
||||||
function onHoverIn(e) {
|
function onHoverIn(e) {
|
||||||
|
|
||||||
var elem = e.target;
|
var elem = e.target;
|
||||||
|
var card = parentWithClass(elem, 'card');
|
||||||
|
|
||||||
if (!elem.classList.contains('cardImage')) {
|
if (!card) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
elem = card.querySelector('.cardImage,.cardImageContainer');
|
||||||
|
|
||||||
|
if (!elem) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -243,7 +247,7 @@
|
||||||
showOverlayTimeout = setTimeout(function () {
|
showOverlayTimeout = setTimeout(function () {
|
||||||
onShowTimerExpired(elem);
|
onShowTimerExpired(elem);
|
||||||
|
|
||||||
}, 1200);
|
}, 1000);
|
||||||
}
|
}
|
||||||
|
|
||||||
function preventTouchHover() {
|
function preventTouchHover() {
|
||||||
|
|
|
@ -14,10 +14,9 @@
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
height: 50px;
|
|
||||||
background: #43A047;
|
background: #43A047;
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
padding: 0 .75em 0 .25em;
|
padding: .5em;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
|
|
@ -131,7 +131,7 @@
|
||||||
itemSelectionPanel = document.createElement('div');
|
itemSelectionPanel = document.createElement('div');
|
||||||
itemSelectionPanel.classList.add('itemSelectionPanel');
|
itemSelectionPanel.classList.add('itemSelectionPanel');
|
||||||
|
|
||||||
item.querySelector('.cardContent').appendChild(itemSelectionPanel);
|
item.querySelector('.cardContent,.cardBox').appendChild(itemSelectionPanel);
|
||||||
|
|
||||||
var cssClass = 'chkItemSelect';
|
var cssClass = 'chkItemSelect';
|
||||||
if (isChecked && !browser.firefox) {
|
if (isChecked && !browser.firefox) {
|
||||||
|
@ -416,8 +416,7 @@
|
||||||
|
|
||||||
require(['alert'], function (alert) {
|
require(['alert'], function (alert) {
|
||||||
alert({
|
alert({
|
||||||
text: globalize.translate('sharedcomponents#PleaseSelectTwoItems'),
|
text: globalize.translate('sharedcomponents#PleaseSelectTwoItems')
|
||||||
title: globalize.translate('sharedcomponents#Error')
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
return;
|
return;
|
||||||
|
|
|
@ -974,13 +974,13 @@ define(['browser', 'layoutManager', 'scrollStyles'], function (browser, layoutMa
|
||||||
|
|
||||||
if (!transform) {
|
if (!transform) {
|
||||||
if (o.horizontal) {
|
if (o.horizontal) {
|
||||||
if (layoutManager.desktop && o.hiddenScroll === false) {
|
if (layoutManager.desktop) {
|
||||||
slideeElement.classList.add('smoothScrollX');
|
slideeElement.classList.add('smoothScrollX');
|
||||||
} else {
|
} else {
|
||||||
slideeElement.classList.add('hiddenScrollX');
|
slideeElement.classList.add('hiddenScrollX');
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
if (layoutManager.desktop && o.hiddenScroll === false) {
|
if (layoutManager.desktop) {
|
||||||
slideeElement.classList.add('smoothScrollY');
|
slideeElement.classList.add('smoothScrollY');
|
||||||
} else {
|
} else {
|
||||||
slideeElement.classList.add('hiddenScrollY');
|
slideeElement.classList.add('hiddenScrollY');
|
||||||
|
@ -990,9 +990,6 @@ define(['browser', 'layoutManager', 'scrollStyles'], function (browser, layoutMa
|
||||||
slideeElement.style['will-change'] = 'transform';
|
slideeElement.style['will-change'] = 'transform';
|
||||||
}
|
}
|
||||||
|
|
||||||
// Scrolling navigation
|
|
||||||
scrollSource.addEventListener(wheelEvent, scrollHandler);
|
|
||||||
|
|
||||||
if (transform) {
|
if (transform) {
|
||||||
dragInitEventNames.forEach(function (eventName) {
|
dragInitEventNames.forEach(function (eventName) {
|
||||||
dragSourceElement.addEventListener(eventName, dragInitSlidee);
|
dragSourceElement.addEventListener(eventName, dragInitSlidee);
|
||||||
|
@ -1007,6 +1004,16 @@ define(['browser', 'layoutManager', 'scrollStyles'], function (browser, layoutMa
|
||||||
passive: true
|
passive: true
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Scrolling navigation
|
||||||
|
scrollSource.addEventListener(wheelEvent, scrollHandler);
|
||||||
|
|
||||||
|
} else if (o.horizontal) {
|
||||||
|
|
||||||
|
// Don't bind to mouse events with vertical scroll since the mouse wheel can handle this natively
|
||||||
|
|
||||||
|
// Scrolling navigation
|
||||||
|
scrollSource.addEventListener(wheelEvent, scrollHandler);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Mark instance as initialized
|
// Mark instance as initialized
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue