a little more jquery removal

This commit is contained in:
Luke Pulverenti 2016-06-02 02:08:47 -04:00
parent 31b057360f
commit 471d0fbefc
11 changed files with 202 additions and 122 deletions

View File

@ -810,7 +810,7 @@
Events.on(MediaController, 'playerchange', onPlayerChange);
$(context.querySelector('.itemsContainer')).createCardMenus();
libraryBrowser.createCardMenus(context.querySelector('.itemsContainer'));
}

View File

@ -147,7 +147,7 @@
function initPage(tabContent) {
$('.itemsContainer', tabContent).on('needsrefresh', function () {
tabContent.querySelector('.itemsContainer').addEventListener('needsrefresh', function () {
reloadItems(tabContent);
});

View File

@ -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;

View File

@ -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 },

View File

@ -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
};
var categorySyncButtons = page.querySelectorAll('.categorySyncButton');
for (var i = 0, length = categorySyncButtons.length; i < length; i++) {
if (LibraryBrowser.enableSync(item, user)) {
$('.categorySyncButton', page).removeClass('hide');
categorySyncButtons[i].classList.remove('hide');
} else {
$('.categorySyncButton', page).addClass('hide');
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) {

View File

@ -124,10 +124,16 @@
self.initTab = function () {
var tabContent = view.querySelector('.pageTabContent[data-index=\'' + 0 + '\']');
var containers = tabContent.querySelectorAll('.itemsContainer');
for (var i = 0, length = containers.length; i < length; i++) {
if (enableScrollX()) {
$('.itemsContainer', tabContent).addClass('hiddenScrollX').createCardMenus();
containers[i].classList.add('hiddenScrollX');
} else {
$('.itemsContainer', tabContent).removeClass('hiddenScrollX').createCardMenus();
containers[i].classList.remove('hiddenScrollX');
}
LibraryBrowser.createCardMenus(containers[i]);
}
};

View File

@ -291,7 +291,7 @@
reloadItems(context);
});
$('.itemsContainer', context).on('needsrefresh', function () {
context.querySelector('.itemsContainer').addEventListener('needsrefresh', function () {
reloadItems(context);
});

View File

@ -180,7 +180,7 @@
reloadItems(tabContent);
});
$('.itemsContainer', tabContent).on('needsrefresh', function () {
tabContent.querySelector('.itemsContainer').addEventListener('needsrefresh', function () {
reloadItems(tabContent);

View File

@ -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 () {

View File

@ -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 () {
if (currentPlayer) {
currentPlayer.pause();
var i, length;
pauseButtons = elem.querySelectorAll('.pauseButton');
for (i = 0, length = pauseButtons.length; i < length; i++) {
pauseButtons[i].addEventListener('click', onPauseClick);
}
});
unpauseButton = $('.unpauseButton', elem).on('click', function () {
if (currentPlayer) {
currentPlayer.unpause();
unpauseButtons = elem.querySelectorAll('.unpauseButton');
for (i = 0, length = unpauseButtons.length; i < length; i++) {
unpauseButtons[i].addEventListener('click', onUnpauseClick);
}
});
$('.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);

View File

@ -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();
}