mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
display top plugins
This commit is contained in:
Luke Pulverenti
parent
bc4468cb40
commit
78258425bf
2 changed files with 152 additions and 92 deletions
|
|
@ -45,7 +45,7 @@
|
|||
var availablePlugins = options.availablePlugins;
|
||||
var installedPlugins = options.installedPlugins;
|
||||
|
||||
availablePlugins = availablePlugins.filter(function (p) {
|
||||
var allPlugins = availablePlugins.filter(function (p) {
|
||||
|
||||
p.category = p.category || "General";
|
||||
p.categoryDisplayName = Globalize.translate('PluginCategory' + p.category.replace(' ', ''));
|
||||
|
|
@ -64,21 +64,74 @@
|
|||
|
||||
return p.type == "UserInstalled";
|
||||
|
||||
}).sort(function (a, b) {
|
||||
|
||||
var aName = (a.category) + " " + a.name;
|
||||
var bame = (b.category) + " " + b.name;
|
||||
|
||||
return aName > bame ? 1 : -1;
|
||||
});
|
||||
|
||||
var pluginhtml = '';
|
||||
availablePlugins = allPlugins.sort(function (a, b) {
|
||||
|
||||
var currentCategory;
|
||||
var aName = (a.category);
|
||||
var bName = (b.category);
|
||||
|
||||
for (var i = 0, length = availablePlugins.length; i < length; i++) {
|
||||
var html = '';
|
||||
var plugin = availablePlugins[i];
|
||||
if (aName > bName) {
|
||||
return 1;
|
||||
}
|
||||
if (bName > aName) {
|
||||
return -1;
|
||||
}
|
||||
|
||||
aName = (a.name);
|
||||
bName = (b.name);
|
||||
|
||||
if (aName > bName) {
|
||||
return 1;
|
||||
}
|
||||
if (bName > aName) {
|
||||
return -1;
|
||||
}
|
||||
|
||||
if (a.installs > b.installs) {
|
||||
return 1;
|
||||
}
|
||||
if (b.installs > a.installs) {
|
||||
return -1;
|
||||
}
|
||||
|
||||
return 0;
|
||||
});
|
||||
|
||||
var html = '';
|
||||
var i, length, plugin;
|
||||
|
||||
var currentCategory = Globalize.translate('HeaderTopPlugins');
|
||||
html += '<div class="detailSectionHeader">' + currentCategory + '</div>';
|
||||
var topPlugins = allPlugins.slice(0).sort(function (a, b) {
|
||||
|
||||
if (a.installs > b.installs) {
|
||||
return 1;
|
||||
}
|
||||
if (b.installs > a.installs) {
|
||||
return -1;
|
||||
}
|
||||
|
||||
var aName = (a.name);
|
||||
var bName = (b.name);
|
||||
|
||||
if (aName > bName) {
|
||||
return 1;
|
||||
}
|
||||
if (bName > aName) {
|
||||
return -1;
|
||||
}
|
||||
|
||||
return 0;
|
||||
});
|
||||
|
||||
for (i = 0, length = Math.min(topPlugins.length, 12) ; i < length; i++) {
|
||||
html += getPluginHtml(topPlugins[i], options, installedPlugins);
|
||||
}
|
||||
|
||||
for (i = 0, length = availablePlugins.length; i < length; i++) {
|
||||
|
||||
plugin = availablePlugins[i];
|
||||
|
||||
var category = plugin.categoryDisplayName;
|
||||
|
||||
|
|
@ -97,83 +150,7 @@
|
|||
currentCategory = category;
|
||||
}
|
||||
|
||||
var href = plugin.externalUrl ? plugin.externalUrl : "addplugin.html?name=" + encodeURIComponent(plugin.name) + "&guid=" + plugin.guid;
|
||||
|
||||
if (options.context) {
|
||||
href += "&context=" + options.context;
|
||||
}
|
||||
var target = plugin.externalUrl ? ' target="_blank"' : '';
|
||||
|
||||
html += "<div class='card backdropCard alternateHover bottomPaddedCard'>";
|
||||
|
||||
html += '<div class="cardBox visualCardBox">';
|
||||
html += '<div class="cardScalable">';
|
||||
|
||||
html += '<div class="cardPadder"></div>';
|
||||
|
||||
html += '<a class="cardContent" href="' + href + '"' + target + '>';
|
||||
if (plugin.thumbImage) {
|
||||
html += '<div class="cardImage" style="background-image:url(\'' + plugin.thumbImage + '\');">';
|
||||
} else {
|
||||
html += '<div class="cardImage" style="background-image:url(\'css/images/items/list/collection.png\');">';
|
||||
}
|
||||
|
||||
if (plugin.isPremium) {
|
||||
if (plugin.price > 0) {
|
||||
html += "<div class='premiumBanner'><img src='css/images/supporter/premiumflag.png' /></div>";
|
||||
} else {
|
||||
html += "<div class='premiumBanner'><img src='css/images/supporter/supporterflag.png' /></div>";
|
||||
}
|
||||
}
|
||||
html += "</div>";
|
||||
|
||||
// cardContent
|
||||
html += "</a>";
|
||||
|
||||
// cardScalable
|
||||
html += "</div>";
|
||||
|
||||
html += '<div class="cardFooter">';
|
||||
|
||||
html += "<div class='cardText'>";
|
||||
html += plugin.name;
|
||||
html += "</div>";
|
||||
|
||||
if (!plugin.isExternal) {
|
||||
html += "<div class='cardText packageReviewText'>";
|
||||
html += plugin.price > 0 ? "$" + plugin.price.toFixed(2) : Globalize.translate('LabelFree');
|
||||
html += RatingHelpers.getStoreRatingHtml(plugin.avgRating, plugin.id, plugin.name, true);
|
||||
|
||||
html += "<span class='storeReviewCount'>";
|
||||
html += " " + Globalize.translate('LabelNumberReviews').replace("{0}", plugin.totalRatings);
|
||||
html += "</span>";
|
||||
|
||||
html += "</div>";
|
||||
}
|
||||
|
||||
var installedPlugin = plugin.isApp ? null : installedPlugins.filter(function (ip) {
|
||||
return ip.Id == plugin.guid;
|
||||
})[0];
|
||||
|
||||
html += "<div class='cardText'>";
|
||||
|
||||
if (installedPlugin) {
|
||||
html += Globalize.translate('LabelVersionInstalled').replace("{0}", installedPlugin.Version);
|
||||
} else {
|
||||
html += ' ';
|
||||
}
|
||||
html += "</div>";
|
||||
|
||||
// cardFooter
|
||||
html += "</div>";
|
||||
|
||||
// cardBox
|
||||
html += "</div>";
|
||||
|
||||
// card
|
||||
html += "</div>";
|
||||
|
||||
pluginhtml += html;
|
||||
html += getPluginHtml(plugin, options, installedPlugins);
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -181,11 +158,94 @@
|
|||
$(options.noItemsElement).hide();
|
||||
}
|
||||
|
||||
$(options.catalogElement).html(pluginhtml);
|
||||
$(options.catalogElement).html(html);
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
}
|
||||
|
||||
function getPluginHtml(plugin, options, installedPlugins) {
|
||||
|
||||
var html = '';
|
||||
|
||||
var href = plugin.externalUrl ? plugin.externalUrl : "addplugin.html?name=" + encodeURIComponent(plugin.name) + "&guid=" + plugin.guid;
|
||||
|
||||
if (options.context) {
|
||||
href += "&context=" + options.context;
|
||||
}
|
||||
var target = plugin.externalUrl ? ' target="_blank"' : '';
|
||||
|
||||
html += "<div class='card backdropCard alternateHover bottomPaddedCard'>";
|
||||
|
||||
html += '<div class="cardBox visualCardBox">';
|
||||
html += '<div class="cardScalable">';
|
||||
|
||||
html += '<div class="cardPadder"></div>';
|
||||
|
||||
html += '<a class="cardContent" href="' + href + '"' + target + '>';
|
||||
if (plugin.thumbImage) {
|
||||
html += '<div class="cardImage" style="background-image:url(\'' + plugin.thumbImage + '\');">';
|
||||
} else {
|
||||
html += '<div class="cardImage" style="background-image:url(\'css/images/items/list/collection.png\');">';
|
||||
}
|
||||
|
||||
if (plugin.isPremium) {
|
||||
if (plugin.price > 0) {
|
||||
html += "<div class='premiumBanner'><img src='css/images/supporter/premiumflag.png' /></div>";
|
||||
} else {
|
||||
html += "<div class='premiumBanner'><img src='css/images/supporter/supporterflag.png' /></div>";
|
||||
}
|
||||
}
|
||||
html += "</div>";
|
||||
|
||||
// cardContent
|
||||
html += "</a>";
|
||||
|
||||
// cardScalable
|
||||
html += "</div>";
|
||||
|
||||
html += '<div class="cardFooter">';
|
||||
|
||||
html += "<div class='cardText'>";
|
||||
html += plugin.name;
|
||||
html += "</div>";
|
||||
|
||||
if (!plugin.isExternal) {
|
||||
html += "<div class='cardText packageReviewText'>";
|
||||
html += plugin.price > 0 ? "$" + plugin.price.toFixed(2) : Globalize.translate('LabelFree');
|
||||
html += RatingHelpers.getStoreRatingHtml(plugin.avgRating, plugin.id, plugin.name, true);
|
||||
|
||||
html += "<span class='storeReviewCount'>";
|
||||
html += " " + Globalize.translate('LabelNumberReviews').replace("{0}", plugin.totalRatings);
|
||||
html += "</span>";
|
||||
|
||||
html += "</div>";
|
||||
}
|
||||
|
||||
var installedPlugin = plugin.isApp ? null : installedPlugins.filter(function (ip) {
|
||||
return ip.Id == plugin.guid;
|
||||
})[0];
|
||||
|
||||
html += "<div class='cardText'>";
|
||||
|
||||
if (installedPlugin) {
|
||||
html += Globalize.translate('LabelVersionInstalled').replace("{0}", installedPlugin.Version);
|
||||
} else {
|
||||
html += ' ';
|
||||
}
|
||||
html += "</div>";
|
||||
|
||||
// cardFooter
|
||||
html += "</div>";
|
||||
|
||||
// cardBox
|
||||
html += "</div>";
|
||||
|
||||
// card
|
||||
html += "</div>";
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
$(document).on('pageinitdepends', "#pluginCatalogPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
|
|
|||
|
|
@ -847,6 +847,6 @@
|
|||
"OptionBanner": "Banner",
|
||||
"NoSlideshowContentFound": "No slideshow images were found.",
|
||||
"OptionPhotoSlideshow": "Photo slideshow",
|
||||
"OptionBackdropSlideshow": "Backdrop slideshow"
|
||||
|
||||
"OptionBackdropSlideshow": "Backdrop slideshow",
|
||||
"HeaderTopPlugins": "Top Plugins"
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue