diff --git a/dashboard-ui/scripts/actionsheet.js b/dashboard-ui/scripts/actionsheet.js index 9d38494e4..7a38159b8 100644 --- a/dashboard-ui/scripts/actionsheet.js +++ b/dashboard-ui/scripts/actionsheet.js @@ -20,8 +20,8 @@ var pos = $(options.positionTo).offset(); - pos.top += $(options.positionTo).innerHeight() / 2; - pos.left += $(options.positionTo).innerWidth() / 2; + pos.top += options.positionTo.innerHeight / 2; + pos.left += options.positionTo.innerWidth / 2; // Account for margins pos.top -= 24; diff --git a/dashboard-ui/scripts/alphapicker.js b/dashboard-ui/scripts/alphapicker.js index c05f7f0b4..a88ce4dc9 100644 --- a/dashboard-ui/scripts/alphapicker.js +++ b/dashboard-ui/scripts/alphapicker.js @@ -39,28 +39,30 @@ var page = this; - var picker = $('.alphabetPicker', page); + var picker = page.querySelector('.alphabetPicker'); - if (!picker.length) { + if (!picker) { return; } $('.itemsContainer', page).addClass('itemsContainerWithAlphaPicker'); - picker.html(getPickerHtml()).trigger('create').on('click', 'a', function () { + picker.innerHTML = getPickerHtml(); - var elem = $(this); + Events.on(picker, 'click', 'a', function () { - var isSelected = elem.hasClass('selectedCharacter'); + var elem = this; + + var isSelected = elem.classList.contains('selectedCharacter'); $('.selectedCharacter', picker).removeClass('selectedCharacter'); if (!isSelected) { - elem.addClass('selectedCharacter'); - picker.trigger('alphaselect', [this.innerHTML]); + elem.classList.add('selectedCharacter'); + Events.trigger(picker, 'alphaselect', [this.innerHTML]); } else { - picker.trigger('alphaclear'); + Events.trigger(picker, 'alphaclear'); } }); }); @@ -79,10 +81,10 @@ if (this.innerHTML.toLowerCase() == val) { - $(this).addClass('selectedCharacter'); + this.classList.add('selectedCharacter'); } else { - $(this).removeClass('selectedCharacter'); + this.classList.remove('selectedCharacter'); } }); diff --git a/dashboard-ui/scripts/autoorganizelog.js b/dashboard-ui/scripts/autoorganizelog.js index e509bac73..f9dc1b420 100644 --- a/dashboard-ui/scripts/autoorganizelog.js +++ b/dashboard-ui/scripts/autoorganizelog.js @@ -293,7 +293,7 @@ updatePageSizeSetting: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; if (result.TotalRecordCount > query.Limit && result.TotalRecordCount > 50) { $('.listBottomPaging', page).html(pagingHtml).trigger('create'); diff --git a/dashboard-ui/scripts/backdrops.js b/dashboard-ui/scripts/backdrops.js index 44667a199..717682f32 100644 --- a/dashboard-ui/scripts/backdrops.js +++ b/dashboard-ui/scripts/backdrops.js @@ -9,7 +9,17 @@ // elem = $('
').prependTo(document.body); //} - return $(document.documentElement).addClass('backdropContainer'); + var elem = document.documentElement; + + elem.classList.add('backdropContainer'); + return elem; + } + + function clearBackdrop() { + + var elem = document.documentElement; + elem.classList.remove('backdropContainer'); + elem.style.backgroundImage = ''; } function getRandom(min, max) { @@ -61,7 +71,7 @@ function setBackdropImage(elem, url) { - elem.lazyImage(url); + ImageLoader.lazyImage(elem, url); } function showBackdrop(type, parentId) { @@ -101,12 +111,7 @@ getElement().css('backgroundImage', 'url(css/images/splash.jpg)'); - $(page).addClass('backdropPage staticBackdropPage'); - } - - function clearBackdrop() { - - $('.backdropContainer').css('backgroundImage', '').removeClass('backdropContainer'); + page.classList.add('backdropPage staticBackdropPage'); } function isEnabledByDefault() { @@ -151,7 +156,7 @@ }); if (images.length) { - $(page).addClass('backdropPage'); + page.classList.add('backdropPage'); var index = getRandom(0, images.length - 1); var item = images[index]; @@ -168,42 +173,40 @@ setBackdropImage(getElement(), imgUrl); } else { - $(page).removeClass('backdropPage'); + page.classList.remove('backdropPage'); } } function setBackdropUrl(page, url) { if (url) { - $(page).addClass('backdropPage'); + page.classList.add('backdropPage'); setBackdropImage(getElement(), url); } else { - $(page).removeClass('backdropPage'); + page.classList.remove('backdropPage'); clearBackdrop(); } } - $(document).on('pagebeforeshowready', ".page", function () { + Events.on(document, 'pagebeforeshowready', ".page", function () { var page = this; - var $page = $(page); + if (!page.classList.contains('staticBackdropPage')) { - if (!$page.hasClass('staticBackdropPage')) { - - if ($page.hasClass('backdropPage')) { + if (page.classList.contains('backdropPage')) { if (enabled()) { var type = page.getAttribute('data-backdroptype'); - var parentId = $page.hasClass('globalBackdropPage') ? '' : LibraryMenu.getTopParentId(); + var parentId = page.classList.contains('globalBackdropPage') ? '' : LibraryMenu.getTopParentId(); showBackdrop(type, parentId); } else { - $page.removeClass('backdropPage'); + page.classList.remove('backdropPage'); clearBackdrop(); } } else { diff --git a/dashboard-ui/scripts/channelitems.js b/dashboard-ui/scripts/channelitems.js index 8d97c4442..0eee03b3d 100644 --- a/dashboard-ui/scripts/channelitems.js +++ b/dashboard-ui/scripts/channelitems.js @@ -124,7 +124,7 @@ ApiClient.getJSON(ApiClient.getUrl("Channels/" + channelId + "/Items", query)).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -136,7 +136,7 @@ updatePageSizeSetting: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); @@ -152,9 +152,9 @@ centerText: true }); - var elem = $('#items', page).html(html).lazyChildren(); - - $(pagingHtml).appendTo(elem).trigger('create'); + var elem = page.querySelector('#items'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/channels.js b/dashboard-ui/scripts/channels.js index 04ad855e7..aee1be30b 100644 --- a/dashboard-ui/scripts/channels.js +++ b/dashboard-ui/scripts/channels.js @@ -15,7 +15,7 @@ ApiClient.getJSON(ApiClient.getUrl("Channels", query)).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -49,7 +49,9 @@ }); } - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); LibraryBrowser.saveQueryValues('channels', query); diff --git a/dashboard-ui/scripts/channelslatest.js b/dashboard-ui/scripts/channelslatest.js index 6e5dc2615..af00880b7 100644 --- a/dashboard-ui/scripts/channelslatest.js +++ b/dashboard-ui/scripts/channelslatest.js @@ -2,7 +2,7 @@ function reloadItems(page) { - Sections.loadLatestChannelItems($(".items", page), Dashboard.getCurrentUserId()); + Sections.loadLatestChannelItems(page.querySelector('.items'), Dashboard.getCurrentUserId()); } $(document).on('pagebeforeshowready', "#channelsLatestPage", function () { diff --git a/dashboard-ui/scripts/editcollectionitems.js b/dashboard-ui/scripts/editcollectionitems.js index e5f897cea..546e1d9c5 100644 --- a/dashboard-ui/scripts/editcollectionitems.js +++ b/dashboard-ui/scripts/editcollectionitems.js @@ -96,7 +96,7 @@ }).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = result.Items.map(getTitleHtml).join(''); diff --git a/dashboard-ui/scripts/episodes.js b/dashboard-ui/scripts/episodes.js index b9329a760..da132a9ee 100644 --- a/dashboard-ui/scripts/episodes.js +++ b/dashboard-ui/scripts/episodes.js @@ -29,7 +29,7 @@ ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -41,7 +41,7 @@ addSelectionButton: true }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(); var trigger = false; @@ -80,14 +80,14 @@ }); } - var elem = $('.itemsContainer', page).html(html).lazyChildren(); + var elem = page.querySelector('.itemsContainer'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); if (trigger) { - elem.trigger('create'); + $(elem).trigger('create'); } - $(pagingHtml).appendTo(elem).trigger('create'); - $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; reloadItems(page); diff --git a/dashboard-ui/scripts/favorites.js b/dashboard-ui/scripts/favorites.js index 5a9afbac1..905dec8f0 100644 --- a/dashboard-ui/scripts/favorites.js +++ b/dashboard-ui/scripts/favorites.js @@ -60,8 +60,9 @@ } } - elem = $(elem).html(html).lazyChildren(); - elem.createCardMenus(); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); + $(elem).createCardMenus(); }); } @@ -100,7 +101,7 @@ var section = sections[i]; - elem = $('.section' + section.id, page); + elem = page.querySelector('.section' + section.id); promises.push(loadSection(elem, userId, section, sections.length == 1)); } diff --git a/dashboard-ui/scripts/gamegenrepage.js b/dashboard-ui/scripts/gamegenrepage.js index 4ac17609a..3129311e3 100644 --- a/dashboard-ui/scripts/gamegenrepage.js +++ b/dashboard-ui/scripts/gamegenrepage.js @@ -22,7 +22,7 @@ ApiClient.getGameGenres(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -46,7 +46,9 @@ lazy: true }); - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/gamespage.js b/dashboard-ui/scripts/gamespage.js index d29e3006f..cbfa0ba8c 100644 --- a/dashboard-ui/scripts/gamespage.js +++ b/dashboard-ui/scripts/gamespage.js @@ -28,7 +28,7 @@ ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -73,10 +73,12 @@ }); } - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); if (trigger) { - $('#items', page).trigger('create'); + $(elem).trigger('create'); } $('.btnNextPage', page).on('click', function () { diff --git a/dashboard-ui/scripts/gamestudiospage.js b/dashboard-ui/scripts/gamestudiospage.js index b926ae534..e4a1bda78 100644 --- a/dashboard-ui/scripts/gamestudiospage.js +++ b/dashboard-ui/scripts/gamestudiospage.js @@ -23,7 +23,7 @@ ApiClient.getStudios(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -48,7 +48,9 @@ }); - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/gamesystemspage.js b/dashboard-ui/scripts/gamesystemspage.js index ec0a8a95f..03e461cd1 100644 --- a/dashboard-ui/scripts/gamesystemspage.js +++ b/dashboard-ui/scripts/gamesystemspage.js @@ -25,7 +25,7 @@ ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); updateFilterControls(page); @@ -39,7 +39,9 @@ }); - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); LibraryBrowser.saveQueryValues(getSavedQueryKey(), query); diff --git a/dashboard-ui/scripts/indexpage.js b/dashboard-ui/scripts/indexpage.js index 36bd111a0..69a447743 100644 --- a/dashboard-ui/scripts/indexpage.js +++ b/dashboard-ui/scripts/indexpage.js @@ -32,7 +32,7 @@ var showLibraryTileNames = displayPreferences.CustomPrefs.enableLibraryTileNames != '0'; - var elem = $('.section' + index, page); + var elem = page.querySelector('.section' + index); if (section == 'latestmedia') { return Sections.loadRecentlyAdded(elem, user); @@ -77,16 +77,16 @@ var i, length; var sectionCount = 4; - var elem = $('.sections', page); + var elem = page.querySelector('.sections'); - if (!elem.html().length) { + if (!elem.innerHTML.length) { var html = ''; for (i = 0, length = sectionCount; i < length; i++) { html += '
'; } - elem.html(html); + elem.innerHTML = html; } var promises = []; @@ -166,7 +166,7 @@ var page = this; - $('.btnTakeTour', page).on('click', function () { + Events.on(page.querySelector('.btnTakeTour'), 'click', function () { takeTour(page, Dashboard.getCurrentUserId()); }); diff --git a/dashboard-ui/scripts/itembynamedetailpage.js b/dashboard-ui/scripts/itembynamedetailpage.js index 1a0c95fed..68d28eb8e 100644 --- a/dashboard-ui/scripts/itembynamedetailpage.js +++ b/dashboard-ui/scripts/itembynamedetailpage.js @@ -448,7 +448,7 @@ updatePageSizeSetting: false }); - $('.listTopPaging', page).html(pagingHtml); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; $('.viewSettings', page).show(); } else { @@ -527,7 +527,12 @@ updatePageSizeSetting: false }); - $('#items', page).html(html).trigger('create').lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); + + // Do we still need this? + $(elem).trigger('create'); $('.btnNextPage', page).on('click', function () { diff --git a/dashboard-ui/scripts/itemdetailpage.js b/dashboard-ui/scripts/itemdetailpage.js index 04e5bba29..89363cd2b 100644 --- a/dashboard-ui/scripts/itemdetailpage.js +++ b/dashboard-ui/scripts/itemdetailpage.js @@ -852,10 +852,12 @@ }); } - var elem = $('.childrenItemsContainer', page).html(html).lazyChildren(); + var elem = page.querySelector('.childrenItemsContainer'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); if (trigger) { - elem.trigger('create'); + $(elem).trigger('create'); } if (item.Type == "BoxSet") { @@ -873,19 +875,19 @@ }); if (item.Type == "Season") { - $('#childrenTitle', page).html(Globalize.translate('HeaderEpisodes')); + page.querySelector('#childrenTitle').innerHTML = Globalize.translate('HeaderEpisodes'); } else if (item.Type == "Series") { - $('#childrenTitle', page).html(Globalize.translate('HeaderSeasons')); + page.querySelector('#childrenTitle').innerHTML = Globalize.translate('HeaderSeasons'); } else if (item.Type == "MusicAlbum") { - $('#childrenTitle', page).html(Globalize.translate('HeaderTracks')); + page.querySelector('#childrenTitle').innerHTML = Globalize.translate('HeaderTracks'); } else if (item.Type == "GameSystem") { - $('#childrenTitle', page).html(Globalize.translate('HeaderGames')); + page.querySelector('#childrenTitle').innerHTML = Globalize.translate('HeaderGames'); } else { - $('#childrenTitle', page).html(Globalize.translate('HeaderItems')); + page.querySelector('#childrenTitle').innerHTML = Globalize.translate('HeaderItems'); } } @@ -961,7 +963,9 @@ html += ''; - $('.collectionItems', page).append(html).lazyChildren(); + var collectionItems = page.querySelector('.collectionItems'); + $(collectionItems).append(html); + ImageLoader.lazyChildren(collectionItems); } function renderUserDataIcons(page, item) { @@ -1062,7 +1066,8 @@ html += '

