';
@@ -151,7 +156,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
html += '';
html += '
';
if (enableScrollX()) {
- var scrollXClass = 'scrollX hiddenScrollX';
+ let scrollXClass = 'scrollX hiddenScrollX';
if (layoutManager.tv) {
scrollXClass += 'smoothScrollX padded-top-focusscale padded-bottom-focusscale';
@@ -182,37 +187,37 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
});
}
- function fullyReload() {
- self.preRender();
- self.renderTab();
- }
+ const fullyReload = () => {
+ this.preRender();
+ this.renderTab();
+ };
- var self = this;
- var data = {};
+ const data = {};
- self.getViewStyles = function () {
+ this.getViewStyles = function () {
return 'Poster,PosterCard,Thumb,ThumbCard'.split(',');
};
- self.getCurrentViewStyle = function () {
+ this.getCurrentViewStyle = function () {
return getPageData().view;
};
- self.setCurrentViewStyle = function (viewStyle) {
+ this.setCurrentViewStyle = function (viewStyle) {
getPageData().view = viewStyle;
libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle);
fullyReload();
};
- self.enableViewSelection = true;
- var promise;
+ this.enableViewSelection = true;
+ let promise;
- self.preRender = function () {
+ this.preRender = function () {
promise = getPromise();
};
- self.renderTab = function () {
+ this.renderTab = function () {
reloadItems(tabContent, promise);
};
- };
-});
+ }
+
+/* eslint-enable indent */
diff --git a/src/controllers/movies/movies.js b/src/controllers/movies/movies.js
index ade9dc4b89..91b428ec68 100644
--- a/src/controllers/movies/movies.js
+++ b/src/controllers/movies/movies.js
@@ -1,12 +1,18 @@
-define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser', 'alphaPicker', 'listView', 'cardBuilder', 'globalize', 'emby-itemscontainer'], function (loading, layoutManager, userSettings, events, libraryBrowser, AlphaPicker, listView, cardBuilder, globalize) {
- 'use strict';
+import loading from 'loading';
+import * as userSettings from 'userSettings';
+import events from 'events';
+import libraryBrowser from 'libraryBrowser';
+import AlphaPicker from 'alphaPicker';
+import listView from 'listView';
+import cardBuilder from 'cardBuilder';
+import globalize from 'globalize';
+import 'emby-itemscontainer';
- loading = loading.default || loading;
- libraryBrowser = libraryBrowser.default || libraryBrowser;
+/* eslint-disable indent */
- return function (view, params, tabContent, options) {
- function onViewStyleChange() {
- if (self.getCurrentViewStyle() == 'List') {
+ export default function (view, params, tabContent, options) {
+ const onViewStyleChange = () => {
+ if (this.getCurrentViewStyle() == 'List') {
itemsContainer.classList.add('vertical-list');
itemsContainer.classList.remove('vertical-wrap');
} else {
@@ -15,13 +21,13 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
}
itemsContainer.innerHTML = '';
- }
+ };
- function updateFilterControls() {
- if (self.alphaPicker) {
- self.alphaPicker.value(query.NameStartsWithOrGreater);
+ const updateFilterControls = () => {
+ if (this.alphaPicker) {
+ this.alphaPicker.value(query.NameStartsWithOrGreater);
}
- }
+ };
function fetchData() {
isLoading = true;
@@ -54,7 +60,7 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
window.scrollTo(0, 0);
updateFilterControls();
- var pagingHtml = libraryBrowser.getQueryPagingHtml({
+ const pagingHtml = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex,
limit: query.Limit,
totalRecordCount: result.TotalRecordCount,
@@ -64,35 +70,30 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
sortButton: false,
filterButton: false
});
- var i;
- var length;
- var elems = tabContent.querySelectorAll('.paging');
- for (i = 0, length = elems.length; i < length; i++) {
- elems[i].innerHTML = pagingHtml;
+ for (const elem of tabContent.querySelectorAll('.paging')) {
+ elem.innerHTML = pagingHtml;
}
- elems = tabContent.querySelectorAll('.btnNextPage');
- for (i = 0, length = elems.length; i < length; i++) {
- elems[i].addEventListener('click', onNextPageClick);
+ for (const elem of tabContent.querySelectorAll('.btnNextPage')) {
+ elem.addEventListener('click', onNextPageClick);
}
- elems = tabContent.querySelectorAll('.btnPreviousPage');
- for (i = 0, length = elems.length; i < length; i++) {
- elems[i].addEventListener('click', onPreviousPageClick);
+ for (const elem of tabContent.querySelectorAll('.btnPreviousPage')) {
+ elem.addEventListener('click', onPreviousPageClick);
}
isLoading = false;
loading.hide();
- require(['autoFocuser'], function (autoFocuser) {
+ import('autoFocuser').then(({default: autoFocuser}) => {
autoFocuser.autoFocus(tabContent);
});
}
- function getItemsHtml(items) {
- var html;
- var viewStyle = self.getCurrentViewStyle();
+ const getItemsHtml = (items) => {
+ let html;
+ const viewStyle = this.getCurrentViewStyle();
if (viewStyle == 'Thumb') {
html = cardBuilder.getCardsHtml({
@@ -156,22 +157,22 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
}
return html;
- }
+ };
- function initPage(tabContent) {
+ const initPage = (tabContent) => {
itemsContainer.fetchData = fetchData;
itemsContainer.getItemsHtml = getItemsHtml;
itemsContainer.afterRefresh = afterRefresh;
- var alphaPickerElement = tabContent.querySelector('.alphaPicker');
+ let alphaPickerElement = tabContent.querySelector('.alphaPicker');
if (alphaPickerElement) {
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
- var newValue = e.detail.value;
+ let newValue = e.detail.value;
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
itemsContainer.refreshItems();
});
- self.alphaPicker = new AlphaPicker.default({
+ this.alphaPicker = new AlphaPicker({
element: alphaPickerElement,
valueChangeEvent: 'click'
});
@@ -181,14 +182,14 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
itemsContainer.classList.add('padded-right-withalphapicker');
}
- var btnFilter = tabContent.querySelector('.btnFilter');
+ const btnFilter = tabContent.querySelector('.btnFilter');
if (btnFilter) {
- btnFilter.addEventListener('click', function () {
- self.showFilterMenu();
+ btnFilter.addEventListener('click', () => {
+ this.showFilterMenu();
});
}
- var btnSort = tabContent.querySelector('.btnSort');
+ const btnSort = tabContent.querySelector('.btnSort');
if (btnSort) {
btnSort.addEventListener('click', function (e) {
@@ -231,24 +232,23 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
});
});
}
- var btnSelectView = tabContent.querySelector('.btnSelectView');
+ const btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {
- libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'Banner,List,Poster,PosterCard,Thumb,ThumbCard'.split(','));
+ libraryBrowser.showLayoutMenu(e.target, this.getCurrentViewStyle, 'Banner,List,Poster,PosterCard,Thumb,ThumbCard'.split(','));
});
btnSelectView.addEventListener('layoutchange', function (e) {
- var viewStyle = e.detail.viewStyle;
+ let viewStyle = e.detail.viewStyle;
userSettings.set(savedViewKey, viewStyle);
query.StartIndex = 0;
onViewStyleChange();
itemsContainer.refreshItems();
});
- }
+ };
- var self = this;
- var itemsContainer = tabContent.querySelector('.itemsContainer');
- var savedQueryKey = params.topParentId + '-' + options.mode;
- var savedViewKey = savedQueryKey + '-view';
- var query = {
+ let itemsContainer = tabContent.querySelector('.itemsContainer');
+ const savedQueryKey = params.topParentId + '-' + options.mode;
+ const savedViewKey = savedQueryKey + '-view';
+ let query = {
SortBy: 'SortName,ProductionYear',
SortOrder: 'Ascending',
IncludeItemTypes: 'Movie',
@@ -264,7 +264,7 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
query['Limit'] = userSettings.libraryPageSize();
}
- var isLoading = false;
+ let isLoading = false;
if (options.mode === 'favorites') {
query.IsFavorite = true;
@@ -272,14 +272,14 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
query = userSettings.loadQuerySettings(savedQueryKey, query);
- self.showFilterMenu = function () {
- require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) {
- var filterDialog = new filterDialogFactory({
+ this.showFilterMenu = function () {
+ import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => {
+ let filterDialog = new filterDialogFactory({
query: query,
mode: 'movies',
serverId: ApiClient.serverId()
});
- events.on(filterDialog, 'filterchange', function () {
+ events.on(filterDialog, 'filterchange', () => {
query.StartIndex = 0;
itemsContainer.refreshItems();
});
@@ -287,22 +287,23 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
});
};
- self.getCurrentViewStyle = function () {
+ this.getCurrentViewStyle = function () {
return userSettings.get(savedViewKey) || 'Poster';
};
- self.initTab = function () {
+ this.initTab = function () {
initPage(tabContent);
onViewStyleChange();
};
- self.renderTab = function () {
+ this.renderTab = function () {
itemsContainer.refreshItems();
updateFilterControls();
};
- self.destroy = function () {
+ this.destroy = function () {
itemsContainer = null;
};
- };
-});
+ }
+
+/* eslint-enable indent */
diff --git a/src/controllers/movies/moviesrecommended.js b/src/controllers/movies/moviesrecommended.js
index a633d654cd..91163c3412 100644
--- a/src/controllers/movies/moviesrecommended.js
+++ b/src/controllers/movies/moviesrecommended.js
@@ -1,7 +1,20 @@
-define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu', 'mainTabsManager', 'cardBuilder', 'dom', 'imageLoader', 'playbackManager', 'globalize', 'emby-scroller', 'emby-itemscontainer', 'emby-tabs', 'emby-button'], function (events, layoutManager, inputManager, userSettings, libraryMenu, mainTabsManager, cardBuilder, dom, imageLoader, playbackManager, globalize) {
- 'use strict';
+import events from 'events';
+import layoutManager from 'layoutManager';
+import inputManager from 'inputManager';
+import * as userSettings from 'userSettings';
+import libraryMenu from 'libraryMenu';
+import * as mainTabsManager from 'mainTabsManager';
+import cardBuilder from 'cardBuilder';
+import dom from 'dom';
+import imageLoader from 'imageLoader';
+import playbackManager from 'playbackManager';
+import globalize from 'globalize';
+import 'emby-scroller';
+import 'emby-itemscontainer';
+import 'emby-tabs';
+import 'emby-button';
- playbackManager = playbackManager.default || playbackManager;
+/* eslint-disable indent */
function enableScrollX() {
return !layoutManager.desktop;
@@ -16,7 +29,7 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
}
function loadLatest(page, userId, parentId) {
- var options = {
+ const options = {
IncludeItemTypes: 'Movie',
Limit: 18,
Fields: 'PrimaryImageAspectRatio,MediaSourceCount,BasicSyncInfo',
@@ -26,8 +39,8 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
EnableTotalRecordCount: false
};
ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) {
- var allowBottomPadding = !enableScrollX();
- var container = page.querySelector('#recentlyAddedItems');
+ const allowBottomPadding = !enableScrollX();
+ const container = page.querySelector('#recentlyAddedItems');
cardBuilder.buildCards(items, {
itemsContainer: container,
shape: getPortraitShape(),
@@ -45,8 +58,8 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
}
function loadResume(page, userId, parentId) {
- var screenWidth = dom.getWindowSize().innerWidth;
- var options = {
+ let screenWidth = dom.getWindowSize().innerWidth;
+ const options = {
SortBy: 'DatePlayed',
SortOrder: 'Descending',
IncludeItemTypes: 'Movie',
@@ -67,8 +80,8 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
page.querySelector('#resumableSection').classList.add('hide');
}
- var allowBottomPadding = !enableScrollX();
- var container = page.querySelector('#resumableItems');
+ const allowBottomPadding = !enableScrollX();
+ const container = page.querySelector('#resumableItems');
cardBuilder.buildCards(result.Items, {
itemsContainer: container,
preferThumb: true,
@@ -88,8 +101,8 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
}
function getRecommendationHtml(recommendation) {
- var html = '';
- var title = '';
+ let html = '';
+ let title = '';
switch (recommendation.RecommendationType) {
case 'SimilarToRecentlyPlayed':
@@ -113,7 +126,7 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
html += '
';
html += '
' + title + '
';
- var allowBottomPadding = true;
+ const allowBottomPadding = true;
if (enableScrollX()) {
html += '
';
@@ -141,8 +154,8 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
}
function loadSuggestions(page, userId, parentId) {
- var screenWidth = dom.getWindowSize().innerWidth;
- var url = ApiClient.getUrl('Movies/Recommendations', {
+ let screenWidth = dom.getWindowSize().innerWidth;
+ let url = ApiClient.getUrl('Movies/Recommendations', {
userId: userId,
categoryLimit: 6,
ItemLimit: screenWidth >= 1920 ? 8 : screenWidth >= 1600 ? 8 : screenWidth >= 1200 ? 6 : 5,
@@ -157,9 +170,9 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
return;
}
- var html = recommendations.map(getRecommendationHtml).join('');
+ const html = recommendations.map(getRecommendationHtml).join('');
page.querySelector('.noItemsMessage').classList.add('hide');
- var recs = page.querySelector('.recommendations');
+ let recs = page.querySelector('.recommendations');
recs.innerHTML = html;
imageLoader.lazyChildren(recs);
@@ -169,7 +182,7 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
}
function autoFocus(page) {
- require(['autoFocuser'], function (autoFocuser) {
+ import('autoFocuser').then(({default: autoFocuser}) => {
autoFocuser.autoFocus(page);
});
}
@@ -195,17 +208,16 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
}
function initSuggestedTab(page, tabContent) {
- var containers = tabContent.querySelectorAll('.itemsContainer');
+ const containers = tabContent.querySelectorAll('.itemsContainer');
- for (var i = 0, length = containers.length; i < length; i++) {
- setScrollClasses(containers[i], enableScrollX());
+ for (const container of containers) {
+ setScrollClasses(container, enableScrollX());
}
}
function loadSuggestionsTab(view, params, tabContent) {
- var parentId = params.topParentId;
- var userId = ApiClient.getCurrentUserId();
- console.debug('loadSuggestionsTab');
+ const parentId = params.topParentId;
+ const userId = ApiClient.getCurrentUserId();
loadResume(tabContent, userId, parentId);
loadLatest(tabContent, userId, parentId);
loadSuggestions(tabContent, userId, parentId);
@@ -224,9 +236,6 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
name: globalize.translate('TabCollections')
}, {
name: globalize.translate('TabGenres')
- }, {
- name: globalize.translate('ButtonSearch'),
- cssClass: 'searchTabButton'
}];
}
@@ -249,13 +258,13 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
}
}
- return function (view, params) {
+ export default function (view, params) {
function onBeforeTabChange(e) {
preLoadTab(view, parseInt(e.detail.selectedTabIndex));
}
function onTabChange(e) {
- var newIndex = parseInt(e.detail.selectedTabIndex);
+ const newIndex = parseInt(e.detail.selectedTabIndex);
loadTab(view, newIndex);
}
@@ -267,52 +276,50 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
mainTabsManager.setTabs(view, currentTabIndex, getTabs, getTabContainers, onBeforeTabChange, onTabChange);
}
- function getTabController(page, index, callback) {
- var depends = [];
+ const getTabController = (page, index, callback) => {
+ let depends = '';
switch (index) {
case 0:
- depends.push('controllers/movies/movies');
+ depends = 'controllers/movies/movies';
break;
case 1:
+ depends = 'controllers/movies/moviesrecommended.js';
break;
case 2:
- depends.push('controllers/movies/movietrailers');
+ depends = 'controllers/movies/movietrailers';
break;
case 3:
- depends.push('controllers/movies/movies');
+ depends = 'controllers/movies/movies';
break;
case 4:
- depends.push('controllers/movies/moviecollections');
+ depends = 'controllers/movies/moviecollections';
break;
case 5:
- depends.push('controllers/movies/moviegenres');
+ depends = 'controllers/movies/moviegenres';
break;
-
- case 6:
- depends.push('scripts/searchtab');
}
- require(depends, function (controllerFactory) {
- var tabContent;
+ import(depends).then(({default: controllerFactory}) => {
+ let tabContent;
if (index === suggestionsTabIndex) {
tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
- self.tabContent = tabContent;
+ this.tabContent = tabContent;
}
- var controller = tabControllers[index];
+ let controller = tabControllers[index];
if (!controller) {
tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
if (index === suggestionsTabIndex) {
- controller = self;
+ controller = this;
} else if (index === 6) {
controller = new controllerFactory(view, tabContent, {
collectionType: 'movies',
@@ -335,7 +342,7 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
callback(controller);
});
- }
+ };
function preLoadTab(page, index) {
getTabController(page, index, function (controller) {
@@ -347,12 +354,12 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
function loadTab(page, index) {
currentTabIndex = index;
- getTabController(page, index, function (controller) {
+ getTabController(page, index, ((controller) => {
if (renderedTabs.indexOf(index) == -1) {
renderedTabs.push(index);
controller.renderTab();
}
- });
+ }));
}
function onPlaybackStop(e, state) {
@@ -370,22 +377,21 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
}
}
- var self = this;
- var currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId));
- var suggestionsTabIndex = 1;
+ let currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId));
+ const suggestionsTabIndex = 1;
- self.initTab = function () {
- var tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
+ this.initTab = function () {
+ let tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
initSuggestedTab(view, tabContent);
};
- self.renderTab = function () {
- var tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
+ this.renderTab = function () {
+ let tabContent = view.querySelector(".pageTabContent[data-index='" + suggestionsTabIndex + "']");
loadSuggestionsTab(view, params, tabContent);
};
- var tabControllers = [];
- var renderedTabs = [];
+ let tabControllers = [];
+ let renderedTabs = [];
view.addEventListener('viewshow', function (e) {
initTabs();
if (!view.getAttribute('data-title')) {
@@ -405,15 +411,14 @@ define(['events', 'layoutManager', 'inputManager', 'userSettings', 'libraryMenu'
events.on(playbackManager, 'playbackstop', onPlaybackStop);
inputManager.on(window, onInputCommand);
});
- view.addEventListener('viewbeforehide', function (e) {
+ view.addEventListener('viewbeforehide', function () {
inputManager.off(window, onInputCommand);
});
- view.addEventListener('viewdestroy', function (e) {
- tabControllers.forEach(function (t) {
- if (t.destroy) {
- t.destroy();
- }
- });
- });
- };
-});
+ for (const tabController of tabControllers) {
+ if (tabController.destroy) {
+ tabController.destroy();
+ }
+ }
+ }
+
+/* eslint-enable indent */
diff --git a/src/controllers/movies/movietrailers.js b/src/controllers/movies/movietrailers.js
index 8d9fe8d090..5f1aa1fe62 100644
--- a/src/controllers/movies/movietrailers.js
+++ b/src/controllers/movies/movietrailers.js
@@ -1,13 +1,20 @@
-define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, userSettings, globalize) {
- 'use strict';
+import loading from 'loading';
+import events from 'events';
+import libraryBrowser from 'libraryBrowser';
+import imageLoader from 'imageLoader';
+import AlphaPicker from 'alphaPicker';
+import listView from 'listView';
+import cardBuilder from 'cardBuilder';
+import * as userSettings from 'userSettings';
+import globalize from 'globalize';
+import 'emby-itemscontainer';
- loading = loading.default || loading;
- libraryBrowser = libraryBrowser.default || libraryBrowser;
+/* eslint-disable indent */
- return function (view, params, tabContent) {
+ export default function (view, params, tabContent) {
function getPageData(context) {
- var key = getSavedQueryKey(context);
- var pageData = data[key];
+ const key = getSavedQueryKey(context);
+ let pageData = data[key];
if (!pageData) {
pageData = data[key] = {
@@ -46,11 +53,11 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
return context.savedQueryKey;
}
- function reloadItems() {
+ const reloadItems = () => {
loading.show();
isLoading = true;
- var query = getQuery(tabContent);
- ApiClient.getItems(ApiClient.getCurrentUserId(), query).then(function (result) {
+ const query = getQuery(tabContent);
+ ApiClient.getItems(ApiClient.getCurrentUserId(), query).then((result) => {
function onNextPageClick() {
if (isLoading) {
return;
@@ -75,7 +82,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
window.scrollTo(0, 0);
updateFilterControls(tabContent);
- var pagingHtml = libraryBrowser.getQueryPagingHtml({
+ const pagingHtml = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex,
limit: query.Limit,
totalRecordCount: result.TotalRecordCount,
@@ -85,8 +92,8 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
sortButton: false,
filterButton: false
});
- var html;
- var viewStyle = self.getCurrentViewStyle();
+ let html;
+ const viewStyle = this.getCurrentViewStyle();
if (viewStyle == 'Thumb') {
html = cardBuilder.getCardsHtml({
@@ -142,22 +149,20 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
});
}
- var i;
- var length;
- var elems = tabContent.querySelectorAll('.paging');
+ let elems = tabContent.querySelectorAll('.paging');
- for (i = 0, length = elems.length; i < length; i++) {
- elems[i].innerHTML = pagingHtml;
+ for (const elem of elems) {
+ elem.innerHTML = pagingHtml;
}
elems = tabContent.querySelectorAll('.btnNextPage');
- for (i = 0, length = elems.length; i < length; i++) {
- elems[i].addEventListener('click', onNextPageClick);
+ for (const elem of elems) {
+ elem.addEventListener('click', onNextPageClick);
}
elems = tabContent.querySelectorAll('.btnPreviousPage');
- for (i = 0, length = elems.length; i < length; i++) {
- elems[i].addEventListener('click', onPreviousPageClick);
+ for (const elem of elems) {
+ elem.addEventListener('click', onPreviousPageClick);
}
if (!result.Items.length) {
@@ -169,27 +174,26 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
html += '
';
}
- var itemsContainer = tabContent.querySelector('.itemsContainer');
+ const itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html;
imageLoader.lazyChildren(itemsContainer);
libraryBrowser.saveQueryValues(getSavedQueryKey(tabContent), query);
loading.hide();
isLoading = false;
});
- }
+ };
- function updateFilterControls(tabContent) {
- var query = getQuery(tabContent);
- self.alphaPicker.value(query.NameStartsWithOrGreater);
- }
+ const updateFilterControls = (tabContent) => {
+ const query = getQuery(tabContent);
+ this.alphaPicker.value(query.NameStartsWithOrGreater);
+ };
- var self = this;
- var data = {};
- var isLoading = false;
+ const data = {};
+ let isLoading = false;
- self.showFilterMenu = function () {
- require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) {
- var filterDialog = new filterDialogFactory({
+ this.showFilterMenu = function () {
+ import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => {
+ const filterDialog = new filterDialogFactory({
query: getQuery(tabContent),
mode: 'movies',
serverId: ApiClient.serverId()
@@ -202,21 +206,21 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
});
};
- self.getCurrentViewStyle = function () {
+ this.getCurrentViewStyle = function () {
return getPageData(tabContent).view;
};
- function initPage(tabContent) {
- var alphaPickerElement = tabContent.querySelector('.alphaPicker');
- var itemsContainer = tabContent.querySelector('.itemsContainer');
+ const initPage = (tabContent) => {
+ const alphaPickerElement = tabContent.querySelector('.alphaPicker');
+ const itemsContainer = tabContent.querySelector('.itemsContainer');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
- var newValue = e.detail.value;
- var query = getQuery(tabContent);
+ const newValue = e.detail.value;
+ const query = getQuery(tabContent);
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems();
});
- self.alphaPicker = new AlphaPicker.default({
+ this.alphaPicker = new AlphaPicker({
element: alphaPickerElement,
valueChangeEvent: 'click'
});
@@ -226,7 +230,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
itemsContainer.classList.add('padded-right-withalphapicker');
tabContent.querySelector('.btnFilter').addEventListener('click', function () {
- self.showFilterMenu();
+ this.showFilterMenu();
});
tabContent.querySelector('.btnSort').addEventListener('click', function (e) {
libraryBrowser.showSortMenu({
@@ -260,15 +264,16 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
button: e.target
});
});
- }
+ };
initPage(tabContent);
- self.renderTab = function () {
+ this.renderTab = function () {
reloadItems();
updateFilterControls(tabContent);
};
- self.destroy = function () {};
- };
-});
+ this.destroy = function () {};
+ }
+
+/* eslint-enable indent */
diff --git a/src/controllers/music/musicrecommended.js b/src/controllers/music/musicrecommended.js
index db7dac9547..9bc449e2a2 100644
--- a/src/controllers/music/musicrecommended.js
+++ b/src/controllers/music/musicrecommended.js
@@ -191,9 +191,6 @@ import 'flexStyles';
name: globalize.translate('TabSongs')
}, {
name: globalize.translate('TabGenres')
- }, {
- name: globalize.translate('ButtonSearch'),
- cssClass: 'searchTabButton'
}];
}
@@ -295,10 +292,6 @@ import 'flexStyles';
case 6:
depends = 'controllers/music/musicgenres';
break;
-
- case 7:
- depends = 'scripts/searchtab';
- break;
}
import(depends).then(({default: controllerFactory}) => {
diff --git a/src/controllers/shows/tvrecommended.js b/src/controllers/shows/tvrecommended.js
index 4aab69e978..585449d0c0 100644
--- a/src/controllers/shows/tvrecommended.js
+++ b/src/controllers/shows/tvrecommended.js
@@ -30,9 +30,6 @@ import 'emby-button';
name: globalize.translate('TabNetworks')
}, {
name: globalize.translate('TabEpisodes')
- }, {
- name: globalize.translate('ButtonSearch'),
- cssClass: 'searchTabButton'
}];
}
@@ -217,10 +214,6 @@ import 'emby-button';
case 6:
depends = 'controllers/shows/episodes';
break;
-
- case 7:
- depends = 'scripts/searchtab';
- break;
}
import(depends).then(({default: controllerFactory}) => {
diff --git a/src/elements/emby-slider/emby-slider.css b/src/elements/emby-slider/emby-slider.css
index 7661895f15..01221b6cae 100644
--- a/src/elements/emby-slider/emby-slider.css
+++ b/src/elements/emby-slider/emby-slider.css
@@ -230,3 +230,18 @@
margin: 0;
padding: 0.5em 0.75em;
}
+
+/* FIXME: 'sliderContainer' is used to wrap slider's pieces */
+.sliderContainer-settings {
+ margin-bottom: 1.8em;
+ position: relative;
+}
+
+.sliderContainer-settings .mdl-slider-container {
+ height: 2.83em; /* similar to emby-input with its 110% font-size */
+}
+
+.sliderLabel {
+ display: block;
+ margin-bottom: 0.25em;
+}
diff --git a/src/elements/emby-slider/emby-slider.js b/src/elements/emby-slider/emby-slider.js
index 2439331144..b39e24f5e4 100644
--- a/src/elements/emby-slider/emby-slider.js
+++ b/src/elements/emby-slider/emby-slider.js
@@ -150,6 +150,16 @@ import 'emby-input';
this.classList.add('show-focus');
}
+ const topContainer = dom.parentWithClass(this, 'sliderContainer-settings');
+
+ if (topContainer && this.getAttribute('label')) {
+ const label = this.ownerDocument.createElement('label');
+ label.innerHTML = this.getAttribute('label');
+ label.classList.add('sliderLabel');
+ label.htmlFor = this.id;
+ topContainer.insertBefore(label, topContainer.firstChild);
+ }
+
const containerElement = this.parentNode;
containerElement.classList.add('mdl-slider-container');
diff --git a/src/libraries/navdrawer/navdrawer.js b/src/libraries/navdrawer/navdrawer.js
index 4733c617f3..965b68aee4 100644
--- a/src/libraries/navdrawer/navdrawer.js
+++ b/src/libraries/navdrawer/navdrawer.js
@@ -1,354 +1,357 @@
-define(["browser", "dom", "css!./navdrawer", "scrollStyles"], function (browser, dom) {
- "use strict";
+/* Cleaning this file properly is not neecessary, since it's an outdated library
+ * and will be replaced soon by a Vue component.
+ */
- browser = browser.default || browser;
+import browser from 'browser';
+import dom from 'dom';
+import 'css!./navdrawer';
+import 'scrollStyles';
- return function (options) {
- function getTouches(e) {
- return e.changedTouches || e.targetTouches || e.touches;
+export default function (options) {
+ function getTouches(e) {
+ return e.changedTouches || e.targetTouches || e.touches;
+ }
+
+ function onMenuTouchStart(e) {
+ options.target.classList.remove('transition');
+ var touches = getTouches(e);
+ var touch = touches[0] || {};
+ menuTouchStartX = touch.clientX;
+ menuTouchStartY = touch.clientY;
+ menuTouchStartTime = new Date().getTime();
+ }
+
+ function setVelocity(deltaX) {
+ var time = new Date().getTime() - (menuTouchStartTime || 0);
+ velocity = Math.abs(deltaX) / time;
+ }
+
+ function onMenuTouchMove(e) {
+ var isOpen = self.visible;
+ var touches = getTouches(e);
+ var touch = touches[0] || {};
+ var endX = touch.clientX || 0;
+ var endY = touch.clientY || 0;
+ var deltaX = endX - (menuTouchStartX || 0);
+ var deltaY = endY - (menuTouchStartY || 0);
+ setVelocity(deltaX);
+
+ if (isOpen && dragMode !== 1 && deltaX > 0) {
+ dragMode = 2;
}
- function onMenuTouchStart(e) {
- options.target.classList.remove("transition");
- var touches = getTouches(e);
- var touch = touches[0] || {};
- menuTouchStartX = touch.clientX;
- menuTouchStartY = touch.clientY;
- menuTouchStartTime = new Date().getTime();
+ if (dragMode === 0 && (!isOpen || Math.abs(deltaX) >= 10) && Math.abs(deltaY) < 5) {
+ dragMode = 1;
+ scrollContainer.addEventListener('scroll', disableEvent);
+ self.showMask();
+ } else if (dragMode === 0 && Math.abs(deltaY) >= 5) {
+ dragMode = 2;
}
- function setVelocity(deltaX) {
- var time = new Date().getTime() - (menuTouchStartTime || 0);
- velocity = Math.abs(deltaX) / time;
+ if (dragMode === 1) {
+ newPos = currentPos + deltaX;
+ self.changeMenuPos();
}
+ }
- function onMenuTouchMove(e) {
- var isOpen = self.visible;
- var touches = getTouches(e);
- var touch = touches[0] || {};
- var endX = touch.clientX || 0;
- var endY = touch.clientY || 0;
- var deltaX = endX - (menuTouchStartX || 0);
- var deltaY = endY - (menuTouchStartY || 0);
- setVelocity(deltaX);
+ function onMenuTouchEnd(e) {
+ options.target.classList.add('transition');
+ scrollContainer.removeEventListener('scroll', disableEvent);
+ dragMode = 0;
+ var touches = getTouches(e);
+ var touch = touches[0] || {};
+ var endX = touch.clientX || 0;
+ var endY = touch.clientY || 0;
+ var deltaX = endX - (menuTouchStartX || 0);
+ var deltaY = endY - (menuTouchStartY || 0);
+ currentPos = deltaX;
+ self.checkMenuState(deltaX, deltaY);
+ }
- if (isOpen && 1 !== dragMode && deltaX > 0) {
- dragMode = 2;
- }
+ function onEdgeTouchStart(e) {
+ if (isPeeking) {
+ onMenuTouchMove(e);
+ } else {
+ if (((getTouches(e)[0] || {}).clientX || 0) <= options.handleSize) {
+ isPeeking = true;
- if (0 === dragMode && (!isOpen || Math.abs(deltaX) >= 10) && Math.abs(deltaY) < 5) {
- dragMode = 1;
- scrollContainer.addEventListener("scroll", disableEvent);
- self.showMask();
- } else if (0 === dragMode && Math.abs(deltaY) >= 5) {
- dragMode = 2;
- }
-
- if (1 === dragMode) {
- newPos = currentPos + deltaX;
- self.changeMenuPos();
- }
- }
-
- function onMenuTouchEnd(e) {
- options.target.classList.add("transition");
- scrollContainer.removeEventListener("scroll", disableEvent);
- dragMode = 0;
- var touches = getTouches(e);
- var touch = touches[0] || {};
- var endX = touch.clientX || 0;
- var endY = touch.clientY || 0;
- var deltaX = endX - (menuTouchStartX || 0);
- var deltaY = endY - (menuTouchStartY || 0);
- currentPos = deltaX;
- self.checkMenuState(deltaX, deltaY);
- }
-
- function onEdgeTouchStart(e) {
- if (isPeeking) {
- onMenuTouchMove(e);
- } else {
- if (((getTouches(e)[0] || {}).clientX || 0) <= options.handleSize) {
- isPeeking = true;
-
- if (e.type === "touchstart") {
- dom.removeEventListener(edgeContainer, "touchmove", onEdgeTouchMove, {});
- dom.addEventListener(edgeContainer, "touchmove", onEdgeTouchMove, {});
- }
-
- onMenuTouchStart(e);
+ if (e.type === 'touchstart') {
+ dom.removeEventListener(edgeContainer, 'touchmove', onEdgeTouchMove, {});
+ dom.addEventListener(edgeContainer, 'touchmove', onEdgeTouchMove, {});
}
+
+ onMenuTouchStart(e);
}
}
+ }
- function onEdgeTouchMove(e) {
- e.preventDefault();
- e.stopPropagation();
- onEdgeTouchStart(e);
+ function onEdgeTouchMove(e) {
+ e.preventDefault();
+ e.stopPropagation();
+ onEdgeTouchStart(e);
+ }
+
+ function onEdgeTouchEnd(e) {
+ if (isPeeking) {
+ isPeeking = false;
+ dom.removeEventListener(edgeContainer, 'touchmove', onEdgeTouchMove, {});
+ onMenuTouchEnd(e);
}
+ }
- function onEdgeTouchEnd(e) {
- if (isPeeking) {
- isPeeking = false;
- dom.removeEventListener(edgeContainer, "touchmove", onEdgeTouchMove, {});
- onMenuTouchEnd(e);
- }
- }
+ function disableEvent(e) {
+ e.preventDefault();
+ e.stopPropagation();
+ }
- function disableEvent(e) {
- e.preventDefault();
- e.stopPropagation();
- }
+ function onBackgroundTouchStart(e) {
+ var touches = getTouches(e);
+ var touch = touches[0] || {};
+ backgroundTouchStartX = touch.clientX;
+ backgroundTouchStartTime = new Date().getTime();
+ }
- function onBackgroundTouchStart(e) {
- var touches = getTouches(e);
- var touch = touches[0] || {};
- backgroundTouchStartX = touch.clientX;
- backgroundTouchStartTime = new Date().getTime();
- }
+ function onBackgroundTouchMove(e) {
+ var touches = getTouches(e);
+ var touch = touches[0] || {};
+ var endX = touch.clientX || 0;
- function onBackgroundTouchMove(e) {
- var touches = getTouches(e);
- var touch = touches[0] || {};
- var endX = touch.clientX || 0;
-
- if (endX <= options.width && self.isVisible) {
- countStart++;
- var deltaX = endX - (backgroundTouchStartX || 0);
-
- if (countStart == 1) {
- startPoint = deltaX;
- }
- if (deltaX < 0 && dragMode !== 2) {
- dragMode = 1;
- newPos = deltaX - startPoint + options.width;
- self.changeMenuPos();
- var time = new Date().getTime() - (backgroundTouchStartTime || 0);
- velocity = Math.abs(deltaX) / time;
- }
- }
-
- e.preventDefault();
- e.stopPropagation();
- }
-
- function onBackgroundTouchEnd(e) {
- var touches = getTouches(e);
- var touch = touches[0] || {};
- var endX = touch.clientX || 0;
+ if (endX <= options.width && self.isVisible) {
+ countStart++;
var deltaX = endX - (backgroundTouchStartX || 0);
- self.checkMenuState(deltaX);
- countStart = 0;
- }
- function onMaskTransitionEnd() {
- var classList = mask.classList;
-
- if (!classList.contains("backdrop")) {
- classList.add("hide");
+ if (countStart == 1) {
+ startPoint = deltaX;
+ }
+ if (deltaX < 0 && dragMode !== 2) {
+ dragMode = 1;
+ newPos = deltaX - startPoint + options.width;
+ self.changeMenuPos();
+ var time = new Date().getTime() - (backgroundTouchStartTime || 0);
+ velocity = Math.abs(deltaX) / time;
}
}
- var self;
- var defaults;
- var mask;
- var newPos = 0;
- var currentPos = 0;
- var startPoint = 0;
- var countStart = 0;
- var velocity = 0;
- options.target.classList.add("transition");
- var dragMode = 0;
- var scrollContainer = options.target.querySelector(".mainDrawer-scrollContainer");
- scrollContainer.classList.add("scrollY");
+ e.preventDefault();
+ e.stopPropagation();
+ }
- var TouchMenuLA = function () {
- self = this;
- defaults = {
- width: 260,
- handleSize: 10,
- disableMask: false,
- maxMaskOpacity: 0.5
- };
- this.isVisible = false;
- this.initialize();
+ function onBackgroundTouchEnd(e) {
+ var touches = getTouches(e);
+ var touch = touches[0] || {};
+ var endX = touch.clientX || 0;
+ var deltaX = endX - (backgroundTouchStartX || 0);
+ self.checkMenuState(deltaX);
+ countStart = 0;
+ }
+
+ function onMaskTransitionEnd() {
+ var classList = mask.classList;
+
+ if (!classList.contains('backdrop')) {
+ classList.add('hide');
+ }
+ }
+
+ var self;
+ var defaults;
+ var mask;
+ var newPos = 0;
+ var currentPos = 0;
+ var startPoint = 0;
+ var countStart = 0;
+ var velocity = 0;
+ options.target.classList.add('transition');
+ var dragMode = 0;
+ var scrollContainer = options.target.querySelector('.mainDrawer-scrollContainer');
+ scrollContainer.classList.add('scrollY');
+
+ var TouchMenuLA = function () {
+ self = this;
+ defaults = {
+ width: 260,
+ handleSize: 10,
+ disableMask: false,
+ maxMaskOpacity: 0.5
};
+ this.isVisible = false;
+ this.initialize();
+ };
- TouchMenuLA.prototype.initElements = function () {
- options.target.classList.add("touch-menu-la");
- options.target.style.width = options.width + "px";
- options.target.style.left = -options.width + "px";
+ TouchMenuLA.prototype.initElements = function () {
+ options.target.classList.add('touch-menu-la');
+ options.target.style.width = options.width + 'px';
+ options.target.style.left = -options.width + 'px';
- if (!options.disableMask) {
- mask = document.createElement("div");
- mask.className = "tmla-mask hide";
- document.body.appendChild(mask);
- dom.addEventListener(mask, dom.whichTransitionEvent(), onMaskTransitionEnd, {
- passive: true
- });
- }
- };
-
- var menuTouchStartX;
- var menuTouchStartY;
- var menuTouchStartTime;
- var edgeContainer = document.querySelector(".mainDrawerHandle");
- var isPeeking = false;
-
- TouchMenuLA.prototype.animateToPosition = function (pos) {
- requestAnimationFrame(function () {
- options.target.style.transform = pos ? "translateX(" + pos + "px)" : "none";
+ if (!options.disableMask) {
+ mask = document.createElement('div');
+ mask.className = 'tmla-mask hide';
+ document.body.appendChild(mask);
+ dom.addEventListener(mask, dom.whichTransitionEvent(), onMaskTransitionEnd, {
+ passive: true
});
- };
+ }
+ };
- TouchMenuLA.prototype.changeMenuPos = function () {
- if (newPos <= options.width) {
- this.animateToPosition(newPos);
- }
- };
+ var menuTouchStartX;
+ var menuTouchStartY;
+ var menuTouchStartTime;
+ var edgeContainer = document.querySelector('.mainDrawerHandle');
+ var isPeeking = false;
- TouchMenuLA.prototype.clickMaskClose = function () {
- mask.addEventListener("click", function () {
+ TouchMenuLA.prototype.animateToPosition = function (pos) {
+ requestAnimationFrame(function () {
+ options.target.style.transform = pos ? 'translateX(' + pos + 'px)' : 'none';
+ });
+ };
+
+ TouchMenuLA.prototype.changeMenuPos = function () {
+ if (newPos <= options.width) {
+ this.animateToPosition(newPos);
+ }
+ };
+
+ TouchMenuLA.prototype.clickMaskClose = function () {
+ mask.addEventListener('click', function () {
+ self.close();
+ });
+ };
+
+ TouchMenuLA.prototype.checkMenuState = function (deltaX, deltaY) {
+ if (velocity >= 0.4) {
+ if (deltaX >= 0 || Math.abs(deltaY || 0) >= 70) {
+ self.open();
+ } else {
self.close();
- });
- };
-
- TouchMenuLA.prototype.checkMenuState = function (deltaX, deltaY) {
- if (velocity >= 0.4) {
- if (deltaX >= 0 || Math.abs(deltaY || 0) >= 70) {
- self.open();
- } else {
+ }
+ } else {
+ if (newPos >= 100) {
+ self.open();
+ } else {
+ if (newPos) {
self.close();
}
- } else {
- if (newPos >= 100) {
- self.open();
- } else {
- if (newPos) {
- self.close();
- }
- }
}
- };
-
- TouchMenuLA.prototype.open = function () {
- this.animateToPosition(options.width);
- currentPos = options.width;
- this.isVisible = true;
- options.target.classList.add("drawer-open");
- self.showMask();
- self.invoke(options.onChange);
- };
-
- TouchMenuLA.prototype.close = function () {
- this.animateToPosition(0);
- currentPos = 0;
- self.isVisible = false;
- options.target.classList.remove("drawer-open");
- self.hideMask();
- self.invoke(options.onChange);
- };
-
- TouchMenuLA.prototype.toggle = function () {
- if (self.isVisible) {
- self.close();
- } else {
- self.open();
- }
- };
-
- var backgroundTouchStartX;
- var backgroundTouchStartTime;
-
- TouchMenuLA.prototype.showMask = function () {
- mask.classList.remove("hide");
- mask.classList.add("backdrop");
- };
-
- TouchMenuLA.prototype.hideMask = function () {
- mask.classList.add("hide");
- mask.classList.remove("backdrop");
- };
-
- TouchMenuLA.prototype.invoke = function (fn) {
- if (fn) {
- fn.apply(self);
- }
- };
-
- var _edgeSwipeEnabled;
-
- TouchMenuLA.prototype.setEdgeSwipeEnabled = function (enabled) {
- if (!options.disableEdgeSwipe) {
- if (browser.touch) {
- if (enabled) {
- if (!_edgeSwipeEnabled) {
- _edgeSwipeEnabled = true;
- dom.addEventListener(edgeContainer, "touchstart", onEdgeTouchStart, {
- passive: true
- });
- dom.addEventListener(edgeContainer, "touchend", onEdgeTouchEnd, {
- passive: true
- });
- dom.addEventListener(edgeContainer, "touchcancel", onEdgeTouchEnd, {
- passive: true
- });
- }
- } else {
- if (_edgeSwipeEnabled) {
- _edgeSwipeEnabled = false;
- dom.removeEventListener(edgeContainer, "touchstart", onEdgeTouchStart, {
- passive: true
- });
- dom.removeEventListener(edgeContainer, "touchend", onEdgeTouchEnd, {
- passive: true
- });
- dom.removeEventListener(edgeContainer, "touchcancel", onEdgeTouchEnd, {
- passive: true
- });
- }
- }
- }
- }
- };
-
- TouchMenuLA.prototype.initialize = function () {
- options = Object.assign(defaults, options || {});
-
- if (browser.edge) {
- options.disableEdgeSwipe = true;
- }
-
- self.initElements();
-
- if (browser.touch) {
- dom.addEventListener(options.target, "touchstart", onMenuTouchStart, {
- passive: true
- });
- dom.addEventListener(options.target, "touchmove", onMenuTouchMove, {
- passive: true
- });
- dom.addEventListener(options.target, "touchend", onMenuTouchEnd, {
- passive: true
- });
- dom.addEventListener(options.target, "touchcancel", onMenuTouchEnd, {
- passive: true
- });
- dom.addEventListener(mask, "touchstart", onBackgroundTouchStart, {
- passive: true
- });
- dom.addEventListener(mask, "touchmove", onBackgroundTouchMove, {});
- dom.addEventListener(mask, "touchend", onBackgroundTouchEnd, {
- passive: true
- });
- dom.addEventListener(mask, "touchcancel", onBackgroundTouchEnd, {
- passive: true
- });
- }
-
- self.clickMaskClose();
- };
-
- return new TouchMenuLA();
+ }
};
-});
+
+ TouchMenuLA.prototype.open = function () {
+ this.animateToPosition(options.width);
+ currentPos = options.width;
+ this.isVisible = true;
+ options.target.classList.add('drawer-open');
+ self.showMask();
+ self.invoke(options.onChange);
+ };
+
+ TouchMenuLA.prototype.close = function () {
+ this.animateToPosition(0);
+ currentPos = 0;
+ self.isVisible = false;
+ options.target.classList.remove('drawer-open');
+ self.hideMask();
+ self.invoke(options.onChange);
+ };
+
+ TouchMenuLA.prototype.toggle = function () {
+ if (self.isVisible) {
+ self.close();
+ } else {
+ self.open();
+ }
+ };
+
+ var backgroundTouchStartX;
+ var backgroundTouchStartTime;
+
+ TouchMenuLA.prototype.showMask = function () {
+ mask.classList.remove('hide');
+ mask.classList.add('backdrop');
+ };
+
+ TouchMenuLA.prototype.hideMask = function () {
+ mask.classList.add('hide');
+ mask.classList.remove('backdrop');
+ };
+
+ TouchMenuLA.prototype.invoke = function (fn) {
+ if (fn) {
+ fn.apply(self);
+ }
+ };
+
+ var _edgeSwipeEnabled;
+
+ TouchMenuLA.prototype.setEdgeSwipeEnabled = function (enabled) {
+ if (!options.disableEdgeSwipe) {
+ if (browser.touch) {
+ if (enabled) {
+ if (!_edgeSwipeEnabled) {
+ _edgeSwipeEnabled = true;
+ dom.addEventListener(edgeContainer, 'touchstart', onEdgeTouchStart, {
+ passive: true
+ });
+ dom.addEventListener(edgeContainer, 'touchend', onEdgeTouchEnd, {
+ passive: true
+ });
+ dom.addEventListener(edgeContainer, 'touchcancel', onEdgeTouchEnd, {
+ passive: true
+ });
+ }
+ } else {
+ if (_edgeSwipeEnabled) {
+ _edgeSwipeEnabled = false;
+ dom.removeEventListener(edgeContainer, 'touchstart', onEdgeTouchStart, {
+ passive: true
+ });
+ dom.removeEventListener(edgeContainer, 'touchend', onEdgeTouchEnd, {
+ passive: true
+ });
+ dom.removeEventListener(edgeContainer, 'touchcancel', onEdgeTouchEnd, {
+ passive: true
+ });
+ }
+ }
+ }
+ }
+ };
+
+ TouchMenuLA.prototype.initialize = function () {
+ options = Object.assign(defaults, options || {});
+
+ if (browser.edge) {
+ options.disableEdgeSwipe = true;
+ }
+
+ self.initElements();
+
+ if (browser.touch) {
+ dom.addEventListener(options.target, 'touchstart', onMenuTouchStart, {
+ passive: true
+ });
+ dom.addEventListener(options.target, 'touchmove', onMenuTouchMove, {
+ passive: true
+ });
+ dom.addEventListener(options.target, 'touchend', onMenuTouchEnd, {
+ passive: true
+ });
+ dom.addEventListener(options.target, 'touchcancel', onMenuTouchEnd, {
+ passive: true
+ });
+ dom.addEventListener(mask, 'touchstart', onBackgroundTouchStart, {
+ passive: true
+ });
+ dom.addEventListener(mask, 'touchmove', onBackgroundTouchMove, {});
+ dom.addEventListener(mask, 'touchend', onBackgroundTouchEnd, {
+ passive: true
+ });
+ dom.addEventListener(mask, 'touchcancel', onBackgroundTouchEnd, {
+ passive: true
+ });
+ }
+
+ self.clickMaskClose();
+ };
+
+ return new TouchMenuLA();
+}
diff --git a/src/libraries/scroller.js b/src/libraries/scroller.js
index cc75dcdeef..c460ec5b2c 100644
--- a/src/libraries/scroller.js
+++ b/src/libraries/scroller.js
@@ -1,928 +1,886 @@
-define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'scrollStyles'], function (browser, layoutManager, dom, focusManager, ResizeObserver) {
- 'use strict';
+/* Cleaning this file properly is not neecessary, since it's an outdated library
+ * and will be replaced soon by a Vue component.
+ */
- browser = browser.default || browser;
- focusManager = focusManager.default || focusManager;
+import browser from 'browser';
+import layoutManager from 'layoutManager';
+import dom from 'dom';
+import focusManager from 'focusManager';
+import ResizeObserver from 'ResizeObserver';
+import 'scrollStyles';
- /**
+/**
* Return type of the value.
*
* @param {Mixed} value
*
* @return {String}
*/
- function type(value) {
- if (value == null) {
- return String(value);
- }
-
- if (typeof value === 'object' || typeof value === 'function') {
- return Object.prototype.toString.call(value).match(/\s([a-z]+)/i)[1].toLowerCase() || 'object';
- }
-
- return typeof value;
+function type(value) {
+ if (value == null) {
+ return String(value);
}
- /**
- * Disables an event it was triggered on and unbinds itself.
- *
- * @param {Event} event
- *
- * @return {Void}
- */
- function disableOneEvent(event) {
- /*jshint validthis:true */
- event.preventDefault();
- event.stopPropagation();
- this.removeEventListener(event.type, disableOneEvent);
+ if (typeof value === 'object' || typeof value === 'function') {
+ return Object.prototype.toString.call(value).match(/\s([a-z]+)/i)[1].toLowerCase() || 'object';
}
- /**
- * Make sure that number is within the limits.
- *
- * @param {Number} number
- * @param {Number} min
- * @param {Number} max
- *
- * @return {Number}
- */
- function within(number, min, max) {
- return number < min ? min : number > max ? max : number;
+ return typeof value;
+}
+
+/**
+ * Disables an event it was triggered on and unbinds itself.
+ *
+ * @param {Event} event
+ *
+ * @return {Void}
+ */
+function disableOneEvent(event) {
+ /*jshint validthis:true */
+ event.preventDefault();
+ event.stopPropagation();
+ this.removeEventListener(event.type, disableOneEvent);
+}
+
+/**
+ * Make sure that number is within the limits.
+ *
+ * @param {Number} number
+ * @param {Number} min
+ * @param {Number} max
+ *
+ * @return {Number}
+ */
+function within(number, min, max) {
+ return number < min ? min : number > max ? max : number;
+}
+
+// Other global values
+var dragMouseEvents = ['mousemove', 'mouseup'];
+var dragTouchEvents = ['touchmove', 'touchend'];
+var wheelEvent = (document.implementation.hasFeature('Event.wheel', '3.0') ? 'wheel' : 'mousewheel');
+var interactiveElements = ['INPUT', 'SELECT', 'TEXTAREA'];
+
+var scrollerFactory = function (frame, options) {
+ // Extend options
+ var o = Object.assign({}, {
+ slidee: null, // Selector, DOM element, or jQuery object with DOM element representing SLIDEE.
+ horizontal: false, // Switch to horizontal mode.
+
+ // Scrolling
+ mouseWheel: true,
+ scrollBy: 0, // Pixels or items to move per one mouse scroll. 0 to disable scrolling
+
+ // Dragging
+ dragSource: null, // Selector or DOM element for catching dragging events. Default is FRAME.
+ mouseDragging: 1, // Enable navigation by dragging the SLIDEE with mouse cursor.
+ touchDragging: 1, // Enable navigation by dragging the SLIDEE with touch events.
+ dragThreshold: 3, // Distance in pixels before Sly recognizes dragging.
+ intervactive: null, // Selector for special interactive elements.
+
+ // Mixed options
+ speed: 0 // Animations speed in milliseconds. 0 to disable animations.
+
+ }, options);
+
+ var isSmoothScrollSupported = 'scrollBehavior' in document.documentElement.style;
+
+ // native scroll is a must with touch input
+ // also use native scroll when scrolling vertically in desktop mode - excluding horizontal because the mouse wheel support is choppy at the moment
+ // in cases with firefox, if the smooth scroll api is supported then use that because their implementation is very good
+ if (options.allowNativeScroll === false) {
+ options.enableNativeScroll = false;
+ } else if (isSmoothScrollSupported && ((browser.firefox && !layoutManager.tv) || options.allowNativeSmoothScroll)) {
+ // native smooth scroll
+ options.enableNativeScroll = true;
+ } else if (options.requireAnimation && (browser.animate || browser.supportsCssAnimation())) {
+ // transform is the only way to guarantee animation
+ options.enableNativeScroll = false;
+ } else if (!layoutManager.tv || !browser.animate) {
+ options.enableNativeScroll = true;
}
- // Other global values
- var dragMouseEvents = ['mousemove', 'mouseup'];
- var dragTouchEvents = ['touchmove', 'touchend'];
- var wheelEvent = (document.implementation.hasFeature('Event.wheel', '3.0') ? 'wheel' : 'mousewheel');
- var interactiveElements = ['INPUT', 'SELECT', 'TEXTAREA'];
- var tmpArray = [];
- var time;
-
- // Math shorthands
- var abs = Math.abs;
- var sqrt = Math.sqrt;
- var pow = Math.pow;
- var round = Math.round;
- var max = Math.max;
- var min = Math.min;
-
- var scrollerFactory = function (frame, options) {
-
- // Extend options
- var o = Object.assign({}, {
- slidee: null, // Selector, DOM element, or jQuery object with DOM element representing SLIDEE.
- horizontal: false, // Switch to horizontal mode.
-
- // Scrolling
- mouseWheel: true,
- scrollBy: 0, // Pixels or items to move per one mouse scroll. 0 to disable scrolling
-
- // Dragging
- dragSource: null, // Selector or DOM element for catching dragging events. Default is FRAME.
- mouseDragging: 1, // Enable navigation by dragging the SLIDEE with mouse cursor.
- touchDragging: 1, // Enable navigation by dragging the SLIDEE with touch events.
- dragThreshold: 3, // Distance in pixels before Sly recognizes dragging.
- intervactive: null, // Selector for special interactive elements.
-
- // Mixed options
- speed: 0 // Animations speed in milliseconds. 0 to disable animations.
-
- }, options);
-
- var isSmoothScrollSupported = 'scrollBehavior' in document.documentElement.style;
-
- // native scroll is a must with touch input
- // also use native scroll when scrolling vertically in desktop mode - excluding horizontal because the mouse wheel support is choppy at the moment
- // in cases with firefox, if the smooth scroll api is supported then use that because their implementation is very good
- if (options.allowNativeScroll === false) {
- options.enableNativeScroll = false;
- } else if (isSmoothScrollSupported && ((browser.firefox && !layoutManager.tv) || options.allowNativeSmoothScroll)) {
- // native smooth scroll
- options.enableNativeScroll = true;
- } else if (options.requireAnimation && (browser.animate || browser.supportsCssAnimation())) {
-
- // transform is the only way to guarantee animation
- options.enableNativeScroll = false;
- } else if (!layoutManager.tv || !browser.animate) {
-
- options.enableNativeScroll = true;
- }
-
- // Need this for the magic wheel. With the animated scroll the magic wheel will run off of the screen
- if (browser.web0s) {
- options.enableNativeScroll = true;
- }
-
- // Private variables
- var self = this;
- self.options = o;
-
- // Frame
- var slideeElement = o.slidee ? o.slidee : sibling(frame.firstChild)[0];
- self._pos = {
- start: 0,
- center: 0,
- end: 0,
- cur: 0,
- dest: 0
- };
-
- var transform = !options.enableNativeScroll;
-
- // Miscellaneous
- var scrollSource = frame;
- var dragSourceElement = o.dragSource ? o.dragSource : frame;
- var dragging = {
- released: 1
- };
- var scrolling = {
- last: 0,
- delta: 0,
- resetTime: 200
- };
-
- // Expose properties
- self.initialized = 0;
- self.slidee = slideeElement;
- self.options = o;
- self.dragging = dragging;
-
- var nativeScrollElement = frame;
-
- function sibling(n, elem) {
- var matched = [];
-
- for (; n; n = n.nextSibling) {
- if (n.nodeType === 1 && n !== elem) {
- matched.push(n);
- }
- }
- return matched;
- }
-
- var requiresReflow = true;
-
- var frameSize = 0;
- var slideeSize = 0;
- function ensureSizeInfo() {
-
- if (requiresReflow) {
-
- requiresReflow = false;
-
- // Reset global variables
- frameSize = o.horizontal ? (frame).offsetWidth : (frame).offsetHeight;
-
- slideeSize = o.scrollWidth || Math.max(slideeElement[o.horizontal ? 'offsetWidth' : 'offsetHeight'], slideeElement[o.horizontal ? 'scrollWidth' : 'scrollHeight']);
-
- // Set position limits & relativess
- self._pos.end = max(slideeSize - frameSize, 0);
- }
- }
-
- /**
- * Loading function.
- *
- * Populate arrays, set sizes, bind events, ...
- *
- * @param {Boolean} [isInit] Whether load is called from within self.init().
- * @return {Void}
- */
- function load(isInit) {
-
- requiresReflow = true;
-
- if (!isInit) {
-
- ensureSizeInfo();
-
- // Fix possible overflowing
- var pos = self._pos;
- self.slideTo(within(pos.dest, pos.start, pos.end));
- }
- }
-
- function initFrameResizeObserver() {
-
- var observerOptions = {};
-
- self.frameResizeObserver = new ResizeObserver(onResize, observerOptions);
-
- self.frameResizeObserver.observe(frame);
- }
-
- self.reload = function () {
- load();
- };
-
- self.getScrollEventName = function () {
- return transform ? 'scrollanimate' : 'scroll';
- };
-
- self.getScrollSlider = function () {
- return slideeElement;
- };
-
- self.getScrollFrame = function () {
- return frame;
- };
-
- function nativeScrollTo(container, pos, immediate) {
-
- if (container.scroll) {
- if (o.horizontal) {
-
- container.scroll({
- left: pos,
- behavior: immediate ? 'instant' : 'smooth'
- });
- } else {
-
- container.scroll({
- top: pos,
- behavior: immediate ? 'instant' : 'smooth'
- });
- }
- } else if (!immediate && container.scrollTo) {
- if (o.horizontal) {
- container.scrollTo(Math.round(pos), 0);
- } else {
- container.scrollTo(0, Math.round(pos));
- }
- } else {
- if (o.horizontal) {
- container.scrollLeft = Math.round(pos);
- } else {
- container.scrollTop = Math.round(pos);
- }
- }
- }
-
- var lastAnimate;
-
- /**
- * Animate to a position.
- *
- * @param {Int} newPos New position.
- * @param {Bool} immediate Reposition immediately without an animation.
- *
- * @return {Void}
- */
- self.slideTo = function (newPos, immediate, fullItemPos) {
-
- ensureSizeInfo();
- var pos = self._pos;
-
- newPos = within(newPos, pos.start, pos.end);
-
- if (!transform) {
-
- nativeScrollTo(nativeScrollElement, newPos, immediate);
- return;
- }
-
- // Update the animation object
- var from = pos.cur;
- immediate = immediate || dragging.init || !o.speed;
-
- var now = new Date().getTime();
-
- if (o.autoImmediate) {
- if (!immediate && (now - (lastAnimate || 0)) <= 50) {
- immediate = true;
- }
- }
-
- if (!immediate && o.skipSlideToWhenVisible && fullItemPos && fullItemPos.isVisible) {
-
- return;
- }
-
- // Start animation rendering
- // NOTE the dependency was modified here to fix a scrollbutton issue
- pos.dest = newPos;
- renderAnimateWithTransform(from, newPos, immediate);
- lastAnimate = now;
- };
-
- function setStyleProperty(elem, name, value, speed, resetTransition) {
-
- var style = elem.style;
-
- if (resetTransition || browser.edge) {
- style.transition = 'none';
- void elem.offsetWidth;
- }
-
- style.transition = 'transform ' + speed + 'ms ease-out';
- style[name] = value;
- }
-
- function dispatchScrollEventIfNeeded() {
- if (o.dispatchScrollEvent) {
- frame.dispatchEvent(new CustomEvent(self.getScrollEventName(), {
- bubbles: true,
- cancelable: false
- }));
- }
- }
-
- function renderAnimateWithTransform(fromPosition, toPosition, immediate) {
-
- var speed = o.speed;
-
- if (immediate) {
- speed = o.immediateSpeed || 50;
- }
-
- if (o.horizontal) {
- setStyleProperty(slideeElement, 'transform', 'translateX(' + (-round(toPosition)) + 'px)', speed);
- } else {
- setStyleProperty(slideeElement, 'transform', 'translateY(' + (-round(toPosition)) + 'px)', speed);
- }
- self._pos.cur = toPosition;
-
- dispatchScrollEventIfNeeded();
- }
-
- function getBoundingClientRect(elem) {
-
- // Support: BlackBerry 5, iOS 3 (original iPhone)
- // If we don't have gBCR, just use 0,0 rather than error
- if (elem.getBoundingClientRect) {
- return elem.getBoundingClientRect();
- } else {
- return { top: 0, left: 0 };
- }
- }
-
- /**
- * Returns the position object.
- *
- * @param {Mixed} item
- *
- * @return {Object}
- */
- self.getPos = function (item) {
-
- var scrollElement = transform ? slideeElement : nativeScrollElement;
- var slideeOffset = getBoundingClientRect(scrollElement);
- var itemOffset = getBoundingClientRect(item);
-
- var slideeStartPos = o.horizontal ? slideeOffset.left : slideeOffset.top;
- var slideeEndPos = o.horizontal ? slideeOffset.right : slideeOffset.bottom;
-
- var offset = o.horizontal ? itemOffset.left - slideeOffset.left : itemOffset.top - slideeOffset.top;
-
- var size = o.horizontal ? itemOffset.width : itemOffset.height;
- if (!size && size !== 0) {
- size = item[o.horizontal ? 'offsetWidth' : 'offsetHeight'];
- }
-
- var centerOffset = o.centerOffset || 0;
-
- if (!transform) {
- centerOffset = 0;
- if (o.horizontal) {
- offset += nativeScrollElement.scrollLeft;
- } else {
- offset += nativeScrollElement.scrollTop;
- }
- }
-
- ensureSizeInfo();
-
- var currentStart = self._pos.cur;
- var currentEnd = currentStart + frameSize;
-
- console.debug('offset:' + offset + ' currentStart:' + currentStart + ' currentEnd:' + currentEnd);
- var isVisible = offset >= currentStart && (offset + size) <= currentEnd;
-
- return {
- start: offset,
- center: offset + centerOffset - (frameSize / 2) + (size / 2),
- end: offset - frameSize + size,
- size: size,
- isVisible: isVisible
- };
- };
-
- self.getCenterPosition = function (item) {
-
- ensureSizeInfo();
-
- var pos = self.getPos(item);
- return within(pos.center, pos.start, pos.end);
- };
-
- function dragInitSlidee(event) {
- var isTouch = event.type === 'touchstart';
-
- // Ignore when already in progress, or interactive element in non-touch navivagion
- if (dragging.init || !isTouch && isInteractive(event.target)) {
- return;
- }
-
- // SLIDEE dragging conditions
- if (!(isTouch ? o.touchDragging : o.mouseDragging && event.which < 2)) {
- return;
- }
-
- if (!isTouch) {
- // prevents native image dragging in Firefox
- event.preventDefault();
- }
-
- // Reset dragging object
- dragging.released = 0;
-
- // Properties used in dragHandler
- dragging.init = 0;
- dragging.source = event.target;
- dragging.touch = isTouch;
- var pointer = isTouch ? event.touches[0] : event;
- dragging.initX = pointer.pageX;
- dragging.initY = pointer.pageY;
- dragging.initPos = self._pos.cur;
- dragging.start = +new Date();
- dragging.time = 0;
- dragging.path = 0;
- dragging.delta = 0;
- dragging.locked = 0;
- dragging.pathToLock = isTouch ? 30 : 10;
-
- // Bind dragging events
- if (transform) {
-
- if (isTouch) {
- dragTouchEvents.forEach(function (eventName) {
- dom.addEventListener(document, eventName, dragHandler, {
- passive: true
- });
- });
- } else {
- dragMouseEvents.forEach(function (eventName) {
- dom.addEventListener(document, eventName, dragHandler, {
- passive: true
- });
- });
- }
- }
- }
-
- /**
- * Handler for dragging scrollbar handle or SLIDEE.
- *
- * @param {Event} event
- *
- * @return {Void}
- */
- function dragHandler(event) {
- dragging.released = event.type === 'mouseup' || event.type === 'touchend';
- var pointer = dragging.touch ? event[dragging.released ? 'changedTouches' : 'touches'][0] : event;
- dragging.pathX = pointer.pageX - dragging.initX;
- dragging.pathY = pointer.pageY - dragging.initY;
- dragging.path = sqrt(pow(dragging.pathX, 2) + pow(dragging.pathY, 2));
- dragging.delta = o.horizontal ? dragging.pathX : dragging.pathY;
-
- if (!dragging.released && dragging.path < 1) {
- return;
- }
-
- // We haven't decided whether this is a drag or not...
- if (!dragging.init) {
- // If the drag path was very short, maybe it's not a drag?
- if (dragging.path < o.dragThreshold) {
- // If the pointer was released, the path will not become longer and it's
- // definitely not a drag. If not released yet, decide on next iteration
- return dragging.released ? dragEnd() : undefined;
- } else {
- // If dragging path is sufficiently long we can confidently start a drag
- // if drag is in different direction than scroll, ignore it
- if (o.horizontal ? abs(dragging.pathX) > abs(dragging.pathY) : abs(dragging.pathX) < abs(dragging.pathY)) {
- dragging.init = 1;
- } else {
- return dragEnd();
- }
- }
- }
-
- //event.preventDefault();
-
- // Disable click on a source element, as it is unwelcome when dragging
- if (!dragging.locked && dragging.path > dragging.pathToLock) {
- dragging.locked = 1;
- dragging.source.addEventListener('click', disableOneEvent);
- }
-
- // Cancel dragging on release
- if (dragging.released) {
- dragEnd();
- }
-
- self.slideTo(round(dragging.initPos - dragging.delta));
- }
-
- /**
- * Stops dragging and cleans up after it.
- *
- * @return {Void}
- */
- function dragEnd() {
- dragging.released = true;
-
- dragTouchEvents.forEach(function (eventName) {
- dom.removeEventListener(document, eventName, dragHandler, {
- passive: true
- });
- });
-
- dragMouseEvents.forEach(function (eventName) {
- dom.removeEventListener(document, eventName, dragHandler, {
- passive: true
- });
- });
-
- // Make sure that disableOneEvent is not active in next tick.
- setTimeout(function () {
- dragging.source.removeEventListener('click', disableOneEvent);
- });
-
- dragging.init = 0;
- }
-
- /**
- * Check whether element is interactive.
- *
- * @return {Boolean}
- */
- function isInteractive(element) {
-
- while (element) {
-
- if (interactiveElements.indexOf(element.tagName) !== -1) {
- return true;
- }
-
- element = element.parentNode;
- }
- return false;
- }
-
- /**
- * Mouse wheel delta normalization.
- *
- * @param {Event} event
- *
- * @return {Int}
- */
- function normalizeWheelDelta(event) {
- // JELLYFIN MOD: Only use deltaX for horizontal scroll and remove IE8 support
- scrolling.curDelta = o.horizontal ? event.deltaX : event.deltaY;
- // END JELLYFIN MOD
-
- if (transform) {
- scrolling.curDelta /= event.deltaMode === 1 ? 3 : 100;
- }
- return scrolling.curDelta;
- }
-
- /**
- * Mouse scrolling handler.
- *
- * @param {Event} event
- *
- * @return {Void}
- */
- function scrollHandler(event) {
-
- ensureSizeInfo();
- var pos = self._pos;
- // Ignore if there is no scrolling to be done
- if (!o.scrollBy || pos.start === pos.end) {
- return;
- }
- var delta = normalizeWheelDelta(event);
-
- if (transform) {
- // Trap scrolling only when necessary and/or requested
- if (delta > 0 && pos.dest < pos.end || delta < 0 && pos.dest > pos.start) {
- //stopDefault(event, 1);
- }
-
- self.slideBy(o.scrollBy * delta);
- } else {
-
- if (isSmoothScrollSupported) {
- delta *= 12;
- }
-
- if (o.horizontal) {
- nativeScrollElement.scrollLeft += delta;
- } else {
- nativeScrollElement.scrollTop += delta;
- }
- }
- }
-
- /**
- * Destroys instance and everything it created.
- *
- * @return {Void}
- */
- self.destroy = function () {
-
- if (self.frameResizeObserver) {
- self.frameResizeObserver.disconnect();
- self.frameResizeObserver = null;
- }
-
- // Reset native FRAME element scroll
- dom.removeEventListener(frame, 'scroll', resetScroll, {
- passive: true
- });
-
- dom.removeEventListener(scrollSource, wheelEvent, scrollHandler, {
- passive: true
- });
-
- dom.removeEventListener(dragSourceElement, 'touchstart', dragInitSlidee, {
- passive: true
- });
-
- dom.removeEventListener(frame, 'click', onFrameClick, {
- passive: true,
- capture: true
- });
-
- dom.removeEventListener(dragSourceElement, 'mousedown', dragInitSlidee, {
- //passive: true
- });
-
- // Reset initialized status and return the instance
- self.initialized = 0;
- return self;
- };
-
- var contentRect = {};
-
- function onResize(entries) {
-
- var entry = entries[0];
-
- if (entry) {
-
- var newRect = entry.contentRect;
-
- // handle element being hidden
- if (newRect.width === 0 || newRect.height === 0) {
- return;
- }
-
- if (newRect.width !== contentRect.width || newRect.height !== contentRect.height) {
-
- contentRect = newRect;
-
- load(false);
- }
- }
- }
-
- function resetScroll() {
- if (o.horizontal) {
- this.scrollLeft = 0;
- } else {
- this.scrollTop = 0;
- }
- }
-
- function onFrameClick(e) {
- if (e.which === 1) {
- var focusableParent = focusManager.focusableParent(e.target);
- if (focusableParent && focusableParent !== document.activeElement) {
- focusableParent.focus();
- }
- }
- }
-
- self.getScrollPosition = function () {
-
- if (transform) {
- return self._pos.cur;
- }
-
- if (o.horizontal) {
- return nativeScrollElement.scrollLeft;
- } else {
- return nativeScrollElement.scrollTop;
- }
- };
-
- self.getScrollSize = function () {
-
- if (transform) {
- return slideeSize;
- }
-
- if (o.horizontal) {
- return nativeScrollElement.scrollWidth;
- } else {
- return nativeScrollElement.scrollHeight;
- }
- };
-
- /**
- * Initialize.
- *
- * @return {Object}
- */
- self.init = function () {
- if (self.initialized) {
- return;
- }
-
- if (!transform) {
- if (o.horizontal) {
- if (layoutManager.desktop && !o.hideScrollbar) {
- nativeScrollElement.classList.add('scrollX');
- } else {
- nativeScrollElement.classList.add('scrollX');
- nativeScrollElement.classList.add('hiddenScrollX');
-
- if (layoutManager.tv && o.allowNativeSmoothScroll !== false) {
- nativeScrollElement.classList.add('smoothScrollX');
- }
- }
-
- if (o.forceHideScrollbars) {
- nativeScrollElement.classList.add('hiddenScrollX-forced');
- }
- } else {
- if (layoutManager.desktop && !o.hideScrollbar) {
- nativeScrollElement.classList.add('scrollY');
- } else {
- nativeScrollElement.classList.add('scrollY');
- nativeScrollElement.classList.add('hiddenScrollY');
-
- if (layoutManager.tv && o.allowNativeSmoothScroll !== false) {
- nativeScrollElement.classList.add('smoothScrollY');
- }
- }
-
- if (o.forceHideScrollbars) {
- nativeScrollElement.classList.add('hiddenScrollY-forced');
- }
- }
- } else {
- frame.style.overflow = 'hidden';
- slideeElement.style['will-change'] = 'transform';
- slideeElement.style.transition = 'transform ' + o.speed + 'ms ease-out';
-
- if (o.horizontal) {
- slideeElement.classList.add('animatedScrollX');
- } else {
- slideeElement.classList.add('animatedScrollY');
- }
- }
-
- if (transform || layoutManager.tv) {
- // This can prevent others from being able to listen to mouse events
- dom.addEventListener(dragSourceElement, 'mousedown', dragInitSlidee, {
- //passive: true
- });
- }
-
- initFrameResizeObserver();
-
- if (transform) {
-
- dom.addEventListener(dragSourceElement, 'touchstart', dragInitSlidee, {
- passive: true
- });
-
- if (!o.horizontal) {
- dom.addEventListener(frame, 'scroll', resetScroll, {
- passive: true
- });
- }
-
- if (o.mouseWheel) {
- // Scrolling navigation
- dom.addEventListener(scrollSource, wheelEvent, scrollHandler, {
- passive: true
- });
- }
-
- } else if (o.horizontal) {
-
- // Don't bind to mouse events with vertical scroll since the mouse wheel can handle this natively
-
- if (o.mouseWheel) {
- // Scrolling navigation
- dom.addEventListener(scrollSource, wheelEvent, scrollHandler, {
- passive: true
- });
- }
- }
-
- dom.addEventListener(frame, 'click', onFrameClick, {
- passive: true,
- capture: true
- });
-
- // Mark instance as initialized
- self.initialized = 1;
-
- // Load
- load(true);
-
- // Return instance
- return self;
- };
+ // Need this for the magic wheel. With the animated scroll the magic wheel will run off of the screen
+ if (browser.web0s) {
+ options.enableNativeScroll = true;
+ }
+
+ // Private variables
+ var self = this;
+ self.options = o;
+
+ // Frame
+ var slideeElement = o.slidee ? o.slidee : sibling(frame.firstChild)[0];
+ self._pos = {
+ start: 0,
+ center: 0,
+ end: 0,
+ cur: 0,
+ dest: 0
};
+ var transform = !options.enableNativeScroll;
+
+ // Miscellaneous
+ var scrollSource = frame;
+ var dragSourceElement = o.dragSource ? o.dragSource : frame;
+ var dragging = {
+ released: 1
+ };
+ var scrolling = {
+ last: 0,
+ delta: 0,
+ resetTime: 200
+ };
+
+ // Expose properties
+ self.initialized = 0;
+ self.slidee = slideeElement;
+ self.options = o;
+ self.dragging = dragging;
+
+ var nativeScrollElement = frame;
+
+ function sibling(n, elem) {
+ var matched = [];
+
+ for (; n; n = n.nextSibling) {
+ if (n.nodeType === 1 && n !== elem) {
+ matched.push(n);
+ }
+ }
+ return matched;
+ }
+
+ var requiresReflow = true;
+
+ var frameSize = 0;
+ var slideeSize = 0;
+ function ensureSizeInfo() {
+ if (requiresReflow) {
+ requiresReflow = false;
+
+ // Reset global variables
+ frameSize = o.horizontal ? (frame).offsetWidth : (frame).offsetHeight;
+
+ slideeSize = o.scrollWidth || Math.max(slideeElement[o.horizontal ? 'offsetWidth' : 'offsetHeight'], slideeElement[o.horizontal ? 'scrollWidth' : 'scrollHeight']);
+
+ // Set position limits & relativess
+ self._pos.end = Math.max(slideeSize - frameSize, 0);
+ }
+ }
+
/**
- * Slide SLIDEE by amount of pixels.
+ * Loading function.
*
- * @param {Int} delta Pixels/Items. Positive means forward, negative means backward.
- * @param {Bool} immediate Reposition immediately without an animation.
+ * Populate arrays, set sizes, bind events, ...
*
+ * @param {Boolean} [isInit] Whether load is called from within self.init().
* @return {Void}
*/
- scrollerFactory.prototype.slideBy = function (delta, immediate) {
- if (!delta) {
+ function load(isInit) {
+ requiresReflow = true;
+
+ if (!isInit) {
+ ensureSizeInfo();
+
+ // Fix possible overflowing
+ var pos = self._pos;
+ self.slideTo(within(pos.dest, pos.start, pos.end));
+ }
+ }
+
+ function initFrameResizeObserver() {
+ var observerOptions = {};
+
+ self.frameResizeObserver = new ResizeObserver(onResize, observerOptions);
+
+ self.frameResizeObserver.observe(frame);
+ }
+
+ self.reload = function () {
+ load();
+ };
+
+ self.getScrollEventName = function () {
+ return transform ? 'scrollanimate' : 'scroll';
+ };
+
+ self.getScrollSlider = function () {
+ return slideeElement;
+ };
+
+ self.getScrollFrame = function () {
+ return frame;
+ };
+
+ function nativeScrollTo(container, pos, immediate) {
+ if (container.scroll) {
+ if (o.horizontal) {
+ container.scroll({
+ left: pos,
+ behavior: immediate ? 'instant' : 'smooth'
+ });
+ } else {
+ container.scroll({
+ top: pos,
+ behavior: immediate ? 'instant' : 'smooth'
+ });
+ }
+ } else if (!immediate && container.scrollTo) {
+ if (o.horizontal) {
+ container.scrollTo(Math.round(pos), 0);
+ } else {
+ container.scrollTo(0, Math.round(pos));
+ }
+ } else {
+ if (o.horizontal) {
+ container.scrollLeft = Math.round(pos);
+ } else {
+ container.scrollTop = Math.round(pos);
+ }
+ }
+ }
+
+ var lastAnimate;
+
+ /**
+ * Animate to a position.
+ *
+ * @param {Int} newPos New position.
+ * @param {Bool} immediate Reposition immediately without an animation.
+ *
+ * @return {Void}
+ */
+ self.slideTo = function (newPos, immediate, fullItemPos) {
+ ensureSizeInfo();
+ var pos = self._pos;
+
+ newPos = within(newPos, pos.start, pos.end);
+
+ if (!transform) {
+ nativeScrollTo(nativeScrollElement, newPos, immediate);
return;
}
- this.slideTo(this._pos.dest + delta, immediate);
- };
- /**
- * Core method for handling `toLocation` methods.
- *
- * @param {String} location
- * @param {Mixed} item
- * @param {Bool} immediate
- *
- * @return {Void}
- */
- scrollerFactory.prototype.to = function (location, item, immediate) {
- // Optional arguments logic
- if (type(item) === 'boolean') {
- immediate = item;
- item = undefined;
- }
+ // Update the animation object
+ var from = pos.cur;
+ immediate = immediate || dragging.init || !o.speed;
- if (item === undefined) {
- this.slideTo(this._pos[location], immediate);
- } else {
- var itemPos = this.getPos(item);
+ var now = new Date().getTime();
- if (itemPos) {
- this.slideTo(itemPos[location], immediate, itemPos);
+ if (o.autoImmediate) {
+ if (!immediate && (now - (lastAnimate || 0)) <= 50) {
+ immediate = true;
}
}
+
+ if (!immediate && o.skipSlideToWhenVisible && fullItemPos && fullItemPos.isVisible) {
+ return;
+ }
+
+ // Start animation rendering
+ // NOTE the dependency was modified here to fix a scrollbutton issue
+ pos.dest = newPos;
+ renderAnimateWithTransform(from, newPos, immediate);
+ lastAnimate = now;
};
+ function setStyleProperty(elem, name, value, speed, resetTransition) {
+ var style = elem.style;
+
+ if (resetTransition || browser.edge) {
+ style.transition = 'none';
+ void elem.offsetWidth;
+ }
+
+ style.transition = 'transform ' + speed + 'ms ease-out';
+ style[name] = value;
+ }
+
+ function dispatchScrollEventIfNeeded() {
+ if (o.dispatchScrollEvent) {
+ frame.dispatchEvent(new CustomEvent(self.getScrollEventName(), {
+ bubbles: true,
+ cancelable: false
+ }));
+ }
+ }
+
+ function renderAnimateWithTransform(fromPosition, toPosition, immediate) {
+ var speed = o.speed;
+
+ if (immediate) {
+ speed = o.immediateSpeed || 50;
+ }
+
+ if (o.horizontal) {
+ setStyleProperty(slideeElement, 'transform', 'translateX(' + (-Math.round(toPosition)) + 'px)', speed);
+ } else {
+ setStyleProperty(slideeElement, 'transform', 'translateY(' + (-Math.round(toPosition)) + 'px)', speed);
+ }
+ self._pos.cur = toPosition;
+
+ dispatchScrollEventIfNeeded();
+ }
+
+ function getBoundingClientRect(elem) {
+ // Support: BlackBerry 5, iOS 3 (original iPhone)
+ // If we don't have gBCR, just use 0,0 rather than error
+ if (elem.getBoundingClientRect) {
+ return elem.getBoundingClientRect();
+ } else {
+ return { top: 0, left: 0 };
+ }
+ }
+
/**
- * Animate element or the whole SLIDEE to the start of the frame.
+ * Returns the position object.
*
- * @param {Mixed} item Item DOM element, or index starting at 0. Omitting will animate SLIDEE.
- * @param {Bool} immediate Reposition immediately without an animation.
+ * @param {Mixed} item
+ *
+ * @return {Object}
+ */
+ self.getPos = function (item) {
+ var scrollElement = transform ? slideeElement : nativeScrollElement;
+ var slideeOffset = getBoundingClientRect(scrollElement);
+ var itemOffset = getBoundingClientRect(item);
+
+ var offset = o.horizontal ? itemOffset.left - slideeOffset.left : itemOffset.top - slideeOffset.top;
+
+ var size = o.horizontal ? itemOffset.width : itemOffset.height;
+ if (!size && size !== 0) {
+ size = item[o.horizontal ? 'offsetWidth' : 'offsetHeight'];
+ }
+
+ var centerOffset = o.centerOffset || 0;
+
+ if (!transform) {
+ centerOffset = 0;
+ if (o.horizontal) {
+ offset += nativeScrollElement.scrollLeft;
+ } else {
+ offset += nativeScrollElement.scrollTop;
+ }
+ }
+
+ ensureSizeInfo();
+
+ var currentStart = self._pos.cur;
+ var currentEnd = currentStart + frameSize;
+
+ console.debug('offset:' + offset + ' currentStart:' + currentStart + ' currentEnd:' + currentEnd);
+ var isVisible = offset >= currentStart && (offset + size) <= currentEnd;
+
+ return {
+ start: offset,
+ center: offset + centerOffset - (frameSize / 2) + (size / 2),
+ end: offset - frameSize + size,
+ size: size,
+ isVisible: isVisible
+ };
+ };
+
+ self.getCenterPosition = function (item) {
+ ensureSizeInfo();
+
+ var pos = self.getPos(item);
+ return within(pos.center, pos.start, pos.end);
+ };
+
+ function dragInitSlidee(event) {
+ var isTouch = event.type === 'touchstart';
+
+ // Ignore when already in progress, or interactive element in non-touch navivagion
+ if (dragging.init || !isTouch && isInteractive(event.target)) {
+ return;
+ }
+
+ // SLIDEE dragging conditions
+ if (!(isTouch ? o.touchDragging : o.mouseDragging && event.which < 2)) {
+ return;
+ }
+
+ if (!isTouch) {
+ // prevents native image dragging in Firefox
+ event.preventDefault();
+ }
+
+ // Reset dragging object
+ dragging.released = 0;
+
+ // Properties used in dragHandler
+ dragging.init = 0;
+ dragging.source = event.target;
+ dragging.touch = isTouch;
+ var pointer = isTouch ? event.touches[0] : event;
+ dragging.initX = pointer.pageX;
+ dragging.initY = pointer.pageY;
+ dragging.initPos = self._pos.cur;
+ dragging.start = +new Date();
+ dragging.time = 0;
+ dragging.path = 0;
+ dragging.delta = 0;
+ dragging.locked = 0;
+ dragging.pathToLock = isTouch ? 30 : 10;
+
+ // Bind dragging events
+ if (transform) {
+ if (isTouch) {
+ dragTouchEvents.forEach(function (eventName) {
+ dom.addEventListener(document, eventName, dragHandler, {
+ passive: true
+ });
+ });
+ } else {
+ dragMouseEvents.forEach(function (eventName) {
+ dom.addEventListener(document, eventName, dragHandler, {
+ passive: true
+ });
+ });
+ }
+ }
+ }
+
+ /**
+ * Handler for dragging scrollbar handle or SLIDEE.
+ *
+ * @param {Event} event
*
* @return {Void}
*/
- scrollerFactory.prototype.toStart = function (item, immediate) {
- this.to('start', item, immediate);
- };
+ function dragHandler(event) {
+ dragging.released = event.type === 'mouseup' || event.type === 'touchend';
+ var pointer = dragging.touch ? event[dragging.released ? 'changedTouches' : 'touches'][0] : event;
+ dragging.pathX = pointer.pageX - dragging.initX;
+ dragging.pathY = pointer.pageY - dragging.initY;
+ dragging.path = Math.sqrt(Math.pow(dragging.pathX, 2) + Math.pow(dragging.pathY, 2));
+ dragging.delta = o.horizontal ? dragging.pathX : dragging.pathY;
+
+ if (!dragging.released && dragging.path < 1) {
+ return;
+ }
+
+ // We haven't decided whether this is a drag or not...
+ if (!dragging.init) {
+ // If the drag path was very short, maybe it's not a drag?
+ if (dragging.path < o.dragThreshold) {
+ // If the pointer was released, the path will not become longer and it's
+ // definitely not a drag. If not released yet, decide on next iteration
+ return dragging.released ? dragEnd() : undefined;
+ } else {
+ // If dragging path is sufficiently long we can confidently start a drag
+ // if drag is in different direction than scroll, ignore it
+ if (o.horizontal ? Math.abs(dragging.pathX) > Math.abs(dragging.pathY) : Math.abs(dragging.pathX) < Math.abs(dragging.pathY)) {
+ dragging.init = 1;
+ } else {
+ return dragEnd();
+ }
+ }
+ }
+
+ //event.preventDefault();
+
+ // Disable click on a source element, as it is unwelcome when dragging
+ if (!dragging.locked && dragging.path > dragging.pathToLock) {
+ dragging.locked = 1;
+ dragging.source.addEventListener('click', disableOneEvent);
+ }
+
+ // Cancel dragging on release
+ if (dragging.released) {
+ dragEnd();
+ }
+
+ self.slideTo(Math.round(dragging.initPos - dragging.delta));
+ }
/**
- * Animate element or the whole SLIDEE to the end of the frame.
- *
- * @param {Mixed} item Item DOM element, or index starting at 0. Omitting will animate SLIDEE.
- * @param {Bool} immediate Reposition immediately without an animation.
+ * Stops dragging and cleans up after it.
*
* @return {Void}
*/
- scrollerFactory.prototype.toEnd = function (item, immediate) {
- this.to('end', item, immediate);
- };
+ function dragEnd() {
+ dragging.released = true;
+
+ dragTouchEvents.forEach(function (eventName) {
+ dom.removeEventListener(document, eventName, dragHandler, {
+ passive: true
+ });
+ });
+
+ dragMouseEvents.forEach(function (eventName) {
+ dom.removeEventListener(document, eventName, dragHandler, {
+ passive: true
+ });
+ });
+
+ // Make sure that disableOneEvent is not active in next tick.
+ setTimeout(function () {
+ dragging.source.removeEventListener('click', disableOneEvent);
+ });
+
+ dragging.init = 0;
+ }
/**
- * Animate element or the whole SLIDEE to the center of the frame.
+ * Check whether element is interactive.
*
- * @param {Mixed} item Item DOM element, or index starting at 0. Omitting will animate SLIDEE.
- * @param {Bool} immediate Reposition immediately without an animation.
+ * @return {Boolean}
+ */
+ function isInteractive(element) {
+ while (element) {
+ if (interactiveElements.indexOf(element.tagName) !== -1) {
+ return true;
+ }
+
+ element = element.parentNode;
+ }
+ return false;
+ }
+
+ /**
+ * Mouse wheel delta normalization.
+ *
+ * @param {Event} event
+ *
+ * @return {Int}
+ */
+ function normalizeWheelDelta(event) {
+ // JELLYFIN MOD: Only use deltaX for horizontal scroll and remove IE8 support
+ scrolling.curDelta = o.horizontal ? event.deltaX : event.deltaY;
+ // END JELLYFIN MOD
+
+ if (transform) {
+ scrolling.curDelta /= event.deltaMode === 1 ? 3 : 100;
+ }
+ return scrolling.curDelta;
+ }
+
+ /**
+ * Mouse scrolling handler.
+ *
+ * @param {Event} event
*
* @return {Void}
*/
- scrollerFactory.prototype.toCenter = function (item, immediate) {
- this.to('center', item, immediate);
+ function scrollHandler(event) {
+ ensureSizeInfo();
+ var pos = self._pos;
+ // Ignore if there is no scrolling to be done
+ if (!o.scrollBy || pos.start === pos.end) {
+ return;
+ }
+ var delta = normalizeWheelDelta(event);
+
+ if (transform) {
+ // Trap scrolling only when necessary and/or requested
+ if (delta > 0 && pos.dest < pos.end || delta < 0 && pos.dest > pos.start) {
+ //stopDefault(event, 1);
+ }
+
+ self.slideBy(o.scrollBy * delta);
+ } else {
+ if (isSmoothScrollSupported) {
+ delta *= 12;
+ }
+
+ if (o.horizontal) {
+ nativeScrollElement.scrollLeft += delta;
+ } else {
+ nativeScrollElement.scrollTop += delta;
+ }
+ }
+ }
+
+ /**
+ * Destroys instance and everything it created.
+ *
+ * @return {Void}
+ */
+ self.destroy = function () {
+ if (self.frameResizeObserver) {
+ self.frameResizeObserver.disconnect();
+ self.frameResizeObserver = null;
+ }
+
+ // Reset native FRAME element scroll
+ dom.removeEventListener(frame, 'scroll', resetScroll, {
+ passive: true
+ });
+
+ dom.removeEventListener(scrollSource, wheelEvent, scrollHandler, {
+ passive: true
+ });
+
+ dom.removeEventListener(dragSourceElement, 'touchstart', dragInitSlidee, {
+ passive: true
+ });
+
+ dom.removeEventListener(frame, 'click', onFrameClick, {
+ passive: true,
+ capture: true
+ });
+
+ dom.removeEventListener(dragSourceElement, 'mousedown', dragInitSlidee, {
+ //passive: true
+ });
+
+ // Reset initialized status and return the instance
+ self.initialized = 0;
+ return self;
};
- scrollerFactory.create = function (frame, options) {
- var instance = new scrollerFactory(frame, options);
- return Promise.resolve(instance);
+ var contentRect = {};
+
+ function onResize(entries) {
+ var entry = entries[0];
+
+ if (entry) {
+ var newRect = entry.contentRect;
+
+ // handle element being hidden
+ if (newRect.width === 0 || newRect.height === 0) {
+ return;
+ }
+
+ if (newRect.width !== contentRect.width || newRect.height !== contentRect.height) {
+ contentRect = newRect;
+
+ load(false);
+ }
+ }
+ }
+
+ function resetScroll() {
+ if (o.horizontal) {
+ this.scrollLeft = 0;
+ } else {
+ this.scrollTop = 0;
+ }
+ }
+
+ function onFrameClick(e) {
+ if (e.which === 1) {
+ var focusableParent = focusManager.focusableParent(e.target);
+ if (focusableParent && focusableParent !== document.activeElement) {
+ focusableParent.focus();
+ }
+ }
+ }
+
+ self.getScrollPosition = function () {
+ if (transform) {
+ return self._pos.cur;
+ }
+
+ if (o.horizontal) {
+ return nativeScrollElement.scrollLeft;
+ } else {
+ return nativeScrollElement.scrollTop;
+ }
};
- return scrollerFactory;
-});
+ self.getScrollSize = function () {
+ if (transform) {
+ return slideeSize;
+ }
+
+ if (o.horizontal) {
+ return nativeScrollElement.scrollWidth;
+ } else {
+ return nativeScrollElement.scrollHeight;
+ }
+ };
+
+ /**
+ * Initialize.
+ *
+ * @return {Object}
+ */
+ self.init = function () {
+ if (self.initialized) {
+ return;
+ }
+
+ if (!transform) {
+ if (o.horizontal) {
+ if (layoutManager.desktop && !o.hideScrollbar) {
+ nativeScrollElement.classList.add('scrollX');
+ } else {
+ nativeScrollElement.classList.add('scrollX');
+ nativeScrollElement.classList.add('hiddenScrollX');
+
+ if (layoutManager.tv && o.allowNativeSmoothScroll !== false) {
+ nativeScrollElement.classList.add('smoothScrollX');
+ }
+ }
+
+ if (o.forceHideScrollbars) {
+ nativeScrollElement.classList.add('hiddenScrollX-forced');
+ }
+ } else {
+ if (layoutManager.desktop && !o.hideScrollbar) {
+ nativeScrollElement.classList.add('scrollY');
+ } else {
+ nativeScrollElement.classList.add('scrollY');
+ nativeScrollElement.classList.add('hiddenScrollY');
+
+ if (layoutManager.tv && o.allowNativeSmoothScroll !== false) {
+ nativeScrollElement.classList.add('smoothScrollY');
+ }
+ }
+
+ if (o.forceHideScrollbars) {
+ nativeScrollElement.classList.add('hiddenScrollY-forced');
+ }
+ }
+ } else {
+ frame.style.overflow = 'hidden';
+ slideeElement.style['will-change'] = 'transform';
+ slideeElement.style.transition = 'transform ' + o.speed + 'ms ease-out';
+
+ if (o.horizontal) {
+ slideeElement.classList.add('animatedScrollX');
+ } else {
+ slideeElement.classList.add('animatedScrollY');
+ }
+ }
+
+ if (transform || layoutManager.tv) {
+ // This can prevent others from being able to listen to mouse events
+ dom.addEventListener(dragSourceElement, 'mousedown', dragInitSlidee, {
+ //passive: true
+ });
+ }
+
+ initFrameResizeObserver();
+
+ if (transform) {
+ dom.addEventListener(dragSourceElement, 'touchstart', dragInitSlidee, {
+ passive: true
+ });
+
+ if (!o.horizontal) {
+ dom.addEventListener(frame, 'scroll', resetScroll, {
+ passive: true
+ });
+ }
+
+ if (o.mouseWheel) {
+ // Scrolling navigation
+ dom.addEventListener(scrollSource, wheelEvent, scrollHandler, {
+ passive: true
+ });
+ }
+ } else if (o.horizontal) {
+ // Don't bind to mouse events with vertical scroll since the mouse wheel can handle this natively
+
+ if (o.mouseWheel) {
+ // Scrolling navigation
+ dom.addEventListener(scrollSource, wheelEvent, scrollHandler, {
+ passive: true
+ });
+ }
+ }
+
+ dom.addEventListener(frame, 'click', onFrameClick, {
+ passive: true,
+ capture: true
+ });
+
+ // Mark instance as initialized
+ self.initialized = 1;
+
+ // Load
+ load(true);
+
+ // Return instance
+ return self;
+ };
+};
+
+/**
+ * Slide SLIDEE by amount of pixels.
+ *
+ * @param {Int} delta Pixels/Items. Positive means forward, negative means backward.
+ * @param {Bool} immediate Reposition immediately without an animation.
+ *
+ * @return {Void}
+ */
+scrollerFactory.prototype.slideBy = function (delta, immediate) {
+ if (!delta) {
+ return;
+ }
+ this.slideTo(this._pos.dest + delta, immediate);
+};
+
+/**
+ * Core method for handling `toLocation` methods.
+ *
+ * @param {String} location
+ * @param {Mixed} item
+ * @param {Bool} immediate
+ *
+ * @return {Void}
+ */
+scrollerFactory.prototype.to = function (location, item, immediate) {
+ // Optional arguments logic
+ if (type(item) === 'boolean') {
+ immediate = item;
+ item = undefined;
+ }
+
+ if (item === undefined) {
+ this.slideTo(this._pos[location], immediate);
+ } else {
+ var itemPos = this.getPos(item);
+
+ if (itemPos) {
+ this.slideTo(itemPos[location], immediate, itemPos);
+ }
+ }
+};
+
+/**
+ * Animate element or the whole SLIDEE to the start of the frame.
+ *
+ * @param {Mixed} item Item DOM element, or index starting at 0. Omitting will animate SLIDEE.
+ * @param {Bool} immediate Reposition immediately without an animation.
+ *
+ * @return {Void}
+ */
+scrollerFactory.prototype.toStart = function (item, immediate) {
+ this.to('start', item, immediate);
+};
+
+/**
+ * Animate element or the whole SLIDEE to the end of the frame.
+ *
+ * @param {Mixed} item Item DOM element, or index starting at 0. Omitting will animate SLIDEE.
+ * @param {Bool} immediate Reposition immediately without an animation.
+ *
+ * @return {Void}
+ */
+scrollerFactory.prototype.toEnd = function (item, immediate) {
+ this.to('end', item, immediate);
+};
+
+/**
+ * Animate element or the whole SLIDEE to the center of the frame.
+ *
+ * @param {Mixed} item Item DOM element, or index starting at 0. Omitting will animate SLIDEE.
+ * @param {Bool} immediate Reposition immediately without an animation.
+ *
+ * @return {Void}
+ */
+scrollerFactory.prototype.toCenter = function (item, immediate) {
+ this.to('center', item, immediate);
+};
+
+scrollerFactory.create = function (frame, options) {
+ var instance = new scrollerFactory(frame, options);
+ return Promise.resolve(instance);
+};
+
+export default scrollerFactory;
diff --git a/src/plugins/htmlVideoPlayer/plugin.js b/src/plugins/htmlVideoPlayer/plugin.js
index d52f0eb5b3..525372ac88 100644
--- a/src/plugins/htmlVideoPlayer/plugin.js
+++ b/src/plugins/htmlVideoPlayer/plugin.js
@@ -1132,7 +1132,7 @@ function tryRemoveElement(elem) {
*/
getCueCss(appearance, selector) {
return `${selector}::cue {
- ${appearance.text.map((s) => `${s.name}:${s.value}!important;`).join('')}
+ ${appearance.text.map((s) => s.value !== undefined && s.value !== '' ? `${s.name}:${s.value}!important;` : '').join('')}
}`;
}
@@ -1150,7 +1150,7 @@ function tryRemoveElement(elem) {
document.getElementsByTagName('head')[0].appendChild(styleElem);
}
- styleElem.innerHTML = this.getCueCss(subtitleAppearanceHelper.getStyles(userSettings.getSubtitleAppearanceSettings(), true), '.htmlvideoplayer');
+ styleElem.innerHTML = this.getCueCss(subtitleAppearanceHelper.getStyles(userSettings.getSubtitleAppearanceSettings()), '.htmlvideoplayer');
});
}
@@ -1195,17 +1195,28 @@ function tryRemoveElement(elem) {
// download the track json
this.fetchSubtitles(track, item).then(function (data) {
- // show in ui
- console.debug(`downloaded ${data.TrackEvents.length} track events`);
- // add some cues to show the text
- // in safari, the cues need to be added before setting the track mode to showing
- for (const trackEvent of data.TrackEvents) {
- const trackCueObject = window.VTTCue || window.TextTrackCue;
- const cue = new trackCueObject(trackEvent.StartPositionTicks / 10000000, trackEvent.EndPositionTicks / 10000000, normalizeTrackEventText(trackEvent.Text, false));
+ import('userSettings').then((userSettings) => {
+ // show in ui
+ console.debug(`downloaded ${data.TrackEvents.length} track events`);
- trackElement.addCue(cue);
- }
- trackElement.mode = 'showing';
+ const subtitleAppearance = userSettings.getSubtitleAppearanceSettings();
+ const cueLine = parseInt(subtitleAppearance.verticalPosition, 10);
+
+ // add some cues to show the text
+ // in safari, the cues need to be added before setting the track mode to showing
+ for (const trackEvent of data.TrackEvents) {
+ const trackCueObject = window.VTTCue || window.TextTrackCue;
+ const cue = new trackCueObject(trackEvent.StartPositionTicks / 10000000, trackEvent.EndPositionTicks / 10000000, normalizeTrackEventText(trackEvent.Text, false));
+
+ if (cue.line === 'auto') {
+ cue.line = cueLine;
+ }
+
+ trackElement.addCue(cue);
+ }
+
+ trackElement.mode = 'showing';
+ });
});
}
diff --git a/src/plugins/htmlVideoPlayer/style.css b/src/plugins/htmlVideoPlayer/style.css
index b83a7816f5..880ea86743 100644
--- a/src/plugins/htmlVideoPlayer/style.css
+++ b/src/plugins/htmlVideoPlayer/style.css
@@ -33,16 +33,22 @@ video::-webkit-media-controls {
text-shadow: 0.14em 0.14em 0.14em rgba(0, 0, 0, 1);
-webkit-font-smoothing: antialiased;
font-family: inherit;
+ line-height: normal; /* Restore value. See -webkit-media-text-track-container 'line-height' */
}
-.htmlvideoplayer-moveupsubtitles::-webkit-media-text-track-display {
- /* style the text itself */
- margin-top: -2em;
+.htmlvideoplayer::-webkit-media-text-track-container {
+ font-size: 170% !important; /* Override element inline style */
+ line-height: 50%; /* Child element cannot set line height smaller than its parent has. This allow smaller values for children */
+}
+
+.htmlvideoplayer::-webkit-media-text-track-display {
+ max-width: 70%;
+ margin-left: 15%;
}
.videoSubtitles {
position: fixed;
- bottom: 10%;
+ bottom: 0;
text-align: center;
left: 0;
right: 0;
@@ -53,7 +59,6 @@ video::-webkit-media-controls {
.videoSubtitlesInner {
max-width: 70%;
background-color: rgba(0, 0, 0, 0.8);
- padding: 0.25em;
margin: auto;
display: inline-block;
}
diff --git a/src/plugins/sessionPlayer/plugin.js b/src/plugins/sessionPlayer/plugin.js
index fb1f745df3..c68e0d7a4a 100644
--- a/src/plugins/sessionPlayer/plugin.js
+++ b/src/plugins/sessionPlayer/plugin.js
@@ -1,6 +1,7 @@
define(['playbackManager', 'events', 'serverNotifications', 'connectionManager'], function (playbackManager, events, serverNotifications, connectionManager) {
'use strict';
+ serverNotifications = serverNotifications.default || serverNotifications;
playbackManager = playbackManager.default || playbackManager;
function getActivePlayerId() {
diff --git a/src/scripts/libraryMenu.js b/src/scripts/libraryMenu.js
index bbe01276ba..376b19f70d 100644
--- a/src/scripts/libraryMenu.js
+++ b/src/scripts/libraryMenu.js
@@ -1,6 +1,7 @@
define(['dom', 'layoutManager', 'inputManager', 'connectionManager', 'events', 'viewManager', 'libraryBrowser', 'appRouter', 'apphost', 'playbackManager', 'syncPlayManager', 'groupSelectionMenu', 'browser', 'globalize', 'scripts/imagehelper', 'paper-icon-button-light', 'material-icons', 'scrollStyles', 'flexStyles'], function (dom, layoutManager, inputManager, connectionManager, events, viewManager, libraryBrowser, appRouter, appHost, playbackManager, syncPlayManager, groupSelectionMenu, browser, globalize, imageHelper) {
'use strict';
+ viewManager = viewManager.default || viewManager;
playbackManager = playbackManager.default || playbackManager;
browser = browser.default || browser;
@@ -806,6 +807,8 @@ define(['dom', 'layoutManager', 'inputManager', 'connectionManager', 'events', '
navDrawerScrollContainer.addEventListener('click', onMainDrawerClick);
return new Promise(function (resolve, reject) {
require(['navdrawer'], function (navdrawer) {
+ navdrawer = navdrawer.default || navdrawer;
+
navDrawerInstance = new navdrawer(getNavDrawerOptions());
if (!layoutManager.tv) {
diff --git a/src/scripts/scrollHelper.js b/src/scripts/scrollHelper.js
index 8b596571b4..b867123683 100644
--- a/src/scripts/scrollHelper.js
+++ b/src/scripts/scrollHelper.js
@@ -1,137 +1,138 @@
-define(['focusManager', 'dom', 'scrollStyles'], function (focusManager, dom) {
- 'use strict';
+import focusManager from 'focusManager';
+import dom from 'dom';
+import 'scrollStyles';
- focusManager = focusManager.default || focusManager;
+function getBoundingClientRect(elem) {
+ // Support: BlackBerry 5, iOS 3 (original iPhone)
+ // If we don't have gBCR, just use 0,0 rather than error
+ if (elem.getBoundingClientRect) {
+ return elem.getBoundingClientRect();
+ } else {
+ return { top: 0, left: 0 };
+ }
+}
- function getBoundingClientRect(elem) {
- // Support: BlackBerry 5, iOS 3 (original iPhone)
- // If we don't have gBCR, just use 0,0 rather than error
- if (elem.getBoundingClientRect) {
- return elem.getBoundingClientRect();
- } else {
- return { top: 0, left: 0 };
- }
+export function getPosition(scrollContainer, item, horizontal) {
+ const slideeOffset = getBoundingClientRect(scrollContainer);
+ const itemOffset = getBoundingClientRect(item);
+
+ let offset = horizontal ? itemOffset.left - slideeOffset.left : itemOffset.top - slideeOffset.top;
+ let size = horizontal ? itemOffset.width : itemOffset.height;
+ if (!size && size !== 0) {
+ size = item[horizontal ? 'offsetWidth' : 'offsetHeight'];
}
- function getPosition(scrollContainer, item, horizontal) {
- var slideeOffset = getBoundingClientRect(scrollContainer);
- var itemOffset = getBoundingClientRect(item);
+ const currentStart = horizontal ? scrollContainer.scrollLeft : scrollContainer.scrollTop;
- var offset = horizontal ? itemOffset.left - slideeOffset.left : itemOffset.top - slideeOffset.top;
- var size = horizontal ? itemOffset.width : itemOffset.height;
- if (!size && size !== 0) {
- size = item[horizontal ? 'offsetWidth' : 'offsetHeight'];
- }
+ offset += currentStart;
- var currentStart = horizontal ? scrollContainer.scrollLeft : scrollContainer.scrollTop;
+ const frameSize = horizontal ? scrollContainer.offsetWidth : scrollContainer.offsetHeight;
- offset += currentStart;
+ const currentEnd = currentStart + frameSize;
- var frameSize = horizontal ? scrollContainer.offsetWidth : scrollContainer.offsetHeight;
-
- var currentEnd = currentStart + frameSize;
-
- var isVisible = offset >= currentStart && (offset + size) <= currentEnd;
-
- return {
- start: offset,
- center: (offset - (frameSize / 2) + (size / 2)),
- end: offset - frameSize + size,
- size: size,
- isVisible: isVisible
- };
- }
-
- function toCenter(container, elem, horizontal, skipWhenVisible) {
- var pos = getPosition(container, elem, horizontal);
-
- if (skipWhenVisible && pos.isVisible) {
- return;
- }
-
- if (container.scrollTo) {
- if (horizontal) {
- container.scrollTo(pos.center, 0);
- } else {
- container.scrollTo(0, pos.center);
- }
- } else {
- if (horizontal) {
- container.scrollLeft = Math.round(pos.center);
- } else {
- container.scrollTop = Math.round(pos.center);
- }
- }
- }
-
- function toStart(container, elem, horizontal, skipWhenVisible) {
- var pos = getPosition(container, elem, horizontal);
-
- if (skipWhenVisible && pos.isVisible) {
- return;
- }
-
- if (container.scrollTo) {
- if (horizontal) {
- container.scrollTo(pos.start, 0);
- } else {
- container.scrollTo(0, pos.start);
- }
- } else {
- if (horizontal) {
- container.scrollLeft = Math.round(pos.start);
- } else {
- container.scrollTop = Math.round(pos.start);
- }
- }
- }
-
- function centerOnFocus(e, scrollSlider, horizontal) {
- var focused = focusManager.focusableParent(e.target);
-
- if (focused) {
- toCenter(scrollSlider, focused, horizontal);
- }
- }
-
- function centerOnFocusHorizontal(e) {
- centerOnFocus(e, this, true);
- }
- function centerOnFocusVertical(e) {
- centerOnFocus(e, this, false);
- }
+ const isVisible = offset >= currentStart && (offset + size) <= currentEnd;
return {
- getPosition: getPosition,
- centerFocus: {
- on: function (element, horizontal) {
- if (horizontal) {
- dom.addEventListener(element, 'focus', centerOnFocusHorizontal, {
- capture: true,
- passive: true
- });
- } else {
- dom.addEventListener(element, 'focus', centerOnFocusVertical, {
- capture: true,
- passive: true
- });
- }
- },
- off: function (element, horizontal) {
- if (horizontal) {
- dom.removeEventListener(element, 'focus', centerOnFocusHorizontal, {
- capture: true,
- passive: true
- });
- } else {
- dom.removeEventListener(element, 'focus', centerOnFocusVertical, {
- capture: true,
- passive: true
- });
- }
- }
- },
- toCenter: toCenter,
- toStart: toStart
+ start: offset,
+ center: (offset - (frameSize / 2) + (size / 2)),
+ end: offset - frameSize + size,
+ size: size,
+ isVisible: isVisible
};
-});
+}
+
+export function toCenter(container, elem, horizontal, skipWhenVisible) {
+ const pos = getPosition(container, elem, horizontal);
+
+ if (skipWhenVisible && pos.isVisible) {
+ return;
+ }
+
+ if (container.scrollTo) {
+ if (horizontal) {
+ container.scrollTo(pos.center, 0);
+ } else {
+ container.scrollTo(0, pos.center);
+ }
+ } else {
+ if (horizontal) {
+ container.scrollLeft = Math.round(pos.center);
+ } else {
+ container.scrollTop = Math.round(pos.center);
+ }
+ }
+}
+
+export function toStart(container, elem, horizontal, skipWhenVisible) {
+ const pos = getPosition(container, elem, horizontal);
+
+ if (skipWhenVisible && pos.isVisible) {
+ return;
+ }
+
+ if (container.scrollTo) {
+ if (horizontal) {
+ container.scrollTo(pos.start, 0);
+ } else {
+ container.scrollTo(0, pos.start);
+ }
+ } else {
+ if (horizontal) {
+ container.scrollLeft = Math.round(pos.start);
+ } else {
+ container.scrollTop = Math.round(pos.start);
+ }
+ }
+}
+
+function centerOnFocus(e, scrollSlider, horizontal) {
+ const focused = focusManager.focusableParent(e.target);
+
+ if (focused) {
+ toCenter(scrollSlider, focused, horizontal);
+ }
+}
+
+function centerOnFocusHorizontal(e) {
+ centerOnFocus(e, this, true);
+}
+
+function centerOnFocusVertical(e) {
+ centerOnFocus(e, this, false);
+}
+
+export const centerFocus = {
+ on: function (element, horizontal) {
+ if (horizontal) {
+ dom.addEventListener(element, 'focus', centerOnFocusHorizontal, {
+ capture: true,
+ passive: true
+ });
+ } else {
+ dom.addEventListener(element, 'focus', centerOnFocusVertical, {
+ capture: true,
+ passive: true
+ });
+ }
+ },
+ off: function (element, horizontal) {
+ if (horizontal) {
+ dom.removeEventListener(element, 'focus', centerOnFocusHorizontal, {
+ capture: true,
+ passive: true
+ });
+ } else {
+ dom.removeEventListener(element, 'focus', centerOnFocusVertical, {
+ capture: true,
+ passive: true
+ });
+ }
+ }
+};
+
+export default {
+ getPosition: getPosition,
+ centerFocus: centerFocus,
+ toCenter: toCenter,
+ toStart: toStart
+};
diff --git a/src/scripts/searchtab.js b/src/scripts/searchtab.js
deleted file mode 100644
index e012b8a4b2..0000000000
--- a/src/scripts/searchtab.js
+++ /dev/null
@@ -1,57 +0,0 @@
-define(['searchFields', 'searchResults', 'events'], function (SearchFields, SearchResults, events) {
- 'use strict';
-
- SearchFields = SearchFields.default || SearchFields;
- SearchResults = SearchResults.default || SearchResults;
-
- function init(instance, tabContent, options) {
- tabContent.innerHTML = '
';
- instance.searchFields = new SearchFields({
- element: tabContent.querySelector('.searchFields')
- });
- instance.searchResults = new SearchResults({
- element: tabContent.querySelector('.searchResults'),
- serverId: ApiClient.serverId(),
- parentId: options.parentId,
- collectionType: options.collectionType
- });
- events.on(instance.searchFields, 'search', function (e, value) {
- instance.searchResults.search(value);
- });
- }
-
- function SearchTab(view, tabContent, options) {
- var self = this;
- options = options || {};
- init(this, tabContent, options);
-
- self.preRender = function () {};
-
- self.renderTab = function () {
- var searchFields = this.searchFields;
-
- if (searchFields) {
- searchFields.focus();
- }
- };
- }
-
- SearchTab.prototype.destroy = function () {
- var searchFields = this.searchFields;
-
- if (searchFields) {
- searchFields.destroy();
- }
-
- this.searchFields = null;
- var searchResults = this.searchResults;
-
- if (searchResults) {
- searchResults.destroy();
- }
-
- this.searchResults = null;
- };
-
- return SearchTab;
-});
diff --git a/src/scripts/serverNotifications.js b/src/scripts/serverNotifications.js
index 87db52402d..2566d148f6 100644
--- a/src/scripts/serverNotifications.js
+++ b/src/scripts/serverNotifications.js
@@ -1,214 +1,216 @@
-define(['connectionManager', 'playbackManager', 'syncPlayManager', 'events', 'inputManager', 'focusManager', 'appRouter'], function (connectionManager, playbackManager, syncPlayManager, events, inputManager, focusManager, appRouter) {
- 'use strict';
+import connectionManager from 'connectionManager';
+import playbackManager from 'playbackManager';
+import syncPlayManager from 'syncPlayManager';
+import events from 'events';
+import inputManager from 'inputManager';
+import focusManager from 'focusManager';
+import appRouter from 'appRouter';
- playbackManager = playbackManager.default || playbackManager;
- focusManager = focusManager.default || focusManager;
+const serverNotifications = {};
- var serverNotifications = {};
+function notifyApp() {
+ inputManager.notify();
+}
- function notifyApp() {
- inputManager.notify();
- }
-
- function displayMessage(cmd) {
- var args = cmd.Arguments;
- if (args.TimeoutMs) {
- require(['toast'], function (toast) {
- toast({ title: args.Header, text: args.Text });
- });
- } else {
- require(['alert'], function (alert) {
- alert.default({ title: args.Header, text: args.Text });
- });
- }
- }
-
- function displayContent(cmd, apiClient) {
- if (!playbackManager.isPlayingLocally(['Video', 'Book'])) {
- appRouter.showItem(cmd.Arguments.ItemId, apiClient.serverId());
- }
- }
-
- function playTrailers(apiClient, itemId) {
- apiClient.getItem(apiClient.getCurrentUserId(), itemId).then(function (item) {
- playbackManager.playTrailers(item);
+function displayMessage(cmd) {
+ const args = cmd.Arguments;
+ if (args.TimeoutMs) {
+ import('toast').then(({default: toast}) => {
+ toast({ title: args.Header, text: args.Text });
+ });
+ } else {
+ import('alert').then(({default: alert}) => {
+ alert({ title: args.Header, text: args.Text });
});
}
+}
- function processGeneralCommand(cmd, apiClient) {
- console.debug('Received command: ' + cmd.Name);
- switch (cmd.Name) {
- case 'Select':
- inputManager.handleCommand('select');
- return;
- case 'Back':
- inputManager.handleCommand('back');
- return;
- case 'MoveUp':
- inputManager.handleCommand('up');
- return;
- case 'MoveDown':
- inputManager.handleCommand('down');
- return;
- case 'MoveLeft':
- inputManager.handleCommand('left');
- return;
- case 'MoveRight':
- inputManager.handleCommand('right');
- return;
- case 'PageUp':
- inputManager.handleCommand('pageup');
- return;
- case 'PageDown':
- inputManager.handleCommand('pagedown');
- return;
- case 'PlayTrailers':
- playTrailers(apiClient, cmd.Arguments.ItemId);
- break;
- case 'SetRepeatMode':
- playbackManager.setRepeatMode(cmd.Arguments.RepeatMode);
- break;
- case 'SetShuffleQueue':
- playbackManager.setQueueShuffleMode(cmd.Arguments.ShuffleMode);
- break;
- case 'VolumeUp':
- inputManager.handleCommand('volumeup');
- return;
- case 'VolumeDown':
- inputManager.handleCommand('volumedown');
- return;
- case 'ChannelUp':
- inputManager.handleCommand('channelup');
- return;
- case 'ChannelDown':
- inputManager.handleCommand('channeldown');
- return;
- case 'Mute':
- inputManager.handleCommand('mute');
- return;
- case 'Unmute':
- inputManager.handleCommand('unmute');
- return;
- case 'ToggleMute':
- inputManager.handleCommand('togglemute');
- return;
- case 'SetVolume':
- notifyApp();
- playbackManager.setVolume(cmd.Arguments.Volume);
- break;
- case 'SetAudioStreamIndex':
- notifyApp();
- playbackManager.setAudioStreamIndex(parseInt(cmd.Arguments.Index));
- break;
- case 'SetSubtitleStreamIndex':
- notifyApp();
- playbackManager.setSubtitleStreamIndex(parseInt(cmd.Arguments.Index));
- break;
- case 'ToggleFullscreen':
- inputManager.handleCommand('togglefullscreen');
- return;
- case 'GoHome':
- inputManager.handleCommand('home');
- return;
- case 'GoToSettings':
- inputManager.handleCommand('settings');
- return;
- case 'DisplayContent':
- displayContent(cmd, apiClient);
- break;
- case 'GoToSearch':
- inputManager.handleCommand('search');
- return;
- case 'DisplayMessage':
- displayMessage(cmd);
- break;
- case 'ToggleOsd':
- // todo
- break;
- case 'ToggleContextMenu':
- // todo
- break;
- case 'TakeScreenShot':
- // todo
- break;
- case 'SendKey':
- // todo
- break;
- case 'SendString':
- // todo
- focusManager.sendText(cmd.Arguments.String);
- break;
- default:
- console.debug('processGeneralCommand does not recognize: ' + cmd.Name);
- break;
- }
-
- notifyApp();
+function displayContent(cmd, apiClient) {
+ if (!playbackManager.isPlayingLocally(['Video', 'Book'])) {
+ appRouter.showItem(cmd.Arguments.ItemId, apiClient.serverId());
}
+}
- function onMessageReceived(e, msg) {
- var apiClient = this;
- if (msg.MessageType === 'Play') {
- notifyApp();
- var serverId = apiClient.serverInfo().Id;
- if (msg.Data.PlayCommand === 'PlayNext') {
- playbackManager.queueNext({ ids: msg.Data.ItemIds, serverId: serverId });
- } else if (msg.Data.PlayCommand === 'PlayLast') {
- playbackManager.queue({ ids: msg.Data.ItemIds, serverId: serverId });
- } else {
- playbackManager.play({
- ids: msg.Data.ItemIds,
- startPositionTicks: msg.Data.StartPositionTicks,
- mediaSourceId: msg.Data.MediaSourceId,
- audioStreamIndex: msg.Data.AudioStreamIndex,
- subtitleStreamIndex: msg.Data.SubtitleStreamIndex,
- startIndex: msg.Data.StartIndex,
- serverId: serverId
- });
- }
- } else if (msg.MessageType === 'Playstate') {
- if (msg.Data.Command === 'Stop') {
- inputManager.handleCommand('stop');
- } else if (msg.Data.Command === 'Pause') {
- inputManager.handleCommand('pause');
- } else if (msg.Data.Command === 'Unpause') {
- inputManager.handleCommand('play');
- } else if (msg.Data.Command === 'PlayPause') {
- inputManager.handleCommand('playpause');
- } else if (msg.Data.Command === 'Seek') {
- playbackManager.seek(msg.Data.SeekPositionTicks);
- } else if (msg.Data.Command === 'NextTrack') {
- inputManager.handleCommand('next');
- } else if (msg.Data.Command === 'PreviousTrack') {
- inputManager.handleCommand('previous');
- } else {
- notifyApp();
- }
- } else if (msg.MessageType === 'GeneralCommand') {
- var cmd = msg.Data;
- processGeneralCommand(cmd, apiClient);
- } else if (msg.MessageType === 'UserDataChanged') {
- if (msg.Data.UserId === apiClient.getCurrentUserId()) {
- for (var i = 0, length = msg.Data.UserDataList.length; i < length; i++) {
- events.trigger(serverNotifications, 'UserDataChanged', [apiClient, msg.Data.UserDataList[i]]);
- }
- }
- } else if (msg.MessageType === 'SyncPlayCommand') {
- syncPlayManager.processCommand(msg.Data, apiClient);
- } else if (msg.MessageType === 'SyncPlayGroupUpdate') {
- syncPlayManager.processGroupUpdate(msg.Data, apiClient);
- } else {
- events.trigger(serverNotifications, msg.MessageType, [apiClient, msg.Data]);
- }
- }
- function bindEvents(apiClient) {
- events.off(apiClient, 'message', onMessageReceived);
- events.on(apiClient, 'message', onMessageReceived);
- }
-
- connectionManager.getApiClients().forEach(bindEvents);
- events.on(connectionManager, 'apiclientcreated', function (e, newApiClient) {
- bindEvents(newApiClient);
+function playTrailers(apiClient, itemId) {
+ apiClient.getItem(apiClient.getCurrentUserId(), itemId).then(function (item) {
+ playbackManager.playTrailers(item);
});
- return serverNotifications;
+}
+
+function processGeneralCommand(cmd, apiClient) {
+ console.debug('Received command: ' + cmd.Name);
+ switch (cmd.Name) {
+ case 'Select':
+ inputManager.handleCommand('select');
+ return;
+ case 'Back':
+ inputManager.handleCommand('back');
+ return;
+ case 'MoveUp':
+ inputManager.handleCommand('up');
+ return;
+ case 'MoveDown':
+ inputManager.handleCommand('down');
+ return;
+ case 'MoveLeft':
+ inputManager.handleCommand('left');
+ return;
+ case 'MoveRight':
+ inputManager.handleCommand('right');
+ return;
+ case 'PageUp':
+ inputManager.handleCommand('pageup');
+ return;
+ case 'PageDown':
+ inputManager.handleCommand('pagedown');
+ return;
+ case 'PlayTrailers':
+ playTrailers(apiClient, cmd.Arguments.ItemId);
+ break;
+ case 'SetRepeatMode':
+ playbackManager.setRepeatMode(cmd.Arguments.RepeatMode);
+ break;
+ case 'SetShuffleQueue':
+ playbackManager.setQueueShuffleMode(cmd.Arguments.ShuffleMode);
+ break;
+ case 'VolumeUp':
+ inputManager.handleCommand('volumeup');
+ return;
+ case 'VolumeDown':
+ inputManager.handleCommand('volumedown');
+ return;
+ case 'ChannelUp':
+ inputManager.handleCommand('channelup');
+ return;
+ case 'ChannelDown':
+ inputManager.handleCommand('channeldown');
+ return;
+ case 'Mute':
+ inputManager.handleCommand('mute');
+ return;
+ case 'Unmute':
+ inputManager.handleCommand('unmute');
+ return;
+ case 'ToggleMute':
+ inputManager.handleCommand('togglemute');
+ return;
+ case 'SetVolume':
+ notifyApp();
+ playbackManager.setVolume(cmd.Arguments.Volume);
+ break;
+ case 'SetAudioStreamIndex':
+ notifyApp();
+ playbackManager.setAudioStreamIndex(parseInt(cmd.Arguments.Index));
+ break;
+ case 'SetSubtitleStreamIndex':
+ notifyApp();
+ playbackManager.setSubtitleStreamIndex(parseInt(cmd.Arguments.Index));
+ break;
+ case 'ToggleFullscreen':
+ inputManager.handleCommand('togglefullscreen');
+ return;
+ case 'GoHome':
+ inputManager.handleCommand('home');
+ return;
+ case 'GoToSettings':
+ inputManager.handleCommand('settings');
+ return;
+ case 'DisplayContent':
+ displayContent(cmd, apiClient);
+ break;
+ case 'GoToSearch':
+ inputManager.handleCommand('search');
+ return;
+ case 'DisplayMessage':
+ displayMessage(cmd);
+ break;
+ case 'ToggleOsd':
+ // todo
+ break;
+ case 'ToggleContextMenu':
+ // todo
+ break;
+ case 'TakeScreenShot':
+ // todo
+ break;
+ case 'SendKey':
+ // todo
+ break;
+ case 'SendString':
+ // todo
+ focusManager.sendText(cmd.Arguments.String);
+ break;
+ default:
+ console.debug('processGeneralCommand does not recognize: ' + cmd.Name);
+ break;
+ }
+
+ notifyApp();
+}
+
+function onMessageReceived(e, msg) {
+ const apiClient = this;
+ if (msg.MessageType === 'Play') {
+ notifyApp();
+ const serverId = apiClient.serverInfo().Id;
+ if (msg.Data.PlayCommand === 'PlayNext') {
+ playbackManager.queueNext({ ids: msg.Data.ItemIds, serverId: serverId });
+ } else if (msg.Data.PlayCommand === 'PlayLast') {
+ playbackManager.queue({ ids: msg.Data.ItemIds, serverId: serverId });
+ } else {
+ playbackManager.play({
+ ids: msg.Data.ItemIds,
+ startPositionTicks: msg.Data.StartPositionTicks,
+ mediaSourceId: msg.Data.MediaSourceId,
+ audioStreamIndex: msg.Data.AudioStreamIndex,
+ subtitleStreamIndex: msg.Data.SubtitleStreamIndex,
+ startIndex: msg.Data.StartIndex,
+ serverId: serverId
+ });
+ }
+ } else if (msg.MessageType === 'Playstate') {
+ if (msg.Data.Command === 'Stop') {
+ inputManager.handleCommand('stop');
+ } else if (msg.Data.Command === 'Pause') {
+ inputManager.handleCommand('pause');
+ } else if (msg.Data.Command === 'Unpause') {
+ inputManager.handleCommand('play');
+ } else if (msg.Data.Command === 'PlayPause') {
+ inputManager.handleCommand('playpause');
+ } else if (msg.Data.Command === 'Seek') {
+ playbackManager.seek(msg.Data.SeekPositionTicks);
+ } else if (msg.Data.Command === 'NextTrack') {
+ inputManager.handleCommand('next');
+ } else if (msg.Data.Command === 'PreviousTrack') {
+ inputManager.handleCommand('previous');
+ } else {
+ notifyApp();
+ }
+ } else if (msg.MessageType === 'GeneralCommand') {
+ const cmd = msg.Data;
+ processGeneralCommand(cmd, apiClient);
+ } else if (msg.MessageType === 'UserDataChanged') {
+ if (msg.Data.UserId === apiClient.getCurrentUserId()) {
+ for (let i = 0, length = msg.Data.UserDataList.length; i < length; i++) {
+ events.trigger(serverNotifications, 'UserDataChanged', [apiClient, msg.Data.UserDataList[i]]);
+ }
+ }
+ } else if (msg.MessageType === 'SyncPlayCommand') {
+ syncPlayManager.processCommand(msg.Data, apiClient);
+ } else if (msg.MessageType === 'SyncPlayGroupUpdate') {
+ syncPlayManager.processGroupUpdate(msg.Data, apiClient);
+ } else {
+ events.trigger(serverNotifications, msg.MessageType, [apiClient, msg.Data]);
+ }
+}
+function bindEvents(apiClient) {
+ events.off(apiClient, 'message', onMessageReceived);
+ events.on(apiClient, 'message', onMessageReceived);
+}
+
+connectionManager.getApiClients().forEach(bindEvents);
+events.on(connectionManager, 'apiclientcreated', function (e, newApiClient) {
+ bindEvents(newApiClient);
});
+
+export default serverNotifications;
diff --git a/src/scripts/settings/userSettings.js b/src/scripts/settings/userSettings.js
index bd6050b5fe..1235e0fa5f 100644
--- a/src/scripts/settings/userSettings.js
+++ b/src/scripts/settings/userSettings.js
@@ -15,6 +15,10 @@ function saveServerPreferences(instance) {
instance.saveTimeout = setTimeout(onSaveTimeout.bind(instance), 50);
}
+const defaultSubtitleAppearanceSettings = {
+ verticalPosition: -3
+};
+
export class UserSettings {
constructor() {
}
@@ -412,7 +416,7 @@ export class UserSettings {
*/
getSubtitleAppearanceSettings(key) {
key = key || 'localplayersubtitleappearance3';
- return JSON.parse(this.get(key, false) || '{}');
+ return Object.assign(defaultSubtitleAppearanceSettings, JSON.parse(this.get(key, false) || '{}'));
}
/**
diff --git a/src/scripts/shell.js b/src/scripts/shell.js
index 5a2afd9fd4..e42c7792a0 100644
--- a/src/scripts/shell.js
+++ b/src/scripts/shell.js
@@ -1,23 +1,20 @@
-define([], function () {
- 'use strict';
-
- return {
- openUrl: function (url, target) {
- if (window.NativeShell) {
- window.NativeShell.openUrl(url, target);
- } else {
- window.open(url, target || '_blank');
- }
- },
- enableFullscreen: function () {
- if (window.NativeShell) {
- window.NativeShell.enableFullscreen();
- }
- },
- disableFullscreen: function () {
- if (window.NativeShell) {
- window.NativeShell.disableFullscreen();
- }
+// TODO: This seems like a good candidate for deprecation
+export default {
+ openUrl: function (url, target) {
+ if (window.NativeShell) {
+ window.NativeShell.openUrl(url, target);
+ } else {
+ window.open(url, target || '_blank');
}
- };
-});
+ },
+ enableFullscreen: function () {
+ if (window.NativeShell) {
+ window.NativeShell.enableFullscreen();
+ }
+ },
+ disableFullscreen: function () {
+ if (window.NativeShell) {
+ window.NativeShell.disableFullscreen();
+ }
+ }
+};
diff --git a/src/scripts/site.js b/src/scripts/site.js
index cd85c35e83..aa74411af4 100644
--- a/src/scripts/site.js
+++ b/src/scripts/site.js
@@ -813,8 +813,8 @@ function initClient() {
define('tvguide', [componentsPath + '/guide/guide'], returnFirstDependency);
define('guide-settings-dialog', [componentsPath + '/guide/guide-settings'], returnFirstDependency);
define('viewManager', [componentsPath + '/viewManager/viewManager'], function (viewManager) {
- window.ViewManager = viewManager;
- viewManager.dispatchPageEvents(true);
+ window.ViewManager = viewManager.default;
+ viewManager.default.dispatchPageEvents(true);
return viewManager;
});
define('slideshow', [componentsPath + '/slideshow/slideshow'], returnFirstDependency);
diff --git a/src/strings/ar.json b/src/strings/ar.json
index a9d3d2de41..eb7d6f4249 100644
--- a/src/strings/ar.json
+++ b/src/strings/ar.json
@@ -99,9 +99,9 @@
"DeleteUserConfirmation": "هل انت متاكد من انك تريد حذف هذا المستخدم ؟",
"DeviceAccessHelp": "هذه الميزة تنطبق حصرياً على الأجهزة التي يمكن التعرف عليها فردياً ولن تمنع المتصفح من الدخول عليها. ترشيح الوصول لأجهزة المستخدم ستمنع المستخدمين من استعمال الأجهزة الجديدة إلى أن يتم اعتمادهم من هنا.",
"DrmChannelsNotImported": "القنوات المجهزة بإدارة الحقوق الرقمية DRM لن تورّد.",
- "EasyPasswordHelp": "الرمز الشخصي الميسرالخاص بك يمكنك من الاتصال إلى خادم مكتبتك، عبر تطبيقات أمبي على الأجهزة أو الدخول على حسابك في الشبكة الداخلية.",
+ "EasyPasswordHelp": "الرمز pin الميسر الخاص بك يستخدم للوصول بدون اتصل عبر التطبيقات المدعومة أو الدخول على حسابك في الشبكة الداخلية.",
"EnablePhotos": "عرض الصور",
- "EnablePhotosHelp": "سيتم اكتشاف الصور وعرضها مع ملفات الوسائط الأخرى",
+ "EnablePhotosHelp": "سيتم اكتشاف الصور وعرضها مع ملفات الوسائط الأخرى.",
"ErrorAddingListingsToSchedulesDirect": "كان هناك خطأ في إضافة الاصطفاف لخدمة \"Schedules Direct\" الخاصة بك. خدمة \"Schedules Direct\" لا تسمح إلا بعدد محدود من الاصطفافات لكل حساب. قد تحتاج إلى تسجيل الدخول إلى موقع \"Schedules Direct\" لإزالة الاصطفافات الأخرى من حسابك قبل المتابعة.",
"ErrorAddingMediaPathToVirtualFolder": "كان هناك خطأ في إضافة مسار الوسائط. الرجاء التأكد من صحة المسار وأن خادم أمبي لديه صلاحية الوصول إلى الموقع.",
"ErrorAddingTunerDevice": "كان هناك خطأ في إضافة جهاز المولف. الرجاء التأكد من صلاحية الوصول إليه ثم عاود المحاولة.",
@@ -111,7 +111,7 @@
"ErrorPleaseSelectLineup": "الرجاء اختيار اصطفاف ثم المحاولة مرة أخرى. إن لم تتوفر أية اصطفافات، فالرجاء التأكد من اسم المستخدم وكلمة المرور الخاصة بك، وتأكد من صحة رمزك البريدي.",
"ErrorSavingTvProvider": "كان هناك خطأ في حفظ مزود التلفزة. الرجاء التأكد من صلاحية الوصول إليه ثم عاود المحاولة.",
"ExitFullscreen": "الخروج من الشاشة الكاملة",
- "ExtractChapterImagesHelp": "استخلاص صور الأبواب سيسمح لتطبيقات أمبي أن تظهر لك قوائم تصويرية لتبويبات الأفلام. هذه العملية قد تكون بطيئة، وتستغل قدرة المعالج بشكل ملحوظ، وقد تحتاج إلى حيازة بضعة غيغابايتات من مساحة التخزين بشكل مؤقت. هذه المهمة تعمل خلال عملية استكشاف المقاطع المرئية، كما يمكن أن تحدد لتكون مهمة ليلية مجدولة. يمكنك جدولة العملية من قسم جدولة المهام. لا ينصح بتشغيل هذه المهمة خلال ساعات الذروة من دخول المستخدمين.",
+ "ExtractChapterImagesHelp": "استخلاص صور الفصول سيسمح للتطبيقات أن تظهر لك قوائم تصويرية لتبويبات الأفلام. هذه العملية قد تكون بطيئة، وتستغل موارد الجهاز بشكل ملحوظ، وقد تحتاج إلى حيازة بضعة غيغابايتات من مساحة التخزين بشكل مؤقت. هذه المهمة تعمل خلال عملية استكشاف المقاطع المرئية، كما يمكن أن تحدد لتكون مهمة ليلية مجدولة. يمكنك جدولة العملية من قسم جدولة المهام. لا ينصح بتشغيل هذه المهمة خلال ساعات الذروة من دخول المستخدمين.",
"FFmpegSavePathNotFound": "لم نستطع تحديد موقع ffmpeg باستخدام المسار الذي أدخلته. سوف نحتاج تطبيق FFprobe أيضاً ويجب أن يتواجد في نفس المكان. إن هذه الأجزاء تكون بالعادة محزومة معاً في نفس ملف الإنزال. الرجاء التأكد من المسار المدخل والمحاولة مرة أخرى.",
"FastForward": "التقديم السريع",
"FileNotFound": "الملف غير موجود.",
@@ -129,7 +129,7 @@
"GuideProviderSelectListings": "إختر المبوبات",
"H264CrfHelp": "معامل المعدل الثابت CRF هو الجودة الافتراضية لإعدادات مشفر x264. بإمكانك إعطاء قيمة تتراوح بين 0 و 51، وكلما قلت القيمة فسينتج عن ذلك جودة أفضل (على حساب حجم تخزين أعلى). القيم المعقول تتراوح بين 18 و 28. الافتراضي لـ x264 هي 23، لذا فبإمكانك استخدام هذه القيمة كنقطة بداية.",
"EncoderPresetHelp": "اختر قيمة أعلى لتحسين السرة والأداء وقيمة أقل لتحسين الجودة.",
- "HardwareAccelerationWarning": "تمكين التسريع بعتاد الحاسوب قد يتسبب في عدم استقرار بعض أنواع الأنظمة. تأكد من أن نظام التشغيل الخاص بك محدث إلى آخر نسخة وأن سواقات الفيديو محدثة أيضاً. إذا واجهت أية صعوبات في تسغيل الفيديو بعد تمكين هذه الخاصية، فعليك إرجاع الإعداد إلى وضعية آلي.",
+ "HardwareAccelerationWarning": "تمكين التسريع بعتاد الحاسوب قد يتسبب في عدم استقرار بعض أنواع الأنظمة. تأكد من أن نظام التشغيل الخاص بك محدث إلى آخر نسخة وأن سواقات الفيديو محدثة أيضاً. إذا واجهت أية صعوبات في تسغيل الفيديو بعد تمكين هذه الخاصية، فعليك إرجاع الإعداد إلى وضعية بلا None.",
"HeaderAccessSchedule": "جدول الدخولات",
"HeaderAccessScheduleHelp": "إنشئ جدول دخولات لكي تتمكن من تحديد ساعات للدخول.",
"HeaderActiveDevices": "الأجهزة المفعّلة",
@@ -145,7 +145,7 @@
"HeaderAllowMediaDeletionFrom": "السماح بحذف الوسائط من قبل",
"HeaderApiKey": "مفتاح API",
"HeaderApiKeys": "مفاتيح API",
- "HeaderApiKeysHelp": "التطبيقات الخارجية تحتاج أن تمتلك مفتاح api لكي تتصل بخادم أمبي. هذه المفاتيح تُصدر عن طريق تسجيل الدخول بحساب أمبي، أو عن طريق منح التطبيق مفتاحاً أصدر يدوياً.",
+ "HeaderApiKeysHelp": "التطبيقات الخارجية تحتاج أن تمتلك مفتاح api لكي تتصل بالخادم. هذه المفاتيح تُصدر عن طريق تسجيل الدخول بمستخدم عادي، أو عن طريق منح التطبيق مفتاحاً أصدر يدوياً.",
"HeaderApp": "التطبيق",
"HeaderAudioSettings": "إعدادات الصوت",
"HeaderBooks": "الكتب",
@@ -232,7 +232,7 @@
"HeaderPreferredMetadataLanguage": "اللغة المفضلة لواصفات البيانات",
"HeaderProfile": "الحساب",
"HeaderProfileInformation": "معلومات العريضة",
- "HeaderProfileServerSettingsHelp": "هذه القيم ستتحكم في كيفية تقديم شكل خادم أمبي في الجهاز",
+ "HeaderProfileServerSettingsHelp": "هذه القيم ستتحكم في كيفية تقديم شكل الخادم في للعملاء.",
"HeaderRecentlyPlayed": "تم تشغيله مؤخراً",
"HeaderRecordingPostProcessing": "تطبيق ما-بعد-المعالجة للتسجيل",
"HeaderRemoteControl": "التحكم عن بعد",
@@ -254,7 +254,7 @@
"HeaderSelectServerCachePath": "إختر مسار كاشة الخادم",
"HeaderSelectServerCachePathHelp": "تصفح أو أدخل المسار الذي ترغب أن يُستخدم كاشة لملفات الخادم. يجب أن يكون هذا المجلد قابل للكتابة فيه.",
"HeaderSelectTranscodingPath": "إختر المسار المؤقت للتشفير البيني",
- "HeaderSelectTranscodingPathHelp": "تصفح أو أدخل المسار الذي ترغب أن يُستخدم للملفات المؤقتة للتشفير البيني. يجب أن يكون هذا المجلد قابل للكتابة فيه.",
+ "HeaderSelectTranscodingPathHelp": "تصفح أو أدخل المسار الذي ترغب أن يُستخدم لملفات التشفير البيني. يجب أن يكون هذا المجلد قابل للكتابة فيه.",
"HeaderSendMessage": "أرسل رسالة",
"HeaderSeries": "المسلسلات",
"HeaderServerSettings": "إعدادات الخادم",
@@ -291,17 +291,17 @@
"HeaderXmlSettings": "إعدادات xml",
"HeaderYears": "السنوات",
"HeadersFolders": "مجلدات",
- "ImportFavoriteChannelsHelp": "عند التفعيل، فقط القنوات التي علّمت في المفضلة على هذا المولف ستورد إلى النظام.",
- "ImportMissingEpisodesHelp": "عند التمكين، المعلومات الناقصة للحلقات ستورّد إلى قاعدة بيانات أمبي وستعرض داخل المواسم والمسلسلات. قد تتسبب هذه بأوقات أطول بكثير عند تمشيط المكنبات.",
+ "ImportFavoriteChannelsHelp": "فقط القنوات التي علّمت في المفضلة على جهاز المولف ستورد.",
+ "ImportMissingEpisodesHelp": "المعلومات الناقصة للحلقات ستورّد إلى قاعدة بياناتك وستعرض داخل المواسم والمسلسلات. قد تتسبب هذه بأوقات أطول بكثير عند تمشيط المكتبات.",
"LabelAbortedByServerShutdown": "(تم إهماله بسبب عملية إغلاق الخادم)",
"LabelAccessDay": "يوم الأسبوع:",
- "LabelAccessEnd": "تاريخ النهاية",
- "LabelAccessStart": "تاريخ البداية",
+ "LabelAccessEnd": "وقت النهاية:",
+ "LabelAccessStart": "وقت البداية:",
"LabelAirDays": "أيام البث:",
"LabelAirTime": "وقت البث:",
- "LabelAlbum": "الألبوم",
+ "LabelAlbum": "الألبوم:",
"LabelAlbumArtHelp": "PN المستخدمة في رسومات الألبوم، داخل سمة dlna:profileID في upnp:albumArtURI. بعض الأجهزة تحتاج قيمة محددة، مهما كان حجم الصورة.",
- "LabelAlbumArtMaxHeight": "الارتفاع الأقصى لرسومات الألبوم",
+ "LabelAlbumArtMaxHeight": "الارتفاع الأقصى لرسومات الألبوم:",
"LabelAlbumArtMaxHeightHelp": "الدقة القصوى لرسومات الألبوم المظهّرة عبر سمة upnp:albumArtURI.",
"LabelAlbumArtMaxWidth": "العرض الأقصى لرسوم الألبوم:",
"LabelAlbumArtMaxWidthHelp": "الدقة القصوى لرسومات الألبوم المظهّرة عبر سمة upnp:albumArtURI.",
@@ -310,42 +310,42 @@
"LabelAll": "الجميع",
"LabelAllowHWTranscoding": "السماح بالتشفير البيني بعتاد الحاسب",
"LabelAppName": "اسم التطبيق",
- "LabelAppNameExample": "مثال: Sickbeard، NzbDrone",
+ "LabelAppNameExample": "مثال: Sickbeard، Sonarr",
"LabelArtists": "الفنانون:",
- "LabelArtistsHelp": "فصل الاستعمالات المتعددة ;",
+ "LabelArtistsHelp": "افصل بين الفنانين ب ; فاصلة منقوطة.",
"LabelAudioLanguagePreference": "اللغة المفضلة للصوت:",
"LabelBindToLocalNetworkAddress": "إربطه إلى عنوان شبكة محلي:",
- "LabelBindToLocalNetworkAddressHelp": "هذا خياري. امتطي عنوان الآي بي المحلي لربطه بخادم http. إذا ترك فارغاً، فإن الخادم سيربطه بجميع العناوين المتاحة. تغيير هذه القيمة يتطلب إعادة تشغيل خادم أمبي.",
- "LabelBlastMessageInterval": "فترات بث رسالة قيد التشغيل (بالثواني)",
- "LabelBlastMessageIntervalHelp": "يحدد الفترة بالثواني بين يث رسائل قيد التشغيل",
- "LabelCache": "ذاكرة الكاشة",
- "LabelCachePath": "مسار ذاكرة الكاشة:",
- "LabelCachePathHelp": "حدد موقع مخصص لملفات كاشة الخادم، مثل الصور وغيرها. أترك هذه الخانة فارغة لاستعمال القيمة التلقائية.",
+ "LabelBindToLocalNetworkAddressHelp": "تجاوز عنوان الآي بي المحلي لربطه بخادم http. إذا ترك فارغاً، فإن الخادم سيربطه بجميع العناوين المتاحة. تغيير هذه القيمة يتطلب إعادة تشغيل خادم جيلليفن.",
+ "LabelBlastMessageInterval": "فترات بث رسالة قيد التشغيل",
+ "LabelBlastMessageIntervalHelp": "يحدد الفترة بالثواني بين بث رسائل قيد التشغيل.",
+ "LabelCache": "مَخبأ (كاش):",
+ "LabelCachePath": "مسار ذاكرة الكاش:",
+ "LabelCachePathHelp": "حدد موقع مخصص لملفات الخادم المؤقتة، مثل الصور وغيرها. أترك هذه الخانة فارغة لاستعمال القيمة الافتراضية.",
"LabelCancelled": "تم الإلغاء",
- "LabelCollection": "المجموعة",
+ "LabelCollection": "المجموعة:",
"LabelCommunityRating": "تقييم المجتمع:",
- "LabelContentType": "نوع المحتوى",
+ "LabelContentType": "نوع المحتوى:",
"LabelCountry": "البلد:",
"LabelCurrentPassword": "كلمة السر الحالية:",
- "LabelCustomCertificatePath": "مسار شهادة ssl مخصص:",
+ "LabelCustomCertificatePath": "مسار شهادة SSL المخصص:",
"LabelCustomCertificatePathHelp": "مسار ملف PKCS # 12 يحتوي على شهادة ومفتاح خاص لتمكين دعم TLS على مجال مخصص.",
- "LabelCustomCss": "تنيسق CSS مخصوص:",
- "LabelCustomCssHelp": "طبق تنسيق css مخصوصة لواجهة الويب.",
+ "LabelCustomCss": "تنيسق CSS مخصص:",
+ "LabelCustomCssHelp": "طبق تنسيقك css المخصص لواجهة الويب.",
"LabelCustomDeviceDisplayName": "اسم العرض:",
- "LabelCustomDeviceDisplayNameHelp": "أذكر اسم عرض مخصوص أو أتركه فارغاً لاستخدام",
+ "LabelCustomDeviceDisplayNameHelp": "أذكر اسم عرض مخصوص أو أتركه فارغاً لاستخدام الاسم المبلغ من الجهاز.",
"LabelDateAddedBehavior": "كيف يتصرف المحتوى الجديد نحو \"تاريخ الإضافة\" الخاص به:",
- "LabelDateAddedBehaviorHelp": "إذا استعرضت قيمة واصفات البيانا فإنها سوف تستخدم قبل أن تستخدم أي من هذه الخيارات.",
+ "LabelDateAddedBehaviorHelp": "إذا اخذت واصفات البيانات قيمة، فإنها سوف تستخدم قبل أن تستخدم أي من هذه الخيارات.",
"LabelDay": "اليوم:",
"LabelDeathDate": "تاريخ الوفاة:",
- "LabelDefaultUser": "المستخدم الافتراضي",
+ "LabelDefaultUser": "المستخدم الافتراضي:",
"LabelDefaultUserHelp": "لتحديد مكتبة المستخدم التي تظهر على الأجهزة المتصلة. بإمكان الامتطاء على هذه القيمة لكل جهاز عن طريق عرائض الأجهزة.",
"LabelDeviceDescription": "وصف الجهاز",
- "LabelDidlMode": "طور didl:",
+ "LabelDidlMode": "طور DIDL:",
"LabelDisplayMissingEpisodesWithinSeasons": "أظهر الحلقات المفقودة في مجلدات المواسم",
"LabelDisplayName": "الاسم المعروض:",
"LabelDisplaySpecialsWithinSeasons": "أظهر الحلقات الخاصة في المواسم التي بثت فيها",
"LabelDownMixAudioScale": "تعزيز الصوت عند تقليل توزيع قنوات الصوت:",
- "LabelDownMixAudioScaleHelp": "تعزيز الصوت عند تقليل توزيع قنوات الصوت. حدد القيمة بـ 1 للمحافظة على القيمة الأصلية للصوت.",
+ "LabelDownMixAudioScaleHelp": "تعزيز الصوت عند تقليل توزيع قنوات الصوت. حدد القيمة ب 1 للمحافظة على القيمة الأصلية للصوت.",
"LabelDownloadLanguages": "إنزال اللغة:",
"LabelDynamicExternalId": "معرفة {0}:",
"LabelEasyPinCode": "الرمز الشخصي الميسر:",
@@ -354,8 +354,8 @@
"LabelEnableAutomaticPortMap": "فعل الخاصية الآلية في التوفيق بين المنافذ",
"LabelEnableAutomaticPortMapHelp": "حاول التوفيق بين المنفذ العالمي والمنفذ المحلي آلياً باستخدام آلية UPnP. هذه الخاصية قد لا تعمل مع بعض أنواع الراوترات.",
"LabelEnableBlastAliveMessages": "بث رسائل قيد التشغيل",
- "LabelEnableBlastAliveMessagesHelp": "فعل هذه الخاصية إذا كان الخادم لا يكتشف بكفاءة من قبل أجهزة UPnP الأخرى على شبكتك",
- "LabelEnableDlnaClientDiscoveryInterval": "فترات استكشاف العملاء (بالثواني)",
+ "LabelEnableBlastAliveMessagesHelp": "فعل هذه الخاصية إذا كان الخادم لا يكتشف بكفاءة من قبل أجهزة UPnP الأخرى على شبكتك.",
+ "LabelEnableDlnaClientDiscoveryInterval": "فترات استكشاف العملاء",
"LabelEnableDlnaClientDiscoveryIntervalHelp": "يحدد الفترة بالثواني بين عمليات بحث SSDP التي يقوم بها أمبي.",
"LabelEnableDlnaDebugLogging": "تفعيل خاصية كشوفات أخطاء DLNA",
"LabelEnableDlnaDebugLoggingHelp": "هذه ستنشئ سجلات كشفية ضخمة ولا ينبغي تفعيلها إلا عند الحاجة إليها بغرض استكشاف الأخطاء وحصرها.",
@@ -930,7 +930,7 @@
"Backdrops": "خلفيات متغيرة للصفحة",
"Backdrop": "خلفية متغيرة للصفحة",
"Auto": "تلقائي",
- "AuthProviderHelp": "حدد مقدم المصادقات ليتم استخدامه لمصادقة كلمة مرور هذا المستخدم.",
+ "AuthProviderHelp": "اختار مقدم المصادقة ليتم استخدامه لمصادقة كلمة مرور هذا المستخدم.",
"AroundTime": "حول",
"AttributeNew": "جديد",
"AspectRatio": "نسبة العرض الى الارتفاع",
@@ -1038,7 +1038,7 @@
"Director": "المخرج",
"DirectPlaying": "بث بدون تحويل الصيغة",
"DirectStreaming": "البث المباشر",
- "DirectStreamHelp2": "البث المباشر للملف يستخدم طاقة معالجة قليلة جدًا دون أي خسارة في جودة الفيديو.",
+ "DirectStreamHelp2": "البث المباشر للملف يستخدم قوة معالجة قليلة جدًا دون أي خسارة في جودة الفيديو.",
"DirectStreamHelp1": "الوسائط متوافقة مع الجهاز فيما يتعلق بالدقة ونوع الوسائط (H.264 ، AC3 ، إلخ) ، ولكنها في حاوية ملفات غير متوافقة (mkv ، avi ، wmv ، إلخ). سيتم إعادة حزم الفيديو في الوقت الحقيقي قبل بثه إلى الجهاز.",
"DetectingDevices": "يتم الكشف عن الأجهزة",
"Desktop": "سطح المكتب",
@@ -1139,5 +1139,51 @@
"Dislike": "لم يعجبنى",
"ButtonSyncPlay": "SyncPlay",
"ExtraLarge": "كبير جدا",
- "EnableNextVideoInfoOverlayHelp": "في نهاية الفيديو, عرض معلومات عن الفيديو القادم في قائمة التشغيل."
+ "EnableNextVideoInfoOverlayHelp": "في نهاية الفيديو, عرض معلومات عن الفيديو القادم في قائمة التشغيل.",
+ "LabelDroppedFrames": "الاطارات الساقطة:",
+ "LabelDropImageHere": "اسقط صورة هنا، او ضغط تصفح.",
+ "LabelDisplayOrder": "ترتيب المعروض:",
+ "LabelDisplayMode": "وضع المعروض:",
+ "LabelDisplayLanguageHelp": "ترجمة جيلليفين هو مشروع مستمر.",
+ "LabelDisplayLanguage": "لغة العرض:",
+ "LabelDiscNumber": "رقم القرص:",
+ "LabelDeinterlaceMethod": "طريقة تقليل التشابك:",
+ "LabelDefaultScreen": "الشاشة الافتراضية:",
+ "LabelDateTimeLocale": "وقت و تاريخ محلي:",
+ "LabelDateAdded": "تاريخ الاضافة:",
+ "LabelCustomRating": "تقييم مخصص:",
+ "LabelCriticRating": "تقييم النقاد:",
+ "LabelCorruptedFrames": "الإطارات التالفة:",
+ "LabelChannels": "القنوات:",
+ "LabelCertificatePasswordHelp": "اذا تطلبت شهادتك الامنية كلمة مرور، من فضلك ادخلها هنا.",
+ "LabelCertificatePassword": "كلمة مرور الشهادة الامنية:",
+ "LabelBurnSubtitles": "الترجمات المحروقة:",
+ "LabelBlockContentWithTags": "احجب العناصر بالعلامات:",
+ "LabelBitrate": "معدل البت:",
+ "LabelBirthYear": "عام الميلاد:",
+ "LabelBirthDate": "تاريخ الميلاد:",
+ "LabelAutomaticallyRefreshInternetMetadataEvery": "حدث وصف البيانات تلقائيا من الانترنت:",
+ "LabelAuthProvider": "مقدم التصديق:",
+ "LabelAudioSampleRate": "سرعة معينة الصوت:",
+ "LabelAudioCodec": "ترميز الصوت:",
+ "LabelAudioChannels": "قنوات الصوت:",
+ "LabelAudioBitrate": "معدل بث الصوت:",
+ "LabelAudioBitDepth": "عمق بث الصوت:",
+ "LabelAudio": "الصوت",
+ "LabelAllowedRemoteAddressesMode": "وضع مرشح عنوان المضيف IP البعيد:",
+ "LabelAllowedRemoteAddresses": "مرشح عنوان المضيف IP البعيد:",
+ "LabelAirsBeforeSeason": "عروض بث قبل الموسم:",
+ "LabelAirsBeforeEpisode": "عروض بث قبل الحلقة:",
+ "LabelAirsAfterSeason": "عروض بث بعد الموسم:",
+ "Label3DFormat": "صيغة ثلاثية الابعاد:",
+ "Kids": "اطفال",
+ "Items": "عناصر",
+ "ItemCount": "{0} عنصر",
+ "InstantMix": "خلط فوري",
+ "HeaderSyncPlayEnabled": "تزامن اللعب ممكَّن",
+ "HeaderSyncPlaySelectGroup": "انضم لمجموعة",
+ "EnableDetailsBannerHelp": "اظهر صوره اللافته اعلى عنصر تفاصيل الصفحة.",
+ "EnableDetailsBanner": "لافتة التفاصيل",
+ "EnableDecodingColorDepth10Vp9": "تمكين ترميز ال10 بت عبر العتاد الصلب من اجل VP9",
+ "EnableDecodingColorDepth10Hevc": "تمكين ترميز ال10 بت عبر العتاد الصلب من اجل HEVC"
}
diff --git a/src/strings/en-us.json b/src/strings/en-us.json
index 54c8cf8880..4dffc49618 100644
--- a/src/strings/en-us.json
+++ b/src/strings/en-us.json
@@ -1542,5 +1542,8 @@
"ButtonCast": "Cast",
"ButtonPlayer": "Player",
"StopPlayback": "Stop playback",
- "ClearQueue": "Clear queue"
+ "ClearQueue": "Clear queue",
+ "LabelSubtitleVerticalPosition": "Vertical position:",
+ "SubtitleVerticalPositionHelp": "Line number where text appears. Positive numbers indicate top down. Negative numbers indicate bottom up.",
+ "Preview": "Preview"
}
diff --git a/src/strings/he.json b/src/strings/he.json
index 58eb6ee1b4..c266f587c2 100644
--- a/src/strings/he.json
+++ b/src/strings/he.json
@@ -471,7 +471,7 @@
"TabTrailers": "טריילרים",
"TabTranscoding": "קידוד",
"TabUpcoming": "בקרוב",
- "Tags": "תגים",
+ "Tags": "מילות מפתח",
"TellUsAboutYourself": "ספר לנו על עצמך",
"ThisWizardWillGuideYou": "אשף זה יעזור לך בהתליך ההתקנה.",
"Thursday": "חמישי",
@@ -588,7 +588,7 @@
"MessageConfirmRestart": "האם אתה בטוח שברצונך לאתחל את שרת ה-Jellyfin?",
"HeaderThisUserIsCurrentlyDisabled": "משתמש זה אינו פעיל כרגע",
"HeaderTaskTriggers": "טריגרים של המשימה",
- "HeaderTags": "תגיות",
+ "HeaderTags": "מילות מפתח",
"HeaderStopRecording": "עצור הקלטה",
"HeaderSortOrder": "סדר מיון",
"HeaderSortBy": "מיין לפי",
@@ -867,5 +867,7 @@
"OptionEveryday": "כל יום",
"OptionEnableExternalContentInSuggestions": "הפעל תוכן חיצוני בהמלצות",
"OptionEnableAccessToAllLibraries": "אפשר גישה לכל הספריות",
- "OptionEnableAccessToAllChannels": "אפשר גישה לכל הערוצים"
+ "OptionEnableAccessToAllChannels": "אפשר גישה לכל הערוצים",
+ "HeaderSyncPlaySelectGroup": "הצטרף לקבוצה",
+ "TabUsers": "משתמשים"
}
diff --git a/src/strings/ru.json b/src/strings/ru.json
index 199d0f24ae..50ab735286 100644
--- a/src/strings/ru.json
+++ b/src/strings/ru.json
@@ -1542,5 +1542,8 @@
"ButtonPlayer": "Проигрыватель",
"PreviousTrack": "Перейти к предыдущему",
"NextTrack": "Перейти к следующему",
- "LabelUnstable": "Нестабильная"
+ "LabelUnstable": "Нестабильная",
+ "LabelSubtitleVerticalPosition": "Вертикальная позиция:",
+ "SubtitleVerticalPositionHelp": "Номер строки, где появляется текст. Положительные числа означают сверху вниз. Отрицательные числа означают снизу вверх.",
+ "Preview": "Предварительный просмотр"
}
diff --git a/yarn.lock b/yarn.lock
index 3ec7f21487..ad55e16176 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3020,10 +3020,10 @@ css-has-pseudo@^0.10.0:
postcss "^7.0.6"
postcss-selector-parser "^5.0.0-rc.4"
-css-loader@^4.2.0:
- version "4.2.0"
- resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-4.2.0.tgz#b57efb92ac8f0cd85bf92d89df9634ef1f51b8bf"
- integrity sha512-ko7a9b0iFpWtk9eSI/C8IICvZeGtYnjxYjw45rJprokXj/+kBd/siX4vAIBq9Uij8Jubc4jL1EvSnTjCEwaHSw==
+css-loader@^4.2.1:
+ version "4.2.1"
+ resolved "https://registry.yarnpkg.com/css-loader/-/css-loader-4.2.1.tgz#9f48fd7eae1219d629a3f085ba9a9102ca1141a7"
+ integrity sha512-MoqmF1if7Z0pZIEXA4ZF9PgtCXxWbfzfJM+3p+OYfhcrwcqhaCRb74DSnfzRl7e024xEiCRn5hCvfUbTf2sgFA==
dependencies:
camelcase "^6.0.0"
cssesc "^3.0.0"