mirror of
https://github.com/jellyfin/jellyfin-web.git
synced 2024-11-17 19:08:18 -07:00
First level of ratings and reviews
This commit is contained in:
parent
7614d695d9
commit
75b5f25694
10
ApiClient.js
10
ApiClient.js
@ -3569,6 +3569,16 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi
|
||||
url: url
|
||||
});
|
||||
};
|
||||
|
||||
self.createPackageReview = function(review) {
|
||||
|
||||
var url = self.getUrl("PackageReviews/" + review.id, review);
|
||||
|
||||
return self.ajax({
|
||||
type: "POST",
|
||||
url: url,
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
}(jQuery, navigator, window.JSON, window.WebSocket, setTimeout, window);
|
||||
|
File diff suppressed because one or more lines are too long
@ -36,6 +36,18 @@
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.posterItemStoreText {
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
font-weight: normal;
|
||||
font-size: 16px;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
text-wrap: none;
|
||||
white-space: nowrap;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
|
||||
.posterItemText {
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
@ -71,6 +83,20 @@
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.storeItem {
|
||||
width: 270px;
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.storePosterItem {
|
||||
width: 270px;
|
||||
}
|
||||
.storePosterItem .posterItemImage {
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
|
||||
.backdropPosterItem {
|
||||
width: 160px;
|
||||
}
|
||||
|
@ -2,6 +2,7 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>Plugins</title>
|
||||
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
|
||||
</head>
|
||||
<body>
|
||||
<div id="pluginCatalogPage" data-role="page" class="page type-interior pluginConfigurationPage">
|
||||
|
@ -47,6 +47,28 @@
|
||||
Dashboard.hideLoadingMsg();
|
||||
}
|
||||
|
||||
function getRatingHtml(rating, id, name) {
|
||||
|
||||
var html = "<div style='margin-left: 5px; margin-right: 5px; display: inline-block'>";
|
||||
if (!rating) rating = 0;
|
||||
|
||||
for (var i = 1; i <= 5; i++) {
|
||||
html += "<a href='#' data-id=" + id + " data-name='" + name + "' data-rating=" + i + " onclick='Dashboard.ratePackage(this);' >";
|
||||
if (rating < i - 1 || rating == 0) {
|
||||
html += "<div class='storeStarRating emptyStarRating' title='Rate " + i + " stars'></div>";
|
||||
} else if (rating < i) {
|
||||
html += "<div class='storeStarRating halfStarRating' title='Rate " + i + " stars'></div>";
|
||||
} else {
|
||||
html += "<div class='storeStarRating' title='Rate " + i + " stars'></div>";
|
||||
}
|
||||
html += "</a>";
|
||||
}
|
||||
|
||||
html += "</div>";
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
function populateList(page, availablePlugins, installedPlugins) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
@ -79,7 +101,7 @@
|
||||
var href = plugin.externalUrl ? plugin.externalUrl : "addPlugin.html?name=" + encodeURIComponent(plugin.name) + "&guid=" + plugin.guid;
|
||||
var target = plugin.externalUrl ? ' target="_blank"' : '';
|
||||
|
||||
html += "<a class='posterItem backdropPosterItem transparentPosterItem borderlessPosterItem' href='" + href + "' " + target + ">";
|
||||
html += "<div class='storeItem'><a class='posterItem storePosterItem borderlessPosterItem' style='background: #D4D4D4!important' href='" + href + "' " + target + ">";
|
||||
|
||||
if (plugin.thumbImage) {
|
||||
html += '<div class="posterItemImage" style="background-image:url(\'' + plugin.thumbImage + '\');background-size:cover;"></div>';
|
||||
@ -95,9 +117,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
var color = plugin.tileColor || LibraryBrowser.getMetroColor(plugin.name);
|
||||
html += "</a>";
|
||||
|
||||
html += "<div class='posterItemText posterItemTextCentered' style='background:" + color + "'>";
|
||||
html += "<div class='posterItemStoreText' style='font-size: 18px!important; font-weight: bold'>";
|
||||
|
||||
var installedPlugin = plugin.isApp ? null : installedPlugins.filter(function (ip) {
|
||||
return ip.Name == plugin.name;
|
||||
@ -111,7 +133,17 @@
|
||||
|
||||
html += "</div>";
|
||||
|
||||
html += "</a>";
|
||||
html += "<div class='posterItemStoreText' >";
|
||||
html += plugin.price > 0 ? "$" + plugin.price.toFixed(2) : "Free";
|
||||
html += getRatingHtml(plugin.avgRating, plugin.id, plugin.name);
|
||||
html += " " + plugin.totalRatings + " Reviews";
|
||||
|
||||
if (plugin.isPremium && plugin.isRegistered) {
|
||||
html += "<span title='You are registered for this feature' style='cursor: default'> ®</span>";
|
||||
}
|
||||
|
||||
html += "</div>";
|
||||
html += "</div>";
|
||||
|
||||
pluginhtml += html;
|
||||
|
||||
@ -126,7 +158,6 @@
|
||||
Dashboard.hideLoadingMsg();
|
||||
}
|
||||
|
||||
|
||||
$(document).on('pageinit', "#pluginCatalogPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
98
dashboard-ui/scripts/ratingdialog.js
Normal file
98
dashboard-ui/scripts/ratingdialog.js
Normal file
@ -0,0 +1,98 @@
|
||||
(function (window, document, $) {
|
||||
|
||||
window.RatingDialog = function (page) {
|
||||
|
||||
var self = this;
|
||||
|
||||
self.show = function (options) {
|
||||
|
||||
options = options || {};
|
||||
|
||||
options.header = options.header || "Rate and Review";
|
||||
|
||||
var html = '<div data-role="popup" id="popupRatingDialog" class="ui-corner-all popup" style="min-width:400px;" data-dismissible="false">';
|
||||
|
||||
html += '<div class="ui-corner-top ui-bar-a" style="text-align: center; padding: 0 20px;">';
|
||||
html += '<h3>' + options.header + '</h3>';
|
||||
html += '</div>';
|
||||
|
||||
html += '<div data-role="content" class="ui-corner-bottom ui-content">';
|
||||
html += '<form>';
|
||||
|
||||
html += '<div style="margin:0;">';
|
||||
html += '<label for="txtRatingDialogRating" >Your Rating:</label>';
|
||||
html += '<input id="txtRatingDialogRating" name="rating" type="number" required="required" min=0 max=5 step=1 value=' + options.rating + ' />';
|
||||
html += '<label for="txtRatingDialogTitle" >Short Overall Rating Description:</label>';
|
||||
html += '<input id="txtRatingDialogTitle" name="title" type="text" maxlength=160 />';
|
||||
html += '<label for="txtRatingDialogRecommend" >I recommend this item</label>';
|
||||
html += '<input id="txtRatingDialogRecommend" name="recommend" type="checkbox" checked />';
|
||||
html += '<label for="txtRatingDialogReview" >Full Review</label>';
|
||||
html += '<textarea id="txtRatingDialogReview" name="review" rows=8 style="height:inherit" ></textarea>';
|
||||
html += '</div>';
|
||||
|
||||
|
||||
html += '<p>';
|
||||
html += '<button type="submit" data-theme="b" data-icon="ok">OK</button>';
|
||||
html += '<button type="button" data-icon="delete" onclick="$(this).parents(\'.popup\').popup(\'close\');">Cancel</button>';
|
||||
html += '</p>';
|
||||
html += '<p id="errorMsg" style="display:none; color:red; font-weight:bold">';
|
||||
html += '</p>';
|
||||
html += '</form>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
|
||||
$(page).append(html);
|
||||
|
||||
var popup = $('#popupRatingDialog').popup().trigger('create').on("popupafteropen", function() {
|
||||
|
||||
$('#txtRatingDialogTitle', this).focus();
|
||||
|
||||
}).popup("open").on("popupafterclose", function() {
|
||||
|
||||
$('form', this).off("submit");
|
||||
|
||||
$(this).off("popupafterclose").remove();
|
||||
|
||||
});
|
||||
|
||||
$('form', popup).on('submit', function () {
|
||||
|
||||
if (options.callback) {
|
||||
var review = {
|
||||
id: options.id,
|
||||
rating: $('#txtRatingDialogRating', this).val(),
|
||||
title: $('#txtRatingDialogTitle', this).val(),
|
||||
recommend: $('#txtRatingDialogRecommend', this).checked(),
|
||||
review: $('#txtRatingDialogReview', this).val(),
|
||||
};
|
||||
|
||||
if (review.rating < 3) {
|
||||
if (!review.title) {
|
||||
$('#errorMsg', this).html("Please give reason for low rating").show();
|
||||
$('#txtRatingDialogTitle', this).focus();
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
if (!review.recommend) {
|
||||
if (!review.title) {
|
||||
$('#errorMsg', this).html("Please give reason for not recommending").show();
|
||||
$('#txtRatingDialogTitle', this).focus();
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
options.callback(review);
|
||||
} else console.log("No callback function provided");
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
self.close = function () {
|
||||
$('#popupRatingDialog', page).popup("close");
|
||||
};
|
||||
};
|
||||
|
||||
})(window, document, jQuery);
|
@ -1120,7 +1120,25 @@ var Dashboard = {
|
||||
parts.push(seconds);
|
||||
|
||||
return parts.join(':');
|
||||
}
|
||||
},
|
||||
|
||||
ratePackage: function(link) {
|
||||
var id = link.getAttribute('data-id');
|
||||
var name = link.getAttribute('data-name');
|
||||
var rating = link.getAttribute('data-rating');
|
||||
|
||||
var dialog = new RatingDialog($.mobile.activePage);
|
||||
dialog.show({ header: "Rate and review " + name, id: id, rating: rating, callback: function(review) {
|
||||
console.log(review);
|
||||
dialog.close();
|
||||
|
||||
ApiClient.createPackageReview(review).done(function() {
|
||||
Dashboard.alert("Thank you for your review");
|
||||
});
|
||||
} });
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
if (!window.WebSocket) {
|
||||
|
Loading…
Reference in New Issue
Block a user