' + Globalize.translate('ButtonMoreItems') + '

'; } - $('#criticReviewsContent', page).html(html).trigger('create'); + var criticReviewsContent = page.querySelector('#criticReviewsContent'); + criticReviewsContent.innerHTML = html; } function renderThemeMedia(page, item) { @@ -1220,7 +1225,9 @@ html += '

' + Globalize.translate('ButtonMoreItems') + '

'; } - $('#scenesContent', page).html(html).trigger('create').lazyChildren(); + var scenesContent = page.querySelector('#scenesContent'); + scenesContent.innerHTML = html; + ImageLoader.lazyChildren(scenesContent); } function renderMediaSources(page, item) { @@ -1235,7 +1242,8 @@ html = '
' + html; } - $('#mediaInfoContent', page).html(html).trigger('create'); + var mediaInfoContent = page.querySelector('#mediaInfoContent'); + mediaInfoContent.innerHTML = html; } function getMediaSourceHtml(item, version) { @@ -1459,7 +1467,9 @@ ApiClient.getSpecialFeatures(user.Id, item.Id).done(function (specials) { - $('#specialsContent', page).html(getVideosHtml(specials, user, limit, "moreSpecials")).lazyChildren().trigger('create'); + var specialsContent = page.querySelector('#specialsContent'); + specialsContent.innerHTML = getVideosHtml(specials, user, limit, "moreSpecials"); + ImageLoader.lazyChildren(specialsContent); }); } @@ -1529,7 +1539,9 @@ html += '

' + Globalize.translate('ButtonMoreItems') + '

'; } - $('#castContent', page).html(html).lazyChildren().trigger('create'); + var castContent = page.querySelector('#castContent'); + castContent.innerHTML = html; + ImageLoader.lazyChildren(castContent); } function play(startPosition) { @@ -1653,9 +1665,9 @@ reload(page); - $(ApiClient).on('websocketmessage', onWebSocketMessage); + Events.on(ApiClient, 'websocketmessage', onWebSocketMessage); - $(LibraryBrowser).on('itemdeleting.detailpage', function (e, itemId) { + Events.on(LibraryBrowser, 'itemdeleting.detailpage', function (e, itemId) { if (currentItem && currentItem.Id == itemId) { Dashboard.navigate('index.html'); @@ -1664,7 +1676,7 @@ }).on('pagebeforehide', "#itemDetailPage", function () { - $(LibraryBrowser).off('itemdeleting.detailpage'); + Events.off(LibraryBrowser, 'itemdeleting.detailpage'); currentItem = null; @@ -1672,7 +1684,7 @@ $(page).off("click.moreScenes").off("click.morePeople").off("click.moreSpecials").off("click.moreCriticReviews"); - $(ApiClient).off('websocketmessage', onWebSocketMessage); + Events.off(ApiClient, 'websocketmessage', onWebSocketMessage); }); function itemDetailPage() { diff --git a/dashboard-ui/scripts/itemlistpage.js b/dashboard-ui/scripts/itemlistpage.js index 602e90423..e9a9b5b7f 100644 --- a/dashboard-ui/scripts/itemlistpage.js +++ b/dashboard-ui/scripts/itemlistpage.js @@ -34,7 +34,7 @@ var result = r2[0]; // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -45,7 +45,7 @@ showLimit: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); @@ -86,9 +86,9 @@ }); } - var elem = $('#items', page).html(html).lazyChildren(); - - $(pagingHtml).appendTo(elem).trigger('create'); + var elem = page.querySelector('#items'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js index 689076772..522f87588 100644 --- a/dashboard-ui/scripts/librarybrowser.js +++ b/dashboard-ui/scripts/librarybrowser.js @@ -336,10 +336,6 @@ }); }, - closePlayMenu: function () { - $('.playFlyout').popup("close").remove(); - }, - getMoreCommands: function (item, user) { var commands = []; @@ -406,7 +402,7 @@ if (result) { ApiClient.deleteItem(itemId); - $(LibraryBrowser).trigger('itemdeleting', [itemId]); + Events.trigger(LibraryBrowser, 'itemdeleting', [itemId]); } }); @@ -2208,7 +2204,7 @@ html += ''; - if (showControls && options.showLimit !== false) { + if (showControls && options.showLimit) { require(['jqmicons']); var id = "selectPageSize"; @@ -2353,16 +2349,14 @@ var id = link.getAttribute('data-itemid'); - var $link = $(link); - - var markAsPlayed = !$link.hasClass('btnUserItemRatingOn'); + var markAsPlayed = !link.classList.contains('btnUserItemRatingOn'); if (markAsPlayed) { ApiClient.markPlayed(Dashboard.getCurrentUserId(), id); - $link.addClass('btnUserItemRatingOn'); + link.classList.add('btnUserItemRatingOn'); } else { ApiClient.markUnplayed(Dashboard.getCurrentUserId(), id); - $link.removeClass('btnUserItemRatingOn'); + link.classList.remove('btnUserItemRatingOn'); } }, @@ -2668,31 +2662,31 @@ elem.html(html); - var page = $(elem).parents('.page'); + var page = $(elem).parents('.page')[0]; - var detailContentEffectedByImage = $('.detailContentEffectedByImage', page); + var detailContentEffectedByImage = page.querySelector('.detailContentEffectedByImage'); if (shape == 'thumb') { - detailContentEffectedByImage.addClass('detailContentEffectedByThumbImage'); - detailContentEffectedByImage.removeClass('detailContentEffectedBySquareImage'); - detailContentEffectedByImage.removeClass('detailContentEffectedByPortraitImage'); + detailContentEffectedByImage.classList.add('detailContentEffectedByThumbImage'); + detailContentEffectedByImage.classList.remove('detailContentEffectedBySquareImage'); + detailContentEffectedByImage.classList.remove('detailContentEffectedByPortraitImage'); elem.addClass('thumbDetailImageContainer'); elem.removeClass('portraitDetailImageContainer'); elem.removeClass('squareDetailImageContainer'); } else if (shape == 'square') { - detailContentEffectedByImage.removeClass('detailContentEffectedByThumbImage'); - detailContentEffectedByImage.addClass('detailContentEffectedBySquareImage'); - detailContentEffectedByImage.removeClass('detailContentEffectedByPortraitImage'); + detailContentEffectedByImage.classList.remove('detailContentEffectedByThumbImage'); + detailContentEffectedByImage.classList.add('detailContentEffectedBySquareImage'); + detailContentEffectedByImage.classList.remove('detailContentEffectedByPortraitImage'); elem.removeClass('thumbDetailImageContainer'); elem.removeClass('portraitDetailImageContainer'); elem.addClass('squareDetailImageContainer'); } else { - detailContentEffectedByImage.removeClass('detailContentEffectedByThumbImage'); - detailContentEffectedByImage.removeClass('detailContentEffectedBySquareImage'); - detailContentEffectedByImage.addClass('detailContentEffectedByPortraitImage'); + detailContentEffectedByImage.classList.remove('detailContentEffectedByThumbImage'); + detailContentEffectedByImage.classList.remove('detailContentEffectedBySquareImage'); + detailContentEffectedByImage.classList.add('detailContentEffectedByPortraitImage'); elem.removeClass('thumbDetailImageContainer'); elem.addClass('portraitDetailImageContainer'); @@ -2875,16 +2869,17 @@ var overview = item.Overview || ''; - elem.html(overview).trigger('create'); + elem = elem[0]; + elem.innerHTML = overview; $('a', elem).each(function () { - $(this).attr("target", "_blank"); + this.setAttribute("target", "_blank"); }); if (overview) { - elem.removeClass('empty'); + elem.classList.remove('empty'); } else { - elem.addClass('empty'); + elem.classList.add('empty'); } }, @@ -3005,7 +3000,7 @@ tag: item.BackdropImageTags[0] }); - $('#itemBackdrop', page).removeClass('noBackdrop').lazyImage(imgUrl); + ImageLoader.lazyImage($('#itemBackdrop', page).removeClass('noBackdrop')[0], imgUrl); } else if (item.ParentBackdropItemId && item.ParentBackdropImageTags && item.ParentBackdropImageTags.length) { @@ -3016,7 +3011,7 @@ maxWidth: screenWidth }); - $('#itemBackdrop', page).removeClass('noBackdrop').lazyImage(imgUrl); + ImageLoader.lazyImage($('#itemBackdrop', page).removeClass('noBackdrop')[0], imgUrl); } else { diff --git a/dashboard-ui/scripts/librarylist.js b/dashboard-ui/scripts/librarylist.js index 248c1be97..2bbedf5fd 100644 --- a/dashboard-ui/scripts/librarylist.js +++ b/dashboard-ui/scripts/librarylist.js @@ -138,12 +138,6 @@ return html; } - function closeContextMenu() { - - // Used by the tab menu, not the slide up - $('.tapHoldMenu').popup('close'); - } - function onTrailerButtonClick() { var id = this.getAttribute('data-itemid'); @@ -152,8 +146,6 @@ MediaController.play({ items: trailers }); }); - closeContextMenu(); - return false; } @@ -165,8 +157,6 @@ var mediaType = this.getAttribute('data-mediatype'); var resumePosition = parseInt(this.getAttribute('data-resumeposition')); - closeContextMenu(); - LibraryBrowser.showPlayMenu(this, id, type, isFolder, mediaType, resumePosition); return false; @@ -176,8 +166,6 @@ var card = $(this).parents('.card')[0]; - closeContextMenu(); - showContextMenu(card, { showPlayOptions: false }); @@ -195,11 +183,9 @@ function showContextMenu(card, options) { - closeContextMenu(); - var displayContextItem = card; - if ($(card).hasClass('listviewMenuButton')) { + if (card.classList.contains('listviewMenuButton')) { card = $(card).parents('.listItem,.card')[0]; } @@ -365,7 +351,14 @@ }); } - var href = card.getAttribute('data-href') || card.href || $('a', card).attr('href'); + var href = card.getAttribute('data-href') || card.href; + + if (!href) { + var link = card.getElementsByTagName('a'); + if (link) { + href = link.href; + } + } require(['actionsheet'], function () { @@ -493,12 +486,12 @@ GroupItems: false }; - var target = $(e.target); - if (target.is('a') || target.is('button')) { + var target = e.target; + if (target.tagName == 'A' || target.tagName == 'BUTTON') { return; } - var buttonParents = target.parents('a:not(.card,.cardContent),button:not(.card,.cardContent)'); + var buttonParents = $(target).parents('a:not(.card,.cardContent),button:not(.card,.cardContent)'); if (buttonParents.length) { return; } @@ -549,18 +542,18 @@ var elem = $('.detailsMenu').popup().trigger('create').popup("open").on("popupafterclose", function () { $(this).off("popupafterclose").remove(); - }); + })[0]; $('.detailsMenuLeftButton', elem).on('click', function () { - var overlay = $(this).parents('.detailsMenu'); - setItemIntoOverlay(overlay, parseInt(overlay.attr('data-index')) - 1, context); + var overlay = $(this).parents('.detailsMenu')[0]; + setItemIntoOverlay(overlay, parseInt(overlay.getAttribute('data-index') || '0') - 1, context); }); $('.detailsMenuRightButton', elem).on('click', function () { - var overlay = $(this).parents('.detailsMenu'); - setItemIntoOverlay(overlay, parseInt(overlay.attr('data-index')) + 1, context); + var overlay = $(this).parents('.detailsMenu')[0]; + setItemIntoOverlay(overlay, parseInt(overlay.getAttribute('data-index') || '0') + 1, context); }); return elem; @@ -568,12 +561,12 @@ function setItemIntoOverlay(elem, index) { - var ids = elem.attr('data-ids').split(','); + var ids = elem.getAttribute('data-ids').split(','); var itemId = ids[index]; var userId = Dashboard.getCurrentUserId(); - var context = elem.attr('data-context'); + var context = elem.getAttribute('data-context'); - elem.attr('data-index', index); + elem.setAttribute('data-index', index); if (index > 0) { $('.detailsMenuLeftButton', elem).show(); @@ -699,7 +692,7 @@ $('.btnSync', elem).on('click', function () { - elem.popup('close'); + $(elem).popup('close'); SyncManager.showMenu({ items: [item] @@ -708,7 +701,7 @@ $('.btnPlay', elem).on('click', function () { - elem.popup('close'); + $(elem).popup('close'); MediaController.play({ items: [item] @@ -717,7 +710,7 @@ $('.btnResume', elem).on('click', function () { - elem.popup('close'); + $(elem).popup('close'); MediaController.play({ items: [item], @@ -738,8 +731,8 @@ function onCardClick(e) { - var target = $(e.target); - if (target.is('.itemSelectionPanel') || $('.itemSelectionPanel', this).length) { + var targetElem = e.target; + if (targetElem.classList.contains('itemSelectionPanel') || this.querySelector('.itemSelectionPanel')) { return false; } @@ -747,28 +740,29 @@ var itemId = info.id; var context = info.context; - var card = $(this); + var card = this; - if (card.hasClass('itemWithAction')) { + if (card.classList.contains('itemWithAction')) { return; } - if (!card.hasClass('card')) { - card = $(card).parents('.card'); + if (!card.classList.contains('card')) { + card = $(card).parents('.card')[0]; } - if (card.hasClass('groupedCard')) { + if (card.classList.contains('groupedCard')) { return; } - if (card.attr('data-detailsmenu') != 'true') { + if (card.getAttribute('data-detailsmenu') != 'true') { return; } - if (target.is('a') || target.is('button')) { + if (targetElem.tagName == 'A' || targetElem.tagName == 'BUTTON') { return; } + var target = $(targetElem); if (target.parents('a').length || target.parents('button').length) { return; } @@ -789,13 +783,13 @@ function onShowTimerExpired(elem) { - elem = $('a', elem)[0]; + elem = elem.querySelector('a'); if ($('.itemSelectionPanel:visible', elem).length) { return; } - var innerElem = $('.cardOverlayTarget', elem); + var innerElem = elem.querySelector('.cardOverlayTarget'); var dataElement = elem; while (dataElement && !dataElement.getAttribute('data-itemid')) { @@ -813,20 +807,20 @@ var item = response1[0]; var user = response2[0]; - var card = $(elem); + var card = elem; - if (!card.hasClass('card')) { - card = card.parents('.card'); + while (!card.classList.contains('card')) { + card = card.parentNode; } - innerElem.html(getOverlayHtml(item, user, card[0], commands)).trigger('create'); + innerElem.innerHTML = getOverlayHtml(item, user, card, commands); $('.btnPlayItem', innerElem).on('click', onPlayItemButtonClick); $('.btnPlayTrailer', innerElem).on('click', onTrailerButtonClick); $('.btnMoreCommands', innerElem).on('click', onMoreButtonClick); }); - innerElem.show().each(function () { + $(innerElem).show().each(function () { this.style.height = 0; @@ -912,9 +906,15 @@ function hideSelections(page) { - $('.selectionCommands', page).hide(); + var selectionCommands = page.querySelector('.selectionCommands'); + if (selectionCommands) { + selectionCommands.style.display = 'none'; + } - $('.itemSelectionPanel', page).hide(); + var elems = page.getElementsByClassName('itemSelectionPanel'); + for (var i = 0, length = elems.length; i < length; i++) { + elems[i].style.display = 'none'; + } } function getSelectedItems(page) { @@ -947,7 +947,9 @@ items: selection }); - $(SyncManager).off('jobsubmit.librarylist').on('jobsubmit.librarylist', function () { + Events.off(SyncManager, 'jobsubmit.librarylist'); + + Events.on(SyncManager, 'jobsubmit.librarylist', function () { hideSelections(page); }); @@ -1067,43 +1069,48 @@ index = elemWithAttributes.getAttribute('data-index'); itemsContainer = $(elem).parents('.itemsContainer'); - closeContextMenu(); - itemsContainer.trigger('playallfromhere', [index]); } return false; } - function resetImages(page) { - - $('.cardImage', page).remove(); - } - $(document).on('pageinitdepends', ".libraryPage", function () { var page = this; - $('.btnAddToPlaylist', page).on('click', function () { - addToPlaylist(page); - }); + var btnAddToPlaylist = page.querySelector('.btnAddToPlaylist'); + if (btnAddToPlaylist) { + Events.on(btnAddToPlaylist, 'click', function () { + addToPlaylist(page); + }); + } - $('.btnMergeVersions', page).on('click', function () { - combineVersions(page); - }); + var btnMergeVersions = page.querySelector('.btnMergeVersions'); + if (btnMergeVersions) { + Events.on(btnMergeVersions, 'click', function () { + combineVersions(page); + }); + } - $('.btnSyncItems', page).on('click', function () { - sync(page); - }); + var btnSyncItems = page.querySelector('.btnSyncItems'); + if (btnSyncItems) { + Events.on(btnSyncItems, 'click', function () { + sync(page); + }); + } - $('.btnAddToCollection', page).on('click', function () { - addToCollection(page); - }); + var btnAddToCollection = page.querySelector('.btnAddToCollection'); + if (btnAddToCollection) { + Events.on(btnAddToCollection, 'click', function () { + addToCollection(page); + }); + } - $('.viewTabButton', page).on('click', function () { + $(page.getElementsByClassName('viewTabButton')).on('click', function () { $('.viewTabButton', page).removeClass('ui-btn-active'); - $(this).addClass('ui-btn-active'); + this.classList.add('ui-btn-active'); $('.viewTab', page).hide(); $('.' + this.getAttribute('data-tab'), page).show(); @@ -1123,7 +1130,10 @@ }).on('click', '.itemWithAction', onItemWithActionClick).on('click', '.listviewSubLink', onListviewSubLinkClick); - $('.itemsContainer', page).createCardMenus(); + var itemsContainers = page.getElementsByClassName('itemsContainer'); + for (var i = 0, length = itemsContainers.length; i < length; i++) { + $(itemsContainers[i]).createCardMenus(); + } }).on('pagebeforeshowready', ".libraryPage", function () { @@ -1131,12 +1141,11 @@ hideSelections(page); - $('.viewTabButton:first', page).trigger('click'); + var elem = page.querySelector('.viewTabButton'); + if (elem) { + Events.trigger(elem, 'click'); + } - }).on('pagebeforehide', ".libraryPage", function () { - - var page = this; - resetImages(page); }); function renderUserDataChanges(card, userData) { diff --git a/dashboard-ui/scripts/librarymenu.js b/dashboard-ui/scripts/librarymenu.js index ddf6a82b6..52c10d5f4 100644 --- a/dashboard-ui/scripts/librarymenu.js +++ b/dashboard-ui/scripts/librarymenu.js @@ -46,9 +46,9 @@ html += ''; $(document.body).append(html); - $('.viewMenuBar').lazyChildren(); + ImageLoader.lazyChildren(document.querySelector('.viewMenuBar')); - $(document).trigger('headercreated'); + Events.trigger(document, 'headercreated'); bindMenuEvents(); } @@ -67,7 +67,7 @@ function addUserToHeader(user) { - var header = $('.viewMenuBar'); + var header = document.querySelector('.viewMenuBar'); if (user.localUser) { $('.btnCast', header).visible(true); @@ -112,7 +112,12 @@ } else { userButtonHtml += '
'; } - $('.headerUserButton', header).html(userButtonHtml).lazyChildren(); + + var headerUserButton = header.querySelector('.headerUserButton'); + if (headerUserButton) { + headerUserButton.innerHTML = userButtonHtml; + ImageLoader.lazyChildren(headerUserButton); + } } } @@ -146,11 +151,11 @@ function updateViewMenuBarHeadroom(page, viewMenuBar) { - if ($(page).hasClass('libraryPage')) { + if (page.classList.contains('libraryPage')) { // Don't like this timeout at all but if headroom is activated during the page events it will jump and flicker on us setTimeout(reEnableHeadroom, 700); } else { - viewMenuBar.addClass('headroomDisabled'); + viewMenuBar.classList.add('headroomDisabled'); } } @@ -169,17 +174,17 @@ function openMainDrawer() { - var drawerPanel = $('.mainDrawerPanel')[0]; + var drawerPanel = document.querySelector('.mainDrawerPanel'); drawerPanel.openDrawer(); lastOpenTime = new Date().getTime(); } function onMainDrawerOpened() { if ($.browser.mobile) { - $(document.body).addClass('bodyWithPopupOpen'); + document.body.classList.add('bodyWithPopupOpen'); } - var drawer = $('.mainDrawerPanel .mainDrawer'); + var drawer = document.querySelector('.mainDrawerPanel .mainDrawer'); ConnectionManager.user(window.ApiClient).done(function (user) { @@ -190,26 +195,28 @@ refreshLibraryInfoInDrawer(user, drawer); refreshBottomUserInfoInDrawer(user, drawer); - $(document).trigger('libraryMenuCreated'); + Events.trigger(document, 'libraryMenuCreated'); updateLibraryMenu(user.localUser); } + var pageElem = $($.mobile.activePage)[0]; + if (requiresDrawerRefresh || requiresDashboardDrawerRefresh) { - refreshDashboardInfoInDrawer($.mobile.activePage, user, drawer); + refreshDashboardInfoInDrawer(pageElem, user, drawer); requiresDashboardDrawerRefresh = false; } requiresDrawerRefresh = false; - updateLibraryNavLinks($.mobile.activePage); + updateLibraryNavLinks(pageElem); }); - $('.mainDrawerPanel #drawer').addClass('verticalScrollingDrawer'); + document.querySelector('.mainDrawerPanel #drawer').classList.add('verticalScrollingDrawer'); } function onMainDrawerClosed() { - $(document.body).removeClass('bodyWithPopupOpen'); - $('.mainDrawerPanel #drawer').removeClass('verticalScrollingDrawer'); + document.body.classList.remove('bodyWithPopupOpen'); + document.querySelector('.mainDrawerPanel #drawer').classList.remove('verticalScrollingDrawer'); } function closeMainDrawer() { @@ -218,7 +225,7 @@ function ensureDrawerStructure(drawer) { - if ($('.mainDrawerContent', drawer).length) { + if (drawer.querySelector('.mainDrawerContent')) { return; } @@ -235,7 +242,7 @@ html += ''; - $(drawer).html(html); + drawer.innerHTML = html; } function refreshUserInfoInDrawer(user, drawer) { @@ -287,9 +294,11 @@ html += '' + Globalize.translate('ButtonRemote') + ''; - var elem = $('.userheader', drawer).html(html); - - $('.lazy', elem).fillImages(); + var userHeader = drawer.querySelector('.userheader'); + + userHeader.innerHTML = html; + + ImageLoader.fillImages(userHeader.getElementsByClassName('lazy')); } function refreshLibraryInfoInDrawer(user, drawer) { @@ -301,7 +310,7 @@ html += '
'; html += '
'; - $('.libraryDrawerContent', drawer).html(html); + drawer.querySelector('.libraryDrawerContent').innerHTML = html; } function refreshDashboardInfoInDrawer(page, user, drawer) { @@ -314,7 +323,7 @@ html = html.split('href=').join('onclick="return LibraryMenu.onLinkClicked(this);" href='); - $('.dashboardDrawerContent', drawer).html(html); + drawer.querySelector('.dashboardDrawerContent').innerHTML = html; } function replaceAll(string, find, replace) { @@ -364,9 +373,9 @@ html += ''; - $('.userFooter', drawer).html(html); + drawer.querySelector('.userFooter').innerHTML = html; - $('.lnkManageServer', drawer).on('click', onManageServerClicked); + Events.on(drawer.querySelector('.lnkManageServer'), 'click', onManageServerClicked); } function updateLibraryMenu(user) { @@ -449,14 +458,16 @@ }).join(''); - var elem = $('.libraryMenuOptions').html(html); + var libraryMenuOptions = document.querySelector('.libraryMenuOptions'); + libraryMenuOptions.innerHTML = html; + var elem = libraryMenuOptions; $('.sidebarLink', elem).off('click.updateText').on('click.updateText', function () { - var section = $('.sectionName', this)[0]; + var section = this.getElementsByClassName('sectionName')[0]; var text = section ? section.innerHTML : this.innerHTML; - $('.libraryMenuButtonText').html(text); + document.querySelector('.libraryMenuButtonText').innerHTML = text; }); }); @@ -496,8 +507,7 @@ function setLibraryMenuText(text) { - $('.libraryMenuButtonText').html('' + text + ''); - + document.querySelector('.libraryMenuButtonText').innerHTML = '' + text + ''; } function getTopParentId() { @@ -565,77 +575,80 @@ function updateLibraryNavLinks(page) { - page = $(page); + var isLiveTvPage = page.classList.contains('liveTvPage'); + var isChannelsPage = page.classList.contains('channelsPage'); + var isEditorPage = page.classList.contains('metadataEditorPage'); + var isReportsPage = page.classList.contains('reportsPage'); + var isMySyncPage = page.classList.contains('mySyncPage'); - var isLiveTvPage = page.hasClass('liveTvPage'); - var isChannelsPage = page.hasClass('channelsPage'); - var isEditorPage = page.hasClass('metadataEditorPage'); - var isReportsPage = page.hasClass('reportsPage'); - var isMySyncPage = page.hasClass('mySyncPage'); - - var id = isLiveTvPage || isChannelsPage || isEditorPage || isReportsPage || isMySyncPage || page.hasClass('allLibraryPage') ? + var id = isLiveTvPage || isChannelsPage || isEditorPage || isReportsPage || isMySyncPage || page.classList.contains('allLibraryPage') ? '' : getTopParentId() || ''; - $('.lnkMediaFolder').each(function () { + var i, length; + var elems = document.getElementsByClassName('lnkMediaFolder'); - var itemId = this.getAttribute('data-itemid'); + for (i = 0, length = elems.length; i < length; i++) { + + var lnkMediaFolder = elems[i]; + var itemId = lnkMediaFolder.getAttribute('data-itemid'); if (isChannelsPage && itemId == 'channels') { - $(this).addClass('selectedMediaFolder'); + lnkMediaFolder.classList.add('selectedMediaFolder'); } else if (isLiveTvPage && itemId == 'livetv') { - $(this).addClass('selectedMediaFolder'); + lnkMediaFolder.classList.add('selectedMediaFolder'); } else if (isEditorPage && itemId == 'editor') { - $(this).addClass('selectedMediaFolder'); + lnkMediaFolder.classList.add('selectedMediaFolder'); } else if (isReportsPage && itemId == 'reports') { - $(this).addClass('selectedMediaFolder'); + lnkMediaFolder.classList.add('selectedMediaFolder'); } else if (isMySyncPage && itemId == 'mysync') { - $(this).addClass('selectedMediaFolder'); + lnkMediaFolder.classList.add('selectedMediaFolder'); } else if (id && itemId == id) { - $(this).addClass('selectedMediaFolder'); + lnkMediaFolder.classList.add('selectedMediaFolder'); } else { - $(this).removeClass('selectedMediaFolder'); + lnkMediaFolder.classList.remove('selectedMediaFolder'); } - - }); + } var context = getParameterByName('context'); if (context !== 'playlists') { - $('.scopedLibraryViewNav a', page).each(function () { - var src = this.href; + elems = page.querySelectorAll('.scopedLibraryViewNav a'); + + for (i = 0, length = elems.length; i < length; i++) { + + var lnk = elems[i]; + var src = lnk.href; if (src.indexOf('#') != -1) { - return; + continue; } src = replaceQueryString(src, 'topParentId', id); - this.href = src; - }); + lnk.href = src; + } } } function updateContextText(page) { - var jPage = $(page); - - var name = jPage.attr('data-contextname'); + var name = page.getAttribute('data-contextname'); if (name) { - $('.libraryMenuButtonText').html('' + name + ''); + document.querySelector('.libraryMenuButtonText').innerHTML = '' + name + ''; } - else if (jPage.hasClass('allLibraryPage') || jPage.hasClass('type-interior')) { - $('.libraryMenuButtonText').html(Globalize.translate('ButtonHome')); + else if (page.classList.contains('allLibraryPage') || page.classList.contains('type-interior')) { + document.querySelector('.libraryMenuButtonText').innerHTML = Globalize.translate('ButtonHome'); } } @@ -654,20 +667,24 @@ function buildViewMenuBar(page) { - if ($(page).hasClass('standalonePage')) { + if (page.classList.contains('standalonePage')) { $('.viewMenuBar').visible(false); return; } + var viewMenuBar = document.querySelector('.viewMenuBar'); + if (requiresViewMenuRefresh) { - $('.viewMenuBar').remove(); + if (viewMenuBar) { + $(viewMenuBar).remove(); + viewMenuBar = null; + } } - var viewMenuBar = $('.viewMenuBar').visible(true); - if (!$('.viewMenuBar').length) { + if (!viewMenuBar) { renderHeader(); - updateViewMenuBarHeadroom(page, $('.viewMenuBar')); + updateViewMenuBarHeadroom(page, document.querySelector('.viewMenuBar')); updateCastIcon(); @@ -678,6 +695,7 @@ ConnectionManager.user(window.ApiClient).done(addUserToHeader); } else { + $(viewMenuBar).visible(true); updateContextText(page); updateLibraryNavLinks(page); updateViewMenuBarHeadroom(page, viewMenuBar); @@ -731,21 +749,21 @@ buildViewMenuBar(page); - var jpage = $(page); - - var isLibraryPage = jpage.hasClass('libraryPage'); + var isLibraryPage = page.classList.contains('libraryPage'); var darkDrawer = false; if (isLibraryPage) { - $(document.body).addClass('libraryDocument').removeClass('dashboardDocument').removeClass('hideMainDrawer'); + document.body.classList.add('libraryDocument'); + document.body.classList.remove('dashboardDocument'); + document.body.classList.remove('hideMainDrawer'); if (AppInfo.enableBottomTabs) { - $(page).addClass('noSecondaryNavPage'); + page.classList.add('noSecondaryNavPage'); $(function () { - $('.footer').addClass('footerOverBottomTabs'); + document.querySelector('.footer').classList.add('footerOverBottomTabs'); }); } else { @@ -760,16 +778,23 @@ darkDrawer = true; } } - else if (jpage.hasClass('type-interior')) { - $(document.body).addClass('dashboardDocument').removeClass('libraryDocument').removeClass('hideMainDrawer'); + else if (page.classList.contains('type-interior')) { + + document.body.classList.remove('libraryDocument'); + document.body.classList.add('dashboardDocument'); + document.body.classList.remove('hideMainDrawer'); + } else { - $(document.body).removeClass('dashboardDocument').removeClass('libraryDocument').addClass('hideMainDrawer'); + + document.body.classList.remove('libraryDocument'); + document.body.classList.remove('dashboardDocument'); + document.body.classList.add('hideMainDrawer'); } if (darkDrawer) { - $('.mainDrawerPanel #drawer').addClass('darkDrawer'); + document.querySelector('.mainDrawerPanel #drawer').classList.add('darkDrawer'); } else { - $('.mainDrawerPanel #drawer').removeClass('darkDrawer'); + document.querySelector('.mainDrawerPanel #drawer').classList.remove('darkDrawer'); } if (AppInfo.enableBackButton) { @@ -779,36 +804,36 @@ function updateBackButton(page) { - var jPage = $(page); - - var canGoBack = backStack.length > 0 && jPage.is('.itemDetailPage'); + var canGoBack = backStack.length > 0 && page.classList.contains('itemDetailPage'); $('.headerBackButton').visible(canGoBack); - jPage.off('swiperight', onPageSwipeLeft); + Events.off(page, 'swiperight', onPageSwipeLeft); if (canGoBack) { - jPage.on('swiperight', onPageSwipeLeft); + Events.on(page, 'swiperight', onPageSwipeLeft); } } function onPageSwipeLeft(e) { - var target = $(e.target); + var target = e.target; - if (!target.is('.hiddenScrollX') && !target.parents('.hiddenScrollX').length) { + if (!target.classList.contains('hiddenScrollX') && !$(target).parents('.hiddenScrollX').length) { history.back(); } } function onPageShowDocumentReady(page) { - var elem = $('.libraryViewNav .ui-btn-active:visible', page); - if (elem.length) { - elem[0].scrollIntoView(); + var elems = page.querySelectorAll('.libraryViewNav .ui-btn-active'); + elems = $(elems).filter(':visible'); + + if (elems.length) { + elems[0].scrollIntoView(); // Scroll back up so in case vertical scroll was messed with - $(document).scrollTop(0); + window.scrollTo(0, 0); } } @@ -830,14 +855,16 @@ }); // initialise headroom.init(); - $(elem).addClass('headroomEnabled'); + elem.classList.add('headroomEnabled'); }); } function initializeApiClient(apiClient) { requiresLibraryMenuRefresh = true; - $(apiClient).off('websocketmessage.librarymenu', onWebSocketMessage).on('websocketmessage.librarymenu', onWebSocketMessage); + Events.off(apiClient, 'websocketmessage.librarymenu', onWebSocketMessage); + + Events.on(apiClient, 'websocketmessage.librarymenu', onWebSocketMessage); } Dashboard.ready(function () { @@ -846,20 +873,24 @@ initializeApiClient(window.ApiClient); } - $(ConnectionManager).on('apiclientcreated', function (e, apiClient) { + Events.on(ConnectionManager, 'apiclientcreated', function (e, apiClient) { initializeApiClient(apiClient); - }).on('localusersignedin localusersignedout', function () { + }); + + Events.on(ConnectionManager, 'localusersignedin localusersignedout', function () { requiresLibraryMenuRefresh = true; requiresViewMenuRefresh = true; requiresDrawerRefresh = true; }); - $(MediaController).on('playerchange', function () { + Events.on(MediaController, 'playerchange', function () { updateCastIcon(); }); - $('.mainDrawerPanel').on('paper-drawer-panel-open', onMainDrawerOpened).on('paper-drawer-panel-close', onMainDrawerClosed); + var mainDrawerPanel = document.querySelector('.mainDrawerPanel'); + Events.on(mainDrawerPanel, 'paper-drawer-panel-open', onMainDrawerOpened); + Events.on(mainDrawerPanel, 'paper-drawer-panel-close', onMainDrawerClosed); }); })(window, document, jQuery, window.devicePixelRatio); @@ -875,7 +906,7 @@ $.fn.createHoverTouch = function () { timerId = setTimeout(function () { - $(elem).trigger('hovertouch'); + Events.trigger(elem, 'hovertouch'); }, 300); } @@ -909,7 +940,7 @@ $.fn.createHoverTouch = function () { preventHover = true; if (preventHover) { - $(this).trigger('hovertouch'); + Events.trigger(this, 'hovertouch'); stopTimer(this); preventHover = false; } diff --git a/dashboard-ui/scripts/livetvchannels.js b/dashboard-ui/scripts/livetvchannels.js index 377579f1f..99e1585f3 100644 --- a/dashboard-ui/scripts/livetvchannels.js +++ b/dashboard-ui/scripts/livetvchannels.js @@ -39,7 +39,9 @@ var html = getChannelsHtml(result.Items); - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/livetvguide.js b/dashboard-ui/scripts/livetvguide.js index b1eaeded3..38be0963c 100644 --- a/dashboard-ui/scripts/livetvguide.js +++ b/dashboard-ui/scripts/livetvguide.js @@ -76,22 +76,25 @@ startIndex: channelQuery.StartIndex, limit: channelQuery.Limit, totalRecordCount: channelsResult.TotalRecordCount, - updatePageSizeSetting: false + updatePageSizeSetting: false, + showLimit: true }); - $('.channelPaging', page).html(channelPagingHtml).trigger('create'); + var channelPaging = page.querySelector('.channelPaging'); + channelPaging.innerHTML = channelPagingHtml; + $(channelPaging).trigger('create'); - $('.btnNextPage', page).on('click', function () { + Events.on(page.querySelector('.btnNextPage'), 'click', function () { channelQuery.StartIndex += channelQuery.Limit; reloadChannels(page); }); - $('.btnPreviousPage', page).on('click', function () { + Events.on(page.querySelector('.btnPreviousPage'), 'click', function () { channelQuery.StartIndex -= channelQuery.Limit; reloadChannels(page); }); - $('.selectPageSize', page).on('change', function () { + Events.on(page.querySelector('#selectPageSize'), 'change', function () { channelQuery.Limit = parseInt(this.value); channelQuery.StartIndex = 0; reloadChannels(page); @@ -260,7 +263,10 @@ html.push(getChannelProgramsHtml(page, date, channels[i], programs)); } - $('.programGrid', page).html(html.join('')).scrollTop(0).scrollLeft(0) + var programGrid = page.querySelector('.programGrid'); + programGrid.innerHTML = html.join(''); + + $(programGrid).scrollTop(0).scrollLeft(0) .createGuideHoverMenu('.programCellInner'); } @@ -297,7 +303,7 @@ html += ''; } - $('.channelList', page).html(html); + page.querySelector('.channelList').innerHTML = html; } function renderGuide(page, date, channels, programs) { @@ -306,7 +312,7 @@ var startDate = date; var endDate = new Date(startDate.getTime() + msPerDay); - $('.timeslotHeaders', page).html(getTimeslotHeadersHtml(startDate, endDate)); + page.querySelector('.timeslotHeaders').innerHTML = getTimeslotHeadersHtml(startDate, endDate); renderPrograms(page, date, channels, programs); } @@ -316,9 +322,8 @@ if (!headersScrolling) { gridScrolling = true; - var grid = $(elem); - $('.timeslotHeaders', page).scrollLeft(grid.scrollLeft()); + $(page.querySelector('.timeslotHeaders')).scrollLeft($(elem).scrollLeft()); gridScrolling = false; } } @@ -327,8 +332,7 @@ if (!gridScrolling) { headersScrolling = true; - elem = $(elem); - $('.programGrid', page).scrollLeft(elem.scrollLeft()); + $(page.querySelector('.programGrid')).scrollLeft($(elem).scrollLeft()); headersScrolling = false; } } @@ -341,7 +345,7 @@ var text = LibraryBrowser.getFutureDateText(date); text = '' + text.replace(' ', ' '); - $('.currentDate', page).html(text); + page.querySelector('.currentDate').innerHTML = text; } var dateOptions = []; @@ -418,8 +422,8 @@ function selectDate(page) { - require(['actionsheet'], function() { - + require(['actionsheet'], function () { + ActionSheetElement.show({ items: dateOptions, showCancel: true, @@ -439,18 +443,18 @@ var page = this; - $('.programGrid', page).on('scroll', function () { + Events.on(page.querySelector('.programGrid'), 'scroll', function () { onProgramGridScroll(page, this); }); if ($.browser.mobile) { - $('.tvGuide', page).addClass('mobileGuide'); + page.querySelector('.tvGuide').classList.add('mobileGuide'); } else { - $('.tvGuide', page).removeClass('mobileGuide'); + page.querySelector('.tvGuide').classList.remove('mobileGuide'); - $('.timeslotHeaders', page).on('scroll', function () { + Events.on(page.querySelector('.timeslotHeaders'), 'scroll', function () { onTimeslotHeadersScroll(page, this); }); @@ -459,14 +463,10 @@ if (AppInfo.enableHeadRoom) { requirejs(["thirdparty/headroom"], function () { - $('.tvGuideHeader', page).each(function () { - - // construct an instance of Headroom, passing the element - var headroom = new Headroom(this); - // initialise - headroom.init(); - - }); + // construct an instance of Headroom, passing the element + var headroom = new Headroom(page.querySelector('.tvGuideHeader')); + // initialise + headroom.init(); }); } diff --git a/dashboard-ui/scripts/livetvitems.js b/dashboard-ui/scripts/livetvitems.js index 1ed17e4d6..2a55572d7 100644 --- a/dashboard-ui/scripts/livetvitems.js +++ b/dashboard-ui/scripts/livetvitems.js @@ -31,7 +31,7 @@ ApiClient.getLiveTvPrograms(query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -42,7 +42,7 @@ showLimit: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); @@ -72,9 +72,9 @@ }); } - var elem = $('.itemsContainer', page).html(html).lazyChildren(); - - $(pagingHtml).appendTo(elem).trigger('create'); + var elem = page.querySelector('.itemsContainer'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/livetvrecordinglist.js b/dashboard-ui/scripts/livetvrecordinglist.js index bdee1fba0..04c3e74db 100644 --- a/dashboard-ui/scripts/livetvrecordinglist.js +++ b/dashboard-ui/scripts/livetvrecordinglist.js @@ -14,7 +14,7 @@ ApiClient.getLiveTvRecordings(query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -49,7 +49,9 @@ updatePageSizeSetting: false }); - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/livetvsuggested.js b/dashboard-ui/scripts/livetvsuggested.js index 6dc391f4a..3c36b24ad 100644 --- a/dashboard-ui/scripts/livetvsuggested.js +++ b/dashboard-ui/scripts/livetvsuggested.js @@ -24,7 +24,9 @@ }); - $('.activeProgramItems', page).html(html).lazyChildren(); + var elem = page.querySelector('.activeProgramItems'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); Dashboard.hideLoadingMsg(); }); } @@ -56,7 +58,9 @@ }); - $('.upcomingProgramItems', page).html(html).lazyChildren(); + var elem = page.querySelector('.upcomingProgramItems'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); }); ApiClient.getLiveTvRecommendedPrograms({ @@ -78,7 +82,9 @@ lazy: true }); - $('.upcomingTvMovieItems', page).html(html).lazyChildren(); + var elem = page.querySelector('.upcomingTvMovieItems'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); }); ApiClient.getLiveTvRecommendedPrograms({ @@ -100,7 +106,9 @@ lazy: true }); - $('.upcomingSportsItems', page).html(html).lazyChildren(); + var elem = page.querySelector('.upcomingSportsItems'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); }); } diff --git a/dashboard-ui/scripts/mediacontroller.js b/dashboard-ui/scripts/mediacontroller.js index 0a341f6d1..ebdeb4d36 100644 --- a/dashboard-ui/scripts/mediacontroller.js +++ b/dashboard-ui/scripts/mediacontroller.js @@ -39,7 +39,7 @@ function monitorPlayer(player) { - $(player).on('playbackstart.mediacontroller', function (e, state) { + Events.on(player, 'playbackstart.mediacontroller', function (e, state) { var info = { QueueableMediaTypes: state.NowPlayingItem.MediaType, @@ -51,7 +51,9 @@ ApiClient.reportPlaybackStart(info); - }).on('playbackstop.mediacontroller', function (e, state) { + }); + + Events.on(player, 'playbackstop.mediacontroller', function (e, state) { var stopInfo = { itemId: state.NowPlayingItem.Id, @@ -190,7 +192,7 @@ }); - if ($('.radioSelectPlayerTarget:checked', elem).attr('data-mirror') == 'true') { + if ($('.radioSelectPlayerTarget:checked', elem)[0].getAttribute('data-mirror') == 'true') { $('.fldMirrorMode', elem).show(); } else { $('.fldMirrorMode', elem).hide(); diff --git a/dashboard-ui/scripts/mediaplayer-video.js b/dashboard-ui/scripts/mediaplayer-video.js index 645bea063..62e91c198 100644 --- a/dashboard-ui/scripts/mediaplayer-video.js +++ b/dashboard-ui/scripts/mediaplayer-video.js @@ -1178,23 +1178,28 @@ var index = self.currentPlaylistIndex(null); var length = self.playlist.length; var requiresNativeControls = !self.enableCustomVideoControls(); - var controls = $(requiresNativeControls ? '.videoAdvancedControls' : '.videoControls'); if (length < 2) { $('.videoTrackControl').hide(); return; } + var controls = requiresNativeControls ? '.videoAdvancedControls' : '.videoControls'; + controls = document.getElementsByClassName(controls)[0]; + + var previousTrackButton = controls.getElementsByClassName('previousTrackButton')[0]; + var nextTrackButton = controls.getElementsByClassName('nextTrackButton')[0]; + if (index === 0) { - $('.previousTrackButton', controls).attr('disabled', 'disabled'); + previousTrackButton.setAttribute('disabled', 'disabled'); } else { - $('.previousTrackButton', controls).removeAttr('disabled'); + previousTrackButton.removeAttribute('disabled'); } if ((index + 1) >= length) { - $('.nextTrackButton', controls).attr('disabled', 'disabled'); + nextTrackButton.setAttribute('disabled', 'disabled'); } else { - $('.nextTrackButton', controls).removeAttr('disabled'); + nextTrackButton.removeAttribute('disabled'); } $('.videoTrackControl', controls).show(); diff --git a/dashboard-ui/scripts/mediaplayer.js b/dashboard-ui/scripts/mediaplayer.js index f49dede21..45f7919c6 100644 --- a/dashboard-ui/scripts/mediaplayer.js +++ b/dashboard-ui/scripts/mediaplayer.js @@ -557,11 +557,15 @@ clearProgressInterval(); - $(mediaRenderer).off('ended.playbackstopped').off('ended.playnext').one("play", function () { + Events.off(mediaRenderer, 'ended.playbackstopped').off('ended.playnext'); + + $(mediaRenderer).one("play", function () { self.updateCanClientSeek(this); - $(this).on('ended.playbackstopped', self.onPlaybackStopped).one('ended.playnext', self.playNextAfterEnded); + Events.on(this, 'ended.playbackstopped', self.onPlaybackStopped); + + $(this).one('ended.playnext', self.playNextAfterEnded); self.startProgressInterval(); sendProgressUpdate(); @@ -616,7 +620,7 @@ var state = self.getPlayerStateInternal(self.currentMediaRenderer, self.currentItem, self.currentMediaSource); - $(self).trigger('positionchange', [state]); + Events.trigger(self, 'positionchange', [state]); }; self.canQueueMediaType = function (mediaType) { @@ -1353,9 +1357,11 @@ mediaRenderer.stop(); - $(mediaRenderer).off("ended.playnext").one("ended", function () { + Events.off(mediaRenderer, "ended.playnext"); - $(this).off(); + $(mediaRenderer).one("ended", function() { + + Events.off(this); this.cleanup(destroyRenderer); @@ -1363,7 +1369,9 @@ self.currentItem = null; self.currentMediaSource = null; - }).trigger("ended"); + }); + + Events.trigger(mediaRenderer, "ended"); } else { self.currentMediaRenderer = null; @@ -1531,7 +1539,7 @@ var state = self.getPlayerStateInternal(mediaRenderer, item, mediaSource); - $(self).trigger('playbackstart', [state]); + Events.trigger(self, 'playbackstart', [state]); self.startProgressInterval(); }; @@ -1542,7 +1550,7 @@ var state = self.getPlayerStateInternal(mediaRenderer, self.currentItem, self.currentMediaSource); - $(self).trigger('volumechange', [state]); + Events.trigger(self, 'volumechange', [state]); }; self.cleanup = function () { @@ -1553,11 +1561,13 @@ Logger.log('playback stopped'); - $(document.body).removeClass('bodyWithPopupOpen'); + document.body.classList.remove('bodyWithPopupOpen'); var mediaRenderer = this; - $(mediaRenderer).off('.mediaplayerevent').off('ended.playbackstopped'); + Events.off(mediaRenderer, '.mediaplayerevent'); + + Events.off(mediaRenderer, 'ended.playbackstopped'); self.cleanup(mediaRenderer); @@ -1576,17 +1586,17 @@ var state = self.getPlayerStateInternal(mediaRenderer, item, mediaSource); - $(self).trigger('playbackstop', [state]); + Events.trigger(self, 'playbackstop', [state]); }; self.onPlaystateChange = function (mediaRenderer) { var state = self.getPlayerStateInternal(mediaRenderer, self.currentItem, self.currentMediaSource); - $(self).trigger('playstatechange', [state]); + Events.trigger(self, 'playstatechange', [state]); }; - $(window).on("beforeunload", function () { + Events.on(window, "beforeunload", function () { // Try to report playback stopped before the browser closes if (self.currentItem && self.currentMediaRenderer && currentProgressInterval) { @@ -1673,18 +1683,22 @@ mediaRenderer.setPoster(self.getPosterUrl(item)); mediaRenderer.setCurrentSrc(audioUrl, item, mediaSource); - $(mediaRenderer).on("volumechange.mediaplayerevent", function () { + Events.on(mediaRenderer, "volumechange.mediaplayerevent", function() { Logger.log('audio element event: volumechange'); self.onVolumeChanged(this); - }).one("playing.mediaplayerevent", function () { + }); + + $(mediaRenderer).one("playing.mediaplayerevent", function () { Logger.log('audio element event: playing'); // For some reason this is firing at the start, so don't bind until playback has begun - $(this).on("ended.playbackstopped", self.onPlaybackStopped).one('ended.playnext', self.playNextAfterEnded); + Events.on(this, "ended.playbackstopped", self.onPlaybackStopped); + + $(this).one('ended.playnext', self.playNextAfterEnded); self.onPlaybackStart(this, item, mediaSource); diff --git a/dashboard-ui/scripts/moviecollections.js b/dashboard-ui/scripts/moviecollections.js index dc942fdb1..24207caaf 100644 --- a/dashboard-ui/scripts/moviecollections.js +++ b/dashboard-ui/scripts/moviecollections.js @@ -33,7 +33,7 @@ var user = response2[0]; // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -111,10 +111,12 @@ $('.noItemsMessage', page).show(); } - $('.itemsContainer', page).html(html).lazyChildren(); + var elem = page.querySelector('.itemsContainer'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); if (trigger) { - $('.itemsContainer', page).trigger('create'); + $(elem).trigger('create'); } $('.btnNextPage', page).on('click', function () { diff --git a/dashboard-ui/scripts/moviegenres.js b/dashboard-ui/scripts/moviegenres.js index ebddc2e35..003ca9092 100644 --- a/dashboard-ui/scripts/moviegenres.js +++ b/dashboard-ui/scripts/moviegenres.js @@ -25,7 +25,7 @@ ApiClient.getGenres(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -85,7 +85,9 @@ }); } - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/moviepeople.js b/dashboard-ui/scripts/moviepeople.js index 32027e2b5..64a11bf24 100644 --- a/dashboard-ui/scripts/moviepeople.js +++ b/dashboard-ui/scripts/moviepeople.js @@ -27,7 +27,7 @@ ApiClient.getPeople(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -40,7 +40,7 @@ pageSizeKey: pageSizeKey }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); @@ -54,9 +54,9 @@ lazy: true }); - var elem = $('#items', page).html(html).lazyChildren(); - - $(pagingHtml).appendTo(elem).trigger('create'); + var elem = page.querySelector('#items'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/movies.js b/dashboard-ui/scripts/movies.js index a60c5ffd0..f9794d442 100644 --- a/dashboard-ui/scripts/movies.js +++ b/dashboard-ui/scripts/movies.js @@ -29,7 +29,7 @@ ApiClient.getItems(userId, query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -43,7 +43,7 @@ }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); var trigger = false; @@ -129,14 +129,14 @@ }); } - var elem = $('.itemsContainer', page).html(html).lazyChildren(); + var elem = page.querySelector('.itemsContainer'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); if (trigger) { - $(elem).trigger('create'); + Events.trigger(elem, 'create'); } - $(pagingHtml).appendTo(elem).trigger('create'); - $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; reloadItems(page); diff --git a/dashboard-ui/scripts/moviesrecommended.js b/dashboard-ui/scripts/moviesrecommended.js index f20efcfe0..9d880ecf7 100644 --- a/dashboard-ui/scripts/moviesrecommended.js +++ b/dashboard-ui/scripts/moviesrecommended.js @@ -242,10 +242,11 @@ var page = this; var userId = Dashboard.getCurrentUserId(); + var containers = page.querySelectorAll('.itemsContainer'); if (enableScrollX()) { - $('.itemsContainer', page).addClass('hiddenScrollX'); + $(containers).addClass('hiddenScrollX'); } else { - $('.itemsContainer', page).removeClass('hiddenScrollX'); + $(containers).removeClass('hiddenScrollX'); } loadResume(page, userId, parentId); diff --git a/dashboard-ui/scripts/moviestudios.js b/dashboard-ui/scripts/moviestudios.js index 3842c6a75..51bca2fe2 100644 --- a/dashboard-ui/scripts/moviestudios.js +++ b/dashboard-ui/scripts/moviestudios.js @@ -23,7 +23,7 @@ ApiClient.getStudios(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -34,7 +34,7 @@ showLimit: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); @@ -48,9 +48,9 @@ lazy: true }); - var elem = $('#items', page).html(html).lazyChildren().trigger('create'); - - $(pagingHtml).appendTo(elem).trigger('create'); + var elem = page.querySelector('#items'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/movietrailers.js b/dashboard-ui/scripts/movietrailers.js index 1806f58c2..e859ac108 100644 --- a/dashboard-ui/scripts/movietrailers.js +++ b/dashboard-ui/scripts/movietrailers.js @@ -28,7 +28,7 @@ ApiClient.getJSON(ApiClient.getUrl('Trailers', query)).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); if (result.Items.length) { $('.noItemsMessage', page).hide(); @@ -46,7 +46,7 @@ showLimit: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); @@ -58,9 +58,9 @@ showDetailsMenu: true }); - var elem = $('.itemsContainer', page).html(html).lazyChildren(); - - $(pagingHtml).appendTo(elem).trigger('create'); + var elem = page.querySelector('.itemsContainer'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/musicalbumartists.js b/dashboard-ui/scripts/musicalbumartists.js index a17c1c94e..92778b37a 100644 --- a/dashboard-ui/scripts/musicalbumartists.js +++ b/dashboard-ui/scripts/musicalbumartists.js @@ -28,7 +28,7 @@ ApiClient.getAlbumArtists(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -41,7 +41,7 @@ pageSizeKey: pageSizeKey }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); var trigger = false; @@ -80,14 +80,14 @@ }); } - var elem = $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); if (trigger) { - elem.trigger('create'); + $(elem).trigger('create'); } - $(pagingHtml).appendTo(elem).trigger('create'); - $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; reloadItems(page); diff --git a/dashboard-ui/scripts/musicalbums.js b/dashboard-ui/scripts/musicalbums.js index 17fcdc779..5544de402 100644 --- a/dashboard-ui/scripts/musicalbums.js +++ b/dashboard-ui/scripts/musicalbums.js @@ -27,7 +27,7 @@ ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -39,7 +39,7 @@ addSelectionButton: true }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); var trigger = false; @@ -88,14 +88,14 @@ }); } - var elem = $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); if (trigger) { - elem.trigger('create'); + $(elem).trigger('create'); } - $(pagingHtml).appendTo(elem).trigger('create'); - $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; reloadItems(page); diff --git a/dashboard-ui/scripts/musicartists.js b/dashboard-ui/scripts/musicartists.js index 90839a9c3..7bc195f8b 100644 --- a/dashboard-ui/scripts/musicartists.js +++ b/dashboard-ui/scripts/musicartists.js @@ -28,7 +28,7 @@ ApiClient.getArtists(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -42,7 +42,7 @@ pageSizeKey: pageSizeKey }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); var trigger = false; @@ -81,14 +81,14 @@ }); } - var elem = $('.itemsContainer', page).html(html).lazyChildren(); + var elem = page.querySelector('.itemsContainer'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); if (trigger) { - elem.trigger('create'); + $(elem).trigger('create'); } - $(pagingHtml).appendTo(elem).trigger('create'); - $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; reloadItems(page); diff --git a/dashboard-ui/scripts/musicgenres.js b/dashboard-ui/scripts/musicgenres.js index 1748c1471..063834371 100644 --- a/dashboard-ui/scripts/musicgenres.js +++ b/dashboard-ui/scripts/musicgenres.js @@ -25,7 +25,7 @@ ApiClient.getMusicGenres(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -65,7 +65,9 @@ }); } - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/musicrecommended.js b/dashboard-ui/scripts/musicrecommended.js index 67f88d1cd..54ab165c7 100644 --- a/dashboard-ui/scripts/musicrecommended.js +++ b/dashboard-ui/scripts/musicrecommended.js @@ -178,10 +178,11 @@ loadRecentlyPlayed(page, parentId); loadFrequentlyPlayed(page, parentId); + var containers = page.querySelectorAll('.itemsContainer'); if (enableScrollX()) { - $('.itemsContainer', page).addClass('hiddenScrollX'); + $(containers).addClass('hiddenScrollX'); } else { - $('.itemsContainer', page).removeClass('hiddenScrollX'); + $(containers).removeClass('hiddenScrollX'); } }); diff --git a/dashboard-ui/scripts/musicvideos.js b/dashboard-ui/scripts/musicvideos.js index 28f4146c7..7bf905730 100644 --- a/dashboard-ui/scripts/musicvideos.js +++ b/dashboard-ui/scripts/musicvideos.js @@ -25,7 +25,7 @@ ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -65,7 +65,9 @@ }); } - $('#items', page).html(html).trigger('create').lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/nowplayingbar.js b/dashboard-ui/scripts/nowplayingbar.js index 066e43aa9..9cad9ebce 100644 --- a/dashboard-ui/scripts/nowplayingbar.js +++ b/dashboard-ui/scripts/nowplayingbar.js @@ -167,17 +167,17 @@ function getNowPlayingBar() { - var elem = $('.nowPlayingBar'); + var elem = document.querySelector('.nowPlayingBar'); - if (elem.length) { + if (elem) { return elem; } - elem = $(getNowPlayingBarHtml()).insertBefore('#footerNotifications').trigger('create'); + elem = $(getNowPlayingBarHtml()).insertBefore('#footerNotifications')[0]; if ($.browser.safari && $.browser.mobile) { // Not handled well here. The wrong elements receive events, bar doesn't update quickly enough, etc. - elem.addClass('noMediaProgress'); + elem.classList.add('noMediaProgress'); } bindEvents(elem); @@ -408,7 +408,7 @@ var nowPlayingBar = getNowPlayingBar(); - nowPlayingBar.show(); + $(nowPlayingBar).show(); } function hideNowPlayingBar() { @@ -417,7 +417,10 @@ // in the event of a stop->play command // Don't call getNowPlayingBar here because we don't want to end up creating it just to hide it - $('.nowPlayingBar').hide(); + var elem = document.getElementsByClassName('nowPlayingBar')[0]; + if (elem) { + elem.style.display = 'none'; + } } function onPlaybackStopped(e, state) { @@ -446,7 +449,7 @@ if (currentPlayer) { - $(currentPlayer).off('.nowplayingbar'); + Events.off(currentPlayer, '.nowplayingbar'); currentPlayer.endPlayerUpdates(); currentPlayer = null; @@ -492,7 +495,7 @@ Dashboard.ready(function () { - $(MediaController).on('playerchange', function () { + Events.on(MediaController, 'playerchange', function () { bindToPlayer(MediaController.getCurrentPlayer()); }); diff --git a/dashboard-ui/scripts/nowplayingpage.js b/dashboard-ui/scripts/nowplayingpage.js index ebc0d0e0b..65440a2d0 100644 --- a/dashboard-ui/scripts/nowplayingpage.js +++ b/dashboard-ui/scripts/nowplayingpage.js @@ -374,7 +374,7 @@ function onStateChanged(e, state) { - updatePlayerState($.mobile.activePage, state); + updatePlayerState($($.mobile.activePage)[0], state); } function showButton(button) { diff --git a/dashboard-ui/scripts/photos.js b/dashboard-ui/scripts/photos.js index 16b75cc61..a596ea7ef 100644 --- a/dashboard-ui/scripts/photos.js +++ b/dashboard-ui/scripts/photos.js @@ -25,7 +25,7 @@ ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -36,7 +36,7 @@ showLimit: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); @@ -65,9 +65,9 @@ }); } - var elem = $('#items', page).html(html).lazyChildren(); - - $(pagingHtml).appendTo(elem).trigger('create'); + var elem = page.querySelector('#items'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/playlistedit.js b/dashboard-ui/scripts/playlistedit.js index cc80e9320..a0d80f57a 100644 --- a/dashboard-ui/scripts/playlistedit.js +++ b/dashboard-ui/scripts/playlistedit.js @@ -73,7 +73,7 @@ } // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -112,7 +112,9 @@ $('.noItemsMessage', page).show(); } - $('.itemsContainer', page).html(html).trigger('create').lazyChildren(); + var elem = page.querySelector('.itemsContainer'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/playlists.js b/dashboard-ui/scripts/playlists.js index 7fb95735c..48493667c 100644 --- a/dashboard-ui/scripts/playlists.js +++ b/dashboard-ui/scripts/playlists.js @@ -40,7 +40,7 @@ var user = response2[0]; // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -86,10 +86,12 @@ $('.noItemsMessage', page).show(); } - $('.itemsContainer', page).html(html).lazyChildren(); + var elem = page.querySelector('.itemsContainer'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); if (trigger) { - $('.itemsContainer', page).trigger('create'); + $(elem).trigger('create'); } $('.btnNextPage', page).on('click', function () { diff --git a/dashboard-ui/scripts/reports.js b/dashboard-ui/scripts/reports.js index bb049745c..2e6e48360 100644 --- a/dashboard-ui/scripts/reports.js +++ b/dashboard-ui/scripts/reports.js @@ -260,7 +260,7 @@ function renderItems(page, result) { - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; if (SelectedReportView === "ReportData") { @@ -274,7 +274,7 @@ showLimit: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; $('.listTopPaging', page).show(); $('.listBottomPaging', page).html(pagingHtml).trigger('create'); diff --git a/dashboard-ui/scripts/search.js b/dashboard-ui/scripts/search.js index b48016e12..0eb8ca8fb 100644 --- a/dashboard-ui/scripts/search.js +++ b/dashboard-ui/scripts/search.js @@ -151,12 +151,12 @@ if (val) { updateSearchOverlay(getSearchOverlay(true).fadeIn('fast'), val); - $(document.body).addClass('bodyWithPopupOpen'); + document.body.classList.add('bodyWithPopupOpen'); } else { updateSearchOverlay(getSearchOverlay(false).fadeOut('fast'), val); - $(document.body).removeClass('bodyWithPopupOpen'); + document.body.classList.remove('bodyWithPopupOpen'); } } diff --git a/dashboard-ui/scripts/sections.js b/dashboard-ui/scripts/sections.js index 000dfd14e..e9baaf558 100644 --- a/dashboard-ui/scripts/sections.js +++ b/dashboard-ui/scripts/sections.js @@ -123,7 +123,7 @@ html += getLibraryButtonsHtml(items); html += ''; - $(elem).html(html); + elem.innerHTML = html; handleLibraryLinkNavigations(elem); }); @@ -177,7 +177,9 @@ html += ''; } - $(elem).html(html).lazyChildren().createCardMenus(); + elem.innerHTML = html; + + $(elem).lazyChildren().createCardMenus(); }); } @@ -212,7 +214,9 @@ html += ''; } - $(elem).html(html).lazyChildren().createCardMenus(); + elem.innerHTML = html; + + $(elem).lazyChildren().createCardMenus(); }); } @@ -262,7 +266,9 @@ html += ''; } - $(elem).html(html).lazyChildren().createCardMenus({ showDetailsMenu: false }); + elem.innerHTML = html; + + $(elem).lazyChildren().createCardMenus({ showDetailsMenu: false }); handleLibraryLinkNavigations(elem); }); @@ -315,7 +321,9 @@ html += ''; } - $(elem).html(html).lazyChildren().createCardMenus(); + elem.innerHTML = html; + + $(elem).lazyChildren().createCardMenus(); }); } @@ -350,7 +358,7 @@ }).join(''); - $(elem).html(channelsHtml); + elem.innerHTML = channelsHtml; for (var i = 0, length = channels.length; i < length; i++) { @@ -402,7 +410,10 @@ }); html += ''; - $('#channel' + channel.Id + '', page).html(html).lazyChildren().trigger('create').createCardMenus(); + var elem = page.querySelector('#channel' + channel.Id + ''); + elem.innerHTML = html; + + $(elem).lazyChildren().trigger('create').createCardMenus(); }); } @@ -441,7 +452,9 @@ showDetailsMenu: true }); - elem.html(html).lazyChildren().trigger('create'); + elem.innerHTML = html; + + $(elem).lazyChildren().trigger('create'); }); } diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js index ce0e12d6f..ca0060c2b 100644 --- a/dashboard-ui/scripts/site.js +++ b/dashboard-ui/scripts/site.js @@ -338,7 +338,7 @@ var Dashboard = { var html = '' + Globalize.translate('MessagePleaseRestart') + ''; if (systemInfo.CanSelfRestart) { - html += ''; + html += ''; } Dashboard.showFooterNotification({ id: "serverRestartWarning", html: html, forceShow: true, allowHide: false }); @@ -346,14 +346,17 @@ var Dashboard = { hideServerRestartWarning: function () { - $('#serverRestartWarning').remove(); + var elem = document.getElementById('serverRestartWarning'); + if (elem) { + elem.parentNode.removeChild(elem); + } }, showDashboardRefreshNotification: function () { var html = '' + Globalize.translate('MessagePleaseRefreshPage') + ''; - html += ''; + html += ''; Dashboard.showFooterNotification({ id: "dashboardVersionWarning", html: html, forceShow: true, allowHide: false }); }, @@ -376,7 +379,12 @@ var Dashboard = { hideDashboardVersionWarning: function () { - $('#dashboardVersionWarning').remove(); + var elem = document.getElementById('dashboardVersionWarning'); + + if (elem) { + + elem.parentNode.removeChild(elem); + } }, showFooterNotification: function (options) { @@ -614,7 +622,9 @@ var Dashboard = { html += ''; html += ''; - $(document.body).append(html).addClass('bodyWithPopupOpen'); + $(document.body).append(html); + + document.body.classList.add('bodyWithPopupOpen'); // This timeout is obviously messy but it's unclear how to determine when the webcomponent is ready for use // element onload never fires @@ -625,8 +635,8 @@ var Dashboard = { // Has to be assigned a z-index after the call to .open() $(dlg).on('iron-overlay-closed', function (e) { var confirmed = this.closingReason.confirmed; - $(this).remove(); - $(document.body).removeClass('bodyWithPopupOpen'); + this.parentNode.removeChild(this); + document.body.classList.remove('bodyWithPopupOpen'); callback(confirmed); }); @@ -798,7 +808,7 @@ var Dashboard = { ensureHeader: function (page) { - if (page.hasClass('standalonePage') && !page.hasClass('noHeaderPage')) { + if (page.classList.contains('standalonePage') && !page.classList.contains('noHeaderPage')) { Dashboard.renderHeader(page); } @@ -806,16 +816,16 @@ var Dashboard = { renderHeader: function (page) { - var header = $('.header', page); + var header = page.querySelector('.header'); - if (!header.length) { + if (!header) { var headerHtml = ''; headerHtml += '
'; headerHtml += ''; headerHtml += '
'; - page.prepend(headerHtml); + $(page).prepend(headerHtml); } }, @@ -885,9 +895,9 @@ var Dashboard = { ensureToolsMenu: function (page) { - var sidebar = $('.toolsSidebar', page); + var sidebar = page.querySelector('.toolsSidebar'); - if (!sidebar.length) { + if (!sidebar) { var html = '
'; @@ -901,55 +911,55 @@ var Dashboard = { html += '
'; $('.content-primary', page).before(html); - $(page).trigger('create'); + Events.trigger(page, 'create'); } }, getToolsMenuLinks: function (page) { - var pageElem = page[0]; + var pageElem = page; - var isServicesPage = page.hasClass('appServicesPage'); + var isServicesPage = page.classList.contains('appServicesPage'); var context = getParameterByName('context'); return [{ name: Globalize.translate('TabServer'), href: "dashboard.html", - selected: page.hasClass("dashboardHomePage"), + selected: page.classList.contains("dashboardHomePage"), icon: 'dashboard', color: '#38c' }, { name: Globalize.translate('TabDevices'), href: "devices.html", - selected: page.hasClass("devicesPage"), + selected: page.classList.contains("devicesPage"), icon: 'tablet', color: '#ECA403' }, { name: Globalize.translate('TabUsers'), href: "userprofiles.html", - selected: page.hasClass("userProfilesPage"), + selected: page.classList.contains("userProfilesPage"), icon: 'people', color: '#679C34' }, { name: Globalize.translate('TabLibrary'), divider: true, href: "library.html", - selected: page.hasClass("mediaLibraryPage"), + selected: page.classList.contains("mediaLibraryPage"), icon: 'video-library' }, { name: Globalize.translate('TabMetadata'), href: "metadata.html", - selected: page.hasClass('metadataConfigurationPage'), + selected: page.classList.contains('metadataConfigurationPage'), icon: 'insert-drive-file' }, { name: Globalize.translate('TabPlayback'), href: "playbackconfiguration.html", - selected: page.hasClass('playbackConfigurationPage'), + selected: page.classList.contains('playbackConfigurationPage'), icon: 'play-circle-filled' }, { name: Globalize.translate('TabSync'), href: "syncactivity.html", - selected: page.hasClass('syncConfigurationPage') || (isServicesPage && context == 'sync'), + selected: page.classList.contains('syncConfigurationPage') || (isServicesPage && context == 'sync'), icon: 'refresh' }, { divider: true, @@ -957,31 +967,31 @@ var Dashboard = { }, { name: Globalize.translate('TabAutoOrganize'), href: "autoorganizelog.html", - selected: page.hasClass("organizePage"), + selected: page.classList.contains("organizePage"), icon: 'folder', color: '#01C0DD' }, { name: Globalize.translate('TabDLNA'), href: "dlnasettings.html", - selected: page.hasClass("dlnaPage"), + selected: page.classList.contains("dlnaPage"), icon: 'tv', color: '#E5342E' }, { name: Globalize.translate('TabLiveTV'), href: "livetvstatus.html", - selected: page.hasClass("liveTvSettingsPage") || (isServicesPage && context == 'livetv'), + selected: page.classList.contains("liveTvSettingsPage") || (isServicesPage && context == 'livetv'), icon: 'live-tv', color: '#293AAE' }, { name: Globalize.translate('TabNotifications'), href: "notificationsettings.html", - selected: page.hasClass("notificationConfigurationPage"), + selected: page.classList.contains("notificationConfigurationPage"), icon: 'notifications', color: 'brown' }, { name: Globalize.translate('TabPlugins'), href: "plugins.html", - selected: page.hasClass("pluginConfigurationPage"), + selected: page.classList.contains("pluginConfigurationPage"), icon: 'add-shopping-cart', color: '#9D22B1' }, { @@ -990,13 +1000,13 @@ var Dashboard = { }, { name: Globalize.translate('TabAdvanced'), href: "advanced.html", - selected: page.hasClass("advancedConfigurationPage"), + selected: page.classList.contains("advancedConfigurationPage"), icon: 'settings', color: '#F16834' }, { name: Globalize.translate('TabScheduledTasks'), href: "scheduledtasks.html", - selected: page.hasClass("scheduledTasksConfigurationPage"), + selected: page.classList.contains("scheduledTasksConfigurationPage"), icon: 'schedule', color: '#38c' }, { @@ -1295,21 +1305,23 @@ var Dashboard = { ensurePageTitle: function (page) { - if (!page.hasClass('type-interior')) { + if (!page.classList.contains('type-interior')) { return; } - if ($('.pageTitle', page).length) { + var pageElem = page; + + if (pageElem.querySelector('.pageTitle')) { return; } - var parent = $('.content-primary', page); + var parent = pageElem.querySelector('.content-primary'); - if (!parent.length) { - parent = $('.ui-content', page)[0]; + if (!parent) { + parent = pageElem.getElementsByClassName('ui-content')[0]; } - var helpUrl = page.attr('data-helpurl'); + var helpUrl = pageElem.getAttribute('data-helpurl'); var html = '
'; html += '

' + (document.title || ' ') + '

'; @@ -1329,7 +1341,11 @@ var Dashboard = { setPageTitle: function (title) { - $('.pageTitle', $.mobile.activePage).html(title); + var elem = $($.mobile.activePage)[0].querySelector('.pageTitle'); + + if (elem) { + elem.innerHTML = title; + } if (title) { document.title = title; @@ -1579,10 +1595,10 @@ var Dashboard = { if (dependencies && dependencies.length) { require(dependencies, function () { - $(page).trigger(name); + Events.trigger(page, name); }); } else { - $(page).trigger(name); + Events.trigger(page, name); } }); }, @@ -1787,44 +1803,44 @@ var AppInfo = {}; function setDocumentClasses() { - var elem = $(document.documentElement); + var elem = document.documentElement; if (AppInfo.enableBottomTabs) { - elem.addClass('bottomSecondaryNav'); + elem.classList.add('bottomSecondaryNav'); } if (AppInfo.isTouchPreferred) { - elem.addClass('touch'); + elem.classList.add('touch'); } else { - elem.addClass('pointerInput'); + elem.classList.add('pointerInput'); } if (AppInfo.cardMargin) { - elem.addClass(AppInfo.cardMargin); + elem.classList.add(AppInfo.cardMargin); } if (!AppInfo.enableStudioTabs) { - elem.addClass('studioTabDisabled'); + elem.classList.add('studioTabDisabled'); } if (!AppInfo.enablePeopleTabs) { - elem.addClass('peopleTabDisabled'); + elem.classList.add('peopleTabDisabled'); } if (!AppInfo.enableTvEpisodesTab) { - elem.addClass('tvEpisodesTabDisabled'); + elem.classList.add('tvEpisodesTabDisabled'); } if (!AppInfo.enableMovieTrailersTab) { - elem.addClass('movieTrailersTabDisabled'); + elem.classList.add('movieTrailersTabDisabled'); } if (!AppInfo.enableSupporterMembership) { - elem.addClass('supporterMembershipDisabled'); + elem.classList.add('supporterMembershipDisabled'); } if (AppInfo.isNativeApp) { - elem.addClass('nativeApp'); + elem.classList.add('nativeApp'); } } @@ -2101,9 +2117,9 @@ $(document).on('pagecreate', ".page", function () { } if (current == 'b' && !$.browser.mobile) { - $(document.body).addClass('darkScrollbars'); + document.body.classList.add('darkScrollbars'); } else { - $(document.body).removeClass('darkScrollbars'); + document.body.classList.remove('darkScrollbars'); } }).on('pageinit', ".page", function () { @@ -2114,14 +2130,12 @@ $(document).on('pagecreate', ".page", function () { dependencies = dependencies ? dependencies.split(',') : null; Dashboard.firePageEvent(page, 'pageinitdepends', dependencies); - //$('.localnav a, .libraryViewNav a').attr('data-transition', 'none'); - }).on('pagebeforeshow', ".page", function () { var page = this; var dependencies = this.getAttribute('data-require'); - Dashboard.ensurePageTitle($(page)); + Dashboard.ensurePageTitle(page); dependencies = dependencies ? dependencies.split(',') : null; Dashboard.firePageEvent(page, 'pagebeforeshowready', dependencies); @@ -2134,13 +2148,13 @@ $(document).on('pagecreate', ".page", function () { }).on('pageshowbeginready', ".page", function () { - var page = $(this); + var page = this; var apiClient = window.ApiClient; if (apiClient && apiClient.accessToken() && Dashboard.getCurrentUserId()) { - var isSettingsPage = page.hasClass('type-interior'); + var isSettingsPage = page.classList.contains('type-interior'); if (isSettingsPage) { Dashboard.ensureToolsMenu(page); @@ -2167,7 +2181,7 @@ $(document).on('pagecreate', ".page", function () { } } - if (!isConnectMode && this.id !== "loginPage" && !page.hasClass('forgotPasswordPage') && !page.hasClass('wizardPage')) { + if (!isConnectMode && this.id !== "loginPage" && !page.classList.contains('forgotPasswordPage') && !page.classList.contains('wizardPage')) { Logger.log('Not logged into server. Redirecting to login.'); Dashboard.logout(); @@ -2183,7 +2197,7 @@ $(document).on('pagecreate', ".page", function () { Dashboard.refreshSystemInfoFromServer(); } - if (!page.hasClass('libraryPage')) { + if (!page.classList.contains('libraryPage')) { require(['jqmicons']); } }); \ No newline at end of file diff --git a/dashboard-ui/scripts/songs.js b/dashboard-ui/scripts/songs.js index 9c6083582..18068d077 100644 --- a/dashboard-ui/scripts/songs.js +++ b/dashboard-ui/scripts/songs.js @@ -45,7 +45,7 @@ ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -57,7 +57,7 @@ updatePageSizeSetting: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); @@ -68,9 +68,11 @@ smallIcon: true }); - var elem = $('#items', page).html(html).trigger('create').lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); - $(pagingHtml).appendTo(elem).trigger('create'); + $(elem).trigger('create'); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/supporterkeypage.js b/dashboard-ui/scripts/supporterkeypage.js index 0edb1c26c..eaa6dd325 100644 --- a/dashboard-ui/scripts/supporterkeypage.js +++ b/dashboard-ui/scripts/supporterkeypage.js @@ -13,10 +13,10 @@ $('#txtSupporterKey', page).val(info.SupporterKey); if (info.SupporterKey && !info.IsMBSupporter) { - $('#txtSupporterKey', page).addClass("invalidEntry"); + page.querySelector('#txtSupporterKey').classList.add('invalidEntry'); $('.notSupporter', page).show(); } else { - $('#txtSupporterKey', page).removeClass("invalidEntry"); + page.querySelector('#txtSupporterKey').classList.remove('invalidEntry'); $('.notSupporter', page).hide(); } diff --git a/dashboard-ui/scripts/syncactivity.js b/dashboard-ui/scripts/syncactivity.js index c4e2b05aa..ea28ef448 100644 --- a/dashboard-ui/scripts/syncactivity.js +++ b/dashboard-ui/scripts/syncactivity.js @@ -177,9 +177,7 @@ html += getSyncJobHtml(page, job, cardBoxCssClass, syncJobPage); } - var elem = $('.syncActivity', page).html(html).trigger('create'); - - $(".lazy", elem).unveil(200); + var elem = $('.syncActivity', page).html(html).trigger('create').lazyChildren(); $('.btnJobMenu', elem).on('click', function () { showJobMenu(this); diff --git a/dashboard-ui/scripts/syncjob.js b/dashboard-ui/scripts/syncjob.js index 717b23f08..35227e6b7 100644 --- a/dashboard-ui/scripts/syncjob.js +++ b/dashboard-ui/scripts/syncjob.js @@ -122,9 +122,7 @@ html += ''; - var elem = $('.jobItems', page).html(html).trigger('create'); - - $(".lazy", elem).unveil(200); + var elem = $('.jobItems', page).html(html).trigger('create').lazyChildren(); $('.btnJobItemMenu', elem).on('click', function () { showJobItemMenu(this); diff --git a/dashboard-ui/scripts/thememediaplayer.js b/dashboard-ui/scripts/thememediaplayer.js index 4c2844e0e..ee4cec71c 100644 --- a/dashboard-ui/scripts/thememediaplayer.js +++ b/dashboard-ui/scripts/thememediaplayer.js @@ -1,4 +1,4 @@ -(function (document, $) { +(function (document) { var currentOwnerId; var currentThemeIds = []; @@ -59,7 +59,7 @@ return MediaController.getCurrentPlayer(); } - $(document).on('thememediadownload', ".libraryPage", function (e, themeMediaResult) { + Events.on(document, 'thememediadownload', ".libraryPage", function (e, themeMediaResult) { if (!enabled()) { return; @@ -72,4 +72,4 @@ } }); -})(document, jQuery); \ No newline at end of file +})(document); \ No newline at end of file diff --git a/dashboard-ui/scripts/tvgenres.js b/dashboard-ui/scripts/tvgenres.js index 0c0aa3b4e..0fa6b1d42 100644 --- a/dashboard-ui/scripts/tvgenres.js +++ b/dashboard-ui/scripts/tvgenres.js @@ -25,7 +25,7 @@ ApiClient.getGenres(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -85,7 +85,9 @@ }); } - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/tvpeople.js b/dashboard-ui/scripts/tvpeople.js index 06220ad0f..a05a75cf7 100644 --- a/dashboard-ui/scripts/tvpeople.js +++ b/dashboard-ui/scripts/tvpeople.js @@ -27,7 +27,7 @@ ApiClient.getPeople(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var pagingHtml = LibraryBrowser.getQueryPagingHtml({ @@ -38,7 +38,7 @@ showLimit: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); @@ -52,9 +52,9 @@ lazy: true }); - var elem = $('#items', page).html(html).lazyChildren(); - - $(pagingHtml).appendTo(elem).trigger('create'); + var elem = page.querySelector('#items'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/tvrecommended.js b/dashboard-ui/scripts/tvrecommended.js index 61e265073..82da28781 100644 --- a/dashboard-ui/scripts/tvrecommended.js +++ b/dashboard-ui/scripts/tvrecommended.js @@ -176,9 +176,9 @@ var page = this; if (enableScrollX()) { - $('#resumableItems', page).addClass('hiddenScrollX'); + page.querySelector('#resumableItems').classList.add('hiddenScrollX'); } else { - $('#resumableItems', page).removeClass('hiddenScrollX'); + page.querySelector('#resumableItems').classList.remove('hiddenScrollX'); } reload(page); diff --git a/dashboard-ui/scripts/tvshows.js b/dashboard-ui/scripts/tvshows.js index 0c132dfa0..611338f97 100644 --- a/dashboard-ui/scripts/tvshows.js +++ b/dashboard-ui/scripts/tvshows.js @@ -27,7 +27,7 @@ ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; var trigger = false; @@ -39,7 +39,7 @@ showLimit: false }); - $('.listTopPaging', page).html(pagingHtml).trigger('create'); + page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); @@ -111,14 +111,14 @@ }); } - var elem = $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html + pagingHtml; + ImageLoader.lazyChildren(elem); if (trigger) { - elem.trigger('create'); + $(elem).trigger('create'); } - $(pagingHtml).appendTo(elem).trigger('create'); - $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; reloadItems(page); diff --git a/dashboard-ui/scripts/tvstudios.js b/dashboard-ui/scripts/tvstudios.js index 202d7d451..c4b556ae3 100644 --- a/dashboard-ui/scripts/tvstudios.js +++ b/dashboard-ui/scripts/tvstudios.js @@ -23,7 +23,7 @@ ApiClient.getStudios(Dashboard.getCurrentUserId(), query).done(function (result) { // Scroll back up so they can see the results from the beginning - $(document).scrollTop(0); + window.scrollTo(0, 0); var html = ''; @@ -49,7 +49,9 @@ }); - $('#items', page).html(html).lazyChildren(); + var elem = page.querySelector('#items'); + elem.innerHTML = html; + ImageLoader.lazyChildren(elem); $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; diff --git a/dashboard-ui/scripts/tvupcoming.js b/dashboard-ui/scripts/tvupcoming.js index f11927f5e..0d1fae2f6 100644 --- a/dashboard-ui/scripts/tvupcoming.js +++ b/dashboard-ui/scripts/tvupcoming.js @@ -39,13 +39,8 @@ if (query.ParentId) { - $('.scopedLibraryViewNav', page).show(); - $('.globalNav', page).hide(); context = 'tv'; - } else { - $('.scopedLibraryViewNav', page).hide(); - $('.globalNav', page).show(); } ApiClient.getJSON(ApiClient.getUrl("Shows/Upcoming", query)).done(function (result) { @@ -53,12 +48,13 @@ var items = result.Items; if (items.length) { - $('.noItemsMessage', page).hide(); + page.querySelector('.noItemsMessage').style.display = 'none'; } else { - $('.noItemsMessage', page).show(); + page.querySelector('.noItemsMessage').style.display = 'block'; } - $('#upcomingItems', page).html(LibraryBrowser.getPosterViewHtml({ + var elem = page.querySelector('#upcomingItems'); + elem.innerHTML = LibraryBrowser.getPosterViewHtml({ items: items, showLocationTypeIndicator: false, shape: "backdrop", @@ -70,7 +66,9 @@ lazy: true, showDetailsMenu: true - })).lazyChildren(); + }); + + ImageLoader.lazyChildren(elem); Dashboard.hideLoadingMsg(); diff --git a/dashboard-ui/thirdparty/jquery.unveil-custom.js b/dashboard-ui/thirdparty/jquery.unveil-custom.js index 1b9b42712..441a499b0 100644 --- a/dashboard-ui/thirdparty/jquery.unveil-custom.js +++ b/dashboard-ui/thirdparty/jquery.unveil-custom.js @@ -1,23 +1,35 @@ (function ($) { +})(jQuery); + +/** + * jQuery Unveil + * A very lightweight jQuery plugin to lazy load images + * http://luis-almeida.github.com/unveil + * + * Licensed under the MIT license. + * Copyright 2013 Luís Almeida + * https://github.com/luis-almeida + */ + +(function ($) { + /** - * Copyright 2012, Digital Fusion - * Licensed under the MIT license. - * http://teamdf.com/jquery-plugins/license/ - * - * @author Sam Sehnert - * @desc A small plugin that checks whether elements are within - * the user visible viewport of a web browser. - * only accounts for vertical position, not horizontal. - */ + * Copyright 2012, Digital Fusion + * Licensed under the MIT license. + * http://teamdf.com/jquery-plugins/license/ + * + * @author Sam Sehnert + * @desc A small plugin that checks whether elements are within + * the user visible viewport of a web browser. + * only accounts for vertical position, not horizontal. + */ var $w = $(window); - $.fn.visibleInViewport = function (partial, hidden, direction, threshold) { - if (this.length < 1) - return; + function visibleInViewport(elem, partial, hidden, direction, threshold) { - var $t = this.length > 1 ? this.eq(0) : this, - t = $t.get(0), + var $t = $(elem), + t = elem, vpWidth = $w.width(), vpHeight = $w.height(), direction = (direction) ? direction : 'both', @@ -63,21 +75,7 @@ else if (direction === 'horizontal') return !!clientSize && ((compareRight <= viewRight) && (compareLeft >= viewLeft)); } - }; - -})(jQuery); - -/** - * jQuery Unveil - * A very lightweight jQuery plugin to lazy load images - * http://luis-almeida.github.com/unveil - * - * Licensed under the MIT license. - * Copyright 2013 Luís Almeida - * https://github.com/luis-almeida - */ - -(function ($) { + } var unveilId = 0; @@ -100,7 +98,7 @@ var threshold = getThreshold(); function isVisible() { - return $(this).visibleInViewport(true, false, 'both', threshold); + return visibleInViewport(this, true, false, 'both', threshold); } function fillImage() { @@ -112,16 +110,19 @@ } } - $.fn.unveil = function () { + function unveilElements(elems) { - var $w = $(window), - images = this, - loaded; + if (!elems.length) { + return; + } + + var images = $(elems), + loaded; unveilId++; var eventNamespace = 'unveil' + unveilId; - this.one("unveil", fillImage); + images.one("unveil", fillImage); function unveil() { var inview = images.filter(isVisible); @@ -130,39 +131,54 @@ images = images.not(loaded); if (!images.length) { - $w.off('scroll.' + eventNamespace); - $w.off('resize.' + eventNamespace); + Events.off(window, 'scroll.' + eventNamespace); + Events.off(window, 'resize.' + eventNamespace); } } - $w.on('scroll.' + eventNamespace, unveil); - $w.on('resize.' + eventNamespace, unveil); + Events.on(window, 'scroll.' + eventNamespace, unveil); + Events.on(window, 'resize.' + eventNamespace, unveil); unveil(); + } - return this; + function fillImages(elems) { - }; + for (var i = 0, length = elems.length; i < length; i++) { + var elem = elems[0]; + var source = elem.getAttribute('data-src'); + if (source) { + ImageStore.setImageInto(elem, source); + elem.setAttribute("data-src", ''); + } + } + } - $.fn.fillImages = function () { + function lazyChildren(elem) { - return this.each(fillImage); - }; + unveilElements(elem.getElementsByClassName('lazy')); + } $.fn.lazyChildren = function () { - var lazyItems = $(".lazy", this); - - if (lazyItems.length) { - lazyItems.unveil(); + if (this.length == 1) { + lazyChildren(this[0]); + } else { + unveilElements($('.lazy', this)); } - return this; }; - $.fn.lazyImage = function (url) { + function lazyImage(elem, url) { - return this.attr('data-src', url).fillImages(); + elem.setAttribute('data-src', url); + fillImages([elem]); + } + + window.ImageLoader = { + fillImages: fillImages, + lazyImage: lazyImage, + lazyChildren: lazyChildren }; })(window.jQuery || window.Zepto);