https://thelondonerpub.com/spillover/proto/thelondonerpub2/js/reviews.js

1import { determineProto } from "./protoDeterminer.js";
2
3var proto = determineProto();
4
5$(document).ready(function () {
6  var $carousel = $("#reviewsCarousel");
7  var $wrapperWithLocation = $carousel.closest("[location]");
8  var locationAttr = ($wrapperWithLocation.attr("location") || "").trim();
9  var hasLocationFilter = locationAttr.length > 0;
10
11  $.ajax({
12    url: `https://rails-admin.spillover.com/esites-api/v1/${proto}/reviews`,
13    success: function (t) {
14      var reviews = Array.isArray(t && t.reviews) ? t.reviews : [];
15
16      if (hasLocationFilter) {
17        var wanted = locationAttr.toLowerCase();
18        reviews = reviews.filter(function (o) {
19          var loc = ((o && o.location_name) || "").trim().toLowerCase();
20          return loc === wanted;
21        });
22      }
23
24      var colClass = hasLocationFilter ? "col-lg-10" : "col-lg-6";
25      var html = "";
26      var isFirst = true;
27
28      $.each(reviews, function (_idx, o) {
29        html += `<div class="${isFirst ? "carousel-item active" : "carousel-item"}">
30							<div class="row justify-content-center">
31								<div class="${colClass}">
32								${o.content !== null ? `<div class="testimonial"><p>${o.content}</p></div>` : ""}
33									<div class="media ${o.content !== null ? "" : "mx-1 px-1 review-scale"}">
34										<div class="${o.content !== null ? "media-left mr-3" : "justify-content-center"} d-flex">
35											<div class="overview ${o.content !== null ? "" : "px-1"}">
36												<div class="row">
37													<div class="col-auto name"><b>${o.reviewer}</b></div>
38													<div class="col-auto details"><img class="source-logo" alt="${({ MY_REVIEWS: "Spillover Logo", GOOGLE: "Google Logo", YELP: "Yelp Logo", FACEBOOK: "Facebook Logo" }[o.source] || "")}" src="${o.source_logo}"/></div>
39												</div>
40												<div class="star-rating">
41													<ul class="list-inline">
42													${(function () {
43                            var out = "";
44                            var full =
45                              '<li class="list-inline-item"><svg viewBox="-21 -11 516 492" class="star-colors-full" xml:space="preserve" stroke-linejoin="miter"><polygon stroke-width="25" points="473.486,182.079 310.615,157.952 235.904,11.23 162.628,158.675 0,184.389 117.584,299.641 91.786,462.257 237.732,386.042 384.416,460.829 357.032,298.473"></polygon></svg></li>';
46                            var empty = full.replace("star-colors-full", "star-colors-empty");
47                            var n = o.is_binary_rating ? 5 : o.rating;
48
49                            for (var i = 0; i < n; i++) out += full;
50                            if (!o.is_binary_rating) for (var j = n; j < 5; j++) out += empty;
51
52                            return out;
53                          })()}
54													</ul>
55												</div>
56											</div>								
57										</div>
58									</div>
59								</div>
60							</div>		
61						</div>`;
62        isFirst = false;
63      });
64
65      $("#reviewsCarousel .carousel-inner").append(html);
66    },
67  });
68});