update list views
This commit is contained in:
parent
cbf80fb548
commit
aaf5037d13
14 changed files with 164 additions and 70 deletions
|
@ -15,12 +15,12 @@
|
|||
},
|
||||
"devDependencies": {},
|
||||
"ignore": [],
|
||||
"version": "1.4.84",
|
||||
"_release": "1.4.84",
|
||||
"version": "1.4.85",
|
||||
"_release": "1.4.85",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "1.4.84",
|
||||
"commit": "15bfe5a5a9ca97a96f3f30c76dd463266f66e290"
|
||||
"tag": "1.4.85",
|
||||
"commit": "02ae5393a31e8266eb52f0e1a6471b9da8f964c7"
|
||||
},
|
||||
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
|
||||
"_target": "^1.2.0",
|
||||
|
|
|
@ -1,12 +1,74 @@
|
|||
define(['itemShortcuts', 'registerElement'], function (itemShortcuts) {
|
||||
define(['itemShortcuts', 'connectionManager', 'registerElement'], function (itemShortcuts, connectionManager) {
|
||||
|
||||
var ItemsContainerProtoType = Object.create(HTMLDivElement.prototype);
|
||||
|
||||
function parentWithClass(elem, className) {
|
||||
|
||||
while (!elem.classList || !elem.classList.contains(className)) {
|
||||
elem = elem.parentNode;
|
||||
|
||||
if (!elem) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
return elem;
|
||||
}
|
||||
|
||||
function parentWithAttribute(elem, name) {
|
||||
|
||||
while (!elem.getAttribute(name)) {
|
||||
elem = elem.parentNode;
|
||||
|
||||
if (!elem) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
return elem;
|
||||
}
|
||||
|
||||
function getItem(button) {
|
||||
|
||||
button = parentWithAttribute(button, 'data-id');
|
||||
var serverId = button.getAttribute('data-serverid');
|
||||
var id = button.getAttribute('data-id');
|
||||
|
||||
var apiClient = connectionManager.getApiClient(serverId);
|
||||
|
||||
return apiClient.getItem(apiClient.getCurrentUserId(), id);
|
||||
}
|
||||
|
||||
function showContextMenu(button) {
|
||||
|
||||
getItem(button).then(function (item) {
|
||||
|
||||
require(['itemContextMenu'], function (itemContextMenu) {
|
||||
itemContextMenu.show({
|
||||
positionTo: button,
|
||||
item: item
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function onClick(e) {
|
||||
|
||||
var menuButton = parentWithClass(e.target, 'menuButton');
|
||||
if (menuButton) {
|
||||
showContextMenu(menuButton);
|
||||
e.stopPropagation();
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
ItemsContainerProtoType.attachedCallback = function () {
|
||||
this.addEventListener('click', onClick);
|
||||
itemShortcuts.on(this);
|
||||
};
|
||||
|
||||
ItemsContainerProtoType.detachedCallback = function () {
|
||||
this.removeEventListener('click', onClick);
|
||||
itemShortcuts.off(this);
|
||||
};
|
||||
|
||||
|
|
|
@ -14,3 +14,52 @@
|
|||
.timerIndicator {
|
||||
color: #CB272A;
|
||||
}
|
||||
|
||||
.indicator + .indicator {
|
||||
margin-left: .25em;
|
||||
}
|
||||
|
||||
.countIndicator {
|
||||
background: rgba(82,181,75,1);
|
||||
border-radius: 500px;
|
||||
display: -ms-flex;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-weight: 500;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.playedIndicator {
|
||||
background: rgba(82,181,75,1);
|
||||
border-radius: 500px;
|
||||
display: -ms-flex;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.countIndicator, .playedIndicator {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
.playedIndicator i {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.layout-tv .countIndicator, .layout-tv .playedIndicator {
|
||||
width: 3.8vh;
|
||||
height: 3.8vh;
|
||||
}
|
||||
|
||||
.layout-tv .playedIndicator i {
|
||||
width: 2.6vh;
|
||||
height: 2.6vh;
|
||||
font-size: 2.6vh;
|
||||
}
|
||||
|
|
|
@ -200,7 +200,10 @@ define(['apphost', 'globalize', 'connectionManager', 'itemHelper'], function (ap
|
|||
require(['actionsheet'], function (actionSheet) {
|
||||
|
||||
actionSheet.show({
|
||||
items: commands
|
||||
|
||||
items: commands,
|
||||
positionTo: options.positionTo
|
||||
|
||||
}).then(function (id) {
|
||||
executeCommand(options.item, id).then(resolve);
|
||||
}, reject);
|
||||
|
|
|
@ -169,6 +169,14 @@ div.listItem {
|
|||
margin-top: 0;
|
||||
}
|
||||
|
||||
.listItem .indicators {
|
||||
right: .5vh;
|
||||
top: .5vh;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@supports (display: flex) {
|
||||
|
||||
.listItem, .listItemBody, .listItemMediaInfo {
|
||||
|
|
|
@ -201,8 +201,6 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan
|
|||
if (options.showParentTitle) {
|
||||
if (item.Type == 'Episode') {
|
||||
textlines.push(item.SeriesName || ' ');
|
||||
} else if (item.Type == 'MusicAlbum') {
|
||||
textlines.push(item.AlbumArtist || ' ');
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -213,13 +211,28 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan
|
|||
}
|
||||
textlines.push(displayName);
|
||||
|
||||
if (item.Type == 'Audio') {
|
||||
if (item.ArtistItems && item.Type != 'MusicAlbum') {
|
||||
textlines.push(item.ArtistItems.map(function (a) {
|
||||
return a.Name;
|
||||
|
||||
}).join(', ') || ' ');
|
||||
}
|
||||
|
||||
if (item.AlbumArtist && item.Type == 'MusicAlbum') {
|
||||
textlines.push(item.AlbumArtist || ' ');
|
||||
}
|
||||
|
||||
if (item.Type == 'Game') {
|
||||
textlines.push(item.GameSystem || ' ');
|
||||
}
|
||||
|
||||
if (item.Type == 'TvChannel') {
|
||||
|
||||
if (item.CurrentProgram) {
|
||||
textlines.push(itemHelper.getDisplayName(item.CurrentProgram));
|
||||
}
|
||||
}
|
||||
|
||||
var lineCount = textlines.length;
|
||||
if (!options.enableSideMediaInfo) {
|
||||
lineCount++;
|
||||
|
@ -241,7 +254,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan
|
|||
html += '<h2>';
|
||||
}
|
||||
else if (i == 0) {
|
||||
html += '<h3>';
|
||||
html += '<div>';
|
||||
} else {
|
||||
html += '<div class="secondary">';
|
||||
}
|
||||
|
@ -249,7 +262,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan
|
|||
if (i == 0 && isLargeStyle) {
|
||||
html += '</h2>';
|
||||
} else if (i == 0) {
|
||||
html += '</h3>';
|
||||
html += '</div>';
|
||||
} else {
|
||||
html += '</div>';
|
||||
}
|
||||
|
@ -268,7 +281,7 @@ define(['itemHelper', 'mediaInfo', 'indicators', 'connectionManager', 'layoutMan
|
|||
html += '</div>';
|
||||
|
||||
if (!clickEntireItem) {
|
||||
html += '<button is="paper-icon-button-light" class="listviewMenuButton autoSize"><i class="md-icon"></i></button>';
|
||||
html += '<button is="paper-icon-button-light" class="menuButton autoSize"><i class="md-icon"></i></button>';
|
||||
html += '<span class="listViewUserDataButtons">';
|
||||
html += userdataButtons.getIconsHtml(item, false);
|
||||
html += '</span>';
|
||||
|
|
|
@ -3,9 +3,9 @@
|
|||
}
|
||||
|
||||
i.mediaInfoItem {
|
||||
width: 3vh;
|
||||
height: 3vh;
|
||||
font-size: 3vh;
|
||||
width: auto;
|
||||
height: auto;
|
||||
font-size: 1.6em;
|
||||
margin-right: .6em;
|
||||
}
|
||||
|
||||
|
@ -63,9 +63,3 @@ i.mediaInfoItem {
|
|||
font-size: 90%;
|
||||
padding: .1em .5em;
|
||||
}
|
||||
|
||||
.layout-tv i.mediaInfoItem {
|
||||
width: 4vh;
|
||||
height: 4vh;
|
||||
font-size: 4vh;
|
||||
}
|
|
@ -125,7 +125,7 @@ define(['playbackManager', 'inputManager', 'connectionManager', 'embyRouter', 'g
|
|||
}
|
||||
|
||||
else if (action == 'setplaylistindex') {
|
||||
|
||||
playbackManager.currentPlaylistIndex(parseInt(card.getAttribute('data-index')));
|
||||
}
|
||||
|
||||
else if (action == 'record') {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue