milas/jellyfish-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Migration mediaLibraryEditor and mediaLibraryCreator to es6

Browse source
This commit is contained in:
grafixeyehero 2020-06-09 22:37:34 +03:00
parent 336c7bc5f9
commit bb5d37f3e7
4 changed files with 154 additions and 120 deletions
Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -96,6 +96,8 @@
"src/components/images/imageLoader.js", "src/components/images/imageLoader.js",
"src/components/indicators/indicators.js", "src/components/indicators/indicators.js",
"src/components/lazyLoader/lazyLoaderIntersectionObserver.js", "src/components/lazyLoader/lazyLoaderIntersectionObserver.js",
"src/components/mediaLibraryCreator/mediaLibraryCreator.js",
"src/components/mediaLibraryEditor/mediaLibraryEditor.js",
"src/components/playback/brightnessosd.js", "src/components/playback/brightnessosd.js",
"src/components/playback/mediasession.js", "src/components/playback/mediasession.js",
"src/components/playback/nowplayinghelper.js", "src/components/playback/nowplayinghelper.js",

131
src/components/mediaLibraryCreator/mediaLibraryCreator.js
View file

@ -1,5 +1,24 @@
define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionseditor/libraryoptionseditor', 'globalize', 'emby-toggle', 'emby-input', 'emby-select', 'paper-icon-button-light', 'listViewStyle', 'formDialogStyle', 'emby-button', 'flexStyles'], function (loading, dialogHelper, dom, $, libraryoptionseditor, globalize) { /* eslint-disable indent */
'use strict';
/**
* Module for media library creator.
* @module components/mediaLibraryCreator/mediaLibraryCreator
*/
import loading from 'loading';
import dialogHelper from 'dialogHelper';
import dom from 'dom';
import $ from 'jQuery';
import libraryoptionseditor from 'components/libraryoptionseditor/libraryoptionseditor';
import globalize from 'globalize';
import 'emby-toggle';
import 'emby-input';
import 'emby-select';
import 'paper-icon-button-light';
import 'listViewStyle';
import 'formDialogStyle';
import 'emby-button';
import 'flexStyles';
function onAddLibrary() { function onAddLibrary() {
if (isCreating) { if (isCreating) {
@ -7,7 +26,7 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed
} }
if (pathInfos.length == 0) { if (pathInfos.length == 0) {
require(['alert'], function (alert) { import('alert').then(({default: alert}) => {
alert({ alert({
text: globalize.translate('PleaseAddAtLeastOneFolder'), text: globalize.translate('PleaseAddAtLeastOneFolder'),
type: 'error' type: 'error'
@ -19,23 +38,23 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed
isCreating = true; isCreating = true;
loading.show(); loading.show();
var dlg = dom.parentWithClass(this, 'dlg-librarycreator'); const dlg = dom.parentWithClass(this, 'dlg-librarycreator');
var name = $('#txtValue', dlg).val(); const name = $('#txtValue', dlg).val();
var type = $('#selectCollectionType', dlg).val(); let type = $('#selectCollectionType', dlg).val();
if (type == 'mixed') { if (type == 'mixed') {
type = null; type = null;
} }
var libraryOptions = libraryoptionseditor.getLibraryOptions(dlg.querySelector('.libraryOptions')); const libraryOptions = libraryoptionseditor.getLibraryOptions(dlg.querySelector('.libraryOptions'));
libraryOptions.PathInfos = pathInfos; libraryOptions.PathInfos = pathInfos;
ApiClient.addVirtualFolder(name, type, currentOptions.refresh, libraryOptions).then(function () { ApiClient.addVirtualFolder(name, type, currentOptions.refresh, libraryOptions).then(() => {
hasChanges = true; hasChanges = true;
isCreating = false; isCreating = false;
loading.hide(); loading.hide();
dialogHelper.close(dlg); dialogHelper.close(dlg);
}, function () { }, () => {
require(['toast'], function (toast) { import('toast').then(({default: toast}) => {
toast(globalize.translate('ErrorAddingMediaPathToVirtualFolder')); toast(globalize.translate('ErrorAddingMediaPathToVirtualFolder'));
}); });
@ -46,15 +65,15 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed
} }
function getCollectionTypeOptionsHtml(collectionTypeOptions) { function getCollectionTypeOptionsHtml(collectionTypeOptions) {
return collectionTypeOptions.map(function (i) { return collectionTypeOptions.map(i => {
return '<option value="' + i.value + '">' + i.name + '</option>'; return `<option value="${i.value}">${i.name}</option>`;
}).join(''); }).join('');
} }
function initEditor(page, collectionTypeOptions) { function initEditor(page, collectionTypeOptions) {
$('#selectCollectionType', page).html(getCollectionTypeOptionsHtml(collectionTypeOptions)).val('').on('change', function () { $('#selectCollectionType', page).html(getCollectionTypeOptionsHtml(collectionTypeOptions)).val('').on('change', function () {
var value = this.value; const value = this.value;
var dlg = $(this).parents('.dialog')[0]; const dlg = $(this).parents('.dialog')[0];
libraryoptionseditor.setContentType(dlg.querySelector('.libraryOptions'), value == 'mixed' ? '' : value); libraryoptionseditor.setContentType(dlg.querySelector('.libraryOptions'), value == 'mixed' ? '' : value);
if (value) { if (value) {
@ -64,12 +83,12 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed
} }
if (value != 'mixed') { if (value != 'mixed') {
var index = this.selectedIndex; const index = this.selectedIndex;
if (index != -1) { if (index != -1) {
var name = this.options[index].innerHTML.replace('*', '').replace('&amp;', '&'); const name = this.options[index].innerHTML.replace('*', '').replace('&amp;', '&');
$('#txtValue', dlg).val(name); $('#txtValue', dlg).val(name);
var folderOption = collectionTypeOptions.filter(function (i) { const folderOption = collectionTypeOptions.filter(i => {
return i.value == value; return i.value == value;
})[0]; })[0];
$('.collectionTypeFieldDescription', dlg).html(folderOption.message || ''); $('.collectionTypeFieldDescription', dlg).html(folderOption.message || '');
@ -83,15 +102,15 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed
} }
function onToggleAdvancedChange() { function onToggleAdvancedChange() {
var dlg = dom.parentWithClass(this, 'dlg-librarycreator'); const dlg = dom.parentWithClass(this, 'dlg-librarycreator');
libraryoptionseditor.setAdvancedVisible(dlg.querySelector('.libraryOptions'), this.checked); libraryoptionseditor.setAdvancedVisible(dlg.querySelector('.libraryOptions'), this.checked);
} }
function onAddButtonClick() { function onAddButtonClick() {
var page = dom.parentWithClass(this, 'dlg-librarycreator'); const page = dom.parentWithClass(this, 'dlg-librarycreator');
require(['directorybrowser'], function (directoryBrowser) { import('directorybrowser').then(({default: directoryBrowser}) => {
var picker = new directoryBrowser(); const picker = new directoryBrowser();
picker.show({ picker.show({
enableNetworkSharePath: true, enableNetworkSharePath: true,
callback: function (path, networkSharePath) { callback: function (path, networkSharePath) {
@ -106,24 +125,24 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed
} }
function getFolderHtml(pathInfo, index) { function getFolderHtml(pathInfo, index) {
var html = ''; let html = '';
html += '<div class="listItem listItem-border lnkPath" style="padding-left:.5em;">'; html += '<div class="listItem listItem-border lnkPath" style="padding-left:.5em;">';
html += '<div class="' + (pathInfo.NetworkPath ? 'listItemBody two-line' : 'listItemBody') + '">'; html += `<div class="${pathInfo.NetworkPath ? 'listItemBody two-line' : 'listItemBody'}">`;
html += '<div class="listItemBodyText">' + pathInfo.Path + '</div>'; html += `<div class="listItemBodyText">${pathInfo.Path}</div>`;
if (pathInfo.NetworkPath) { if (pathInfo.NetworkPath) {
html += '<div class="listItemBodyText secondary">' + pathInfo.NetworkPath + '</div>'; html += `<div class="listItemBodyText secondary">${pathInfo.NetworkPath}</div>`;
} }
html += '</div>'; html += '</div>';
html += '<button type="button" is="paper-icon-button-light"" class="listItemButton btnRemovePath" data-index="' + index + '"><span class="material-icons remove_circle"></span></button>'; html += `<button type="button" is="paper-icon-button-light"" class="listItemButton btnRemovePath" data-index="${index}"><span class="material-icons remove_circle"></span></button>`;
html += '</div>'; html += '</div>';
return html; return html;
} }
function renderPaths(page) { function renderPaths(page) {
var foldersHtml = pathInfos.map(getFolderHtml).join(''); const foldersHtml = pathInfos.map(getFolderHtml).join('');
var folderList = page.querySelector('.folderList'); const folderList = page.querySelector('.folderList');
folderList.innerHTML = foldersHtml; folderList.innerHTML = foldersHtml;
if (foldersHtml) { if (foldersHtml) {
@ -134,13 +153,13 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed
} }
function addMediaLocation(page, path, networkSharePath) { function addMediaLocation(page, path, networkSharePath) {
var pathLower = path.toLowerCase(); const pathLower = path.toLowerCase();
var pathFilter = pathInfos.filter(function (p) { const pathFilter = pathInfos.filter(p => {
return p.Path.toLowerCase() == pathLower; return p.Path.toLowerCase() == pathLower;
}); });
if (!pathFilter.length) { if (!pathFilter.length) {
var pathInfo = { const pathInfo = {
Path: path Path: path
}; };
@ -154,11 +173,11 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed
} }
function onRemoveClick(e) { function onRemoveClick(e) {
var button = dom.parentWithClass(e.target, 'btnRemovePath'); const button = dom.parentWithClass(e.target, 'btnRemovePath');
var index = parseInt(button.getAttribute('data-index')); const index = parseInt(button.getAttribute('data-index'));
var location = pathInfos[index].Path; const location = pathInfos[index].Path;
var locationLower = location.toLowerCase(); const locationLower = location.toLowerCase();
pathInfos = pathInfos.filter(function (p) { pathInfos = pathInfos.filter(p => {
return p.Path.toLowerCase() != locationLower; return p.Path.toLowerCase() != locationLower;
}); });
renderPaths(dom.parentWithClass(button, 'dlg-librarycreator')); renderPaths(dom.parentWithClass(button, 'dlg-librarycreator'));
@ -169,24 +188,22 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed
} }
function initLibraryOptions(dlg) { function initLibraryOptions(dlg) {
libraryoptionseditor.embed(dlg.querySelector('.libraryOptions')).then(function () { libraryoptionseditor.embed(dlg.querySelector('.libraryOptions')).then(() => {
$('#selectCollectionType', dlg).trigger('change'); $('#selectCollectionType', dlg).trigger('change');
onToggleAdvancedChange.call(dlg.querySelector('.chkAdvanced')); onToggleAdvancedChange.call(dlg.querySelector('.chkAdvanced'));
}); });
} }
function editor() { export class editor {
this.show = function (options) { constructor() {
return new Promise(function (resolve, reject) { this.show = options => {
return new Promise((resolve) => {
currentOptions = options; currentOptions = options;
currentResolve = resolve; currentResolve = resolve;
hasChanges = false; hasChanges = false;
var xhr = new XMLHttpRequest(); // TODO: remove require
xhr.open('GET', 'components/mediaLibraryCreator/mediaLibraryCreator.template.html', true); require(['text!./components/mediaLibraryCreator/mediaLibraryCreator.template.html'], template => {
const dlg = dialogHelper.createDialog({
xhr.onload = function (e) {
var template = this.response;
var dlg = dialogHelper.createDialog({
size: 'small', size: 'small',
modal: false, modal: false,
removeOnClose: true, removeOnClose: true,
@ -200,23 +217,23 @@ define(['loading', 'dialogHelper', 'dom', 'jQuery', 'components/libraryoptionsed
initEditor(dlg, options.collectionTypeOptions); initEditor(dlg, options.collectionTypeOptions);
dlg.addEventListener('close', onDialogClosed); dlg.addEventListener('close', onDialogClosed);
dialogHelper.open(dlg); dialogHelper.open(dlg);
dlg.querySelector('.btnCancel').addEventListener('click', function () { dlg.querySelector('.btnCancel').addEventListener('click', () => {
dialogHelper.close(dlg); dialogHelper.close(dlg);
}); });
pathInfos = []; pathInfos = [];
renderPaths(dlg); renderPaths(dlg);
initLibraryOptions(dlg); initLibraryOptions(dlg);
}; });
xhr.send();
}); });
}; };
} }
}
var pathInfos = []; let pathInfos = [];
var currentResolve; let currentResolve;
var currentOptions; let currentOptions;
var hasChanges = false; let hasChanges = false;
var isCreating = false; let isCreating = false;
return editor;
}); /* eslint-enable indent */
export default editor;

137
src/components/mediaLibraryEditor/mediaLibraryEditor.js
View file

@ -1,5 +1,22 @@
define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionseditor/libraryoptionseditor', 'globalize', 'emby-button', 'listViewStyle', 'paper-icon-button-light', 'formDialogStyle', 'emby-toggle', 'flexStyles'], function (jQuery, loading, dialogHelper, dom, libraryoptionseditor, globalize) { /* eslint-disable indent */
'use strict';
/**
* Module for media library editor.
* @module components/mediaLibraryEditor/mediaLibraryEditor
*/
import jQuery from 'jQuery';
import loading from 'loading';
import dialogHelper from 'dialogHelper';
import dom from 'dom';
import libraryoptionseditor from 'components/libraryoptionseditor/libraryoptionseditor';
import globalize from 'globalize';
import 'emby-button';
import 'listViewStyle';
import 'paper-icon-button-light';
import 'formDialogStyle';
import 'emby-toggle';
import 'flexStyles';
function onEditLibrary() { function onEditLibrary() {
if (isCreating) { if (isCreating) {
@ -8,15 +25,15 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed
isCreating = true; isCreating = true;
loading.show(); loading.show();
var dlg = dom.parentWithClass(this, 'dlg-libraryeditor'); const dlg = dom.parentWithClass(this, 'dlg-libraryeditor');
var libraryOptions = libraryoptionseditor.getLibraryOptions(dlg.querySelector('.libraryOptions')); let libraryOptions = libraryoptionseditor.getLibraryOptions(dlg.querySelector('.libraryOptions'));
libraryOptions = Object.assign(currentOptions.library.LibraryOptions || {}, libraryOptions); libraryOptions = Object.assign(currentOptions.library.LibraryOptions || {}, libraryOptions);
ApiClient.updateVirtualFolderOptions(currentOptions.library.ItemId, libraryOptions).then(function () { ApiClient.updateVirtualFolderOptions(currentOptions.library.ItemId, libraryOptions).then(() => {
hasChanges = true; hasChanges = true;
isCreating = false; isCreating = false;
loading.hide(); loading.hide();
dialogHelper.close(dlg); dialogHelper.close(dlg);
}, function () { }, () => {
isCreating = false; isCreating = false;
loading.hide(); loading.hide();
}); });
@ -24,50 +41,50 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed
} }
function addMediaLocation(page, path, networkSharePath) { function addMediaLocation(page, path, networkSharePath) {
var virtualFolder = currentOptions.library; const virtualFolder = currentOptions.library;
var refreshAfterChange = currentOptions.refresh; const refreshAfterChange = currentOptions.refresh;
ApiClient.addMediaPath(virtualFolder.Name, path, networkSharePath, refreshAfterChange).then(function () { ApiClient.addMediaPath(virtualFolder.Name, path, networkSharePath, refreshAfterChange).then(() => {
hasChanges = true; hasChanges = true;
refreshLibraryFromServer(page); refreshLibraryFromServer(page);
}, function () { }, () => {
require(['toast'], function (toast) { import('toast').then(({default: toast}) => {
toast(globalize.translate('ErrorAddingMediaPathToVirtualFolder')); toast(globalize.translate('ErrorAddingMediaPathToVirtualFolder'));
}); });
}); });
} }
function updateMediaLocation(page, path, networkSharePath) { function updateMediaLocation(page, path, networkSharePath) {
var virtualFolder = currentOptions.library; const virtualFolder = currentOptions.library;
ApiClient.updateMediaPath(virtualFolder.Name, { ApiClient.updateMediaPath(virtualFolder.Name, {
Path: path, Path: path,
NetworkPath: networkSharePath NetworkPath: networkSharePath
}).then(function () { }).then(() => {
hasChanges = true; hasChanges = true;
refreshLibraryFromServer(page); refreshLibraryFromServer(page);
}, function () { }, () => {
require(['toast'], function (toast) { import('toast').then(({default: toast}) => {
toast(globalize.translate('ErrorAddingMediaPathToVirtualFolder')); toast(globalize.translate('ErrorAddingMediaPathToVirtualFolder'));
}); });
}); });
} }
function onRemoveClick(btnRemovePath, location) { function onRemoveClick(btnRemovePath, location) {
var button = btnRemovePath; const button = btnRemovePath;
var virtualFolder = currentOptions.library; const virtualFolder = currentOptions.library;
require(['confirm'], function (confirm) { import('confirm').then(({default: confirm}) => {
confirm({ confirm({
title: globalize.translate('HeaderRemoveMediaLocation'), title: globalize.translate('HeaderRemoveMediaLocation'),
text: globalize.translate('MessageConfirmRemoveMediaLocation'), text: globalize.translate('MessageConfirmRemoveMediaLocation'),
confirmText: globalize.translate('ButtonDelete'), confirmText: globalize.translate('ButtonDelete'),
primary: 'delete' primary: 'delete'
}).then(function () { }).then(() => {
var refreshAfterChange = currentOptions.refresh; const refreshAfterChange = currentOptions.refresh;
ApiClient.removeMediaPath(virtualFolder.Name, location, refreshAfterChange).then(function () { ApiClient.removeMediaPath(virtualFolder.Name, location, refreshAfterChange).then(() => {
hasChanges = true; hasChanges = true;
refreshLibraryFromServer(dom.parentWithClass(button, 'dlg-libraryeditor')); refreshLibraryFromServer(dom.parentWithClass(button, 'dlg-libraryeditor'));
}, function () { }, () => {
require(['toast'], function (toast) { import('toast').then(({default: toast}) => {
toast(globalize.translate('DefaultErrorMessage')); toast(globalize.translate('DefaultErrorMessage'));
}); });
}); });
@ -76,14 +93,14 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed
} }
function onListItemClick(e) { function onListItemClick(e) {
var listItem = dom.parentWithClass(e.target, 'listItem'); const listItem = dom.parentWithClass(e.target, 'listItem');
if (listItem) { if (listItem) {
var index = parseInt(listItem.getAttribute('data-index')); const index = parseInt(listItem.getAttribute('data-index'));
var pathInfos = (currentOptions.library.LibraryOptions || {}).PathInfos || []; const pathInfos = (currentOptions.library.LibraryOptions || {}).PathInfos || [];
var pathInfo = null == index ? {} : pathInfos[index] || {}; const pathInfo = null == index ? {} : pathInfos[index] || {};
var originalPath = pathInfo.Path || (null == index ? null : currentOptions.library.Locations[index]); const originalPath = pathInfo.Path || (null == index ? null : currentOptions.library.Locations[index]);
var btnRemovePath = dom.parentWithClass(e.target, 'btnRemovePath'); const btnRemovePath = dom.parentWithClass(e.target, 'btnRemovePath');
if (btnRemovePath) { if (btnRemovePath) {
onRemoveClick(btnRemovePath, originalPath); onRemoveClick(btnRemovePath, originalPath);
@ -95,26 +112,26 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed
} }
function getFolderHtml(pathInfo, index) { function getFolderHtml(pathInfo, index) {
var html = ''; let html = '';
html += '<div class="listItem listItem-border lnkPath" data-index="' + index + '" style="padding-left:.5em;">'; html += `<div class="listItem listItem-border lnkPath" data-index="${index}" style="padding-left:.5em;">`;
html += '<div class="' + (pathInfo.NetworkPath ? 'listItemBody two-line' : 'listItemBody') + '">'; html += `<div class="${pathInfo.NetworkPath ? 'listItemBody two-line' : 'listItemBody'}">`;
html += '<h3 class="listItemBodyText">'; html += '<h3 class="listItemBodyText">';
html += pathInfo.Path; html += pathInfo.Path;
html += '</h3>'; html += '</h3>';
if (pathInfo.NetworkPath) { if (pathInfo.NetworkPath) {
html += '<div class="listItemBodyText secondary">' + pathInfo.NetworkPath + '</div>'; html += `<div class="listItemBodyText secondary">${pathInfo.NetworkPath}</div>`;
} }
html += '</div>'; html += '</div>';
html += '<button type="button" is="paper-icon-button-light" class="listItemButton btnRemovePath" data-index="' + index + '"><span class="material-icons remove_circle"></span></button>'; html += `<button type="button" is="paper-icon-button-light" class="listItemButton btnRemovePath" data-index="${index}"><span class="material-icons remove_circle"></span></button>`;
html += '</div>'; html += '</div>';
return html; return html;
} }
function refreshLibraryFromServer(page) { function refreshLibraryFromServer(page) {
ApiClient.getVirtualFolders().then(function (result) { ApiClient.getVirtualFolders().then(result => {
var library = result.filter(function (f) { const library = result.filter(f => {
return f.Name === currentOptions.library.Name; return f.Name === currentOptions.library.Name;
})[0]; })[0];
@ -126,10 +143,10 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed
} }
function renderLibrary(page, options) { function renderLibrary(page, options) {
var pathInfos = (options.library.LibraryOptions || {}).PathInfos || []; let pathInfos = (options.library.LibraryOptions || {}).PathInfos || [];
if (!pathInfos.length) { if (!pathInfos.length) {
pathInfos = options.library.Locations.map(function (p) { pathInfos = options.library.Locations.map(p => {
return { return {
Path: p Path: p
}; };
@ -150,8 +167,8 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed
} }
function showDirectoryBrowser(context, originalPath, networkPath) { function showDirectoryBrowser(context, originalPath, networkPath) {
require(['directorybrowser'], function (directoryBrowser) { import('directorybrowser').then(({default: directoryBrowser}) => {
var picker = new directoryBrowser(); const picker = new directoryBrowser();
picker.show({ picker.show({
enableNetworkSharePath: true, enableNetworkSharePath: true,
pathReadOnly: null != originalPath, pathReadOnly: null != originalPath,
@ -173,7 +190,7 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed
} }
function onToggleAdvancedChange() { function onToggleAdvancedChange() {
var dlg = dom.parentWithClass(this, 'dlg-libraryeditor'); const dlg = dom.parentWithClass(this, 'dlg-libraryeditor');
libraryoptionseditor.setAdvancedVisible(dlg.querySelector('.libraryOptions'), this.checked); libraryoptionseditor.setAdvancedVisible(dlg.querySelector('.libraryOptions'), this.checked);
} }
@ -183,7 +200,7 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed
dlg.querySelector('.folderList').addEventListener('click', onListItemClick); dlg.querySelector('.folderList').addEventListener('click', onListItemClick);
dlg.querySelector('.chkAdvanced').addEventListener('change', onToggleAdvancedChange); dlg.querySelector('.chkAdvanced').addEventListener('change', onToggleAdvancedChange);
dlg.querySelector('.btnSubmit').addEventListener('click', onEditLibrary); dlg.querySelector('.btnSubmit').addEventListener('click', onEditLibrary);
libraryoptionseditor.embed(dlg.querySelector('.libraryOptions'), options.library.CollectionType, options.library.LibraryOptions).then(function () { libraryoptionseditor.embed(dlg.querySelector('.libraryOptions'), options.library.CollectionType, options.library.LibraryOptions).then(() => {
onToggleAdvancedChange.call(dlg.querySelector('.chkAdvanced')); onToggleAdvancedChange.call(dlg.querySelector('.chkAdvanced'));
}); });
} }
@ -192,18 +209,16 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed
currentDeferred.resolveWith(null, [hasChanges]); currentDeferred.resolveWith(null, [hasChanges]);
} }
function editor() { export class editor {
this.show = function (options) { constructor() {
var deferred = jQuery.Deferred(); this.show = options => {
const deferred = jQuery.Deferred();
currentOptions = options; currentOptions = options;
currentDeferred = deferred; currentDeferred = deferred;
hasChanges = false; hasChanges = false;
var xhr = new XMLHttpRequest(); // TODO: remove require
xhr.open('GET', 'components/mediaLibraryEditor/mediaLibraryEditor.template.html', true); require(['text!./components/mediaLibraryEditor/mediaLibraryEditor.template.html'], template => {
const dlg = dialogHelper.createDialog({
xhr.onload = function (e) {
var template = this.response;
var dlg = dialogHelper.createDialog({
size: 'small', size: 'small',
modal: false, modal: false,
removeOnClose: true, removeOnClose: true,
@ -218,20 +233,20 @@ define(['jQuery', 'loading', 'dialogHelper', 'dom', 'components/libraryoptionsed
initEditor(dlg, options); initEditor(dlg, options);
dlg.addEventListener('close', onDialogClosed); dlg.addEventListener('close', onDialogClosed);
dialogHelper.open(dlg); dialogHelper.open(dlg);
dlg.querySelector('.btnCancel').addEventListener('click', function () { dlg.querySelector('.btnCancel').addEventListener('click', () => {
dialogHelper.close(dlg); dialogHelper.close(dlg);
}); });
refreshLibraryFromServer(dlg); refreshLibraryFromServer(dlg);
}; });
xhr.send();
return deferred.promise(); return deferred.promise();
}; };
} }
}
var currentDeferred; let currentDeferred;
var currentOptions; let currentOptions;
var hasChanges = false; let hasChanges = false;
var isCreating = false; let isCreating = false;
return editor;
}); /* eslint-enable indent */
export default editor;

4
src/controllers/dashboard/mediaLibrary.js
View file

@ -3,7 +3,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl
function addVirtualFolder(page) { function addVirtualFolder(page) {
require(['medialibrarycreator'], function (medialibrarycreator) { require(['medialibrarycreator'], function (medialibrarycreator) {
new medialibrarycreator().show({ new medialibrarycreator.default().show({
collectionTypeOptions: getCollectionTypeOptions().filter(function (f) { collectionTypeOptions: getCollectionTypeOptions().filter(function (f) {
return !f.hidden; return !f.hidden;
}), }),
@ -18,7 +18,7 @@ define(['jQuery', 'apphost', 'scripts/taskbutton', 'loading', 'libraryMenu', 'gl
function editVirtualFolder(page, virtualFolder) { function editVirtualFolder(page, virtualFolder) {
require(['medialibraryeditor'], function (medialibraryeditor) { require(['medialibraryeditor'], function (medialibraryeditor) {
new medialibraryeditor().show({ new medialibraryeditor.default().show({
refresh: shouldRefreshLibraryAfterChanges(page), refresh: shouldRefreshLibraryAfterChanges(page),
library: virtualFolder library: virtualFolder
}).then(function (hasChanges) { }).then(function (hasChanges) {