mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update by genre views
This commit is contained in:
parent
71b0be28b8
commit
dfbe16f07e
7 changed files with 75 additions and 35 deletions
|
@ -14,12 +14,12 @@
|
|||
},
|
||||
"devDependencies": {},
|
||||
"ignore": [],
|
||||
"version": "1.4.337",
|
||||
"_release": "1.4.337",
|
||||
"version": "1.4.338",
|
||||
"_release": "1.4.338",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "1.4.337",
|
||||
"commit": "1653cc935acba06056afae3a6fc8bce17fb46a7a"
|
||||
"tag": "1.4.338",
|
||||
"commit": "89d5917a0c6425e6f07868b92c9cabb04dcd0139"
|
||||
},
|
||||
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
|
||||
"_target": "^1.2.1",
|
||||
|
|
|
@ -15,17 +15,24 @@ define(['visibleinviewport', 'browser', 'dom'], function (visibleinviewport, bro
|
|||
|
||||
//options.rootMargin = "300%";
|
||||
|
||||
var observerId = 'obs' + new Date().getTime();
|
||||
|
||||
var self = this;
|
||||
var observer = new IntersectionObserver(function (entries) {
|
||||
for (var j = 0, length2 = entries.length; j < length2; j++) {
|
||||
var entry = entries[j];
|
||||
var target = entry.target;
|
||||
observer.unobserve(target);
|
||||
callback(target);
|
||||
loadedCount++;
|
||||
|
||||
if (loadedCount >= self.elementCount) {
|
||||
self.destroyObserver();
|
||||
observer.unobserve(target);
|
||||
|
||||
if (!target[observerId]) {
|
||||
target[observerId] = 1;
|
||||
callback(target);
|
||||
loadedCount++;
|
||||
|
||||
if (loadedCount >= self.elementCount) {
|
||||
self.destroyObserver();
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
|
@ -95,10 +95,7 @@
|
|||
<button type="button" is="paper-icon-button-light" class="btnNewCollection autoSize"><i class="md-icon">add</i></button>
|
||||
</div>
|
||||
|
||||
<div class="alphaPicker alphabetPicker alphaPicker-vertical">
|
||||
</div>
|
||||
|
||||
<div is="emby-itemscontainer" class="itemsContainer itemsContainerWithAlphaPicker centered" style="text-align:center;">
|
||||
<div is="emby-itemscontainer" class="itemsContainer vertical-wrap centered" style="text-align:center;">
|
||||
</div>
|
||||
<div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
|
||||
<div class="paging"></div>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, alphaPicker, listView, cardBuilder) {
|
||||
define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'cardBuilder', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, listView, cardBuilder) {
|
||||
'use strict';
|
||||
|
||||
return function (view, params, tabContent) {
|
||||
|
@ -205,26 +205,10 @@
|
|||
|
||||
function updateFilterControls(tabContent) {
|
||||
|
||||
var query = getQuery(tabContent);
|
||||
self.alphaPicker.value(query.NameStartsWithOrGreater);
|
||||
}
|
||||
|
||||
function initPage(tabContent) {
|
||||
|
||||
var alphaPickerElement = tabContent.querySelector('.alphaPicker');
|
||||
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
|
||||
var newValue = e.detail.value;
|
||||
var query = getQuery(tabContent);
|
||||
query.NameStartsWithOrGreater = newValue;
|
||||
query.StartIndex = 0;
|
||||
reloadItems(tabContent);
|
||||
});
|
||||
|
||||
self.alphaPicker = new alphaPicker({
|
||||
element: alphaPickerElement,
|
||||
valueChangeEvent: 'click'
|
||||
});
|
||||
|
||||
tabContent.querySelector('.btnSort').addEventListener('click', function (e) {
|
||||
libraryBrowser.showSortMenu({
|
||||
items: [{
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
define(['libraryBrowser', 'cardBuilder', 'lazyLoader', 'apphost'], function (libraryBrowser, cardBuilder, lazyLoader, appHost) {
|
||||
define(['libraryBrowser', 'cardBuilder', 'lazyLoader', 'apphost', 'globalize', 'dom'], function (libraryBrowser, cardBuilder, lazyLoader, appHost, globalize, dom) {
|
||||
'use strict';
|
||||
|
||||
return function (view, params, tabContent) {
|
||||
|
@ -58,6 +58,23 @@
|
|||
return enableScrollX() ? 'overflowPortrait' : 'portrait';
|
||||
}
|
||||
|
||||
function getMoreItemsHref(itemId, type) {
|
||||
|
||||
return 'secondaryitems.html?type=' + type + '&parentId=' + itemId;
|
||||
}
|
||||
|
||||
dom.addEventListener(tabContent, 'click', function (e) {
|
||||
|
||||
var btnMoreFromGenre = dom.parentWithClass(e.target, 'btnMoreFromGenre');
|
||||
if (btnMoreFromGenre) {
|
||||
var id = btnMoreFromGenre.getAttribute('data-id');
|
||||
Dashboard.navigate(getMoreItemsHref(id, 'Movie'));
|
||||
}
|
||||
|
||||
}, {
|
||||
passive: true
|
||||
});
|
||||
|
||||
function fillItemsContainer(elem) {
|
||||
|
||||
var id = elem.getAttribute('data-id');
|
||||
|
@ -144,6 +161,9 @@
|
|||
});
|
||||
}
|
||||
|
||||
if (result.Items.length >= query.Limit) {
|
||||
tabContent.querySelector('.btnMoreFromGenre' + id).classList.remove('hide');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -163,9 +183,15 @@
|
|||
var item = items[i];
|
||||
|
||||
html += '<div class="homePageSection">';
|
||||
|
||||
html += '<div style="display:flex;align-items:center;">';
|
||||
html += '<h1 class="listHeader">';
|
||||
html += item.Name;
|
||||
html += '</h1>';
|
||||
html += '<button is="emby-button" type="button" class="raised more mini noIcon hide btnMoreFromGenre btnMoreFromGenre' + item.Id + '" data-id="' + item.Id + '">';
|
||||
html += '<span>' + globalize.translate('ButtonMore') + '</span>';
|
||||
html += '</button>';
|
||||
html += '</div>';
|
||||
|
||||
if (enableScrollX()) {
|
||||
html += '<div is="emby-itemscontainer" class="itemsContainer hiddenScrollX lazy" data-id="' + item.Id + '">';
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
define(['libraryBrowser', 'cardBuilder', 'lazyLoader', 'apphost'], function (libraryBrowser, cardBuilder, lazyLoader, appHost) {
|
||||
define(['libraryBrowser', 'cardBuilder', 'lazyLoader', 'apphost', 'globalize', 'dom'], function (libraryBrowser, cardBuilder, lazyLoader, appHost, globalize, dom) {
|
||||
'use strict';
|
||||
|
||||
return function (view, params, tabContent) {
|
||||
|
@ -58,6 +58,23 @@
|
|||
return enableScrollX() ? 'overflowPortrait' : 'portrait';
|
||||
}
|
||||
|
||||
function getMoreItemsHref(itemId, type) {
|
||||
|
||||
return 'secondaryitems.html?type=' + type + '&parentId=' + itemId;
|
||||
}
|
||||
|
||||
dom.addEventListener(tabContent, 'click', function (e) {
|
||||
|
||||
var btnMoreFromGenre = dom.parentWithClass(e.target, 'btnMoreFromGenre');
|
||||
if (btnMoreFromGenre) {
|
||||
var id = btnMoreFromGenre.getAttribute('data-id');
|
||||
Dashboard.navigate(getMoreItemsHref(id, 'Series'));
|
||||
}
|
||||
|
||||
}, {
|
||||
passive: true
|
||||
});
|
||||
|
||||
function fillItemsContainer(elem) {
|
||||
|
||||
var id = elem.getAttribute('data-id');
|
||||
|
@ -144,6 +161,9 @@
|
|||
});
|
||||
}
|
||||
|
||||
if (result.Items.length >= query.Limit) {
|
||||
tabContent.querySelector('.btnMoreFromGenre' + id).classList.remove('hide');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -163,9 +183,15 @@
|
|||
var item = items[i];
|
||||
|
||||
html += '<div class="homePageSection">';
|
||||
|
||||
html += '<div style="display:flex;align-items:center;">';
|
||||
html += '<h1 class="listHeader">';
|
||||
html += item.Name;
|
||||
html += '</h1>';
|
||||
html += '<button is="emby-button" type="button" class="raised more mini noIcon hide btnMoreFromGenre btnMoreFromGenre' + item.Id + '" data-id="' + item.Id + '">';
|
||||
html += '<span>' + globalize.translate('ButtonMore') + '</span>';
|
||||
html += '</button>';
|
||||
html += '</div>';
|
||||
|
||||
if (enableScrollX()) {
|
||||
html += '<div is="emby-itemscontainer" class="itemsContainer hiddenScrollX lazy" data-id="' + item.Id + '">';
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<div id="secondaryItemsPage" data-role="page" class="page libraryPage noSecondaryNavPage" data-menubutton="false">
|
||||
<div id="secondaryItemsPage" data-role="page" class="page libraryPage noSecondaryNavPage" data-backbutton="true">
|
||||
|
||||
<div data-role="content">
|
||||
<div class="viewSettings">
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue