Файловый менеджер

Файловый менеджер - Редактировать - /home/tuudkjt/globeasy/wp-content/plugins/reviewx/resources/views/storefront/shortcode/googleReviewList.twig

Назад
<div id="google-reviews-container" class="rvx-container rvx-mx-auto" x-data="{ rawTitle: '{{ title }}', // Set the title from Twig loadMore: '{{ loadMore }}', // Set loadMore from Twig showLoadMore: true // Default to true, will be evaluated in x-init }" x-init=" // Evaluate conditions on initialization showLoadMore = loadMore !== 'false' && loadMore.trim().toLowerCase() !== 'false'; "> <h2 x-show="rawTitle !== 'false'" x-cloak class="rvx-text-1xl rvx-font-bold rvx-mb-[10px!important] rvx-mt-[5px!important]" x-text="rawTitle"> </h2> <div id="review-list" class="rvx-grid rvx-gap-6"></div> <template x-if="showLoadMore"> <div class="rvx-mt-6 text-center"> <button id="load-more-btn" class="rvx-bg-blue-500 rvx-text-white rvx-py-2 rvx-px-4 rvx-rounded-lg rvx-font-semibold rvx-shadow-md hover:rvx-bg-blue-600"> Load More </button> </div> </template> </div> <script> document.addEventListener("DOMContentLoaded", function () { // Reviews data passed from backend const reviews = {{ content.reviews\|json_encode\|raw }}; const reviewList = document.getElementById("review-list"); // ---------------------------- // Helper functions // ---------------------------- // For boolean parameters (e.g. loadMore) function getBooleanParam(param) { // Check if the parameter is strictly false. if (param === false) return false; // Convert to a string, trim whitespace, and check if it equals "false" if (String(param).toLowerCase().trim() === "false") return false; // For any other value, return true. return true; } // For numeric parameters (or false) (e.g. truncateLimit) function getNumericParam(param) { // Explicitly check if the param is false. if (param === false \|\| String(param).toLowerCase() === "false") { return false; } const parsedValue = parseInt(param, 10); return isNaN(parsedValue) ? false : parsedValue; } // ---------------------------- // Retrieve and process parameters // ---------------------------- // loadMore: expected to be true or false. const loadMoreRaw = {{ loadMore\|json_encode\|raw }}; const loadMoreEnabled = getBooleanParam(loadMoreRaw); // reviewLimit: determines how many reviews to show initially let reviewLimit = {{ reviewLimit\|json_encode\|raw }}; // Truncate limit for the review feedback. const truncateParamRaw = {{ truncateLimit\|json_encode\|raw }}; const truncateLimit = getNumericParam(truncateParamRaw); // Attempt to get the load more button element. const loadMoreBtn = document.getElementById("load-more-btn"); // ---------------------------- // Utility functions // ---------------------------- // Function to truncate text if a numeric limit is set. function truncateText(text, limit) { if (limit === false) return text; // full text if limit is false return text.length > limit ? text.slice(0, limit) + "..." : text; } // ---------------------------- // Rendering functions // ---------------------------- function renderReviews() { // Clear the list reviewList.innerHTML = ""; // Render only the reviews up to reviewLimit. reviews.slice(0, reviewLimit).forEach(review => { const reviewCard = document.createElement("div"); reviewCard.className = "rvx-bg-white rvx-rounded-lg rvx-shadow-md rvx-p-6 hover:rvx-shadow-lg rvx-transition-shadow"; const uid = review.uid; // Apply text truncation if needed. const feedback = truncateText(review.feedback, truncateLimit); reviewCard.innerHTML = ` <div class="rvx-flex rvx-items-center rvx-mb-4"> <img src="${review.avatar}" alt="Reviewer avatar" class="rvx-w-12 rvx-h-12 rvx-rounded-full rvx-object-cover rvx-mr-4"> <div> <h3 class="rvx-font-semibold rvx-text-lg">${review.reviewer_name}</h3> <div class="rvx-flex rvx-items-center"> <div class="rvx-flex rvx-text-yellow-400"> ${renderStarRating(review.rating)} </div> <span class="rvx-ml-2 rvx-text-sm rvx-text-gray-600"> ${review.rating}/5 </span> </div> </div> </div> <p class="rvx-text-gray-600 rvx-mb-4" id="feedback-${uid}">${feedback}</p> <div class="rvx-text-sm rvx-text-gray-500"> <span>${review.relative_time_description}</span> </div> `; reviewList.appendChild(reviewCard); }); // Update the "Load More" button's visibility. if (loadMoreEnabled && loadMoreBtn) { loadMoreBtn.style.display = reviewLimit >= reviews.length ? "none" : "block"; } } // Render star ratings function renderStarRating(rating) { let fullStars = Math.floor(rating); let halfStar = rating % 1 >= 0.3 && rating % 1 <= 0.7; let emptyStars = 5 - fullStars - (halfStar ? 1 : 0); let stars = ""; for (let i = 0; i < fullStars; i++) { stars += fullStarIcon(); } if (halfStar) { stars += halfStarIcon(); } for (let i = 0; i < emptyStars; i++) { stars += emptyStarIcon(); } return stars; } // Returns a full star SVG icon function fullStarIcon() { return ` <svg class="rvx-w-5 rvx-h-5 rvx-fill-current rvx-text-yellow-400" xmlns="http://www.w3.org/2000/svg" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 512 488.282"> <path fill="#FFD401" fill-rule="nonzero" d="M268.313 8.2l65.464 153.293 166.054 14.902c7.332.632 12.754 7.085 12.118 14.412a13.262 13.262 0 01-4.495 8.87v.006L381.835 309.374l37.159 162.59c1.646 7.181-2.848 14.336-10.03 15.981a13.308 13.308 0 01-10.273-1.84l-142.686-85.309-143.144 85.579c-6.312 3.777-14.492 1.716-18.274-4.602a13.278 13.278 0 01-1.554-9.809l-.016-.006 37.164-162.589L4.551 199.683c-5.536-4.845-6.103-13.263-1.252-18.804a13.281 13.281 0 019.313-4.527l165.611-14.859L243.73 8.119c2.887-6.777 10.722-9.933 17.493-7.052a13.31 13.31 0 017.09 7.133z"/> </svg> `; } // Returns a half star SVG icon function halfStarIcon() { return ` <svg class="rvx-w-5 rvx-h-5 rvx-fill-current rvx-text-yellow-400" xmlns="http://www.w3.org/2000/svg" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 512 489.217"> <path fill="#ffcf00" fill-rule="nonzero" d="M278.41 15.832l59.521 139.378 152.968 13.689c6.245.682 11.71 3.801 15.512 8.326 3.833 4.52 5.956 10.445 5.537 16.752l-.082.966c-.92 9.22-5.067 12.81-10.171 17.221-37.832 32.769-75.441 65.864-113.148 98.789l34.123 149.31a23.635 23.635 0 01-3.012 17.826c-6.983 11.214-21.979 14.531-33.038 7.284l-130.623-78.111-131.443 78.586a23.6 23.6 0 01-17.899 2.655 23.638 23.638 0 01-14.546-10.822c-3.114-5.201-4.122-11.503-2.768-17.418l34.112-149.316L8.094 210.227a23.58 23.58 0 01-8.042-16.219 23.627 23.627 0 015.801-17.134c4.122-4.835 10.206-7.722 16.534-8.068l151.666-13.596L234.21 14.365c2.552-6.007 7.329-10.418 12.96-12.691 9.272-3.719 20.501-1.121 26.88 6.607 1.927 2.329 3.188 4.793 4.36 7.551zm-22.428 5.946v361.888a10.84 10.84 0 015.609 1.544l136.982 81.887c.186.124.429.223.687.264.625.274 1.57-.31 1.875-.796l.041-.041c.238-.382.336-.894.222-1.395l-35.574-155.654c-.847-3.781.341-7.898 3.461-10.63 39.371-34.381 78.638-68.948 118.143-103.169 1.436-1.245 2.614-2.257 2.707-3.058.083-1.054-.574-1.901-1.643-1.993l-158.355-14.252c-4.128-.124-8.002-2.588-9.722-6.632L258.337 24.376c-.418-.992-.795-1.782-1.115-2.17-.439-.247-.703-.439-1.24-.428z"/> </svg> `; } // Returns a half star SVG icon function emptyStarIcon() { return ` <svg class="rvx-w-5 rvx-h-5 rvx-fill-current rvx-text-yellow-400" xmlns="http://www.w3.org/2000/svg" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 122.88 117.42"> <path d="M66.71 3.55L81.1 37.26l36.58 3.28v-.01c1.55.13 2.91.89 3.85 2.01a5.663 5.663 0 011.32 4.13v.01a5.673 5.673 0 01-1.69 3.57c-.12.13-.25.25-.39.36L93.25 74.64l8.19 35.83c.35 1.53.05 3.06-.73 4.29a5.652 5.652 0 01-3.54 2.52l-.14.03c-.71.14-1.43.15-2.12.02v.01c-.75-.13-1.47-.42-2.11-.84l-.05-.03-31.3-18.71-31.55 18.86a5.664 5.664 0 01-7.79-1.96c-.38-.64-.62-1.33-.73-2.02-.1-.63-.09-1.27.02-1.89.02-.13.04-.27.08-.4l8.16-35.7c-9.24-8.07-18.74-16.1-27.83-24.3l-.08-.08a5.64 5.64 0 01-1.72-3.7c-.1-1.45.36-2.93 1.4-4.12l.12-.13.08-.08a5.668 5.668 0 013.77-1.72h.06l36.34-3.26 14.44-33.8c.61-1.44 1.76-2.5 3.11-3.05 1.35-.54 2.9-.57 4.34.04.69.29 1.3.71 1.8 1.22.53.53.94 1.15 1.22 1.82l.02.06zm10.19 37.2L61.85 5.51a.42.42 0 00-.09-.14.42.42 0 00-.14-.09.427.427 0 00-.35 0c-.1.04-.19.12-.24.24L45.98 40.75c-.37.86-1.18 1.49-2.18 1.58l-37.9 3.4c-.08.01-.16.02-.24.02-.06 0-.13.02-.18.05-.03.01-.05.03-.07.05l-.1.12c-.05.08-.07.17-.06.26.01.09.04.18.09.25.06.05.13.11.19.17l28.63 25c.77.61 1.17 1.62.94 2.65l-8.51 37.22-.03.14c-.01.06-.02.12-.01.17a.454.454 0 00.33.36c.12.03.24.02.34-.04l32.85-19.64c.8-.5 1.85-.54 2.72-.02L95.43 112c.08.04.16.09.24.14.05.03.1.05.16.06v.01c.04.01.09.01.14 0l.04-.01c.12-.03.22-.1.28-.2.06-.09.08-.21.05-.33L87.8 74.28a2.6 2.6 0 01.83-2.55l28.86-25.2c.04-.03.07-.08.1-.13.02-.04.03-.1.04-.17a.497.497 0 00-.09-.33.48.48 0 00-.3-.15v-.01c-.01 0-.03 0-.03-.01l-37.97-3.41c-1-.01-1.93-.6-2.34-1.57z" fill="#ffcf00"/> </svg> `; } // ---------------------------- // Responsive grid columns // ---------------------------- function updateGridColumns() { let autoColumns = 1; // Default to 1 column const width = reviewList.clientWidth; if (width > 1024) autoColumns = 3; else if (width > 768) autoColumns = 2; reviewList.className = `rvx-grid rvx-grid-cols-${autoColumns} rvx-gap-6`; } window.addEventListener("resize", updateGridColumns); // ---------------------------- // Initial render and binding // ---------------------------- updateGridColumns(); renderReviews(); // Bind "Load More" event listener only if enabled. if (loadMoreEnabled && loadMoreBtn) { loadMoreBtn.addEventListener("click", function () { // Increase reviewLimit by the same amount set in Twig (e.g., 3) reviewLimit += {{ reviewLimit\|json_encode\|raw }}; renderReviews(); }); } }); </script>

| ver. 1.6 | Github | . | PHP 8.1.34 | Генерация страницы: 0 | proxy | phpinfo | Настройка