Penguin Random House
`;
const notVerifiedIcon = `
`;
const shareIcon = `
`;
const thumbUp = `
`;
const thumbDown = `
`;
const post = `
${!avatar ? `
${name.slice(0, 1).toUpperCase()}` : `

` }
${verified ? verifiedIcon : notVerifiedIcon}
5/24/19
`
const $posts = $('.row_posts')
$posts.append(post)
}
function setupThumbsButtons () {
const $posts = $('.row_posts')
$posts.on('click', '.thumbup', function() {
const id = $(this).closest('.post').data('reviewid')
voteUp(id)
})
$posts.on('click', '.thumbdown', function() {
const id = $(this).closest('.post').data('reviewid')
voteDown(id)
})
}
function clearPostsList() {
const $posts = $('.row_posts')
$posts.find('.post').remove()
}
function showEmptyPlaceholder() {
const $posts = $('.row_posts')
$posts.append(`
There are no reviews for this product yet.
`)
$('.write_review_button').show()
$('.view_more_button').hide()
}
function prepareReviews(reviews) {
return reviews.map(review => {
return {
id: review.id,
description: review.content,
title: review.title,
votesUp: review.votes_up,
votesDown: review.votes_down,
verified: review.verified_buyer,
stars: review.score,
date: moment(review.created_at).format("MM/DD/YYYY"),
name: review.user.display_name,
avatar: review.user.social_image
}
})
}
function calculateAverageReview(reviews) {
const reviewsNumer = reviews.length
const averageReview = reviews.reduce(review => (acc, review) => acc + review.start, 0)
return {
reviewsNumer,
averageReview
}
}
var examplePosts = [
{
name : 'Jan Adrian',
verified : true,
date : "11/11/11",
title : "Review Title",
description : "This is a description of the review. It can be as long as needed for a user to give their thoughts on a product. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam cursus lacinia purus quis dictum. Donec malesuada tortor ac eros dictum pulvinar. Nulla at erat eleifend, consequat lacus,." ,
stars: 4
},
{
name : 'HP Lovecraft',
verified : true,
date : "11/11/11",
title : "Review Title",
description : "This is a description of the review. It can be as long as needed for a user to give their thoughts on a product. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam cursus lacinia purus quis dictum. Donec malesuada tortor ac eros dictum pulvinar. Nulla at erat eleifend, consequat lacus,." ,
stars: 1
}
];
$(function() {
$('.write_review_button').hide()
$('.view_more_button').hide()
var $reviewsContainer = $('.product-reviews-container')
var productId = $reviewsContainer.data('productid')
fetchProductReviews(productId).then(function (data) {
console.log(data)
const noReviews = data.pagination.total === 0;
clearPostsList()
if (noReviews) {
showEmptyPlaceholder()
} else {
const reviews = prepareReviews(data.reviews)
reviews.forEach(createPost)
const { total_review: numberOfReviews, average_score: averageStars } = data.bottomline
var headerStars = $('.row_header .stars');
headerStars.html(`${makeStars(averageStars)} (${numberOfReviews} Reviews)`)
setupThumbsButtons()
$('.write_review_button').hide()
$('.view_more_button').show()
}
})
})