mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
continue jquery removal
This commit is contained in:
Luke Pulverenti
parent
83975b7b12
commit
2d86f49653
2 changed files with 70 additions and 40 deletions
|
|
@ -1,8 +1,9 @@
|
|||
define(['dialogHelper', 'jQuery', 'emby-checkbox', 'emby-button', 'paper-icon-button-light'], function (dialogHelper, $) {
|
||||
define(['dialogHelper', 'emby-checkbox', 'emby-button', 'paper-icon-button-light'], function (dialogHelper) {
|
||||
|
||||
var currentItemId;
|
||||
var currentItemType;
|
||||
var currentDeferred;
|
||||
var currentResolve;
|
||||
var currentReject;
|
||||
var hasChanges = false;
|
||||
|
||||
// These images can be large and we're seeing memory problems in safari
|
||||
|
|
@ -30,7 +31,7 @@
|
|||
options.type = browsableImageType;
|
||||
options.startIndex = browsableImageStartIndex;
|
||||
options.limit = browsableImagePageSize;
|
||||
options.IncludeAllLanguages = $('#chkAllLanguages', page).checked();
|
||||
options.IncludeAllLanguages = page.querySelector('#chkAllLanguages').checked;
|
||||
|
||||
var provider = selectedProvider || '';
|
||||
|
||||
|
|
@ -42,13 +43,15 @@
|
|||
|
||||
renderRemoteImages(page, result, browsableImageType, options.startIndex, options.limit);
|
||||
|
||||
$('#selectBrowsableImageType', page).val(browsableImageType);
|
||||
page.querySelector('#selectBrowsableImageType').value = browsableImageType;
|
||||
|
||||
var providersHtml = result.Providers.map(function (p) {
|
||||
return '<option value="' + p + '">' + p + '</option>';
|
||||
});
|
||||
|
||||
$('#selectImageProvider', page).html('<option value="">' + Globalize.translate('LabelAll') + '</option>' + providersHtml).val(provider);
|
||||
var selectImageProvider = page.querySelector('#selectImageProvider');
|
||||
selectImageProvider.innerHTML = '<option value="">' + Globalize.translate('LabelAll') + '</option>' + providersHtml;
|
||||
selectImageProvider.value = provider;
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
|
|
@ -56,7 +59,8 @@
|
|||
}
|
||||
|
||||
function renderRemoteImages(page, imagesResult, imageType, startIndex, limit) {
|
||||
$('.availableImagesPaging', page).html(getPagingHtml(startIndex, limit, imagesResult.TotalRecordCount));
|
||||
|
||||
page.querySelector('.availableImagesPaging').innerHTML = getPagingHtml(startIndex, limit, imagesResult.TotalRecordCount);
|
||||
|
||||
var html = '';
|
||||
|
||||
|
|
@ -69,20 +73,22 @@
|
|||
availableImagesList.innerHTML = html;
|
||||
ImageLoader.lazyChildren(availableImagesList);
|
||||
|
||||
$('.btnNextPage', page).on('click', function () {
|
||||
browsableImageStartIndex += browsableImagePageSize;
|
||||
reloadBrowsableImages(page);
|
||||
});
|
||||
var btnNextPage = page.querySelector('.btnNextPage');
|
||||
var btnPreviousPage = page.querySelector('.btnPreviousPage');
|
||||
|
||||
$('.btnPreviousPage', page).on('click', function () {
|
||||
browsableImageStartIndex -= browsableImagePageSize;
|
||||
reloadBrowsableImages(page);
|
||||
});
|
||||
if (btnNextPage) {
|
||||
btnNextPage.addEventListener('click', function () {
|
||||
browsableImageStartIndex += browsableImagePageSize;
|
||||
reloadBrowsableImages(page);
|
||||
});
|
||||
}
|
||||
|
||||
$('.btnDownloadRemoteImage', page).on('click', function () {
|
||||
|
||||
downloadRemoteImage(page, this.getAttribute('data-imageurl'), this.getAttribute('data-imagetype'), this.getAttribute('data-imageprovider'));
|
||||
});
|
||||
if (btnPreviousPage) {
|
||||
btnPreviousPage.addEventListener('click', function () {
|
||||
browsableImageStartIndex -= browsableImagePageSize;
|
||||
reloadBrowsableImages(page);
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -117,6 +123,19 @@
|
|||
return html;
|
||||
}
|
||||
|
||||
function parentWithClass(elem, className) {
|
||||
|
||||
while (!elem.classList || !elem.classList.contains(className)) {
|
||||
elem = elem.parentNode;
|
||||
|
||||
if (!elem) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
return elem;
|
||||
}
|
||||
|
||||
function downloadRemoteImage(page, url, type, provider) {
|
||||
|
||||
var options = getBaseRemoteOptions();
|
||||
|
|
@ -130,7 +149,7 @@
|
|||
ApiClient.downloadRemoteImage(options).then(function () {
|
||||
|
||||
hasChanges = true;
|
||||
var dlg = $(page).parents('.dialog')[0];
|
||||
var dlg = parentWithClass(page, 'dialog');
|
||||
dialogHelper.close(dlg);
|
||||
});
|
||||
}
|
||||
|
|
@ -233,8 +252,8 @@
|
|||
|
||||
function initEditor(page) {
|
||||
|
||||
$('#selectBrowsableImageType', page).on('change', function () {
|
||||
|
||||
page.querySelector('#selectBrowsableImageType').addEventListener('change', function () {
|
||||
browsableImageType = this.value;
|
||||
browsableImageStartIndex = 0;
|
||||
selectedProvider = null;
|
||||
|
|
@ -242,7 +261,7 @@
|
|||
reloadBrowsableImages(page);
|
||||
});
|
||||
|
||||
$('#selectImageProvider', page).on('change', function () {
|
||||
page.querySelector('#selectImageProvider').addEventListener('change', function () {
|
||||
|
||||
browsableImageStartIndex = 0;
|
||||
selectedProvider = this.value;
|
||||
|
|
@ -250,12 +269,20 @@
|
|||
reloadBrowsableImages(page);
|
||||
});
|
||||
|
||||
$('#chkAllLanguages', page).on('change', function () {
|
||||
page.querySelector('#chkAllLanguages').addEventListener('change', function () {
|
||||
|
||||
browsableImageStartIndex = 0;
|
||||
|
||||
reloadBrowsableImages(page);
|
||||
});
|
||||
|
||||
page.addEventListener('click', function(e) {
|
||||
|
||||
var btnDownloadRemoteImage = parentWithClass(e.target, 'btnDownloadRemoteImage');
|
||||
if (btnDownloadRemoteImage) {
|
||||
downloadRemoteImage(page, btnDownloadRemoteImage.getAttribute('data-imageurl'), btnDownloadRemoteImage.getAttribute('data-imagetype'), btnDownloadRemoteImage.getAttribute('data-imageprovider'));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function showEditor(itemId, itemType) {
|
||||
|
|
@ -273,7 +300,8 @@
|
|||
|
||||
var dlg = dialogHelper.createDialog({
|
||||
size: 'fullscreen-border',
|
||||
lockScroll: true
|
||||
lockScroll: true,
|
||||
removeOnClose: true
|
||||
});
|
||||
|
||||
var theme = 'b';
|
||||
|
|
@ -296,14 +324,14 @@
|
|||
document.body.appendChild(dlg);
|
||||
|
||||
// Has to be assigned a z-index after the call to .open()
|
||||
$(dlg).on('close', onDialogClosed);
|
||||
dlg.addEventListener('close', onDialogClosed);
|
||||
|
||||
dialogHelper.open(dlg);
|
||||
|
||||
var editorContent = dlg.querySelector('.editorContent');
|
||||
initEditor(editorContent);
|
||||
|
||||
$('.btnCloseDialog', dlg).on('click', function () {
|
||||
dlg.querySelector('.btnCloseDialog').addEventListener('click', function () {
|
||||
|
||||
dialogHelper.close(dlg);
|
||||
});
|
||||
|
|
@ -316,24 +344,28 @@
|
|||
|
||||
function onDialogClosed() {
|
||||
|
||||
$(this).remove();
|
||||
Dashboard.hideLoadingMsg();
|
||||
currentDeferred.resolveWith(null, [hasChanges]);
|
||||
if (hasChanges) {
|
||||
currentResolve();
|
||||
} else {
|
||||
currentReject();
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
show: function (itemId, itemType, imageType) {
|
||||
|
||||
var deferred = jQuery.Deferred();
|
||||
return new Promise(function (resolve, reject) {
|
||||
|
||||
currentDeferred = deferred;
|
||||
hasChanges = false;
|
||||
browsableImageStartIndex = 0;
|
||||
browsableImageType = imageType || 'Primary';
|
||||
selectedProvider = null;
|
||||
currentResolve = resolve;
|
||||
currentReject = reject;
|
||||
hasChanges = false;
|
||||
browsableImageStartIndex = 0;
|
||||
browsableImageType = imageType || 'Primary';
|
||||
selectedProvider = null;
|
||||
|
||||
showEditor(itemId, itemType);
|
||||
return deferred.promise();
|
||||
showEditor(itemId, itemType);
|
||||
});
|
||||
}
|
||||
};
|
||||
});
|
||||
|
|
@ -206,12 +206,10 @@
|
|||
function showImageDownloader(page, imageType) {
|
||||
require(['components/imagedownloader/imagedownloader'], function (ImageDownloader) {
|
||||
|
||||
ImageDownloader.show(currentItem.Id, currentItem.Type, imageType).then(function (hasChanged) {
|
||||
ImageDownloader.show(currentItem.Id, currentItem.Type, imageType).then(function () {
|
||||
|
||||
if (hasChanged) {
|
||||
hasChanges = true;
|
||||
reload(page);
|
||||
}
|
||||
hasChanges = true;
|
||||
reload(page);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue