mirror of
https://github.com/jellyfin/jellyfin-web.git
synced 2024-11-18 03:18:19 -07:00
restore library editor
This commit is contained in:
Luke Pulverenti
parent
99d3154872
commit
55172c0a19
191
dashboard-ui/components/medialibraryeditor/medialibraryeditor.js
Normal file
191
dashboard-ui/components/medialibraryeditor/medialibraryeditor.js
Normal file
@ -0,0 +1,191 @@
|
||||
define([], function () {
|
||||
|
||||
var currentDeferred;
|
||||
var hasChanges;
|
||||
var currentOptions;
|
||||
|
||||
function addMediaLocation(page, path) {
|
||||
|
||||
var virtualFolder = currentOptions.library;
|
||||
|
||||
var refreshAfterChange = currentOptions.refresh;
|
||||
|
||||
ApiClient.addMediaPath(virtualFolder.Name, path, refreshAfterChange).done(function () {
|
||||
|
||||
refreshLibraryFromServer(page);
|
||||
|
||||
}).fail(function () {
|
||||
|
||||
Dashboard.showError(Globalize.translate('DefaultErrorMessage'));
|
||||
})
|
||||
}
|
||||
|
||||
function onRemoveClick() {
|
||||
|
||||
var button = this;
|
||||
var index = parseInt(button.getAttribute('data-index'));
|
||||
|
||||
var virtualFolder = currentOptions.library;
|
||||
|
||||
var location = virtualFolder.Locations[index];
|
||||
|
||||
Dashboard.confirm(Globalize.translate('MessageConfirmRemoveMediaLocation'), Globalize.translate('HeaderRemoveMediaLocation'), function (confirmResult) {
|
||||
|
||||
if (confirmResult) {
|
||||
|
||||
var refreshAfterChange = currentOptions.refresh;
|
||||
|
||||
ApiClient.removeMediaPath(virtualFolder.Name, location, refreshAfterChange).done(function () {
|
||||
|
||||
refreshLibraryFromServer($(button).parents('.editorContent')[0]);
|
||||
|
||||
}).fail(function () {
|
||||
|
||||
Dashboard.showError(Globalize.translate('DefaultErrorMessage'));
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function getFolderHtml(path, index) {
|
||||
|
||||
var html = '';
|
||||
|
||||
html += '<paper-icon-item role="menuitem" class="lnkPath">';
|
||||
|
||||
html += '<paper-fab class="listAvatar" style="background:#52B54B;" icon="folder" item-icon></paper-fab>';
|
||||
|
||||
html += '<paper-item-body>';
|
||||
html += path;
|
||||
html += '</paper-item-body>';
|
||||
|
||||
html += '<paper-icon-button icon="remove" class="btnRemovePath" data-index="' + index + '"></paper-icon-button>';
|
||||
|
||||
html += '</paper-icon-item>';
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
function refreshLibraryFromServer(page) {
|
||||
|
||||
ApiClient.getVirtualFolders().done(function (result) {
|
||||
|
||||
var library = result.filter(function (f) {
|
||||
|
||||
return f.Name == currentOptions.library.Name;
|
||||
|
||||
})[0];
|
||||
|
||||
if (library) {
|
||||
currentOptions.library = library;
|
||||
renderLibrary(page, currentOptions);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function renderLibrary(page, options) {
|
||||
var foldersHtml = options.library.Locations.map(getFolderHtml).join('');
|
||||
|
||||
page.querySelector('.folderList').innerHTML = foldersHtml;
|
||||
|
||||
$(page.querySelectorAll('.btnRemovePath')).on('click', onRemoveClick);
|
||||
}
|
||||
|
||||
function onAddButtonClick() {
|
||||
|
||||
var page = $(this).parents('.editorContent')[0];
|
||||
|
||||
require(['directorybrowser'], function (directoryBrowser) {
|
||||
|
||||
var picker = new directoryBrowser();
|
||||
|
||||
picker.show({
|
||||
|
||||
callback: function (path) {
|
||||
|
||||
if (path) {
|
||||
addMediaLocation(page, path);
|
||||
}
|
||||
picker.close();
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function initEditor(page, options) {
|
||||
renderLibrary(page, options);
|
||||
|
||||
$('.btnAddFolder', page).on('click', onAddButtonClick);
|
||||
}
|
||||
|
||||
function onDialogClosed() {
|
||||
|
||||
$(this).remove();
|
||||
Dashboard.hideLoadingMsg();
|
||||
currentDeferred.resolveWith(null, [hasChanges]);
|
||||
}
|
||||
|
||||
function editor() {
|
||||
|
||||
var self = this;
|
||||
|
||||
self.show = function (options) {
|
||||
|
||||
var deferred = DeferredBuilder.Deferred();
|
||||
|
||||
currentOptions = options;
|
||||
currentDeferred = deferred;
|
||||
hasChanges = false;
|
||||
|
||||
require(['components/paperdialoghelper'], function () {
|
||||
|
||||
HttpClient.send({
|
||||
|
||||
type: 'GET',
|
||||
url: 'components/medialibraryeditor/medialibraryeditor.template.html'
|
||||
|
||||
}).done(function (template) {
|
||||
|
||||
var dlg = PaperDialogHelper.createDialog({
|
||||
size: 'small',
|
||||
theme: 'a'
|
||||
});
|
||||
|
||||
var html = '';
|
||||
html += '<h2 class="dialogHeader">';
|
||||
html += '<paper-fab icon="arrow-back" class="mini btnCloseDialog"></paper-fab>';
|
||||
|
||||
html += '<div style="display:inline-block;margin-left:.6em;vertical-align:middle;">' + options.library.Name + '</div>';
|
||||
html += '</h2>';
|
||||
|
||||
html += '<div class="editorContent" style="max-width:800px;margin:auto;">';
|
||||
html += Globalize.translateDocument(template);
|
||||
html += '</div>';
|
||||
|
||||
dlg.innerHTML = html;
|
||||
document.body.appendChild(dlg);
|
||||
|
||||
var editorContent = dlg.querySelector('.editorContent');
|
||||
initEditor(editorContent, options);
|
||||
|
||||
$(dlg).on('iron-overlay-closed', onDialogClosed);
|
||||
|
||||
PaperDialogHelper.openWithHash(dlg, 'medialibraryeditor');
|
||||
|
||||
$('.btnCloseDialog', dlg).on('click', function () {
|
||||
|
||||
PaperDialogHelper.close(dlg);
|
||||
});
|
||||
|
||||
refreshLibraryFromServer(editorContent);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
return deferred.promise();
|
||||
};
|
||||
}
|
||||
|
||||
return editor;
|
||||
});
|
||||
@ -0,0 +1,8 @@
|
||||
<div>
|
||||
<h1 style="display:inline-block;vertical-align:middle;">${HeadersFolders}</h1>
|
||||
<paper-button raised class="btnAddFolder submit mini" style="margin-left:1em;" title="${ButtonAdd}">
|
||||
<iron-icon icon="add"></iron-icon>
|
||||
<span>${ButtonAdd}</span>
|
||||
</paper-button>
|
||||
</div>
|
||||
<div class="paperList folderList" style="padding:.7em 0;"></div>
|
||||
@ -1,63 +1,4 @@
|
||||
var MediaLibraryPage = {
|
||||
|
||||
addMediaLocation: function (virtualFolderIndex) {
|
||||
|
||||
MediaLibraryPage.selectDirectory(function (path) {
|
||||
|
||||
if (path) {
|
||||
|
||||
var virtualFolder = MediaLibraryPage.virtualFolders[virtualFolderIndex];
|
||||
|
||||
MediaLibraryPage.lastVirtualFolderName = virtualFolder.Name;
|
||||
|
||||
var refreshAfterChange = shouldRefreshLibraryAfterChanges();
|
||||
|
||||
ApiClient.addMediaPath(virtualFolder.Name, path, refreshAfterChange).done(MediaLibraryPage.processOperationResult);
|
||||
}
|
||||
|
||||
});
|
||||
},
|
||||
|
||||
selectDirectory: function (callback) {
|
||||
|
||||
require(['directorybrowser'], function (directoryBrowser) {
|
||||
|
||||
var picker = new directoryBrowser();
|
||||
|
||||
picker.show({
|
||||
|
||||
callback: callback
|
||||
});
|
||||
|
||||
MediaLibraryPage.directoryPicker = picker;
|
||||
});
|
||||
},
|
||||
|
||||
deleteMediaLocation: function (button) {
|
||||
|
||||
var folderIndex = button.getAttribute('data-folderindex');
|
||||
var index = parseInt(button.getAttribute('data-index'));
|
||||
|
||||
var virtualFolder = MediaLibraryPage.virtualFolders[folderIndex];
|
||||
|
||||
MediaLibraryPage.lastVirtualFolderName = virtualFolder.Name;
|
||||
|
||||
var location = virtualFolder.Locations[index];
|
||||
|
||||
Dashboard.confirm(Globalize.translate('MessageConfirmRemoveMediaLocation'), Globalize.translate('HeaderRemoveMediaLocation'), function (confirmResult) {
|
||||
|
||||
if (confirmResult) {
|
||||
|
||||
var refreshAfterChange = shouldRefreshLibraryAfterChanges();
|
||||
|
||||
ApiClient.removeMediaPath(virtualFolder.Name, location, refreshAfterChange).done(MediaLibraryPage.processOperationResult);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
(function () {
|
||||
(function () {
|
||||
|
||||
function changeCollectionType(page, virtualFolder) {
|
||||
|
||||
@ -92,6 +33,24 @@
|
||||
});
|
||||
}
|
||||
|
||||
function editVirtualFolder(page, virtualFolder) {
|
||||
|
||||
require(['medialibraryeditor'], function (medialibraryeditor) {
|
||||
|
||||
new medialibraryeditor().show({
|
||||
|
||||
refresh: shouldRefreshLibraryAfterChanges(),
|
||||
library: virtualFolder
|
||||
|
||||
}).done(function (hasChanges) {
|
||||
|
||||
if (hasChanges) {
|
||||
reloadLibrary(page);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function deleteVirtualFolder(page, virtualFolder) {
|
||||
|
||||
var msg = Globalize.translate('MessageAreYouSureYouWishToRemoveMediaFolder');
|
||||
@ -233,6 +192,13 @@
|
||||
addVirtualFolder(page);
|
||||
});
|
||||
|
||||
$('.editLibrary', divVirtualFolders).on('click', function () {
|
||||
var card = $(this).parents('.card')[0];
|
||||
var index = parseInt(card.getAttribute('data-index'));
|
||||
var virtualFolder = virtualFolders[index];
|
||||
editVirtualFolder(page, virtualFolder);
|
||||
});
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
}
|
||||
|
||||
@ -290,7 +256,13 @@
|
||||
|
||||
var html = '';
|
||||
|
||||
html += '<div class="card backdropCard" data-index="' + index + '">';
|
||||
var style = "";
|
||||
|
||||
if ($($.mobile.activePage)[0].classList.contains('wizardPage')) {
|
||||
style += "min-width:33.3%;";
|
||||
}
|
||||
|
||||
html += '<div class="card backdropCard" style="' + style + '" data-index="' + index + '">';
|
||||
|
||||
html += '<div class="cardBox visualCardBox">';
|
||||
html += '<div class="cardScalable">';
|
||||
@ -307,9 +279,9 @@
|
||||
}
|
||||
|
||||
if (imgUrl) {
|
||||
html += '<div class="cardImage" style="background-image:url(\'' + imgUrl + '\');"></div>';
|
||||
html += '<div class="cardImage editLibrary" style="cursor:pointer;background-image:url(\'' + imgUrl + '\');"></div>';
|
||||
} else if (!virtualFolder.showNameWithIcon) {
|
||||
html += '<div class="cardImage iconCardImage">';
|
||||
html += '<div class="cardImage editLibrary iconCardImage" style="cursor:pointer;">';
|
||||
html += '<div>';
|
||||
html += '<iron-icon icon="' + (virtualFolder.icon || getIcon(virtualFolder.CollectionType)) + '"></iron-icon>';
|
||||
html += "</div>";
|
||||
|
||||
@ -2063,6 +2063,7 @@ var AppInfo = {};
|
||||
collectioneditor: 'components/collectioneditor/collectioneditor',
|
||||
playlisteditor: 'components/playlisteditor/playlisteditor',
|
||||
medialibrarycreator: 'components/medialibrarycreator/medialibrarycreator',
|
||||
medialibraryeditor: 'components/medialibraryeditor/medialibraryeditor',
|
||||
howler: 'bower_components/howler.js/howler.min',
|
||||
dragula: 'bower_components/dragula.js/dist/dragula.min'
|
||||
};
|
||||
|
||||
@ -1523,5 +1523,6 @@
|
||||
"ButtonClear": "Clear",
|
||||
"ButtonEditImages": "Edit Images",
|
||||
"LabelFolder": "Folder:",
|
||||
"LabelAdditionalFoldersCanBeAddedHelp": "Additional folders can be added to this library after setting it up."
|
||||
"LabelAdditionalFoldersCanBeAddedHelp": "Additional folders can be added to this library after setting it up.",
|
||||
"HeadersFolders": "Folders"
|
||||
}
|
||||
@ -1539,5 +1539,6 @@
|
||||
"ButtonClear": "Clear",
|
||||
"ButtonEditImages": "Edit Images",
|
||||
"LabelFolder": "Folder:",
|
||||
"LabelAdditionalFoldersCanBeAddedHelp": "Additional folders can be added to this library after setting it up."
|
||||
"LabelAdditionalFoldersCanBeAddedHelp": "Additional folders can be added to this library after setting it up.",
|
||||
"HeadersFolders": "Folders"
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user