mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Merge pull request #1393 from jellyfin/repos
Initial work for repository configuration
This commit is contained in:
dkanada
GitHub
commit
d93911c407
15 changed files with 214 additions and 25 deletions
|
|
@ -123,6 +123,9 @@ define(['loading', 'libraryMenu', 'globalize', 'cardStyle', 'emby-button', 'emby
|
|||
}, {
|
||||
href: 'availableplugins.html',
|
||||
name: globalize.translate('TabCatalog')
|
||||
}, {
|
||||
href: 'repositories.html',
|
||||
name: globalize.translate('TabRepositories')
|
||||
}];
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -41,7 +41,7 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
|
|||
html += '<div class="cardBox visualCardBox">';
|
||||
html += '<div class="cardScalable">';
|
||||
html += '<div class="cardPadder cardPadder-backdrop"></div>';
|
||||
html += configPageUrl ? '<a class="cardContent cardImageContainer" is="emby-linkbutton" href="' + configPageUrl + '">' : '<div class="cardContent noConfigPluginCard noHoverEffect cardImageContainer">';
|
||||
html += configPageUrl ? '<a class="cardContent cardImageContainer" is="emby-linkbutton" href="' + configPageUrl + '">' : '<div class="cardContent noConfigPluginCard noHoverEffect cardImageContainer emby-button">';
|
||||
html += '<span class="cardImageIcon material-icons folder"></span>';
|
||||
html += configPageUrl ? '</a>' : '</div>';
|
||||
html += '</div>';
|
||||
|
|
@ -153,6 +153,9 @@ define(['loading', 'libraryMenu', 'dom', 'globalize', 'cardStyle', 'emby-button'
|
|||
}, {
|
||||
href: 'availableplugins.html',
|
||||
name: globalize.translate('TabCatalog')
|
||||
}, {
|
||||
href: 'repositories.html',
|
||||
name: globalize.translate('TabRepositories')
|
||||
}];
|
||||
}
|
||||
|
||||
|
|
|
|||
153
src/controllers/dashboard/plugins/repositories.js
Normal file
153
src/controllers/dashboard/plugins/repositories.js
Normal file
|
|
@ -0,0 +1,153 @@
|
|||
import loading from 'loading';
|
||||
import libraryMenu from 'libraryMenu';
|
||||
import globalize from 'globalize';
|
||||
import dialogHelper from 'dialogHelper';
|
||||
import 'emby-button';
|
||||
import 'emby-checkbox';
|
||||
import 'emby-select';
|
||||
import 'formDialogStyle';
|
||||
import 'listViewStyle';
|
||||
|
||||
let repositories = [];
|
||||
|
||||
function reloadList(page) {
|
||||
loading.show();
|
||||
ApiClient.getJSON(ApiClient.getUrl('Repositories')).then(list => {
|
||||
repositories = list;
|
||||
populateList({
|
||||
listElement: page.querySelector('#repositories'),
|
||||
noneElement: page.querySelector('#none'),
|
||||
repositories: repositories
|
||||
});
|
||||
}).catch(error => {
|
||||
console.error('error loading repositories');
|
||||
page.querySelector('#none').classList.remove('hide');
|
||||
loading.hide();
|
||||
});
|
||||
}
|
||||
|
||||
function saveList(page) {
|
||||
loading.show();
|
||||
ApiClient.ajax({
|
||||
type: 'POST',
|
||||
url: ApiClient.getUrl('Repositories'),
|
||||
data: JSON.stringify(repositories),
|
||||
contentType: 'application/json'
|
||||
}).then(response => {
|
||||
reloadList(page);
|
||||
}).catch(error => {
|
||||
console.error('error saving repositories');
|
||||
loading.hide();
|
||||
});
|
||||
}
|
||||
|
||||
function populateList(options) {
|
||||
var html = '';
|
||||
|
||||
html += '<div class="paperList">';
|
||||
for (var i = 0; i < options.repositories.length; i++) {
|
||||
html += getRepositoryHtml(options.repositories[i]);
|
||||
}
|
||||
|
||||
html += '</div>';
|
||||
if (!options.repositories.length) {
|
||||
options.noneElement.classList.remove('hide');
|
||||
}
|
||||
|
||||
options.listElement.innerHTML = html;
|
||||
loading.hide();
|
||||
}
|
||||
|
||||
function getRepositoryHtml(repository) {
|
||||
var html = '';
|
||||
|
||||
html += '<div class="listItem listItem-border">';
|
||||
html += `<a is="emby-linkbutton" style="margin:0;padding:0" class="clearLink listItemIconContainer" href="${repository.Url}">`;
|
||||
html += '<span class="material-icons listItemIcon open_in_new"></span>';
|
||||
html += '</a>';
|
||||
html += '<div class="listItemBody two-line">';
|
||||
html += `<h3 class="listItemBodyText">${repository.Name}</h3>`;
|
||||
html += `<div class="listItemBodyText secondary">${repository.Url}</div>`;
|
||||
html += '</div>';
|
||||
html += `<button type="button" is="paper-icon-button-light" id="${repository.Url}" class="btnDelete" title="${globalize.translate('ButtonDelete')}"><span class="material-icons delete"></span></button>`;
|
||||
html += '</div>';
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
function getTabs() {
|
||||
return [{
|
||||
href: 'installedplugins.html',
|
||||
name: globalize.translate('TabMyPlugins')
|
||||
}, {
|
||||
href: 'availableplugins.html',
|
||||
name: globalize.translate('TabCatalog')
|
||||
}, {
|
||||
href: 'repositories.html',
|
||||
name: globalize.translate('TabRepositories')
|
||||
}];
|
||||
}
|
||||
|
||||
export default function(view, params) {
|
||||
view.addEventListener('viewshow', function () {
|
||||
libraryMenu.setTabs('plugins', 2, getTabs);
|
||||
reloadList(this);
|
||||
|
||||
var save = this;
|
||||
$('#repositories', view).on('click', '.btnDelete', function() {
|
||||
var button = this;
|
||||
repositories = repositories.filter(function (r) {
|
||||
return r.Url !== button.id;
|
||||
});
|
||||
|
||||
saveList(save);
|
||||
});
|
||||
});
|
||||
|
||||
view.querySelector('.btnNewRepository').addEventListener('click', () => {
|
||||
let dialog = dialogHelper.createDialog({
|
||||
scrollY: false,
|
||||
size: 'large',
|
||||
modal: false,
|
||||
removeOnClose: true
|
||||
});
|
||||
|
||||
let html = '';
|
||||
|
||||
html += '<div class="formDialogHeader">';
|
||||
html += '<button type="button" is="paper-icon-button-light" class="btnCancel autoSize" tabindex="-1"><span class="material-icons arrow_back"></span></button>';
|
||||
html += `<h3 class="formDialogHeaderTitle">${globalize.translate('HeaderNewRepository')}</h3>`;
|
||||
html += '</div>';
|
||||
html += '<form class="newPluginForm" style="margin:4em">';
|
||||
html += '<div class="inputContainer">';
|
||||
html += `<input is="emby-input" id="txtRepositoryName" label="${globalize.translate('LabelRepositoryName')}" type="text" required />`;
|
||||
html += `<div class="fieldDescription">${globalize.translate('LabelRepositoryNameHelp')}</div>`;
|
||||
html += '</div>';
|
||||
html += '<div class="inputContainer">';
|
||||
html += `<input is="emby-input" id="txtRepositoryUrl" label="${globalize.translate('LabelRepositoryUrl')}" type="url" required />`;
|
||||
html += `<div class="fieldDescription">${globalize.translate('LabelRepositoryUrlHelp')}</div>`;
|
||||
html += '</div>';
|
||||
html += `<button is="emby-button" type="submit" class="raised button-submit block"><span>${globalize.translate('ButtonSave')}</span></button>`;
|
||||
html += '</div>';
|
||||
html += '</form>';
|
||||
|
||||
dialog.innerHTML = html;
|
||||
dialog.querySelector('.btnCancel').addEventListener('click', () => {
|
||||
dialogHelper.close(dialog);
|
||||
});
|
||||
|
||||
dialog.querySelector('.newPluginForm').addEventListener('submit', () => {
|
||||
repositories.push({
|
||||
Name: dialog.querySelector('#txtRepositoryName').value,
|
||||
Url: dialog.querySelector('#txtRepositoryUrl').value,
|
||||
Enabled: true
|
||||
});
|
||||
|
||||
saveList(view);
|
||||
dialogHelper.close(dialog);
|
||||
return false;
|
||||
});
|
||||
|
||||
dialogHelper.open(dialog);
|
||||
});
|
||||
}
|
||||
|
|
@ -400,6 +400,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
} else if (item.Album) {
|
||||
parentNameHtml.push(item.Album);
|
||||
}
|
||||
|
||||
// FIXME: This whole section needs some refactoring, so it becames easier to scale across all form factors. See GH #1022
|
||||
var html = '';
|
||||
var tvShowHtml = parentNameHtml[0];
|
||||
|
|
@ -415,9 +416,9 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
}
|
||||
} else {
|
||||
if (layoutManager.mobile) {
|
||||
html = '<h1 class="parentName" style="margin: .1em 0 .25em;">' + parentNameHtml.join('</br>') + '</h1>';
|
||||
html = '<h1 class="parentName" style="margin: 0.2em 0 0">' + parentNameHtml.join('</br>') + '</h1>';
|
||||
} else {
|
||||
html = '<h1 class="parentName" style="margin: .1em 0 .25em;">' + tvShowHtml + '</h1>';
|
||||
html = '<h1 class="parentName" style="margin: 0.2em 0 0">' + tvShowHtml + '</h1>';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -425,20 +426,19 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
var name = itemHelper.getDisplayName(item, {
|
||||
includeParentInfo: false
|
||||
});
|
||||
var offset = parentNameLast ? '.25em' : '.5em';
|
||||
|
||||
if (html && !parentNameLast) {
|
||||
if (!layoutManager.mobile && tvSeasonHtml) {
|
||||
html += '<h3 class="itemName infoText" style="margin: .25em 0 .5em;">' + tvSeasonHtml + ' - ' + name + '</h3>';
|
||||
html += '<h3 class="itemName infoText" style="margin: 0.2em 0 0">' + tvSeasonHtml + ' - ' + name + '</h3>';
|
||||
} else {
|
||||
html += '<h3 class="itemName infoText" style="margin: .25em 0 .5em;">' + name + '</h3>';
|
||||
html += '<h3 class="itemName infoText" style="margin: 0.2em 0 0">' + name + '</h3>';
|
||||
}
|
||||
} else {
|
||||
html = '<h1 class="itemName infoText" style="margin: .1em 0 ' + offset + ';">' + name + '</h1>' + html;
|
||||
html = '<h1 class="itemName infoText" style="margin: 0.4em 0 0">' + name + '</h1>' + html;
|
||||
}
|
||||
|
||||
if (item.OriginalTitle && item.OriginalTitle != item.Name) {
|
||||
html += '<h4 class="itemName infoText" style="margin: -' + offset + ' 0 0;">' + item.OriginalTitle + '</h4>';
|
||||
html += '<h4 class="itemName infoText" style="margin: 0 0 0;">' + item.OriginalTitle + '</h4>';
|
||||
}
|
||||
|
||||
container.innerHTML = html;
|
||||
|
|
@ -1106,10 +1106,10 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
var externalLinksElem = page.querySelector('.itemExternalLinks');
|
||||
|
||||
renderOverview([overview], item);
|
||||
|
||||
var i;
|
||||
var itemMiscInfo;
|
||||
itemMiscInfo = page.querySelectorAll('.itemMiscInfo-primary');
|
||||
|
||||
for (i = 0; i < itemMiscInfo.length; i++) {
|
||||
mediaInfo.fillPrimaryMediaInfo(itemMiscInfo[i], item, {
|
||||
interactive: true,
|
||||
|
|
@ -1125,7 +1125,6 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
|
|||
}
|
||||
|
||||
itemMiscInfo = page.querySelectorAll('.itemMiscInfo-secondary');
|
||||
|
||||
for (i = 0; i < itemMiscInfo.length; i++) {
|
||||
mediaInfo.fillSecondaryMediaInfo(itemMiscInfo[i], item, {
|
||||
interactive: true
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue