mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
fix some broken and unused elements on the plugin pages
This commit is contained in:
dkanada
parent
3b0b5228fe
commit
e4590b4898
7 changed files with 38 additions and 86 deletions
|
|
@ -3,7 +3,7 @@ define(["loading", "libraryMenu", "globalize", "cardStyle", "emby-button", "emby
|
|||
|
||||
function reloadList(page) {
|
||||
loading.show();
|
||||
var promise1 = ApiClient.getAvailablePlugins(query);
|
||||
var promise1 = ApiClient.getAvailablePlugins();
|
||||
var promise2 = ApiClient.getInstalledPlugins();
|
||||
Promise.all([promise1, promise2]).then(function (responses) {
|
||||
populateList({
|
||||
|
|
@ -33,19 +33,15 @@ define(["loading", "libraryMenu", "globalize", "cardStyle", "emby-button", "emby
|
|||
function populateList(options) {
|
||||
var availablePlugins = options.availablePlugins;
|
||||
var installedPlugins = options.installedPlugins;
|
||||
var allPlugins = availablePlugins.filter(function (plugin) {
|
||||
plugin.category = plugin.category || "General";
|
||||
plugin.categoryDisplayName = getHeaderText(plugin.category);
|
||||
|
||||
if (!options.categories || -1 != options.categories.indexOf(plugin.category)) {
|
||||
if (!options.targetSystem || plugin.targetSystem == options.targetSystem) {
|
||||
return "UserInstalled" == plugin.type;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
var categories = [];
|
||||
availablePlugins.forEach(function (plugin, index, array) {
|
||||
plugin.category = plugin.category || 'General';
|
||||
plugin.categoryDisplayName = getHeaderText(plugin.category);
|
||||
array[index] = plugin;
|
||||
});
|
||||
|
||||
availablePlugins = allPlugins.sort(function (a, b) {
|
||||
availablePlugins.sort(function (a, b) {
|
||||
if (a.category > b.category) {
|
||||
return 1;
|
||||
} else if (b.category > a.category) {
|
||||
|
|
@ -59,45 +55,29 @@ define(["loading", "libraryMenu", "globalize", "cardStyle", "emby-button", "emby
|
|||
return 0;
|
||||
});
|
||||
|
||||
var length;
|
||||
var plugin;
|
||||
var currentCategory;
|
||||
var currentCategory = null;
|
||||
var html = "";
|
||||
|
||||
var hasOpenTag = false;
|
||||
currentCategory = null;
|
||||
if (options.showCategory === false) {
|
||||
html += '<div class="itemsContainer vertical-wrap">';
|
||||
hasOpenTag = true;
|
||||
}
|
||||
for (var i = 0; i < availablePlugins.length; i++) {
|
||||
plugin = availablePlugins[i];
|
||||
var plugin = availablePlugins[i];
|
||||
var category = plugin.categoryDisplayName;
|
||||
|
||||
if (category != currentCategory) {
|
||||
if (false !== options.showCategory) {
|
||||
if (currentCategory) {
|
||||
hasOpenTag = false;
|
||||
html += "</div>";
|
||||
html += "</div>";
|
||||
}
|
||||
html += '<div class="verticalSection">';
|
||||
html += '<h2 class="sectionTitle sectionTitle-cards">' + category + "</h2>";
|
||||
html += '<div class="itemsContainer vertical-wrap">';
|
||||
hasOpenTag = true;
|
||||
if (currentCategory) {
|
||||
html += "</div>";
|
||||
html += "</div>";
|
||||
}
|
||||
html += '<div class="verticalSection">';
|
||||
html += '<h2 class="sectionTitle sectionTitle-cards">' + category + "</h2>";
|
||||
html += '<div class="itemsContainer vertical-wrap">';
|
||||
currentCategory = category;
|
||||
}
|
||||
html += getPluginHtml(plugin, options, installedPlugins);
|
||||
}
|
||||
|
||||
if (hasOpenTag) {
|
||||
html += "</div>";
|
||||
html += "</div>";
|
||||
}
|
||||
html += "</div>";
|
||||
html += "</div>";
|
||||
|
||||
if (!availablePlugins.length && options.noItemsElement) {
|
||||
options.noItemsElement.classList.add("hide");
|
||||
options.noItemsElement.classList.remove("hide");
|
||||
}
|
||||
|
||||
options.catalogElement.innerHTML = html;
|
||||
|
|
@ -145,29 +125,19 @@ define(["loading", "libraryMenu", "globalize", "cardStyle", "emby-button", "emby
|
|||
|
||||
function getTabs() {
|
||||
return [{
|
||||
href: "plugins.html",
|
||||
href: "installedplugins.html",
|
||||
name: globalize.translate("TabMyPlugins")
|
||||
}, {
|
||||
href: "plugincatalog.html",
|
||||
href: "availableplugins.html",
|
||||
name: globalize.translate("TabCatalog")
|
||||
}];
|
||||
}
|
||||
|
||||
var query = {
|
||||
TargetSystems: "Server",
|
||||
IsAppStoreSafe: true,
|
||||
IsAdult: false
|
||||
};
|
||||
|
||||
window.PluginCatalog = {
|
||||
renderCatalog: populateList
|
||||
};
|
||||
|
||||
return function (view, params) {
|
||||
view.querySelector("#selectSystem").addEventListener("change", function () {
|
||||
query.TargetSystems = this.value;
|
||||
reloadList(view);
|
||||
});
|
||||
view.addEventListener("viewshow", function () {
|
||||
libraryMenu.setTabs("plugins", 1, getTabs);
|
||||
reloadList(this);
|
||||
171
src/controllers/installedplugins.js
Normal file
171
src/controllers/installedplugins.js
Normal file
|
|
@ -0,0 +1,171 @@
|
|||
define(["loading", "libraryMenu", "dom", "globalize", "cardStyle", "emby-button"], function(loading, libraryMenu, dom, globalize) {
|
||||
"use strict";
|
||||
|
||||
function deletePlugin(page, uniqueid, name) {
|
||||
var msg = globalize.translate("UninstallPluginConfirmation").replace("{0}", name);
|
||||
require(["confirm"], function(confirm) {
|
||||
confirm({
|
||||
title: globalize.translate("UninstallPluginHeader"),
|
||||
text: msg,
|
||||
primary: "cancel",
|
||||
confirmText: globalize.translate("UninstallPluginHeader")
|
||||
}).then(function() {
|
||||
loading.show();
|
||||
ApiClient.uninstallPlugin(uniqueid).then(function() {
|
||||
reloadList(page);
|
||||
});
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
function showNoConfigurationMessage() {
|
||||
Dashboard.alert({
|
||||
message: globalize.translate("NoPluginConfigurationMessage")
|
||||
});
|
||||
}
|
||||
|
||||
function showConnectMessage() {
|
||||
Dashboard.alert({
|
||||
message: globalize.translate("MessagePluginConfigurationRequiresLocalAccess")
|
||||
});
|
||||
}
|
||||
|
||||
function getPluginCardHtml(plugin, pluginConfigurationPages) {
|
||||
var configPage = pluginConfigurationPages.filter(function(pluginConfigurationPage) {
|
||||
return pluginConfigurationPage.PluginId == plugin.Id;
|
||||
})[0];
|
||||
var configPageUrl = configPage ? Dashboard.getConfigurationPageUrl(configPage.Name) : null;
|
||||
|
||||
var html = "";
|
||||
html += "<div data-id='" + plugin.Id + "' data-name='" + plugin.Name + "' class='card backdropCard'>";
|
||||
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">';
|
||||
if (plugin.ImageUrl) {
|
||||
html += '<div class="cardImage coveredImage" style="background-image:url(\'' + plugin.ImageUrl + "');\">";
|
||||
html += "</div>";
|
||||
} else {
|
||||
html += '<i class="cardImageIcon md-icon"></i>';
|
||||
}
|
||||
html += configPageUrl ? "</a>" : "</div>";
|
||||
html += "</div>";
|
||||
html += '<div class="cardFooter">';
|
||||
html += '<div style="text-align:right; float:right;padding-top:5px;">';
|
||||
html += '<button type="button" is="paper-icon-button-light" class="btnCardMenu autoSize"><i class="md-icon">more_horiz</i></button>';
|
||||
html += "</div>";
|
||||
html += "<div class='cardText'>";
|
||||
html += configPage ? configPage.DisplayName || plugin.Name : plugin.Name;
|
||||
html += "</div>";
|
||||
html += "<div class='cardText cardText-secondary'>";
|
||||
html += plugin.Version;
|
||||
html += "</div>";
|
||||
html += "</div>";
|
||||
html += "</div>";
|
||||
html += "</div>";
|
||||
return html;
|
||||
}
|
||||
|
||||
function renderPlugins(page, plugins) {
|
||||
ApiClient.getJSON(ApiClient.getUrl("web/configurationpages") + "?pageType=PluginConfiguration").then(function(configPages) {
|
||||
populateList(page, plugins, configPages);
|
||||
});
|
||||
}
|
||||
|
||||
function populateList(page, plugins, pluginConfigurationPages) {
|
||||
plugins = plugins.sort(function(plugin1, plugin2) {
|
||||
return plugin1.Name > plugin2.Name ? 1 : -1
|
||||
});
|
||||
var html = plugins.map(function(p) {
|
||||
return getPluginCardHtml(p, pluginConfigurationPages)
|
||||
}).join("");
|
||||
var installedPluginsElement = page.querySelector(".installedPlugins");
|
||||
installedPluginsElement.removeEventListener("click", onInstalledPluginsClick);
|
||||
installedPluginsElement.addEventListener("click", onInstalledPluginsClick);
|
||||
if (plugins.length) {
|
||||
installedPluginsElement.classList.add("itemsContainer");
|
||||
installedPluginsElement.classList.add("vertical-wrap");
|
||||
} else {
|
||||
html += '<div style="padding:5px;">';
|
||||
html += "<p>" + globalize.translate("MessageNoPluginsInstalled") + "</p>";
|
||||
html += '<p><a is="emby-linkbutton" class="button-link" href="availableplugins.html">';
|
||||
html += globalize.translate("BrowsePluginCatalogMessage");
|
||||
html += "</a></p>";
|
||||
html += "</div>";
|
||||
}
|
||||
installedPluginsElement.innerHTML = html;
|
||||
loading.hide();
|
||||
}
|
||||
|
||||
function showPluginMenu(page, elem) {
|
||||
var card = dom.parentWithClass(elem, "card");
|
||||
var id = card.getAttribute("data-id");
|
||||
var name = card.getAttribute("data-name");
|
||||
var configHref = card.querySelector(".cardContent").getAttribute("href");
|
||||
var menuItems = [];
|
||||
if (configHref) {
|
||||
menuItems.push({
|
||||
name: globalize.translate("ButtonSettings"),
|
||||
id: "open",
|
||||
ironIcon: "mode-edit"
|
||||
});
|
||||
}
|
||||
menuItems.push({
|
||||
name: globalize.translate("ButtonUninstall"),
|
||||
id: "delete",
|
||||
ironIcon: "delete"
|
||||
});
|
||||
require(["actionsheet"], function(actionsheet) {
|
||||
actionsheet.show({
|
||||
items: menuItems,
|
||||
positionTo: elem,
|
||||
callback: function(resultId) {
|
||||
switch (resultId) {
|
||||
case "open":
|
||||
Dashboard.navigate(configHref);
|
||||
break;
|
||||
case "delete":
|
||||
deletePlugin(page, id, name)
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function reloadList(page) {
|
||||
loading.show();
|
||||
ApiClient.getInstalledPlugins().then(function(plugins) {
|
||||
renderPlugins(page, plugins);
|
||||
});
|
||||
}
|
||||
|
||||
function getTabs() {
|
||||
return [{
|
||||
href: "installedplugins.html",
|
||||
name: globalize.translate("TabMyPlugins")
|
||||
}, {
|
||||
href: "availableplugins.html",
|
||||
name: globalize.translate("TabCatalog")
|
||||
}]
|
||||
}
|
||||
|
||||
function onInstalledPluginsClick(e) {
|
||||
if (dom.parentWithClass(e.target, "noConfigPluginCard")) {
|
||||
showNoConfigurationMessage();
|
||||
} else if (dom.parentWithClass(e.target, "connectModePluginCard")) {
|
||||
showConnectMessage();
|
||||
} else {
|
||||
var btnCardMenu = dom.parentWithClass(e.target, "btnCardMenu");
|
||||
btnCardMenu && showPluginMenu(dom.parentWithClass(btnCardMenu, "page"), btnCardMenu);
|
||||
}
|
||||
}
|
||||
|
||||
pageIdOn("pageshow", "pluginsPage", function() {
|
||||
libraryMenu.setTabs("plugins", 0, getTabs);
|
||||
reloadList(this);
|
||||
});
|
||||
|
||||
window.PluginsPage = {
|
||||
renderPlugins: renderPlugins
|
||||
}
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue