Use updated book details api in frontend

This commit is contained in:
Robbie Antenesse 2019-09-12 12:41:10 -06:00
parent 3f3ae76f2b
commit 46d3da8010
1 changed files with 28 additions and 36 deletions

View File

@ -8,12 +8,12 @@ export const resultDetails = (searchController, result) => {
const modalId = `result_${result.uri}`; const modalId = `result_${result.uri}`;
const buttonHTML = html`<label for=${modalId} class="pseudo button"> const buttonHTML = html`<label for=${modalId} class="pseudo button">
<span data-tooltip="${i18n.__('interaction.average_rating')}: ${result.rating}"> <span data-tooltip="${i18n.__('interaction.average_rating')}: ${result.averageRating}">
${starRating(result.rating)} ${starRating(result.averageRating)}
</span> </span>
<span style="margin-left:10px;" data-tooltip=${i18n.__('interaction.reviews_written')}> <span style="margin-left:10px;" data-tooltip=${i18n.__('interaction.reviews_written')}>
<span style="margin-right:8px;"><i class="icon-chat"></i></span> <span style="margin-right:8px;"><i class="icon-chat"></i></span>
<span>${result.reviewCount}</span> <span>${result.numberOfReviews}</span>
</span> </span>
</label>`; </label>`;
@ -24,7 +24,7 @@ export const resultDetails = (searchController, result) => {
</div> </div>
<div class="two-third-700"> <div class="two-third-700">
<h4>${i18n.__('interaction.average_rating')}</h4> <h4>${i18n.__('interaction.average_rating')}</h4>
<span data-tooltip="${result.rating}">${starRating(result.rating)}</span> <span data-tooltip="${result.averageRating}">${starRating(result.averageRating)}</span>
<div class="flex"> <div class="flex">
<div> <div>
@ -33,42 +33,34 @@ export const resultDetails = (searchController, result) => {
<div> <div>
<a href="/book/${result.uri}" class="small button"> <a href="/book/${result.uri}" class="small button">
<span style="margin-right:8px;"><i class="icon-chat"></i></span> <span style="margin-right:8px;"><i class="icon-chat"></i></span>
<span>${result.reviewCount}</span> <span>${result.numberOfReviews}</span>
<span>${i18n.__('search.see_interaction_details')}</span> <span>${i18n.__('search.see_interaction_details')}</span>
</a> </a>
</div> </div>
</div> </div>
<article class="card"> ${result.reviews.map(review => {
<header> return html`<article class="card">
{{USERNAME}} ${starRating(Math.ceil(result.rating))} <header style="font-weight:normal;">
</header> <strong>${review.reviewer.name}</strong> <em>${review.reviewer.handle}</em><br>
<footer> ${review.date} ${starRating(Math.ceil(review.rating))}
<div class="content"> </header>
<p> <footer>
The only thing worse than yellow snow is green snow. Let's put a touch more of the magic here. <div class="content">
With practice comes confidence. You have to allow the paint to break to make it beautiful. <p>
</p> ${review.review}
<p> </p>
Let all these little things happen. Don't fight them. Learn to use them. Imagination is the key </div>
to painting. You can't make a mistake. Anything that happens you can learn to use - and make <span class="tooltip-top" data-tooltip=${i18n.__('interaction.heart')}>
something beautiful out of it. This is a fantastic little painting. In painting, you have unlimited <button class="pseudo">
power. You have the ability to move mountains. We don't have anything but happy trees here. <i class="icon-heart-outline"></i>
</p> </button>
<p> </span>
If what you're doing doesn't make you happy - you're doing the wrong thing. A fan brush can be <span>
your best friend. Mountains are so simple, they're hard. ${review.hearts}
</p> </span>
</div> </footer>
<span class="tooltip-top" data-tooltip=${i18n.__('interaction.heart')}> </article>`;
<button class="pseudo"> })}
<i class="icon-heart-outline"></i>
</button>
</span>
<span>
${result.reviewCount}
</span>
</footer>
</article>
</div> </div>
<div class="sixth-700"> <div class="sixth-700">
<p> <p>