mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Merge remote-tracking branch 'upstream/master' into another-es6-pr
This commit is contained in:
MrTimscampi
commit
1b33cec561
16 changed files with 1527 additions and 1412 deletions
|
|
@ -1,226 +1,220 @@
|
|||
define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'apphost', 'inputManager', 'layoutManager', 'connectionManager', 'appRouter', 'globalize', 'userSettings', 'emby-checkbox', 'emby-input', 'paper-icon-button-light', 'emby-select', 'material-icons', 'css!./../formdialog', 'emby-button', 'flexStyles'], function (require, dom, focusManager, dialogHelper, loading, appHost, inputManager, layoutManager, connectionManager, appRouter, globalize, userSettings) {
|
||||
'use strict';
|
||||
import dom from 'dom';
|
||||
import focusManager from 'focusManager';
|
||||
import dialogHelper from 'dialogHelper';
|
||||
import inputManager from 'inputManager';
|
||||
import layoutManager from 'layoutManager';
|
||||
import connectionManager from 'connectionManager';
|
||||
import globalize from 'globalize';
|
||||
import * as userSettings from 'userSettings';
|
||||
import 'emby-checkbox';
|
||||
import 'emby-input';
|
||||
import 'paper-icon-button-light';
|
||||
import 'emby-select';
|
||||
import 'material-icons';
|
||||
import 'css!./../formdialog';
|
||||
import 'emby-button';
|
||||
import 'flexStyles';
|
||||
|
||||
focusManager = focusManager.default || focusManager;
|
||||
appRouter = appRouter.default || appRouter;
|
||||
layoutManager = layoutManager.default || layoutManager;
|
||||
function onSubmit(e) {
|
||||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
function renderOptions(context, selector, cssClass, items, isCheckedFn) {
|
||||
var elem = context.querySelector(selector);
|
||||
|
||||
function onSubmit(e) {
|
||||
e.preventDefault();
|
||||
return false;
|
||||
if (items.length) {
|
||||
elem.classList.remove('hide');
|
||||
} else {
|
||||
elem.classList.add('hide');
|
||||
}
|
||||
|
||||
function renderOptions(context, selector, cssClass, items, isCheckedFn) {
|
||||
var elem = context.querySelector(selector);
|
||||
var html = '';
|
||||
|
||||
if (items.length) {
|
||||
elem.classList.remove('hide');
|
||||
html += items.map(function (filter) {
|
||||
var itemHtml = '';
|
||||
|
||||
var checkedHtml = isCheckedFn(filter) ? ' checked' : '';
|
||||
itemHtml += '<label>';
|
||||
itemHtml += '<input is="emby-checkbox" type="checkbox"' + checkedHtml + ' data-filter="' + filter.Id + '" class="' + cssClass + '"/>';
|
||||
itemHtml += '<span>' + filter.Name + '</span>';
|
||||
itemHtml += '</label>';
|
||||
|
||||
return itemHtml;
|
||||
}).join('');
|
||||
|
||||
elem.querySelector('.filterOptions').innerHTML = html;
|
||||
}
|
||||
|
||||
function renderDynamicFilters(context, result, options) {
|
||||
renderOptions(context, '.genreFilters', 'chkGenreFilter', result.Genres, function (i) {
|
||||
// Switching from | to ,
|
||||
var delimeter = (options.settings.GenreIds || '').indexOf('|') === -1 ? ',' : '|';
|
||||
return (delimeter + (options.settings.GenreIds || '') + delimeter).indexOf(delimeter + i.Id + delimeter) !== -1;
|
||||
});
|
||||
}
|
||||
|
||||
function setBasicFilter(context, key, elem) {
|
||||
var value = elem.checked;
|
||||
value = value ? value : null;
|
||||
userSettings.setFilter(key, value);
|
||||
}
|
||||
function moveCheckboxFocus(elem, offset) {
|
||||
var parent = dom.parentWithClass(elem, 'checkboxList-verticalwrap');
|
||||
var elems = focusManager.getFocusableElements(parent);
|
||||
|
||||
var index = -1;
|
||||
for (let i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i] === elem) {
|
||||
index = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
index += offset;
|
||||
|
||||
index = Math.min(elems.length - 1, index);
|
||||
index = Math.max(0, index);
|
||||
|
||||
var newElem = elems[index];
|
||||
if (newElem) {
|
||||
focusManager.focus(newElem);
|
||||
}
|
||||
}
|
||||
function centerFocus(elem, horiz, on) {
|
||||
import('scrollHelper').then(({ default: scrollHelper }) => {
|
||||
var fn = on ? 'on' : 'off';
|
||||
scrollHelper.centerFocus[fn](elem, horiz);
|
||||
});
|
||||
}
|
||||
function onInputCommand(e) {
|
||||
switch (e.detail.command) {
|
||||
case 'left':
|
||||
moveCheckboxFocus(e.target, -1);
|
||||
e.preventDefault();
|
||||
break;
|
||||
case 'right':
|
||||
moveCheckboxFocus(e.target, 1);
|
||||
e.preventDefault();
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
function saveValues(context, settings, settingsKey) {
|
||||
var elems = context.querySelectorAll('.simpleFilter');
|
||||
for (let i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i].tagName === 'INPUT') {
|
||||
setBasicFilter(context, settingsKey + '-filter-' + elems[i].getAttribute('data-settingname'), elems[i]);
|
||||
} else {
|
||||
elem.classList.add('hide');
|
||||
setBasicFilter(context, settingsKey + '-filter-' + elems[i].getAttribute('data-settingname'), elems[i].querySelector('input'));
|
||||
}
|
||||
|
||||
var html = '';
|
||||
|
||||
html += items.map(function (filter) {
|
||||
var itemHtml = '';
|
||||
|
||||
var checkedHtml = isCheckedFn(filter) ? ' checked' : '';
|
||||
itemHtml += '<label>';
|
||||
itemHtml += '<input is="emby-checkbox" type="checkbox"' + checkedHtml + ' data-filter="' + filter.Id + '" class="' + cssClass + '"/>';
|
||||
itemHtml += '<span>' + filter.Name + '</span>';
|
||||
itemHtml += '</label>';
|
||||
|
||||
return itemHtml;
|
||||
}).join('');
|
||||
|
||||
elem.querySelector('.filterOptions').innerHTML = html;
|
||||
}
|
||||
|
||||
function renderDynamicFilters(context, result, options) {
|
||||
renderOptions(context, '.genreFilters', 'chkGenreFilter', result.Genres, function (i) {
|
||||
// Switching from | to ,
|
||||
var delimeter = (options.settings.GenreIds || '').indexOf('|') === -1 ? ',' : '|';
|
||||
return (delimeter + (options.settings.GenreIds || '') + delimeter).indexOf(delimeter + i.Id + delimeter) !== -1;
|
||||
});
|
||||
// Video type
|
||||
var videoTypes = [];
|
||||
elems = context.querySelectorAll('.chkVideoTypeFilter');
|
||||
|
||||
for (let i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i].checked) {
|
||||
videoTypes.push(elems[i].getAttribute('data-filter'));
|
||||
}
|
||||
}
|
||||
userSettings.setFilter(settingsKey + '-filter-VideoTypes', videoTypes.join(','));
|
||||
|
||||
// Series status
|
||||
var seriesStatuses = [];
|
||||
elems = context.querySelectorAll('.chkSeriesStatus');
|
||||
|
||||
for (let i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i].checked) {
|
||||
seriesStatuses.push(elems[i].getAttribute('data-filter'));
|
||||
}
|
||||
}
|
||||
|
||||
function loadDynamicFilters(context, options) {
|
||||
var apiClient = connectionManager.getApiClient(options.serverId);
|
||||
// Genres
|
||||
var genres = [];
|
||||
elems = context.querySelectorAll('.chkGenreFilter');
|
||||
|
||||
var filterMenuOptions = Object.assign(options.filterMenuOptions, {
|
||||
|
||||
UserId: apiClient.getCurrentUserId(),
|
||||
ParentId: options.parentId,
|
||||
IncludeItemTypes: options.itemTypes.join(',')
|
||||
});
|
||||
|
||||
apiClient.getFilters(filterMenuOptions).then(function (result) {
|
||||
renderDynamicFilters(context, result, options);
|
||||
});
|
||||
for (let i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i].checked) {
|
||||
genres.push(elems[i].getAttribute('data-filter'));
|
||||
}
|
||||
}
|
||||
|
||||
function initEditor(context, settings) {
|
||||
context.querySelector('form').addEventListener('submit', onSubmit);
|
||||
|
||||
var elems = context.querySelectorAll('.simpleFilter');
|
||||
var i;
|
||||
var length;
|
||||
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i].tagName === 'INPUT') {
|
||||
elems[i].checked = settings[elems[i].getAttribute('data-settingname')] || false;
|
||||
} else {
|
||||
elems[i].querySelector('input').checked = settings[elems[i].getAttribute('data-settingname')] || false;
|
||||
}
|
||||
}
|
||||
|
||||
var videoTypes = settings.VideoTypes ? settings.VideoTypes.split(',') : [];
|
||||
elems = context.querySelectorAll('.chkVideoTypeFilter');
|
||||
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
elems[i].checked = videoTypes.indexOf(elems[i].getAttribute('data-filter')) !== -1;
|
||||
}
|
||||
|
||||
var seriesStatuses = settings.SeriesStatus ? settings.SeriesStatus.split(',') : [];
|
||||
elems = context.querySelectorAll('.chkSeriesStatus');
|
||||
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
elems[i].checked = seriesStatuses.indexOf(elems[i].getAttribute('data-filter')) !== -1;
|
||||
}
|
||||
|
||||
if (context.querySelector('.basicFilterSection .viewSetting:not(.hide)')) {
|
||||
context.querySelector('.basicFilterSection').classList.remove('hide');
|
||||
userSettings.setFilter(settingsKey + '-filter-GenreIds', genres.join(','));
|
||||
}
|
||||
function bindCheckboxInput(context, on) {
|
||||
var elems = context.querySelectorAll('.checkboxList-verticalwrap');
|
||||
for (let i = 0, length = elems.length; i < length; i++) {
|
||||
if (on) {
|
||||
inputManager.on(elems[i], onInputCommand);
|
||||
} else {
|
||||
context.querySelector('.basicFilterSection').classList.add('hide');
|
||||
inputManager.off(elems[i], onInputCommand);
|
||||
}
|
||||
}
|
||||
}
|
||||
function initEditor(context, settings) {
|
||||
context.querySelector('form').addEventListener('submit', onSubmit);
|
||||
|
||||
if (context.querySelector('.featureSection .viewSetting:not(.hide)')) {
|
||||
context.querySelector('.featureSection').classList.remove('hide');
|
||||
var elems = context.querySelectorAll('.simpleFilter');
|
||||
var i;
|
||||
var length;
|
||||
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i].tagName === 'INPUT') {
|
||||
elems[i].checked = settings[elems[i].getAttribute('data-settingname')] || false;
|
||||
} else {
|
||||
context.querySelector('.featureSection').classList.add('hide');
|
||||
elems[i].querySelector('input').checked = settings[elems[i].getAttribute('data-settingname')] || false;
|
||||
}
|
||||
}
|
||||
|
||||
function saveValues(context, settings, settingsKey) {
|
||||
var elems = context.querySelectorAll('.simpleFilter');
|
||||
var i;
|
||||
var length;
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i].tagName === 'INPUT') {
|
||||
setBasicFilter(context, settingsKey + '-filter-' + elems[i].getAttribute('data-settingname'), elems[i]);
|
||||
} else {
|
||||
setBasicFilter(context, settingsKey + '-filter-' + elems[i].getAttribute('data-settingname'), elems[i].querySelector('input'));
|
||||
}
|
||||
}
|
||||
var videoTypes = settings.VideoTypes ? settings.VideoTypes.split(',') : [];
|
||||
elems = context.querySelectorAll('.chkVideoTypeFilter');
|
||||
|
||||
// Video type
|
||||
var videoTypes = [];
|
||||
elems = context.querySelectorAll('.chkVideoTypeFilter');
|
||||
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i].checked) {
|
||||
videoTypes.push(elems[i].getAttribute('data-filter'));
|
||||
}
|
||||
}
|
||||
userSettings.setFilter(settingsKey + '-filter-VideoTypes', videoTypes.join(','));
|
||||
|
||||
// Series status
|
||||
var seriesStatuses = [];
|
||||
elems = context.querySelectorAll('.chkSeriesStatus');
|
||||
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i].checked) {
|
||||
seriesStatuses.push(elems[i].getAttribute('data-filter'));
|
||||
}
|
||||
}
|
||||
|
||||
// Genres
|
||||
var genres = [];
|
||||
elems = context.querySelectorAll('.chkGenreFilter');
|
||||
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i].checked) {
|
||||
genres.push(elems[i].getAttribute('data-filter'));
|
||||
}
|
||||
}
|
||||
userSettings.setFilter(settingsKey + '-filter-GenreIds', genres.join(','));
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
elems[i].checked = videoTypes.indexOf(elems[i].getAttribute('data-filter')) !== -1;
|
||||
}
|
||||
|
||||
function setBasicFilter(context, key, elem) {
|
||||
var value = elem.checked;
|
||||
value = value ? value : null;
|
||||
userSettings.setFilter(key, value);
|
||||
var seriesStatuses = settings.SeriesStatus ? settings.SeriesStatus.split(',') : [];
|
||||
elems = context.querySelectorAll('.chkSeriesStatus');
|
||||
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
elems[i].checked = seriesStatuses.indexOf(elems[i].getAttribute('data-filter')) !== -1;
|
||||
}
|
||||
|
||||
function centerFocus(elem, horiz, on) {
|
||||
require(['scrollHelper'], function (scrollHelper) {
|
||||
scrollHelper = scrollHelper.default || scrollHelper;
|
||||
var fn = on ? 'on' : 'off';
|
||||
scrollHelper.centerFocus[fn](elem, horiz);
|
||||
});
|
||||
if (context.querySelector('.basicFilterSection .viewSetting:not(.hide)')) {
|
||||
context.querySelector('.basicFilterSection').classList.remove('hide');
|
||||
} else {
|
||||
context.querySelector('.basicFilterSection').classList.add('hide');
|
||||
}
|
||||
|
||||
function moveCheckboxFocus(elem, offset) {
|
||||
var parent = dom.parentWithClass(elem, 'checkboxList-verticalwrap');
|
||||
var elems = focusManager.getFocusableElements(parent);
|
||||
|
||||
var index = -1;
|
||||
for (var i = 0, length = elems.length; i < length; i++) {
|
||||
if (elems[i] === elem) {
|
||||
index = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
index += offset;
|
||||
|
||||
index = Math.min(elems.length - 1, index);
|
||||
index = Math.max(0, index);
|
||||
|
||||
var newElem = elems[index];
|
||||
if (newElem) {
|
||||
focusManager.focus(newElem);
|
||||
}
|
||||
if (context.querySelector('.featureSection .viewSetting:not(.hide)')) {
|
||||
context.querySelector('.featureSection').classList.remove('hide');
|
||||
} else {
|
||||
context.querySelector('.featureSection').classList.add('hide');
|
||||
}
|
||||
}
|
||||
function loadDynamicFilters(context, options) {
|
||||
var apiClient = connectionManager.getApiClient(options.serverId);
|
||||
|
||||
function onInputCommand(e) {
|
||||
switch (e.detail.command) {
|
||||
case 'left':
|
||||
moveCheckboxFocus(e.target, -1);
|
||||
e.preventDefault();
|
||||
break;
|
||||
case 'right':
|
||||
moveCheckboxFocus(e.target, 1);
|
||||
e.preventDefault();
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
var filterMenuOptions = Object.assign(options.filterMenuOptions, {
|
||||
|
||||
function FilterMenu() {
|
||||
UserId: apiClient.getCurrentUserId(),
|
||||
ParentId: options.parentId,
|
||||
IncludeItemTypes: options.itemTypes.join(',')
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function bindCheckboxInput(context, on) {
|
||||
var elems = context.querySelectorAll('.checkboxList-verticalwrap');
|
||||
for (var i = 0, length = elems.length; i < length; i++) {
|
||||
if (on) {
|
||||
inputManager.on(elems[i], onInputCommand);
|
||||
} else {
|
||||
inputManager.off(elems[i], onInputCommand);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
FilterMenu.prototype.show = function (options) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
require(['text!./filtermenu.template.html'], function (template) {
|
||||
apiClient.getFilters(filterMenuOptions).then((result) => {
|
||||
renderDynamicFilters(context, result, options);
|
||||
});
|
||||
}
|
||||
class FilterMenu {
|
||||
show(options) {
|
||||
return new Promise( (resolve, reject) => {
|
||||
import('text!./filtermenu.template.html').then(({ default: template }) => {
|
||||
var dialogOptions = {
|
||||
removeOnClose: true,
|
||||
scrollY: false
|
||||
};
|
||||
|
||||
if (layoutManager.tv) {
|
||||
dialogOptions.size = 'fullscreen';
|
||||
} else {
|
||||
|
|
@ -244,7 +238,7 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'apphost',
|
|||
dlg.innerHTML = globalize.translateHtml(html, 'core');
|
||||
|
||||
var settingElements = dlg.querySelectorAll('.viewSetting');
|
||||
for (var i = 0, length = settingElements.length; i < length; i++) {
|
||||
for (let i = 0, length = settingElements.length; i < length; i++) {
|
||||
if (options.visibleSettings.indexOf(settingElements[i].getAttribute('data-settingname')) === -1) {
|
||||
settingElements[i].classList.add('hide');
|
||||
} else {
|
||||
|
|
@ -256,7 +250,6 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'apphost',
|
|||
loadDynamicFilters(dlg, options);
|
||||
|
||||
bindCheckboxInput(dlg, true);
|
||||
|
||||
dlg.querySelector('.btnCancel').addEventListener('click', function () {
|
||||
dialogHelper.close(dlg);
|
||||
});
|
||||
|
|
@ -271,7 +264,7 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'apphost',
|
|||
submitted = true;
|
||||
}, true);
|
||||
|
||||
dialogHelper.open(dlg).then(function () {
|
||||
dialogHelper.open(dlg).then( function() {
|
||||
bindCheckboxInput(dlg, false);
|
||||
|
||||
if (layoutManager.tv) {
|
||||
|
|
@ -281,16 +274,14 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'apphost',
|
|||
if (submitted) {
|
||||
//if (!options.onChange) {
|
||||
saveValues(dlg, options.settings, options.settingsKey);
|
||||
resolve();
|
||||
return resolve();
|
||||
//}
|
||||
return;
|
||||
}
|
||||
|
||||
reject();
|
||||
return resolve();
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
return FilterMenu;
|
||||
});
|
||||
export default FilterMenu;
|
||||
|
|
|
|||
|
|
@ -1,182 +1,181 @@
|
|||
define(['serverNotifications', 'playbackManager', 'events', 'globalize', 'require'], function (serverNotifications, playbackManager, events, globalize, require) {
|
||||
'use strict';
|
||||
import serverNotifications from 'serverNotifications';
|
||||
import playbackManager from 'playbackManager';
|
||||
import events from 'events';
|
||||
import globalize from 'globalize';
|
||||
|
||||
playbackManager = playbackManager.default || playbackManager;
|
||||
serverNotifications = serverNotifications.default || serverNotifications;
|
||||
function onOneDocumentClick() {
|
||||
document.removeEventListener('click', onOneDocumentClick);
|
||||
document.removeEventListener('keydown', onOneDocumentClick);
|
||||
|
||||
function onOneDocumentClick() {
|
||||
document.removeEventListener('click', onOneDocumentClick);
|
||||
document.removeEventListener('keydown', onOneDocumentClick);
|
||||
|
||||
// don't request notification permissions if they're already granted or denied
|
||||
if (window.Notification && window.Notification.permission === 'default') {
|
||||
/* eslint-disable-next-line compat/compat */
|
||||
Notification.requestPermission();
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('click', onOneDocumentClick);
|
||||
document.addEventListener('keydown', onOneDocumentClick);
|
||||
|
||||
var serviceWorkerRegistration;
|
||||
|
||||
function closeAfter(notification, timeoutMs) {
|
||||
setTimeout(function () {
|
||||
if (notification.close) {
|
||||
notification.close();
|
||||
} else if (notification.cancel) {
|
||||
notification.cancel();
|
||||
}
|
||||
}, timeoutMs);
|
||||
}
|
||||
|
||||
function resetRegistration() {
|
||||
// don't request notification permissions if they're already granted or denied
|
||||
if (window.Notification && window.Notification.permission === 'default') {
|
||||
/* eslint-disable-next-line compat/compat */
|
||||
var serviceWorker = navigator.serviceWorker;
|
||||
if (serviceWorker) {
|
||||
serviceWorker.ready.then(function (registration) {
|
||||
serviceWorkerRegistration = registration;
|
||||
});
|
||||
Notification.requestPermission();
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('click', onOneDocumentClick);
|
||||
document.addEventListener('keydown', onOneDocumentClick);
|
||||
|
||||
let serviceWorkerRegistration;
|
||||
|
||||
function closeAfter(notification, timeoutMs) {
|
||||
setTimeout(function () {
|
||||
if (notification.close) {
|
||||
notification.close();
|
||||
} else if (notification.cancel) {
|
||||
notification.cancel();
|
||||
}
|
||||
}, timeoutMs);
|
||||
}
|
||||
|
||||
function resetRegistration() {
|
||||
/* eslint-disable-next-line compat/compat */
|
||||
let serviceWorker = navigator.serviceWorker;
|
||||
if (serviceWorker) {
|
||||
serviceWorker.ready.then(function (registration) {
|
||||
serviceWorkerRegistration = registration;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
resetRegistration();
|
||||
|
||||
function showPersistentNotification(title, options, timeoutMs) {
|
||||
serviceWorkerRegistration.showNotification(title, options);
|
||||
}
|
||||
|
||||
function showNonPersistentNotification(title, options, timeoutMs) {
|
||||
try {
|
||||
let notif = new Notification(title, options); /* eslint-disable-line compat/compat */
|
||||
|
||||
if (notif.show) {
|
||||
notif.show();
|
||||
}
|
||||
|
||||
if (timeoutMs) {
|
||||
closeAfter(notif, timeoutMs);
|
||||
}
|
||||
} catch (err) {
|
||||
if (options.actions) {
|
||||
options.actions = [];
|
||||
showNonPersistentNotification(title, options, timeoutMs);
|
||||
} else {
|
||||
throw err;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function showNotification(options, timeoutMs, apiClient) {
|
||||
let title = options.title;
|
||||
|
||||
options.data = options.data || {};
|
||||
options.data.serverId = apiClient.serverInfo().Id;
|
||||
options.icon = options.icon || getIconUrl();
|
||||
options.badge = options.badge || getIconUrl('badge.png');
|
||||
|
||||
resetRegistration();
|
||||
|
||||
function showPersistentNotification(title, options, timeoutMs) {
|
||||
serviceWorkerRegistration.showNotification(title, options);
|
||||
if (serviceWorkerRegistration) {
|
||||
showPersistentNotification(title, options, timeoutMs);
|
||||
return;
|
||||
}
|
||||
|
||||
function showNonPersistentNotification(title, options, timeoutMs) {
|
||||
try {
|
||||
var notif = new Notification(title, options); /* eslint-disable-line compat/compat */
|
||||
showNonPersistentNotification(title, options, timeoutMs);
|
||||
}
|
||||
|
||||
if (notif.show) {
|
||||
notif.show();
|
||||
}
|
||||
|
||||
if (timeoutMs) {
|
||||
closeAfter(notif, timeoutMs);
|
||||
}
|
||||
} catch (err) {
|
||||
if (options.actions) {
|
||||
options.actions = [];
|
||||
showNonPersistentNotification(title, options, timeoutMs);
|
||||
} else {
|
||||
throw err;
|
||||
}
|
||||
}
|
||||
function showNewItemNotification(item, apiClient) {
|
||||
if (playbackManager.isPlayingLocally(['Video'])) {
|
||||
return;
|
||||
}
|
||||
|
||||
function showNotification(options, timeoutMs, apiClient) {
|
||||
var title = options.title;
|
||||
let body = item.Name;
|
||||
|
||||
options.data = options.data || {};
|
||||
options.data.serverId = apiClient.serverInfo().Id;
|
||||
options.icon = options.icon || getIconUrl();
|
||||
options.badge = options.badge || getIconUrl('badge.png');
|
||||
|
||||
resetRegistration();
|
||||
|
||||
if (serviceWorkerRegistration) {
|
||||
showPersistentNotification(title, options, timeoutMs);
|
||||
return;
|
||||
}
|
||||
|
||||
showNonPersistentNotification(title, options, timeoutMs);
|
||||
if (item.SeriesName) {
|
||||
body = item.SeriesName + ' - ' + body;
|
||||
}
|
||||
|
||||
function showNewItemNotification(item, apiClient) {
|
||||
if (playbackManager.isPlayingLocally(['Video'])) {
|
||||
return;
|
||||
}
|
||||
let notification = {
|
||||
title: 'New ' + item.Type,
|
||||
body: body,
|
||||
vibrate: true,
|
||||
tag: 'newItem' + item.Id,
|
||||
data: {}
|
||||
};
|
||||
|
||||
var body = item.Name;
|
||||
let imageTags = item.ImageTags || {};
|
||||
|
||||
if (item.SeriesName) {
|
||||
body = item.SeriesName + ' - ' + body;
|
||||
}
|
||||
|
||||
var notification = {
|
||||
title: 'New ' + item.Type,
|
||||
body: body,
|
||||
vibrate: true,
|
||||
tag: 'newItem' + item.Id,
|
||||
data: {}
|
||||
};
|
||||
|
||||
var imageTags = item.ImageTags || {};
|
||||
|
||||
if (imageTags.Primary) {
|
||||
notification.icon = apiClient.getScaledImageUrl(item.Id, {
|
||||
width: 80,
|
||||
tag: imageTags.Primary,
|
||||
type: 'Primary'
|
||||
});
|
||||
}
|
||||
|
||||
showNotification(notification, 15000, apiClient);
|
||||
}
|
||||
|
||||
function onLibraryChanged(data, apiClient) {
|
||||
var newItems = data.ItemsAdded;
|
||||
|
||||
if (!newItems.length) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Don't put a massive number of Id's onto the query string
|
||||
if (newItems.length > 12) {
|
||||
newItems.length = 12;
|
||||
}
|
||||
|
||||
apiClient.getItems(apiClient.getCurrentUserId(), {
|
||||
|
||||
Recursive: true,
|
||||
Limit: 3,
|
||||
Filters: 'IsNotFolder',
|
||||
SortBy: 'DateCreated',
|
||||
SortOrder: 'Descending',
|
||||
Ids: newItems.join(','),
|
||||
MediaTypes: 'Audio,Video',
|
||||
EnableTotalRecordCount: false
|
||||
|
||||
}).then(function (result) {
|
||||
var items = result.Items;
|
||||
|
||||
for (var i = 0, length = items.length ; i < length; i++) {
|
||||
showNewItemNotification(items[i], apiClient);
|
||||
}
|
||||
if (imageTags.Primary) {
|
||||
notification.icon = apiClient.getScaledImageUrl(item.Id, {
|
||||
width: 80,
|
||||
tag: imageTags.Primary,
|
||||
type: 'Primary'
|
||||
});
|
||||
}
|
||||
|
||||
function getIconUrl(name) {
|
||||
name = name || 'notificationicon.png';
|
||||
return require.toUrl('.').split('?')[0] + '/' + name;
|
||||
showNotification(notification, 15000, apiClient);
|
||||
}
|
||||
|
||||
function onLibraryChanged(data, apiClient) {
|
||||
let newItems = data.ItemsAdded;
|
||||
|
||||
if (!newItems.length) {
|
||||
return;
|
||||
}
|
||||
|
||||
function showPackageInstallNotification(apiClient, installation, status) {
|
||||
apiClient.getCurrentUser().then(function (user) {
|
||||
if (!user.Policy.IsAdministrator) {
|
||||
return;
|
||||
}
|
||||
// Don't put a massive number of Id's onto the query string
|
||||
if (newItems.length > 12) {
|
||||
newItems.length = 12;
|
||||
}
|
||||
|
||||
var notification = {
|
||||
tag: 'install' + installation.Id,
|
||||
data: {}
|
||||
};
|
||||
apiClient.getItems(apiClient.getCurrentUserId(), {
|
||||
|
||||
if (status === 'completed') {
|
||||
notification.title = globalize.translate('PackageInstallCompleted', installation.Name, installation.Version);
|
||||
notification.vibrate = true;
|
||||
} else if (status === 'cancelled') {
|
||||
notification.title = globalize.translate('PackageInstallCancelled', installation.Name, installation.Version);
|
||||
} else if (status === 'failed') {
|
||||
notification.title = globalize.translate('PackageInstallFailed', installation.Name, installation.Version);
|
||||
notification.vibrate = true;
|
||||
} else if (status === 'progress') {
|
||||
notification.title = globalize.translate('InstallingPackage', installation.Name, installation.Version);
|
||||
Recursive: true,
|
||||
Limit: 3,
|
||||
Filters: 'IsNotFolder',
|
||||
SortBy: 'DateCreated',
|
||||
SortOrder: 'Descending',
|
||||
Ids: newItems.join(','),
|
||||
MediaTypes: 'Audio,Video',
|
||||
EnableTotalRecordCount: false
|
||||
|
||||
notification.actions =
|
||||
}).then(function (result) {
|
||||
let items = result.Items;
|
||||
|
||||
for (const item of items) {
|
||||
showNewItemNotification(item, apiClient);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getIconUrl(name) {
|
||||
name = name || 'notificationicon.png';
|
||||
return './components/notifications/' + name;
|
||||
}
|
||||
|
||||
function showPackageInstallNotification(apiClient, installation, status) {
|
||||
apiClient.getCurrentUser().then(function (user) {
|
||||
if (!user.Policy.IsAdministrator) {
|
||||
return;
|
||||
}
|
||||
|
||||
let notification = {
|
||||
tag: 'install' + installation.Id,
|
||||
data: {}
|
||||
};
|
||||
|
||||
if (status === 'completed') {
|
||||
notification.title = globalize.translate('PackageInstallCompleted', installation.Name, installation.Version);
|
||||
notification.vibrate = true;
|
||||
} else if (status === 'cancelled') {
|
||||
notification.title = globalize.translate('PackageInstallCancelled', installation.Name, installation.Version);
|
||||
} else if (status === 'failed') {
|
||||
notification.title = globalize.translate('PackageInstallFailed', installation.Name, installation.Version);
|
||||
notification.vibrate = true;
|
||||
} else if (status === 'progress') {
|
||||
notification.title = globalize.translate('InstallingPackage', installation.Name, installation.Version);
|
||||
|
||||
notification.actions =
|
||||
[
|
||||
{
|
||||
action: 'cancel-install',
|
||||
|
|
@ -185,67 +184,67 @@ define(['serverNotifications', 'playbackManager', 'events', 'globalize', 'requir
|
|||
}
|
||||
];
|
||||
|
||||
notification.data.id = installation.id;
|
||||
}
|
||||
notification.data.id = installation.id;
|
||||
}
|
||||
|
||||
if (status === 'progress') {
|
||||
var percentComplete = Math.round(installation.PercentComplete || 0);
|
||||
if (status === 'progress') {
|
||||
let percentComplete = Math.round(installation.PercentComplete || 0);
|
||||
|
||||
notification.body = percentComplete + '% complete.';
|
||||
}
|
||||
notification.body = percentComplete + '% complete.';
|
||||
}
|
||||
|
||||
var timeout = status === 'cancelled' ? 5000 : 0;
|
||||
let timeout = status === 'cancelled' ? 5000 : 0;
|
||||
|
||||
showNotification(notification, timeout, apiClient);
|
||||
});
|
||||
}
|
||||
|
||||
events.on(serverNotifications, 'LibraryChanged', function (e, apiClient, data) {
|
||||
onLibraryChanged(data, apiClient);
|
||||
showNotification(notification, timeout, apiClient);
|
||||
});
|
||||
}
|
||||
|
||||
events.on(serverNotifications, 'PackageInstallationCompleted', function (e, apiClient, data) {
|
||||
showPackageInstallNotification(apiClient, data, 'completed');
|
||||
});
|
||||
events.on(serverNotifications, 'LibraryChanged', function (e, apiClient, data) {
|
||||
onLibraryChanged(data, apiClient);
|
||||
});
|
||||
|
||||
events.on(serverNotifications, 'PackageInstallationFailed', function (e, apiClient, data) {
|
||||
showPackageInstallNotification(apiClient, data, 'failed');
|
||||
});
|
||||
events.on(serverNotifications, 'PackageInstallationCompleted', function (e, apiClient, data) {
|
||||
showPackageInstallNotification(apiClient, data, 'completed');
|
||||
});
|
||||
|
||||
events.on(serverNotifications, 'PackageInstallationCancelled', function (e, apiClient, data) {
|
||||
showPackageInstallNotification(apiClient, data, 'cancelled');
|
||||
});
|
||||
events.on(serverNotifications, 'PackageInstallationFailed', function (e, apiClient, data) {
|
||||
showPackageInstallNotification(apiClient, data, 'failed');
|
||||
});
|
||||
|
||||
events.on(serverNotifications, 'PackageInstalling', function (e, apiClient, data) {
|
||||
showPackageInstallNotification(apiClient, data, 'progress');
|
||||
});
|
||||
events.on(serverNotifications, 'PackageInstallationCancelled', function (e, apiClient, data) {
|
||||
showPackageInstallNotification(apiClient, data, 'cancelled');
|
||||
});
|
||||
|
||||
events.on(serverNotifications, 'ServerShuttingDown', function (e, apiClient, data) {
|
||||
var serverId = apiClient.serverInfo().Id;
|
||||
var notification = {
|
||||
tag: 'restart' + serverId,
|
||||
title: globalize.translate('ServerNameIsShuttingDown', apiClient.serverInfo().Name)
|
||||
};
|
||||
showNotification(notification, 0, apiClient);
|
||||
});
|
||||
events.on(serverNotifications, 'PackageInstalling', function (e, apiClient, data) {
|
||||
showPackageInstallNotification(apiClient, data, 'progress');
|
||||
});
|
||||
|
||||
events.on(serverNotifications, 'ServerRestarting', function (e, apiClient, data) {
|
||||
var serverId = apiClient.serverInfo().Id;
|
||||
var notification = {
|
||||
tag: 'restart' + serverId,
|
||||
title: globalize.translate('ServerNameIsRestarting', apiClient.serverInfo().Name)
|
||||
};
|
||||
showNotification(notification, 0, apiClient);
|
||||
});
|
||||
events.on(serverNotifications, 'ServerShuttingDown', function (e, apiClient, data) {
|
||||
let serverId = apiClient.serverInfo().Id;
|
||||
let notification = {
|
||||
tag: 'restart' + serverId,
|
||||
title: globalize.translate('ServerNameIsShuttingDown', apiClient.serverInfo().Name)
|
||||
};
|
||||
showNotification(notification, 0, apiClient);
|
||||
});
|
||||
|
||||
events.on(serverNotifications, 'RestartRequired', function (e, apiClient) {
|
||||
var serverId = apiClient.serverInfo().Id;
|
||||
var notification = {
|
||||
tag: 'restart' + serverId,
|
||||
title: globalize.translate('PleaseRestartServerName', apiClient.serverInfo().Name)
|
||||
};
|
||||
events.on(serverNotifications, 'ServerRestarting', function (e, apiClient, data) {
|
||||
let serverId = apiClient.serverInfo().Id;
|
||||
let notification = {
|
||||
tag: 'restart' + serverId,
|
||||
title: globalize.translate('ServerNameIsRestarting', apiClient.serverInfo().Name)
|
||||
};
|
||||
showNotification(notification, 0, apiClient);
|
||||
});
|
||||
|
||||
notification.actions =
|
||||
events.on(serverNotifications, 'RestartRequired', function (e, apiClient) {
|
||||
let serverId = apiClient.serverInfo().Id;
|
||||
let notification = {
|
||||
tag: 'restart' + serverId,
|
||||
title: globalize.translate('PleaseRestartServerName', apiClient.serverInfo().Name)
|
||||
};
|
||||
|
||||
notification.actions =
|
||||
[
|
||||
{
|
||||
action: 'restart',
|
||||
|
|
@ -254,6 +253,6 @@ define(['serverNotifications', 'playbackManager', 'events', 'globalize', 'requir
|
|||
}
|
||||
];
|
||||
|
||||
showNotification(notification, 0, apiClient);
|
||||
});
|
||||
showNotification(notification, 0, apiClient);
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -1,103 +1,101 @@
|
|||
define(['playbackManager', 'userSettings', 'connectionManager'], function (playbackManager, userSettings, connectionManager) {
|
||||
'use strict';
|
||||
import playbackManager from 'playbackManager';
|
||||
import * as userSettings from 'userSettings';
|
||||
import connectionManager from 'connectionManager';
|
||||
|
||||
playbackManager = playbackManager.default || playbackManager;
|
||||
let currentOwnerId;
|
||||
let currentThemeIds = [];
|
||||
|
||||
var currentOwnerId;
|
||||
var currentThemeIds = [];
|
||||
function playThemeMedia(items, ownerId) {
|
||||
const currentThemeItems = items.filter(function (i) {
|
||||
return enabled(i.MediaType);
|
||||
});
|
||||
|
||||
function playThemeMedia(items, ownerId) {
|
||||
var currentThemeItems = items.filter(function (i) {
|
||||
return enabled(i.MediaType);
|
||||
if (currentThemeItems.length) {
|
||||
// Stop if a theme song from another ownerId
|
||||
// Leave it alone if anything else (e.g user playing a movie)
|
||||
if (!currentOwnerId && playbackManager.isPlaying()) {
|
||||
return;
|
||||
}
|
||||
|
||||
currentThemeIds = currentThemeItems.map(function (i) {
|
||||
return i.Id;
|
||||
});
|
||||
|
||||
if (currentThemeItems.length) {
|
||||
// Stop if a theme song from another ownerId
|
||||
// Leave it alone if anything else (e.g user playing a movie)
|
||||
if (!currentOwnerId && playbackManager.isPlaying()) {
|
||||
return;
|
||||
}
|
||||
|
||||
currentThemeIds = currentThemeItems.map(function (i) {
|
||||
return i.Id;
|
||||
});
|
||||
|
||||
playbackManager.play({
|
||||
items: currentThemeItems,
|
||||
fullscreen: false,
|
||||
enableRemotePlayers: false
|
||||
}).then(function () {
|
||||
currentOwnerId = ownerId;
|
||||
});
|
||||
} else {
|
||||
stopIfPlaying();
|
||||
}
|
||||
}
|
||||
|
||||
function stopIfPlaying() {
|
||||
if (currentOwnerId) {
|
||||
playbackManager.stop();
|
||||
}
|
||||
|
||||
currentOwnerId = null;
|
||||
}
|
||||
|
||||
function enabled(mediaType) {
|
||||
if (mediaType === 'Video') {
|
||||
return userSettings.enableThemeVideos();
|
||||
}
|
||||
|
||||
return userSettings.enableThemeSongs();
|
||||
}
|
||||
|
||||
var excludeTypes = ['CollectionFolder', 'UserView', 'Program', 'SeriesTimer', 'Person', 'TvChannel', 'Channel'];
|
||||
|
||||
function loadThemeMedia(item) {
|
||||
if (item.CollectionType) {
|
||||
stopIfPlaying();
|
||||
return;
|
||||
}
|
||||
|
||||
if (excludeTypes.indexOf(item.Type) !== -1) {
|
||||
stopIfPlaying();
|
||||
return;
|
||||
}
|
||||
|
||||
var apiClient = connectionManager.getApiClient(item.ServerId);
|
||||
apiClient.getThemeMedia(apiClient.getCurrentUserId(), item.Id, true).then(function (themeMediaResult) {
|
||||
var ownerId = themeMediaResult.ThemeVideosResult.Items.length ? themeMediaResult.ThemeVideosResult.OwnerId : themeMediaResult.ThemeSongsResult.OwnerId;
|
||||
|
||||
if (ownerId !== currentOwnerId) {
|
||||
var items = themeMediaResult.ThemeVideosResult.Items.length ? themeMediaResult.ThemeVideosResult.Items : themeMediaResult.ThemeSongsResult.Items;
|
||||
|
||||
playThemeMedia(items, ownerId);
|
||||
}
|
||||
playbackManager.play({
|
||||
items: currentThemeItems,
|
||||
fullscreen: false,
|
||||
enableRemotePlayers: false
|
||||
}).then(function () {
|
||||
currentOwnerId = ownerId;
|
||||
});
|
||||
} else {
|
||||
stopIfPlaying();
|
||||
}
|
||||
}
|
||||
|
||||
function stopIfPlaying() {
|
||||
if (currentOwnerId) {
|
||||
playbackManager.stop();
|
||||
}
|
||||
|
||||
document.addEventListener('viewshow', function (e) {
|
||||
var state = e.detail.state || {};
|
||||
var item = state.item;
|
||||
currentOwnerId = null;
|
||||
}
|
||||
|
||||
if (item && item.ServerId) {
|
||||
loadThemeMedia(item);
|
||||
return;
|
||||
}
|
||||
function enabled(mediaType) {
|
||||
if (mediaType === 'Video') {
|
||||
return userSettings.enableThemeVideos();
|
||||
}
|
||||
|
||||
var viewOptions = e.detail.options || {};
|
||||
return userSettings.enableThemeSongs();
|
||||
}
|
||||
|
||||
if (viewOptions.supportsThemeMedia) {
|
||||
// Do nothing here, allow it to keep playing
|
||||
} else {
|
||||
playThemeMedia([], null);
|
||||
}
|
||||
}, true);
|
||||
const excludeTypes = ['CollectionFolder', 'UserView', 'Program', 'SeriesTimer', 'Person', 'TvChannel', 'Channel'];
|
||||
|
||||
Events.on(playbackManager, 'playbackstart', function (e, player) {
|
||||
var item = playbackManager.currentItem(player);
|
||||
// User played something manually
|
||||
if (currentThemeIds.indexOf(item.Id) == -1) {
|
||||
currentOwnerId = null;
|
||||
function loadThemeMedia(item) {
|
||||
if (item.CollectionType) {
|
||||
stopIfPlaying();
|
||||
return;
|
||||
}
|
||||
|
||||
if (excludeTypes.indexOf(item.Type) !== -1) {
|
||||
stopIfPlaying();
|
||||
return;
|
||||
}
|
||||
|
||||
const apiClient = connectionManager.getApiClient(item.ServerId);
|
||||
apiClient.getThemeMedia(apiClient.getCurrentUserId(), item.Id, true).then(function (themeMediaResult) {
|
||||
const ownerId = themeMediaResult.ThemeVideosResult.Items.length ? themeMediaResult.ThemeVideosResult.OwnerId : themeMediaResult.ThemeSongsResult.OwnerId;
|
||||
|
||||
if (ownerId !== currentOwnerId) {
|
||||
const items = themeMediaResult.ThemeVideosResult.Items.length ? themeMediaResult.ThemeVideosResult.Items : themeMediaResult.ThemeSongsResult.Items;
|
||||
|
||||
playThemeMedia(items, ownerId);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener('viewshow', function (e) {
|
||||
const state = e.detail.state || {};
|
||||
const item = state.item;
|
||||
|
||||
if (item && item.ServerId) {
|
||||
loadThemeMedia(item);
|
||||
return;
|
||||
}
|
||||
|
||||
const viewOptions = e.detail.options || {};
|
||||
|
||||
if (viewOptions.supportsThemeMedia) {
|
||||
// Do nothing here, allow it to keep playing
|
||||
} else {
|
||||
playThemeMedia([], null);
|
||||
}
|
||||
}, true);
|
||||
|
||||
Events.on(playbackManager, 'playbackstart', function (e, player) {
|
||||
const item = playbackManager.currentItem(player);
|
||||
// User played something manually
|
||||
if (currentThemeIds.indexOf(item.Id) == -1) {
|
||||
currentOwnerId = null;
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,183 +1,185 @@
|
|||
define(['dialogHelper', 'dom', 'layoutManager', 'connectionManager', 'globalize', 'loading', 'browser', 'focusManager', 'scrollHelper', 'material-icons', 'formDialogStyle', 'emby-button', 'emby-itemscontainer', 'cardStyle'], function (dialogHelper, dom, layoutManager, connectionManager, globalize, loading, browser, focusManager, scrollHelper) {
|
||||
'use strict';
|
||||
import dialogHelper from 'dialogHelper';
|
||||
import dom from 'dom';
|
||||
import layoutManager from 'layoutManager';
|
||||
import connectionManager from 'connectionManager';
|
||||
import globalize from 'globalize';
|
||||
import loading from 'loading';
|
||||
import browser from 'browser';
|
||||
import focusManager from 'focusManager';
|
||||
import scrollHelper from 'scrollHelper';
|
||||
import 'material-icons';
|
||||
import 'formDialogStyle';
|
||||
import 'emby-button';
|
||||
import 'emby-itemscontainer';
|
||||
import 'cardStyle';
|
||||
|
||||
browser = browser.default || browser;
|
||||
loading = loading.default || loading;
|
||||
layoutManager = layoutManager.default || layoutManager;
|
||||
focusManager = focusManager.default || focusManager;
|
||||
scrollHelper = scrollHelper.default || scrollHelper;
|
||||
const enableFocusTransform = !browser.slow && !browser.edge;
|
||||
|
||||
var enableFocusTransform = !browser.slow && !browser.edge;
|
||||
function getEditorHtml() {
|
||||
let html = '';
|
||||
html += '<div class="formDialogContent scrollY">';
|
||||
html += '<div class="dialogContentInner dialog-content-centered">';
|
||||
html += '<div class="loadingContent hide">';
|
||||
html += '<h1>' + globalize.translate('DetectingDevices') + '...</h1>';
|
||||
html += '<p>' + globalize.translate('MessagePleaseWait') + '</p>';
|
||||
html += '</div>';
|
||||
html += '<h1 style="margin-bottom:.25em;" class="devicesHeader hide">' + globalize.translate('HeaderNewDevices') + '</h1>';
|
||||
html += '<div is="emby-itemscontainer" class="results vertical-wrap">';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
return html += '</div>';
|
||||
}
|
||||
|
||||
function getEditorHtml() {
|
||||
var html = '';
|
||||
html += '<div class="formDialogContent scrollY">';
|
||||
html += '<div class="dialogContentInner dialog-content-centered">';
|
||||
html += '<div class="loadingContent hide">';
|
||||
html += '<h1>' + globalize.translate('DetectingDevices') + '...</h1>';
|
||||
html += '<p>' + globalize.translate('MessagePleaseWait') + '</p>';
|
||||
html += '</div>';
|
||||
html += '<h1 style="margin-bottom:.25em;" class="devicesHeader hide">' + globalize.translate('HeaderNewDevices') + '</h1>';
|
||||
html += '<div is="emby-itemscontainer" class="results vertical-wrap">';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
return html += '</div>';
|
||||
}
|
||||
function getDeviceHtml(device) {
|
||||
let html = '';
|
||||
let cssClass = 'card scalableCard backdropCard backdropCard-scalable';
|
||||
const cardBoxCssClass = 'cardBox visualCardBox';
|
||||
const padderClass = 'cardPadder-backdrop';
|
||||
|
||||
function getDeviceHtml(device) {
|
||||
var padderClass;
|
||||
var html = '';
|
||||
var cssClass = 'card scalableCard';
|
||||
var cardBoxCssClass = 'cardBox visualCardBox';
|
||||
cssClass += ' backdropCard backdropCard-scalable';
|
||||
padderClass = 'cardPadder-backdrop';
|
||||
// TODO move card creation code to Card component
|
||||
|
||||
// TODO move card creation code to Card component
|
||||
if (layoutManager.tv) {
|
||||
cssClass += ' show-focus';
|
||||
|
||||
if (layoutManager.tv) {
|
||||
cssClass += ' show-focus';
|
||||
|
||||
if (enableFocusTransform) {
|
||||
cssClass += ' show-animation';
|
||||
}
|
||||
}
|
||||
|
||||
html += '<button type="button" class="' + cssClass + '" data-id="' + device.DeviceId + '" style="min-width:33.3333%;">';
|
||||
html += '<div class="' + cardBoxCssClass + '">';
|
||||
html += '<div class="cardScalable visualCardBox-cardScalable">';
|
||||
html += '<div class="' + padderClass + '"></div>';
|
||||
html += '<div class="cardContent searchImage">';
|
||||
html += '<div class="cardImageContainer coveredImage"><span class="cardImageIcon material-icons dvr"></span></div>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
html += '<div class="cardFooter visualCardBox-cardFooter">';
|
||||
html += '<div class="cardText cardTextCentered">' + getTunerName(device.Type) + '</div>';
|
||||
html += '<div class="cardText cardTextCentered cardText-secondary">' + device.FriendlyName + '</div>';
|
||||
html += '<div class="cardText cardText-secondary cardTextCentered">';
|
||||
html += device.Url || ' ';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
return html += '</button>';
|
||||
}
|
||||
|
||||
function getTunerName(providerId) {
|
||||
switch (providerId = providerId.toLowerCase()) {
|
||||
case 'm3u':
|
||||
return 'M3U';
|
||||
|
||||
case 'hdhomerun':
|
||||
return 'HDHomerun';
|
||||
|
||||
case 'hauppauge':
|
||||
return 'Hauppauge';
|
||||
|
||||
case 'satip':
|
||||
return 'DVB';
|
||||
|
||||
default:
|
||||
return 'Unknown';
|
||||
if (enableFocusTransform) {
|
||||
cssClass += ' show-animation';
|
||||
}
|
||||
}
|
||||
|
||||
function renderDevices(view, devices) {
|
||||
var i;
|
||||
var length;
|
||||
var html = '';
|
||||
html += '<button type="button" class="' + cssClass + '" data-id="' + device.DeviceId + '" style="min-width:33.3333%;">';
|
||||
html += '<div class="' + cardBoxCssClass + '">';
|
||||
html += '<div class="cardScalable visualCardBox-cardScalable">';
|
||||
html += '<div class="' + padderClass + '"></div>';
|
||||
html += '<div class="cardContent searchImage">';
|
||||
html += '<div class="cardImageContainer coveredImage"><span class="cardImageIcon material-icons dvr"></span></div>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
html += '<div class="cardFooter visualCardBox-cardFooter">';
|
||||
html += '<div class="cardText cardTextCentered">' + getTunerName(device.Type) + '</div>';
|
||||
html += '<div class="cardText cardTextCentered cardText-secondary">' + device.FriendlyName + '</div>';
|
||||
html += '<div class="cardText cardText-secondary cardTextCentered">';
|
||||
html += device.Url || ' ';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
return html += '</button>';
|
||||
}
|
||||
|
||||
for (i = 0, length = devices.length; i < length; i++) {
|
||||
html += getDeviceHtml(devices[i]);
|
||||
}
|
||||
function getTunerName(providerId) {
|
||||
switch (providerId = providerId.toLowerCase()) {
|
||||
case 'm3u':
|
||||
return 'M3U';
|
||||
|
||||
if (devices.length) {
|
||||
view.querySelector('.devicesHeader').classList.remove('hide');
|
||||
} else {
|
||||
html = '<p><br/>' + globalize.translate('NoNewDevicesFound') + '</p>';
|
||||
view.querySelector('.devicesHeader').classList.add('hide');
|
||||
}
|
||||
case 'hdhomerun':
|
||||
return 'HDHomerun';
|
||||
|
||||
var elem = view.querySelector('.results');
|
||||
elem.innerHTML = html;
|
||||
case 'hauppauge':
|
||||
return 'Hauppauge';
|
||||
|
||||
if (layoutManager.tv) {
|
||||
focusManager.autoFocus(elem);
|
||||
}
|
||||
case 'satip':
|
||||
return 'DVB';
|
||||
|
||||
default:
|
||||
return 'Unknown';
|
||||
}
|
||||
}
|
||||
|
||||
function renderDevices(view, devices) {
|
||||
let html = '';
|
||||
|
||||
for (let i = 0, length = devices.length; i < length; i++) {
|
||||
html += getDeviceHtml(devices[i]);
|
||||
}
|
||||
|
||||
function discoverDevices(view, apiClient) {
|
||||
loading.show();
|
||||
view.querySelector('.loadingContent').classList.remove('hide');
|
||||
return ApiClient.getJSON(ApiClient.getUrl('LiveTv/Tuners/Discvover', {
|
||||
NewDevicesOnly: true
|
||||
})).then(function (devices) {
|
||||
currentDevices = devices;
|
||||
renderDevices(view, devices);
|
||||
view.querySelector('.loadingContent').classList.add('hide');
|
||||
loading.hide();
|
||||
});
|
||||
if (devices.length) {
|
||||
view.querySelector('.devicesHeader').classList.remove('hide');
|
||||
} else {
|
||||
html = '<p><br/>' + globalize.translate('NoNewDevicesFound') + '</p>';
|
||||
view.querySelector('.devicesHeader').classList.add('hide');
|
||||
}
|
||||
|
||||
function tunerPicker() {
|
||||
this.show = function (options) {
|
||||
var dialogOptions = {
|
||||
removeOnClose: true,
|
||||
scrollY: false
|
||||
};
|
||||
const elem = view.querySelector('.results');
|
||||
elem.innerHTML = html;
|
||||
|
||||
if (layoutManager.tv) {
|
||||
dialogOptions.size = 'fullscreen';
|
||||
} else {
|
||||
dialogOptions.size = 'small';
|
||||
}
|
||||
if (layoutManager.tv) {
|
||||
focusManager.autoFocus(elem);
|
||||
}
|
||||
}
|
||||
|
||||
var dlg = dialogHelper.createDialog(dialogOptions);
|
||||
dlg.classList.add('formDialog');
|
||||
var html = '';
|
||||
html += '<div class="formDialogHeader">';
|
||||
html += '<button is="paper-icon-button-light" class="btnCancel autoSize" tabindex="-1"><span class="material-icons arrow_back"></span></button>';
|
||||
html += '<h3 class="formDialogHeaderTitle">';
|
||||
html += globalize.translate('HeaderLiveTvTunerSetup');
|
||||
html += '</h3>';
|
||||
html += '</div>';
|
||||
html += getEditorHtml();
|
||||
dlg.innerHTML = html;
|
||||
dlg.querySelector('.btnCancel').addEventListener('click', function () {
|
||||
dialogHelper.close(dlg);
|
||||
});
|
||||
var deviceResult;
|
||||
dlg.querySelector('.results').addEventListener('click', function (e) {
|
||||
var tunerCard = dom.parentWithClass(e.target, 'card');
|
||||
function discoverDevices(view, apiClient) {
|
||||
loading.show();
|
||||
view.querySelector('.loadingContent').classList.remove('hide');
|
||||
return ApiClient.getJSON(ApiClient.getUrl('LiveTv/Tuners/Discvover', {
|
||||
NewDevicesOnly: true
|
||||
})).then(function (devices) {
|
||||
currentDevices = devices;
|
||||
renderDevices(view, devices);
|
||||
view.querySelector('.loadingContent').classList.add('hide');
|
||||
loading.hide();
|
||||
});
|
||||
}
|
||||
|
||||
if (tunerCard) {
|
||||
var deviceId = tunerCard.getAttribute('data-id');
|
||||
deviceResult = currentDevices.filter(function (d) {
|
||||
return d.DeviceId === deviceId;
|
||||
})[0];
|
||||
dialogHelper.close(dlg);
|
||||
}
|
||||
});
|
||||
|
||||
if (layoutManager.tv) {
|
||||
scrollHelper.centerFocus.on(dlg.querySelector('.formDialogContent'), false);
|
||||
}
|
||||
|
||||
var apiClient = connectionManager.getApiClient(options.serverId);
|
||||
discoverDevices(dlg, apiClient);
|
||||
|
||||
if (layoutManager.tv) {
|
||||
scrollHelper.centerFocus.off(dlg.querySelector('.formDialogContent'), false);
|
||||
}
|
||||
|
||||
return dialogHelper.open(dlg).then(function () {
|
||||
if (deviceResult) {
|
||||
return Promise.resolve(deviceResult);
|
||||
}
|
||||
|
||||
return Promise.reject();
|
||||
});
|
||||
function tunerPicker() {
|
||||
this.show = function (options) {
|
||||
const dialogOptions = {
|
||||
removeOnClose: true,
|
||||
scrollY: false
|
||||
};
|
||||
}
|
||||
|
||||
var currentDevices = [];
|
||||
return tunerPicker;
|
||||
});
|
||||
if (layoutManager.tv) {
|
||||
dialogOptions.size = 'fullscreen';
|
||||
} else {
|
||||
dialogOptions.size = 'small';
|
||||
}
|
||||
|
||||
const dlg = dialogHelper.createDialog(dialogOptions);
|
||||
dlg.classList.add('formDialog');
|
||||
let html = '';
|
||||
html += '<div class="formDialogHeader">';
|
||||
html += '<button is="paper-icon-button-light" class="btnCancel autoSize" tabindex="-1"><span class="material-icons arrow_back"></span></button>';
|
||||
html += '<h3 class="formDialogHeaderTitle">';
|
||||
html += globalize.translate('HeaderLiveTvTunerSetup');
|
||||
html += '</h3>';
|
||||
html += '</div>';
|
||||
html += getEditorHtml();
|
||||
dlg.innerHTML = html;
|
||||
dlg.querySelector('.btnCancel').addEventListener('click', function () {
|
||||
dialogHelper.close(dlg);
|
||||
});
|
||||
let deviceResult;
|
||||
dlg.querySelector('.results').addEventListener('click', function (e) {
|
||||
const tunerCard = dom.parentWithClass(e.target, 'card');
|
||||
|
||||
if (tunerCard) {
|
||||
const deviceId = tunerCard.getAttribute('data-id');
|
||||
deviceResult = currentDevices.filter(function (d) {
|
||||
return d.DeviceId === deviceId;
|
||||
})[0];
|
||||
dialogHelper.close(dlg);
|
||||
}
|
||||
});
|
||||
|
||||
if (layoutManager.tv) {
|
||||
scrollHelper.centerFocus.on(dlg.querySelector('.formDialogContent'), false);
|
||||
}
|
||||
|
||||
const apiClient = connectionManager.getApiClient(options.serverId);
|
||||
discoverDevices(dlg, apiClient);
|
||||
|
||||
if (layoutManager.tv) {
|
||||
scrollHelper.centerFocus.off(dlg.querySelector('.formDialogContent'), false);
|
||||
}
|
||||
|
||||
return dialogHelper.open(dlg).then(function () {
|
||||
if (deviceResult) {
|
||||
return Promise.resolve(deviceResult);
|
||||
}
|
||||
|
||||
return Promise.reject();
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
let currentDevices = [];
|
||||
|
||||
export default tunerPicker;
|
||||
|
|
|
|||
|
|
@ -1,214 +1,219 @@
|
|||
define(['connectionManager', 'globalize', 'dom', 'itemHelper', 'paper-icon-button-light', 'material-icons', 'emby-button', 'css!./userdatabuttons'], function (connectionManager, globalize, dom, itemHelper) {
|
||||
'use strict';
|
||||
import connectionManager from 'connectionManager';
|
||||
import globalize from 'globalize';
|
||||
import dom from 'dom';
|
||||
import itemHelper from 'itemHelper';
|
||||
import 'paper-icon-button-light';
|
||||
import 'material-icons';
|
||||
import 'emby-button';
|
||||
import 'css!./userdatabuttons';
|
||||
|
||||
var userDataMethods = {
|
||||
markPlayed: markPlayed,
|
||||
markDislike: markDislike,
|
||||
markLike: markLike,
|
||||
markFavorite: markFavorite
|
||||
};
|
||||
const userDataMethods = {
|
||||
markPlayed: markPlayed,
|
||||
markDislike: markDislike,
|
||||
markLike: markLike,
|
||||
markFavorite: markFavorite
|
||||
};
|
||||
|
||||
function getUserDataButtonHtml(method, itemId, serverId, buttonCssClass, iconCssClass, icon, tooltip, style) {
|
||||
if (style === 'fab-mini') {
|
||||
style = 'fab';
|
||||
buttonCssClass = buttonCssClass ? (buttonCssClass + ' mini') : 'mini';
|
||||
}
|
||||
|
||||
var is = style === 'fab' ? 'emby-button' : 'paper-icon-button-light';
|
||||
var className = style === 'fab' ? 'autoSize fab' : 'autoSize';
|
||||
|
||||
if (buttonCssClass) {
|
||||
className += ' ' + buttonCssClass;
|
||||
}
|
||||
|
||||
if (iconCssClass) {
|
||||
iconCssClass += ' ';
|
||||
} else {
|
||||
iconCssClass = '';
|
||||
}
|
||||
|
||||
iconCssClass += 'material-icons';
|
||||
|
||||
return '<button title="' + tooltip + '" data-itemid="' + itemId + '" data-serverid="' + serverId + '" is="' + is + '" data-method="' + method + '" class="' + className + '"><span class="' + iconCssClass + ' ' + icon + '"></span></button>';
|
||||
function getUserDataButtonHtml(method, itemId, serverId, buttonCssClass, iconCssClass, icon, tooltip, style) {
|
||||
if (style === 'fab-mini') {
|
||||
style = 'fab';
|
||||
buttonCssClass = buttonCssClass ? (buttonCssClass + ' mini') : 'mini';
|
||||
}
|
||||
|
||||
function onContainerClick(e) {
|
||||
var btnUserData = dom.parentWithClass(e.target, 'btnUserData');
|
||||
const is = style === 'fab' ? 'emby-button' : 'paper-icon-button-light';
|
||||
let className = style === 'fab' ? 'autoSize fab' : 'autoSize';
|
||||
|
||||
if (!btnUserData) {
|
||||
return;
|
||||
}
|
||||
|
||||
var method = btnUserData.getAttribute('data-method');
|
||||
userDataMethods[method](btnUserData);
|
||||
if (buttonCssClass) {
|
||||
className += ' ' + buttonCssClass;
|
||||
}
|
||||
|
||||
function fill(options) {
|
||||
var html = getIconsHtml(options);
|
||||
|
||||
if (options.fillMode === 'insertAdjacent') {
|
||||
options.element.insertAdjacentHTML(options.insertLocation || 'beforeend', html);
|
||||
} else {
|
||||
options.element.innerHTML = html;
|
||||
}
|
||||
|
||||
dom.removeEventListener(options.element, 'click', onContainerClick, {
|
||||
passive: true
|
||||
});
|
||||
|
||||
dom.addEventListener(options.element, 'click', onContainerClick, {
|
||||
passive: true
|
||||
});
|
||||
if (iconCssClass) {
|
||||
iconCssClass += ' ';
|
||||
} else {
|
||||
iconCssClass = '';
|
||||
}
|
||||
|
||||
function destroy(options) {
|
||||
options.element.innerHTML = '';
|
||||
iconCssClass += 'material-icons';
|
||||
|
||||
dom.removeEventListener(options.element, 'click', onContainerClick, {
|
||||
passive: true
|
||||
});
|
||||
return '<button title="' + tooltip + '" data-itemid="' + itemId + '" data-serverid="' + serverId + '" is="' + is + '" data-method="' + method + '" class="' + className + '"><span class="' + iconCssClass + ' ' + icon + '"></span></button>';
|
||||
}
|
||||
|
||||
function onContainerClick(e) {
|
||||
const btnUserData = dom.parentWithClass(e.target, 'btnUserData');
|
||||
|
||||
if (!btnUserData) {
|
||||
return;
|
||||
}
|
||||
|
||||
function getIconsHtml(options) {
|
||||
var item = options.item;
|
||||
var includePlayed = options.includePlayed;
|
||||
var cssClass = options.cssClass;
|
||||
var style = options.style;
|
||||
const method = btnUserData.getAttribute('data-method');
|
||||
userDataMethods[method](btnUserData);
|
||||
}
|
||||
|
||||
var html = '';
|
||||
function fill(options) {
|
||||
const html = getIconsHtml(options);
|
||||
|
||||
var userData = item.UserData || {};
|
||||
if (options.fillMode === 'insertAdjacent') {
|
||||
options.element.insertAdjacentHTML(options.insertLocation || 'beforeend', html);
|
||||
} else {
|
||||
options.element.innerHTML = html;
|
||||
}
|
||||
|
||||
var itemId = item.Id;
|
||||
dom.removeEventListener(options.element, 'click', onContainerClick, {
|
||||
passive: true
|
||||
});
|
||||
|
||||
if (itemHelper.isLocalItem(item)) {
|
||||
return html;
|
||||
}
|
||||
dom.addEventListener(options.element, 'click', onContainerClick, {
|
||||
passive: true
|
||||
});
|
||||
}
|
||||
|
||||
var btnCssClass = 'btnUserData';
|
||||
function destroy(options) {
|
||||
options.element.innerHTML = '';
|
||||
|
||||
if (cssClass) {
|
||||
btnCssClass += ' ' + cssClass;
|
||||
}
|
||||
dom.removeEventListener(options.element, 'click', onContainerClick, {
|
||||
passive: true
|
||||
});
|
||||
}
|
||||
|
||||
var iconCssClass = options.iconCssClass;
|
||||
function getIconsHtml(options) {
|
||||
const item = options.item;
|
||||
const includePlayed = options.includePlayed;
|
||||
const cssClass = options.cssClass;
|
||||
const style = options.style;
|
||||
|
||||
var serverId = item.ServerId;
|
||||
let html = '';
|
||||
|
||||
if (includePlayed !== false) {
|
||||
var tooltipPlayed = globalize.translate('MarkPlayed');
|
||||
const userData = item.UserData || {};
|
||||
|
||||
if (itemHelper.canMarkPlayed(item)) {
|
||||
if (userData.Played) {
|
||||
html += getUserDataButtonHtml('markPlayed', itemId, serverId, btnCssClass + ' btnUserDataOn', iconCssClass, 'check', tooltipPlayed, style);
|
||||
} else {
|
||||
html += getUserDataButtonHtml('markPlayed', itemId, serverId, btnCssClass, iconCssClass, 'check', tooltipPlayed, style);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var tooltipFavorite = globalize.translate('Favorite');
|
||||
if (userData.IsFavorite) {
|
||||
html += getUserDataButtonHtml('markFavorite', itemId, serverId, btnCssClass + ' btnUserData btnUserDataOn', iconCssClass, 'favorite', tooltipFavorite, style);
|
||||
} else {
|
||||
html += getUserDataButtonHtml('markFavorite', itemId, serverId, btnCssClass + ' btnUserData', iconCssClass, 'favorite', tooltipFavorite, style);
|
||||
}
|
||||
const itemId = item.Id;
|
||||
|
||||
if (itemHelper.isLocalItem(item)) {
|
||||
return html;
|
||||
}
|
||||
|
||||
function markFavorite(link) {
|
||||
var id = link.getAttribute('data-itemid');
|
||||
var serverId = link.getAttribute('data-serverid');
|
||||
let btnCssClass = 'btnUserData';
|
||||
|
||||
var markAsFavorite = !link.classList.contains('btnUserDataOn');
|
||||
if (cssClass) {
|
||||
btnCssClass += ' ' + cssClass;
|
||||
}
|
||||
|
||||
favorite(id, serverId, markAsFavorite);
|
||||
const iconCssClass = options.iconCssClass;
|
||||
|
||||
if (markAsFavorite) {
|
||||
link.classList.add('btnUserDataOn');
|
||||
} else {
|
||||
link.classList.remove('btnUserDataOn');
|
||||
const serverId = item.ServerId;
|
||||
|
||||
if (includePlayed !== false) {
|
||||
const tooltipPlayed = globalize.translate('MarkPlayed');
|
||||
|
||||
if (itemHelper.canMarkPlayed(item)) {
|
||||
if (userData.Played) {
|
||||
html += getUserDataButtonHtml('markPlayed', itemId, serverId, btnCssClass + ' btnUserDataOn', iconCssClass, 'check', tooltipPlayed, style);
|
||||
} else {
|
||||
html += getUserDataButtonHtml('markPlayed', itemId, serverId, btnCssClass, iconCssClass, 'check', tooltipPlayed, style);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function markLike(link) {
|
||||
var id = link.getAttribute('data-itemid');
|
||||
var serverId = link.getAttribute('data-serverid');
|
||||
|
||||
if (!link.classList.contains('btnUserDataOn')) {
|
||||
likes(id, serverId, true);
|
||||
|
||||
link.classList.add('btnUserDataOn');
|
||||
} else {
|
||||
clearLike(id, serverId);
|
||||
|
||||
link.classList.remove('btnUserDataOn');
|
||||
}
|
||||
|
||||
link.parentNode.querySelector('.btnDislike').classList.remove('btnUserDataOn');
|
||||
const tooltipFavorite = globalize.translate('Favorite');
|
||||
if (userData.IsFavorite) {
|
||||
html += getUserDataButtonHtml('markFavorite', itemId, serverId, btnCssClass + ' btnUserData btnUserDataOn', iconCssClass, 'favorite', tooltipFavorite, style);
|
||||
} else {
|
||||
html += getUserDataButtonHtml('markFavorite', itemId, serverId, btnCssClass + ' btnUserData', iconCssClass, 'favorite', tooltipFavorite, style);
|
||||
}
|
||||
|
||||
function markDislike(link) {
|
||||
var id = link.getAttribute('data-itemid');
|
||||
var serverId = link.getAttribute('data-serverid');
|
||||
return html;
|
||||
}
|
||||
|
||||
if (!link.classList.contains('btnUserDataOn')) {
|
||||
likes(id, serverId, false);
|
||||
function markFavorite(link) {
|
||||
const id = link.getAttribute('data-itemid');
|
||||
const serverId = link.getAttribute('data-serverid');
|
||||
|
||||
link.classList.add('btnUserDataOn');
|
||||
} else {
|
||||
clearLike(id, serverId);
|
||||
const markAsFavorite = !link.classList.contains('btnUserDataOn');
|
||||
|
||||
link.classList.remove('btnUserDataOn');
|
||||
}
|
||||
favorite(id, serverId, markAsFavorite);
|
||||
|
||||
link.parentNode.querySelector('.btnLike').classList.remove('btnUserDataOn');
|
||||
if (markAsFavorite) {
|
||||
link.classList.add('btnUserDataOn');
|
||||
} else {
|
||||
link.classList.remove('btnUserDataOn');
|
||||
}
|
||||
}
|
||||
|
||||
function markLike(link) {
|
||||
const id = link.getAttribute('data-itemid');
|
||||
const serverId = link.getAttribute('data-serverid');
|
||||
|
||||
if (!link.classList.contains('btnUserDataOn')) {
|
||||
likes(id, serverId, true);
|
||||
|
||||
link.classList.add('btnUserDataOn');
|
||||
} else {
|
||||
clearLike(id, serverId);
|
||||
|
||||
link.classList.remove('btnUserDataOn');
|
||||
}
|
||||
|
||||
function markPlayed(link) {
|
||||
var id = link.getAttribute('data-itemid');
|
||||
var serverId = link.getAttribute('data-serverid');
|
||||
link.parentNode.querySelector('.btnDislike').classList.remove('btnUserDataOn');
|
||||
}
|
||||
|
||||
if (!link.classList.contains('btnUserDataOn')) {
|
||||
played(id, serverId, true);
|
||||
function markDislike(link) {
|
||||
const id = link.getAttribute('data-itemid');
|
||||
const serverId = link.getAttribute('data-serverid');
|
||||
|
||||
link.classList.add('btnUserDataOn');
|
||||
} else {
|
||||
played(id, serverId, false);
|
||||
if (!link.classList.contains('btnUserDataOn')) {
|
||||
likes(id, serverId, false);
|
||||
|
||||
link.classList.remove('btnUserDataOn');
|
||||
}
|
||||
link.classList.add('btnUserDataOn');
|
||||
} else {
|
||||
clearLike(id, serverId);
|
||||
|
||||
link.classList.remove('btnUserDataOn');
|
||||
}
|
||||
|
||||
function likes(id, serverId, isLiked) {
|
||||
var apiClient = connectionManager.getApiClient(serverId);
|
||||
return apiClient.updateUserItemRating(apiClient.getCurrentUserId(), id, isLiked);
|
||||
link.parentNode.querySelector('.btnLike').classList.remove('btnUserDataOn');
|
||||
}
|
||||
|
||||
function markPlayed(link) {
|
||||
const id = link.getAttribute('data-itemid');
|
||||
const serverId = link.getAttribute('data-serverid');
|
||||
|
||||
if (!link.classList.contains('btnUserDataOn')) {
|
||||
played(id, serverId, true);
|
||||
|
||||
link.classList.add('btnUserDataOn');
|
||||
} else {
|
||||
played(id, serverId, false);
|
||||
|
||||
link.classList.remove('btnUserDataOn');
|
||||
}
|
||||
}
|
||||
|
||||
function played(id, serverId, isPlayed) {
|
||||
var apiClient = connectionManager.getApiClient(serverId);
|
||||
function likes(id, serverId, isLiked) {
|
||||
const apiClient = connectionManager.getApiClient(serverId);
|
||||
return apiClient.updateUserItemRating(apiClient.getCurrentUserId(), id, isLiked);
|
||||
}
|
||||
|
||||
var method = isPlayed ? 'markPlayed' : 'markUnplayed';
|
||||
function played(id, serverId, isPlayed) {
|
||||
const apiClient = connectionManager.getApiClient(serverId);
|
||||
|
||||
return apiClient[method](apiClient.getCurrentUserId(), id, new Date());
|
||||
}
|
||||
const method = isPlayed ? 'markPlayed' : 'markUnplayed';
|
||||
|
||||
function favorite(id, serverId, isFavorite) {
|
||||
var apiClient = connectionManager.getApiClient(serverId);
|
||||
return apiClient[method](apiClient.getCurrentUserId(), id, new Date());
|
||||
}
|
||||
|
||||
return apiClient.updateFavoriteStatus(apiClient.getCurrentUserId(), id, isFavorite);
|
||||
}
|
||||
function favorite(id, serverId, isFavorite) {
|
||||
const apiClient = connectionManager.getApiClient(serverId);
|
||||
|
||||
function clearLike(id, serverId) {
|
||||
var apiClient = connectionManager.getApiClient(serverId);
|
||||
return apiClient.updateFavoriteStatus(apiClient.getCurrentUserId(), id, isFavorite);
|
||||
}
|
||||
|
||||
return apiClient.clearUserItemRating(apiClient.getCurrentUserId(), id);
|
||||
}
|
||||
function clearLike(id, serverId) {
|
||||
const apiClient = connectionManager.getApiClient(serverId);
|
||||
|
||||
return {
|
||||
fill: fill,
|
||||
destroy: destroy,
|
||||
getIconsHtml: getIconsHtml
|
||||
};
|
||||
});
|
||||
return apiClient.clearUserItemRating(apiClient.getCurrentUserId(), id);
|
||||
}
|
||||
|
||||
export default {
|
||||
fill: fill,
|
||||
destroy: destroy,
|
||||
getIconsHtml: getIconsHtml
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,61 +1,66 @@
|
|||
define(['require', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'connectionManager', 'appRouter', 'globalize', 'userSettings', 'emby-checkbox', 'emby-input', 'paper-icon-button-light', 'emby-select', 'material-icons', 'css!./../formdialog', 'emby-button', 'flexStyles'], function (require, dialogHelper, loading, appHost, layoutManager, connectionManager, appRouter, globalize, userSettings) {
|
||||
'use strict';
|
||||
import dialogHelper from 'dialogHelper';
|
||||
import layoutManager from 'layoutManager';
|
||||
import globalize from 'globalize';
|
||||
import * as userSettings from 'userSettings';
|
||||
import 'emby-checkbox';
|
||||
import 'emby-input';
|
||||
import 'paper-icon-button-light';
|
||||
import 'emby-select';
|
||||
import 'material-icons';
|
||||
import 'css!./../formdialog';
|
||||
import 'emby-button';
|
||||
import 'flexStyles';
|
||||
|
||||
appRouter = appRouter.default || appRouter;
|
||||
layoutManager = layoutManager.default || layoutManager;
|
||||
function onSubmit(e) {
|
||||
e.preventDefault();
|
||||
return false;
|
||||
}
|
||||
|
||||
function onSubmit(e) {
|
||||
e.preventDefault();
|
||||
return false;
|
||||
function initEditor(context, settings) {
|
||||
context.querySelector('form').addEventListener('submit', onSubmit);
|
||||
|
||||
const elems = context.querySelectorAll('.viewSetting-checkboxContainer');
|
||||
|
||||
for (const elem of elems) {
|
||||
elem.querySelector('input').checked = settings[elem.getAttribute('data-settingname')] || false;
|
||||
}
|
||||
|
||||
function initEditor(context, settings) {
|
||||
context.querySelector('form').addEventListener('submit', onSubmit);
|
||||
context.querySelector('.selectImageType').value = settings.imageType || 'primary';
|
||||
}
|
||||
|
||||
var elems = context.querySelectorAll('.viewSetting-checkboxContainer');
|
||||
|
||||
for (var i = 0, length = elems.length; i < length; i++) {
|
||||
elems[i].querySelector('input').checked = settings[elems[i].getAttribute('data-settingname')] || false;
|
||||
}
|
||||
|
||||
context.querySelector('.selectImageType').value = settings.imageType || 'primary';
|
||||
function saveValues(context, settings, settingsKey) {
|
||||
const elems = context.querySelectorAll('.viewSetting-checkboxContainer');
|
||||
for (const elem of elems) {
|
||||
userSettings.set(settingsKey + '-' + elem.getAttribute('data-settingname'), elem.querySelector('input').checked);
|
||||
}
|
||||
|
||||
function saveValues(context, settings, settingsKey) {
|
||||
var elems = context.querySelectorAll('.viewSetting-checkboxContainer');
|
||||
for (var i = 0, length = elems.length; i < length; i++) {
|
||||
userSettings.set(settingsKey + '-' + elems[i].getAttribute('data-settingname'), elems[i].querySelector('input').checked);
|
||||
}
|
||||
userSettings.set(settingsKey + '-imageType', context.querySelector('.selectImageType').value);
|
||||
}
|
||||
|
||||
userSettings.set(settingsKey + '-imageType', context.querySelector('.selectImageType').value);
|
||||
function centerFocus(elem, horiz, on) {
|
||||
import('scrollHelper').then(({default: scrollHelper}) => {
|
||||
const fn = on ? 'on' : 'off';
|
||||
scrollHelper.centerFocus[fn](elem, horiz);
|
||||
});
|
||||
}
|
||||
|
||||
function showIfAllowed(context, selector, visible) {
|
||||
const elem = context.querySelector(selector);
|
||||
|
||||
if (visible && !elem.classList.contains('hiddenFromViewSettings')) {
|
||||
elem.classList.remove('hide');
|
||||
} else {
|
||||
elem.classList.add('hide');
|
||||
}
|
||||
}
|
||||
|
||||
function centerFocus(elem, horiz, on) {
|
||||
require(['scrollHelper'], function (scrollHelper) {
|
||||
scrollHelper = scrollHelper.default || scrollHelper;
|
||||
var fn = on ? 'on' : 'off';
|
||||
scrollHelper.centerFocus[fn](elem, horiz);
|
||||
});
|
||||
class ViewSettings {
|
||||
constructor() {
|
||||
}
|
||||
|
||||
function showIfAllowed(context, selector, visible) {
|
||||
var elem = context.querySelector(selector);
|
||||
|
||||
if (visible && !elem.classList.contains('hiddenFromViewSettings')) {
|
||||
elem.classList.remove('hide');
|
||||
} else {
|
||||
elem.classList.add('hide');
|
||||
}
|
||||
}
|
||||
|
||||
function ViewSettings() {
|
||||
|
||||
}
|
||||
|
||||
ViewSettings.prototype.show = function (options) {
|
||||
show(options) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
require(['text!./viewSettings.template.html'], function (template) {
|
||||
var dialogOptions = {
|
||||
import('text!./viewSettings.template.html').then(({default: template}) => {
|
||||
const dialogOptions = {
|
||||
removeOnClose: true,
|
||||
scrollY: false
|
||||
};
|
||||
|
|
@ -66,11 +71,11 @@ define(['require', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'conne
|
|||
dialogOptions.size = 'small';
|
||||
}
|
||||
|
||||
var dlg = dialogHelper.createDialog(dialogOptions);
|
||||
const dlg = dialogHelper.createDialog(dialogOptions);
|
||||
|
||||
dlg.classList.add('formDialog');
|
||||
|
||||
var html = '';
|
||||
let html = '';
|
||||
|
||||
html += '<div class="formDialogHeader">';
|
||||
html += '<button is="paper-icon-button-light" class="btnCancel hide-mouse-idle-tv" tabindex="-1"><span class="material-icons arrow_back"></span></button>';
|
||||
|
|
@ -82,14 +87,14 @@ define(['require', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'conne
|
|||
|
||||
dlg.innerHTML = globalize.translateHtml(html, 'core');
|
||||
|
||||
var settingElements = dlg.querySelectorAll('.viewSetting');
|
||||
for (var i = 0, length = settingElements.length; i < length; i++) {
|
||||
if (options.visibleSettings.indexOf(settingElements[i].getAttribute('data-settingname')) === -1) {
|
||||
settingElements[i].classList.add('hide');
|
||||
settingElements[i].classList.add('hiddenFromViewSettings');
|
||||
const settingElements = dlg.querySelectorAll('.viewSetting');
|
||||
for (const settingElement of settingElements) {
|
||||
if (options.visibleSettings.indexOf(settingElement.getAttribute('data-settingname')) === -1) {
|
||||
settingElement.classList.add('hide');
|
||||
settingElement.classList.add('hiddenFromViewSettings');
|
||||
} else {
|
||||
settingElements[i].classList.remove('hide');
|
||||
settingElements[i].classList.remove('hiddenFromViewSettings');
|
||||
settingElement.classList.remove('hide');
|
||||
settingElement.classList.remove('hiddenFromViewSettings');
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -108,7 +113,7 @@ define(['require', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'conne
|
|||
centerFocus(dlg.querySelector('.formDialogContent'), false, true);
|
||||
}
|
||||
|
||||
var submitted;
|
||||
let submitted;
|
||||
|
||||
dlg.querySelector('.selectImageType').dispatchEvent(new CustomEvent('change', {}));
|
||||
|
||||
|
|
@ -131,7 +136,7 @@ define(['require', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'conne
|
|||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
return ViewSettings;
|
||||
});
|
||||
export default ViewSettings;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue