mirror of
https://github.com/jellyfin/jellyfin-web.git
synced 2024-11-17 19:08:18 -07:00
a little more jquery removal
This commit is contained in:
Luke Pulverenti
parent
31b057360f
commit
471d0fbefc
@ -810,7 +810,7 @@
|
||||
|
||||
Events.on(MediaController, 'playerchange', onPlayerChange);
|
||||
|
||||
$(context.querySelector('.itemsContainer')).createCardMenus();
|
||||
libraryBrowser.createCardMenus(context.querySelector('.itemsContainer'));
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -147,7 +147,7 @@
|
||||
|
||||
function initPage(tabContent) {
|
||||
|
||||
$('.itemsContainer', tabContent).on('needsrefresh', function () {
|
||||
tabContent.querySelector('.itemsContainer').addEventListener('needsrefresh', function () {
|
||||
|
||||
reloadItems(tabContent);
|
||||
});
|
||||
|
||||
@ -338,7 +338,7 @@
|
||||
|
||||
itemsContainer.innerHTML = html;
|
||||
ImageLoader.lazyChildren(itemsContainer);
|
||||
$(itemsContainer).createCardMenus();
|
||||
LibraryBrowser.createCardMenus(itemsContainer);
|
||||
});
|
||||
}
|
||||
|
||||
@ -368,7 +368,7 @@
|
||||
} else {
|
||||
$('#childrenCollapsible', page).removeClass('hide');
|
||||
}
|
||||
renderChildren(page, item, user, context);
|
||||
renderChildren(page, item);
|
||||
}
|
||||
else {
|
||||
$('#childrenCollapsible', page).addClass('hide');
|
||||
@ -757,7 +757,10 @@
|
||||
});
|
||||
html += '</div>';
|
||||
|
||||
$('#similarContent', page).html(html).lazyChildren().createCardMenus();
|
||||
var similarContent = page.querySelector('#similarContent');
|
||||
similarContent.innerHTML = html;
|
||||
ImageLoader.lazyChildren(similarContent);
|
||||
LibraryBrowser.createCardMenus(similarContent);
|
||||
});
|
||||
}
|
||||
|
||||
@ -859,7 +862,7 @@
|
||||
}
|
||||
|
||||
var _childrenItemsFunction = null;
|
||||
function renderChildren(page, item, user, context) {
|
||||
function renderChildren(page, item) {
|
||||
|
||||
_childrenItemsFunction = null;
|
||||
|
||||
@ -875,13 +878,14 @@
|
||||
query.SortBy = "SortName";
|
||||
}
|
||||
|
||||
var userId = Dashboard.getCurrentUserId();
|
||||
var promise;
|
||||
|
||||
if (item.Type == "Series") {
|
||||
|
||||
promise = ApiClient.getSeasons(item.Id, {
|
||||
|
||||
userId: user.Id,
|
||||
userId: userId,
|
||||
Fields: fields
|
||||
});
|
||||
}
|
||||
@ -891,14 +895,14 @@
|
||||
promise = ApiClient.getEpisodes(item.SeriesId, {
|
||||
|
||||
seasonId: item.Id,
|
||||
userId: user.Id,
|
||||
userId: userId,
|
||||
Fields: fields
|
||||
});
|
||||
|
||||
_childrenItemsFunction = getEpisodesFunction(item.SeriesId, {
|
||||
|
||||
seasonId: item.Id,
|
||||
userId: user.Id,
|
||||
userId: userId,
|
||||
Fields: fields
|
||||
});
|
||||
}
|
||||
@ -977,7 +981,7 @@
|
||||
elem.classList.remove('hiddenScrollX');
|
||||
}
|
||||
|
||||
$(elem).createCardMenus();
|
||||
LibraryBrowser.createCardMenus(elem);
|
||||
|
||||
if (item.Type == "BoxSet") {
|
||||
|
||||
@ -989,7 +993,7 @@
|
||||
{ name: Globalize.translate('HeaderBooks'), type: 'Book' }
|
||||
];
|
||||
|
||||
renderCollectionItems(page, item, collectionItemTypes, result.Items, user, context);
|
||||
renderCollectionItems(page, item, collectionItemTypes, result.Items);
|
||||
}
|
||||
});
|
||||
|
||||
@ -1043,12 +1047,13 @@
|
||||
});
|
||||
}
|
||||
|
||||
function renderCollectionItems(page, parentItem, types, items, user) {
|
||||
function renderCollectionItems(page, parentItem, types, items) {
|
||||
|
||||
// First empty out existing content
|
||||
page.querySelector('.collectionItems').innerHTML = '';
|
||||
var i, length;
|
||||
|
||||
for (var i = 0, length = types.length; i < length; i++) {
|
||||
for (i = 0, length = types.length; i < length; i++) {
|
||||
|
||||
var type = types[i];
|
||||
|
||||
@ -1059,7 +1064,7 @@
|
||||
});
|
||||
|
||||
if (typeItems.length) {
|
||||
renderCollectionItemType(page, parentItem, type, typeItems, user);
|
||||
renderCollectionItemType(page, parentItem, type, typeItems);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1076,17 +1081,20 @@
|
||||
});
|
||||
|
||||
if (otherTypeItems.length) {
|
||||
renderCollectionItemType(page, parentItem, otherType, otherTypeItems, user);
|
||||
renderCollectionItemType(page, parentItem, otherType, otherTypeItems);
|
||||
}
|
||||
|
||||
if (!items.length) {
|
||||
renderCollectionItemType(page, parentItem, { name: Globalize.translate('HeaderItems') }, items, user);
|
||||
renderCollectionItemType(page, parentItem, { name: Globalize.translate('HeaderItems') }, items);
|
||||
}
|
||||
|
||||
$('.collectionItems .itemsContainer', page).createCardMenus();
|
||||
var containers = page.querySelectorAll('.collectionItems .itemsContainer');
|
||||
for (i = 0, length = containers.length; i < length; i++) {
|
||||
LibraryBrowser.createCardMenus(containers[i]);
|
||||
}
|
||||
}
|
||||
|
||||
function renderCollectionItemType(page, parentItem, type, items, user, context) {
|
||||
function renderCollectionItemType(page, parentItem, type, items) {
|
||||
|
||||
var html = '';
|
||||
|
||||
@ -1109,7 +1117,6 @@
|
||||
shape: shape,
|
||||
showTitle: true,
|
||||
centerText: true,
|
||||
context: context,
|
||||
lazy: true,
|
||||
showDetailsMenu: true,
|
||||
overlayMoreButton: true,
|
||||
@ -1121,14 +1128,9 @@
|
||||
html += '</div>';
|
||||
|
||||
var collectionItems = page.querySelector('.collectionItems');
|
||||
$(collectionItems).append(html);
|
||||
collectionItems.insertAdjacentHTML('beforeend', html);
|
||||
ImageLoader.lazyChildren(collectionItems);
|
||||
|
||||
$(collectionItems).off('removefromcollection').on('removefromcollection', function (e, itemId) {
|
||||
|
||||
removeFromCollection(page, parentItem, [itemId], user, context);
|
||||
});
|
||||
|
||||
collectionItems.querySelector('.btnAddToCollection').addEventListener('click', function () {
|
||||
require(['alert'], function (alert) {
|
||||
alert({
|
||||
@ -1139,7 +1141,7 @@
|
||||
});
|
||||
}
|
||||
|
||||
function removeFromCollection(page, parentItem, itemIds, user, context) {
|
||||
function removeFromCollection(page, parentItem, itemIds) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
@ -1154,7 +1156,7 @@
|
||||
|
||||
}).then(function () {
|
||||
|
||||
renderChildren(page, parentItem, user, context);
|
||||
renderChildren(page, parentItem);
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
}
|
||||
@ -2113,6 +2115,13 @@
|
||||
renderCriticReviews(view, currentItem);
|
||||
});
|
||||
|
||||
view.querySelector('.collectionItems').addEventListener('removefromcollection', function (e) {
|
||||
|
||||
var itemId = e.detail.itemId;
|
||||
removeFromCollection(view, currentItem, [itemId]);
|
||||
});
|
||||
|
||||
|
||||
//var btnMore = page.querySelectorAll('.btnMoreCommands iron-icon');
|
||||
//for (var i = 0, length = btnMore.length; i < length; i++) {
|
||||
// btnMore[i].icon = AppInfo.moreIcon;
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
|
||||
function fadeInRight(elem) {
|
||||
|
||||
var pct = browserInfo.mobile ? '2%' : '0.5%';
|
||||
var pct = browserInfo.mobile ? '2.5%' : '0.5%';
|
||||
|
||||
var keyframes = [
|
||||
{ opacity: '0', transform: 'translate3d(' + pct + ', 0, 0)', offset: 0 },
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
define(['appSettings', 'appStorage', 'libraryBrowser', 'apphost', 'jQuery', 'itemHelper', 'mediaInfo'], function (appSettings, appStorage, LibraryBrowser, appHost, $, itemHelper, mediaInfo) {
|
||||
define(['appSettings', 'appStorage', 'libraryBrowser', 'apphost', 'itemHelper', 'mediaInfo'], function (appSettings, appStorage, LibraryBrowser, appHost, itemHelper, mediaInfo) {
|
||||
|
||||
var showOverlayTimeout;
|
||||
|
||||
@ -242,9 +242,7 @@
|
||||
});
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
itemsContainer.dispatchEvent(new CustomEvent('timercancelled', {
|
||||
bubbles: true
|
||||
}));
|
||||
itemsContainer.dispatchEvent(new CustomEvent('timercancelled', {}));
|
||||
});
|
||||
});
|
||||
});
|
||||
@ -255,7 +253,7 @@
|
||||
var displayContextItem = card;
|
||||
|
||||
if (!card.classList.contains('card') && !card.classList.contains('listItem')) {
|
||||
card = $(card).parents('.listItem,.card')[0];
|
||||
card = parentWithAnyClass(card, ['listItem', 'card']);
|
||||
}
|
||||
|
||||
var itemId = card.getAttribute('data-itemid');
|
||||
@ -637,13 +635,23 @@
|
||||
case 'removefromplaylist':
|
||||
var itemsContainer = parentWithClass(card, 'itemsContainer');
|
||||
if (itemsContainer) {
|
||||
$(itemsContainer).trigger('removefromplaylist', [playlistItemId]);
|
||||
itemsContainer.dispatchEvent(new CustomEvent('removefromplaylist', {
|
||||
detail: {
|
||||
playlistItemId: playlistItemId
|
||||
},
|
||||
cancelable: false
|
||||
}));
|
||||
}
|
||||
break;
|
||||
case 'removefromcollection':
|
||||
var itemsContainer = parentWithClass(card, 'itemsContainer');
|
||||
var itemsContainer = parentWithClass(card, 'collectionItems');
|
||||
if (itemsContainer) {
|
||||
$(card).parents('.collectionItems').trigger('removefromcollection', [itemId]);
|
||||
itemsContainer.dispatchEvent(new CustomEvent('removefromcollection', {
|
||||
detail: {
|
||||
itemId: itemId
|
||||
},
|
||||
cancelable: false
|
||||
}));
|
||||
}
|
||||
break;
|
||||
default:
|
||||
@ -661,7 +669,7 @@
|
||||
var card = e.target;
|
||||
|
||||
if (!card.classList.contains('card') && !card.classList.contains('listItem')) {
|
||||
card = $(card).parents('.listItem,.card')[0];
|
||||
card = parentWithAnyClass(card, ['listItem', 'card']);
|
||||
}
|
||||
|
||||
var id = card.getAttribute('data-itemid');
|
||||
@ -779,6 +787,25 @@
|
||||
return false;
|
||||
}
|
||||
|
||||
function hasAnyClass(elem, classNames) {
|
||||
return classNames.filter(function (c) {
|
||||
return elem.classList.contains(c);
|
||||
}).length > 0;
|
||||
}
|
||||
|
||||
function parentWithAnyClass(elem, classNames) {
|
||||
|
||||
while (!elem.classList || !hasAnyClass(elem, classNames)) {
|
||||
elem = elem.parentNode;
|
||||
|
||||
if (!elem) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
return elem;
|
||||
}
|
||||
|
||||
function parentWithClass(elem, className) {
|
||||
|
||||
while (!elem.classList || !elem.classList.contains(className)) {
|
||||
@ -911,17 +938,6 @@
|
||||
initTapHoldMenus(curr);
|
||||
};
|
||||
|
||||
$.fn.createCardMenus = function (options) {
|
||||
|
||||
for (var i = 0, length = this.length; i < length; i++) {
|
||||
|
||||
var curr = this[i];
|
||||
LibraryBrowser.createCardMenus(curr, options);
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
function initTapHoldMenus(elem) {
|
||||
|
||||
if (elem.classList.contains('itemsContainer')) {
|
||||
@ -1367,7 +1383,7 @@
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
hideSelections();
|
||||
$('.itemsContainer', page).trigger('needsrefresh');
|
||||
page.querySelector('.itemsContainer').dispatchEvent(new CustomEvent('needsrefresh', {}));
|
||||
});
|
||||
});
|
||||
});
|
||||
@ -1427,16 +1443,18 @@
|
||||
|
||||
function playAllFromHere(index, itemsContainer, method) {
|
||||
|
||||
var ids = $('.mediaItem', itemsContainer).get().map(function (i) {
|
||||
var ids = [];
|
||||
|
||||
var node = i;
|
||||
var mediaItems = itemsContainer.querySelectorAll('.mediaItem');
|
||||
for (var i = 0, length = mediaItems.length; i < length; i++) {
|
||||
var node = mediaItems[i];
|
||||
var id = node.getAttribute('data-itemid');
|
||||
while (!id) {
|
||||
node = node.parentNode;
|
||||
id = node.getAttribute('data-itemid');
|
||||
}
|
||||
return id;
|
||||
});
|
||||
ids.push(id);
|
||||
}
|
||||
|
||||
ids = ids.slice(index);
|
||||
|
||||
@ -1468,16 +1486,20 @@
|
||||
SupportsSync: true
|
||||
};
|
||||
|
||||
if (LibraryBrowser.enableSync(item, user)) {
|
||||
$('.categorySyncButton', page).removeClass('hide');
|
||||
} else {
|
||||
$('.categorySyncButton', page).addClass('hide');
|
||||
var categorySyncButtons = page.querySelectorAll('.categorySyncButton');
|
||||
for (var i = 0, length = categorySyncButtons.length; i < length; i++) {
|
||||
if (LibraryBrowser.enableSync(item, user)) {
|
||||
categorySyncButtons[i].classList.remove('hide');
|
||||
} else {
|
||||
categorySyncButtons[i].classList.add('hide');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function onCategorySyncButtonClick(page, button) {
|
||||
function onCategorySyncButtonClick(e) {
|
||||
|
||||
var button = this;
|
||||
var category = button.getAttribute('data-category');
|
||||
var parentId = LibraryMenu.getTopParentId();
|
||||
|
||||
@ -1496,15 +1518,15 @@
|
||||
page.addEventListener('click', onItemWithActionClick);
|
||||
|
||||
var itemsContainers = page.querySelectorAll('.itemsContainer:not(.noautoinit)');
|
||||
for (var i = 0, length = itemsContainers.length; i < length; i++) {
|
||||
var i, length;
|
||||
for (i = 0, length = itemsContainers.length; i < length; i++) {
|
||||
LibraryBrowser.createCardMenus(itemsContainers[i]);
|
||||
}
|
||||
|
||||
$('.categorySyncButton', page).on('click', function () {
|
||||
|
||||
onCategorySyncButtonClick(page, this);
|
||||
});
|
||||
|
||||
var categorySyncButtons = page.querySelectorAll('.categorySyncButton');
|
||||
for (i = 0, length = categorySyncButtons.length; i < length; i++) {
|
||||
categorySyncButtons[i].addEventListener('click', onCategorySyncButtonClick);
|
||||
}
|
||||
});
|
||||
|
||||
pageClassOn('pageshow', "libraryPage", function () {
|
||||
@ -1578,18 +1600,21 @@
|
||||
|
||||
function onUserDataChanged(userData) {
|
||||
|
||||
$(document.querySelectorAll("*[data-itemid='" + userData.ItemId + "']")).each(function () {
|
||||
var elems = document.querySelectorAll("*[data-itemid='" + userData.ItemId + "']");
|
||||
|
||||
var mediaType = this.getAttribute('data-mediatype');
|
||||
for (var i = 0, length = elems.length; i < length; i++) {
|
||||
|
||||
var elem = elems[i];
|
||||
var mediaType = elem.getAttribute('data-mediatype');
|
||||
|
||||
if (mediaType == 'Video') {
|
||||
this.setAttribute('data-positionticks', (userData.PlaybackPositionTicks || 0));
|
||||
elem.setAttribute('data-positionticks', (userData.PlaybackPositionTicks || 0));
|
||||
|
||||
if (this.classList.contains('card')) {
|
||||
renderUserDataChanges(this, userData);
|
||||
if (elem.classList.contains('card')) {
|
||||
renderUserDataChanges(elem, userData);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function onWebSocketMessage(e, data) {
|
||||
|
||||
@ -124,10 +124,16 @@
|
||||
self.initTab = function () {
|
||||
|
||||
var tabContent = view.querySelector('.pageTabContent[data-index=\'' + 0 + '\']');
|
||||
if (enableScrollX()) {
|
||||
$('.itemsContainer', tabContent).addClass('hiddenScrollX').createCardMenus();
|
||||
} else {
|
||||
$('.itemsContainer', tabContent).removeClass('hiddenScrollX').createCardMenus();
|
||||
|
||||
var containers = tabContent.querySelectorAll('.itemsContainer');
|
||||
|
||||
for (var i = 0, length = containers.length; i < length; i++) {
|
||||
if (enableScrollX()) {
|
||||
containers[i].classList.add('hiddenScrollX');
|
||||
} else {
|
||||
containers[i].classList.remove('hiddenScrollX');
|
||||
}
|
||||
LibraryBrowser.createCardMenus(containers[i]);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@ -291,7 +291,7 @@
|
||||
reloadItems(context);
|
||||
});
|
||||
|
||||
$('.itemsContainer', context).on('needsrefresh', function () {
|
||||
context.querySelector('.itemsContainer').addEventListener('needsrefresh', function () {
|
||||
|
||||
reloadItems(context);
|
||||
});
|
||||
|
||||
@ -180,7 +180,7 @@
|
||||
reloadItems(tabContent);
|
||||
});
|
||||
|
||||
$('.itemsContainer', tabContent).on('needsrefresh', function () {
|
||||
tabContent.querySelector('.itemsContainer').addEventListener('needsrefresh', function () {
|
||||
|
||||
reloadItems(tabContent);
|
||||
|
||||
|
||||
@ -258,7 +258,9 @@
|
||||
$(containers).removeClass('hiddenScrollX');
|
||||
}
|
||||
|
||||
$(containers).createCardMenus();
|
||||
for (var i = 0, length = containers.length; i < length; i++) {
|
||||
LibraryBrowser.createCardMenus(containers[i]);
|
||||
}
|
||||
};
|
||||
|
||||
self.renderTab = function () {
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
define(['datetime', 'jQuery', 'paper-icon-button-light'], function (datetime, $) {
|
||||
define(['datetime', 'paper-icon-button-light'], function (datetime) {
|
||||
|
||||
var currentPlayer;
|
||||
|
||||
@ -9,8 +9,8 @@
|
||||
var unmuteButton;
|
||||
var muteButton;
|
||||
var volumeSlider;
|
||||
var unpauseButton;
|
||||
var pauseButton;
|
||||
var unpauseButtons;
|
||||
var pauseButtons;
|
||||
var positionSlider;
|
||||
var toggleRepeatButton;
|
||||
var toggleRepeatButtonIcon;
|
||||
@ -127,6 +127,18 @@
|
||||
});
|
||||
}
|
||||
|
||||
function onPauseClick() {
|
||||
if (currentPlayer) {
|
||||
currentPlayer.pause();
|
||||
}
|
||||
}
|
||||
|
||||
function onUnpauseClick() {
|
||||
if (currentPlayer) {
|
||||
currentPlayer.unpause();
|
||||
}
|
||||
}
|
||||
|
||||
function bindEvents(elem) {
|
||||
|
||||
currentTimeElement = elem.querySelector('.nowPlayingBarCurrentTime');
|
||||
@ -134,49 +146,49 @@
|
||||
nowPlayingTextElement = elem.querySelector('.nowPlayingBarText');
|
||||
nowPlayingUserData = elem.querySelector('.nowPlayingBarUserDataButtons');
|
||||
|
||||
unmuteButton = $('.unmuteButton', elem).on('click', function () {
|
||||
unmuteButton = elem.querySelector('.unmuteButton');
|
||||
unmuteButton.addEventListener('click', function () {
|
||||
|
||||
if (currentPlayer) {
|
||||
currentPlayer.unMute();
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
muteButton = $('.muteButton', elem).on('click', function () {
|
||||
muteButton = elem.querySelector('.muteButton');
|
||||
muteButton.addEventListener('click', function () {
|
||||
|
||||
if (currentPlayer) {
|
||||
currentPlayer.mute();
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$('.stopButton', elem).on('click', function () {
|
||||
elem.querySelector('.stopButton').addEventListener('click', function () {
|
||||
|
||||
if (currentPlayer) {
|
||||
currentPlayer.stop();
|
||||
}
|
||||
});
|
||||
|
||||
pauseButton = $('.pauseButton', elem).on('click', function () {
|
||||
var i, length;
|
||||
pauseButtons = elem.querySelectorAll('.pauseButton');
|
||||
for (i = 0, length = pauseButtons.length; i < length; i++) {
|
||||
pauseButtons[i].addEventListener('click', onPauseClick);
|
||||
}
|
||||
unpauseButtons = elem.querySelectorAll('.unpauseButton');
|
||||
for (i = 0, length = unpauseButtons.length; i < length; i++) {
|
||||
unpauseButtons[i].addEventListener('click', onUnpauseClick);
|
||||
}
|
||||
|
||||
if (currentPlayer) {
|
||||
currentPlayer.pause();
|
||||
}
|
||||
});
|
||||
|
||||
unpauseButton = $('.unpauseButton', elem).on('click', function () {
|
||||
|
||||
if (currentPlayer) {
|
||||
currentPlayer.unpause();
|
||||
}
|
||||
});
|
||||
|
||||
$('.nextTrackButton', elem).on('click', function () {
|
||||
elem.querySelector('.nextTrackButton').addEventListener('click', function () {
|
||||
|
||||
if (currentPlayer) {
|
||||
currentPlayer.nextTrack();
|
||||
}
|
||||
});
|
||||
|
||||
$('.previousTrackButton', elem).on('click', function () {
|
||||
elem.querySelector('.previousTrackButton').addEventListener('click', function () {
|
||||
|
||||
if (currentPlayer) {
|
||||
currentPlayer.previousTrack();
|
||||
@ -193,7 +205,8 @@
|
||||
showRemoteControl(2);
|
||||
});
|
||||
|
||||
toggleRepeatButton = $('.toggleRepeatButton', elem).on('click', function () {
|
||||
toggleRepeatButton = elem.querySelector('.toggleRepeatButton');
|
||||
toggleRepeatButton.addEventListener('click', function () {
|
||||
|
||||
if (currentPlayer) {
|
||||
var state = lastPlayerState || {};
|
||||
@ -210,21 +223,24 @@
|
||||
break;
|
||||
}
|
||||
}
|
||||
})[0];
|
||||
});
|
||||
|
||||
toggleRepeatButtonIcon = toggleRepeatButton.querySelector('iron-icon');
|
||||
|
||||
// Unfortunately this is necessary because the polymer elements might not be ready immediately and there doesn't seem to be an event-driven way to find out when
|
||||
setTimeout(function () {
|
||||
volumeSlider = $('.nowPlayingBarVolumeSlider', elem).on('change', function () {
|
||||
|
||||
volumeSlider = elem.querySelector('.nowPlayingBarVolumeSlider');
|
||||
volumeSlider.addEventListener('change', function () {
|
||||
|
||||
if (currentPlayer) {
|
||||
currentPlayer.setVolume(this.value);
|
||||
}
|
||||
|
||||
})[0];
|
||||
});
|
||||
|
||||
positionSlider = $('.nowPlayingBarPositionSlider', elem).on('change', function () {
|
||||
positionSlider = elem.querySelector('.nowPlayingBarPositionSlider');
|
||||
positionSlider.addEventListener('change', function () {
|
||||
|
||||
if (currentPlayer && lastPlayerState) {
|
||||
|
||||
@ -234,7 +250,7 @@
|
||||
currentPlayer.seek(Math.floor(newPositionTicks));
|
||||
}
|
||||
|
||||
})[0];
|
||||
});
|
||||
|
||||
positionSlider._setPinValue = function (value) {
|
||||
|
||||
@ -273,7 +289,7 @@
|
||||
return;
|
||||
}
|
||||
|
||||
require(['jQuery', 'css!css/nowplayingbar.css', 'paper-slider'], function ($) {
|
||||
require(['css!css/nowplayingbar.css', 'paper-slider'], function () {
|
||||
|
||||
nowPlayingBarElement = document.querySelector('.nowPlayingBar');
|
||||
|
||||
@ -282,7 +298,8 @@
|
||||
return;
|
||||
}
|
||||
|
||||
nowPlayingBarElement = $(getNowPlayingBarHtml()).appendTo(document.body)[0];
|
||||
document.body.insertAdjacentHTML('beforeend', getNowPlayingBarHtml());
|
||||
nowPlayingBarElement = document.querySelector('.nowPlayingBar');
|
||||
|
||||
if ((browserInfo.safari || !AppInfo.isNativeApp) && browserInfo.mobile) {
|
||||
// Not handled well here. The wrong elements receive events, bar doesn't update quickly enough, etc.
|
||||
@ -296,11 +313,11 @@
|
||||
}
|
||||
|
||||
function showButton(button) {
|
||||
button.removeClass('hide');
|
||||
button.classList.remove('hide');
|
||||
}
|
||||
|
||||
function hideButton(button) {
|
||||
button.addClass('hide');
|
||||
button.classList.add('hide');
|
||||
}
|
||||
|
||||
var lastUpdateTime = 0;
|
||||
@ -341,16 +358,25 @@
|
||||
var playerInfo = MediaController.getPlayerInfo();
|
||||
|
||||
var playState = state.PlayState || {};
|
||||
var i, length;
|
||||
|
||||
if (playState.IsPaused) {
|
||||
|
||||
hideButton(pauseButton);
|
||||
showButton(unpauseButton);
|
||||
for (i = 0, length = pauseButtons.length; i < length; i++) {
|
||||
hideButton(pauseButtons[i]);
|
||||
}
|
||||
for (i = 0, length = unpauseButtons.length; i < length; i++) {
|
||||
showButton(unpauseButtons[i]);
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
showButton(pauseButton);
|
||||
hideButton(unpauseButton);
|
||||
for (i = 0, length = pauseButtons.length; i < length; i++) {
|
||||
showButton(pauseButtons[i]);
|
||||
}
|
||||
for (i = 0, length = unpauseButtons.length; i < length; i++) {
|
||||
hideButton(unpauseButtons[i]);
|
||||
}
|
||||
}
|
||||
|
||||
updatePlayerVolumeState(state, playerInfo);
|
||||
|
||||
@ -100,16 +100,7 @@
|
||||
}
|
||||
|
||||
ImageLoader.lazyChildren(elem);
|
||||
$(elem).createCardMenus();
|
||||
|
||||
$(elem).off('needsrefresh').on('needsrefresh', function () {
|
||||
|
||||
reloadItems(page, item);
|
||||
|
||||
}).off('removefromplaylist').on('removefromplaylist', function (e, playlistItemId) {
|
||||
|
||||
removeFromPlaylist(page, item, [playlistItemId]);
|
||||
});
|
||||
LibraryBrowser.createCardMenus(elem);
|
||||
|
||||
$('.btnNextPage', elem).on('click', function () {
|
||||
query.StartIndex += query.Limit;
|
||||
@ -189,9 +180,30 @@
|
||||
});
|
||||
}
|
||||
|
||||
function init(page, item) {
|
||||
|
||||
var elem = page.querySelector('#childrenContent .itemsContainer');
|
||||
|
||||
elem.addEventListener('removefromplaylist', function (e) {
|
||||
|
||||
var playlistItemId = e.detail.playlistItemId;
|
||||
removeFromPlaylist(page, item, [playlistItemId]);
|
||||
});
|
||||
|
||||
elem.addEventListener('needsrefresh', function () {
|
||||
|
||||
reloadItems(page, item);
|
||||
});
|
||||
}
|
||||
|
||||
window.PlaylistViewer = {
|
||||
render: function (page, item) {
|
||||
|
||||
if (!page.playlistInit) {
|
||||
page.playlistInit = true;
|
||||
init(page, item);
|
||||
}
|
||||
|
||||
reloadItems(page, item);
|
||||
showDragAndDropHelp();
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user