block.json
4 months ago
index.asset.php
4 months ago
index.js
4 months ago
render.php
4 months ago
view.asset.php
4 months ago
view.js
4 months ago
render.php
213 lines
| 1 | <?php |
| 2 | /** |
| 3 | * Render Review Block with Dynamic Load More & Multi-Book Support |
| 4 | */ |
| 5 | |
| 6 | $posts_to_show = isset($attributes['postsToShow']) ? intval($attributes['postsToShow']) : 3; |
| 7 | $selected_book_ids_str = isset($attributes['selectedBookId']) ? $attributes['selectedBookId'] : ''; |
| 8 | $heading = isset($attributes['heading']) ? $attributes['heading'] : 'Happy Readers!'; |
| 9 | $show_curve = isset($attributes['showCurve']) ? $attributes['showCurve'] : true; |
| 10 | $curve_color = isset($attributes['curveColor']) ? $attributes['curveColor'] : '#FFFDF5'; |
| 11 | $curve_color = isset($attributes['curveColor']) ? $attributes['curveColor'] : '#FFFDF5'; |
| 12 | $enable_load_more = isset($attributes['enableLoadMore']) ? $attributes['enableLoadMore'] : false; |
| 13 | $review_style = isset($attributes['reviewStyle']) ? $attributes['reviewStyle'] : 'fun'; |
| 14 | |
| 15 | $is_fun = $review_style === 'fun'; |
| 16 | $is_elegant = $review_style === 'elegant'; |
| 17 | |
| 18 | // Styles |
| 19 | $section_bg_color = isset($attributes['sectionBgColor']) ? $attributes['sectionBgColor'] : ''; |
| 20 | $text_color = isset($attributes['textColor']) ? $attributes['textColor'] : ''; |
| 21 | $card_bg_color = isset($attributes['cardBgColor']) ? $attributes['cardBgColor'] : ''; |
| 22 | $star_color = isset($attributes['starColor']) ? $attributes['starColor'] : ''; |
| 23 | |
| 24 | // Conditional Classes & Styles |
| 25 | // Conditional Classes & Styles |
| 26 | $section_wrapper_class = !empty($section_bg_color) ? '' : ($is_elegant ? 'bg-gray-50' : 'bg-blue-sky/10'); |
| 27 | $section_style = !empty($section_bg_color) ? 'style="background-color:' . esc_attr($section_bg_color) . ';"' : ''; |
| 28 | |
| 29 | $default_heading_class = $is_elegant |
| 30 | ? 'text-3xl md:text-5xl font-serif font-bold text-brand-dark' |
| 31 | : 'text-center md:text-center text-3xl md:text-5xl font-black leading-10 text-navy'; |
| 32 | $text_class = !empty($text_color) ? '' : ($is_elegant ? 'text-brand-dark' : 'text-navy'); |
| 33 | $text_style = !empty($text_color) ? 'style="color:' . esc_attr($text_color) . ';"' : ''; |
| 34 | |
| 35 | $card_class = !empty($card_bg_color) ? '' : ($is_elegant ? 'bg-white rounded shadow-sm hover:shadow-md transition-all duration-300' : 'bg-white rounded-xl shadow-lg'); |
| 36 | $card_style = !empty($card_bg_color) ? 'style="background-color:' . esc_attr($card_bg_color) . ';"' : ''; |
| 37 | |
| 38 | $star_class = !empty($star_color) ? '' : ($is_elegant ? 'text-slate-900 text-lg tracking-widest' : 'text-yellow-sun text-4xl'); |
| 39 | $star_style = !empty($star_color) ? 'style="color:' . esc_attr($star_color) . ';"' : ''; |
| 40 | |
| 41 | $review_text_class = $is_elegant |
| 42 | ? 'text-brand-gray italic mb-6 leading-relaxed' |
| 43 | : 'text-lg italic mb-6 leading-relaxed text-navy opacity-80'; |
| 44 | |
| 45 | // Meta Styles |
| 46 | $meta_container_class = $is_elegant ? 'flex items-center gap-4 border-t border-gray-100 pt-4' : 'flex items-center gap-4'; |
| 47 | $author_name_class = $is_elegant ? 'font-bold text-slate-800 font-serif' : 'font-black'; |
| 48 | $author_role_class = $is_elegant ? 'text-xs text-gray-500 uppercase' : 'text-sm opacity-60'; |
| 49 | $star_style = !empty($star_color) ? 'style="color:' . esc_attr($star_color) . ';"' : ''; |
| 50 | |
| 51 | |
| 52 | // Query Arguments |
| 53 | $args = [ |
| 54 | 'post_type' => 'book_reviews', |
| 55 | 'posts_per_page' => $posts_to_show, |
| 56 | 'post_status' => 'publish', |
| 57 | 'orderby' => 'date', |
| 58 | 'order' => 'DESC', |
| 59 | ]; |
| 60 | |
| 61 | // Handle Multiple Book IDs (Comma Separated) |
| 62 | if (!empty($selected_book_ids_str)) { |
| 63 | // Convert "1, 2, 3" to array [1, 2, 3] |
| 64 | $book_ids_array = array_map('intval', array_map('trim', explode(',', $selected_book_ids_str))); |
| 65 | |
| 66 | // Use Meta Query with 'IN' comparison |
| 67 | $args['meta_query'] = [ |
| 68 | [ |
| 69 | 'key' => '_rswpbs_reviewed_book', |
| 70 | 'value' => $book_ids_array, |
| 71 | 'compare' => 'IN', |
| 72 | ], |
| 73 | ]; |
| 74 | } elseif (is_singular('book')) { |
| 75 | // Auto-fetch for current book if we are on a Single Book page |
| 76 | $args['meta_query'] = [ |
| 77 | [ |
| 78 | 'key' => '_rswpbs_reviewed_book', |
| 79 | 'value' => get_the_ID(), |
| 80 | 'compare' => '=', |
| 81 | ], |
| 82 | ]; |
| 83 | } |
| 84 | |
| 85 | $reviews_query = new WP_Query($args); |
| 86 | |
| 87 | $block_id = uniqid('reviews-'); |
| 88 | ?> |
| 89 | |
| 90 | <section id="reviews" class="py-24 relative overflow-hidden <?php echo esc_attr($section_wrapper_class); ?>" <?php echo $section_style; ?>> |
| 91 | |
| 92 | <?php if ($show_curve && $is_fun): ?> |
| 93 | <div class="absolute top-0 left-0 w-full"> |
| 94 | <svg viewBox="0 0 1440 100" fill="none" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none"> |
| 95 | <path d="M0 0H1440V100C1192.5 50.503 919.5 25.503 720 25.503C520.5 25.503 247.5 50.503 0 100V0Z" |
| 96 | fill="<?php echo esc_attr($curve_color); ?>" /> |
| 97 | </svg> |
| 98 | </div> |
| 99 | <?php endif; ?> |
| 100 | |
| 101 | <div |
| 102 | class="awt-container container mx-auto px-6 relative z-10 <?php echo ($show_curve && $is_fun) ? 'mt-12' : ''; ?>"> |
| 103 | <?php if ($heading): ?> |
| 104 | <h2 class="mb-12 text-center md:text-center <?php echo !empty($text_color) ? '' : esc_attr($default_heading_class); ?> <?php echo esc_attr($text_class); ?>" |
| 105 | <?php echo $text_style; ?>> |
| 106 | <?php echo esc_html($heading); ?> |
| 107 | </h2> |
| 108 | <?php endif; ?> |
| 109 | |
| 110 | <?php if ($reviews_query->have_posts()): ?> |
| 111 | <div id="awt-reviews-grid-<?php echo esc_attr($block_id); ?>" |
| 112 | class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 mb-12"> |
| 113 | <?php |
| 114 | $index = 0; |
| 115 | while ($reviews_query->have_posts()): |
| 116 | $reviews_query->the_post(); |
| 117 | $rating = get_post_meta(get_the_ID(), '_rswpbs_rating', true); |
| 118 | $reviewer_name = get_post_meta(get_the_ID(), '_rswpbs_reviewer_name', true); |
| 119 | |
| 120 | // Rotation & Avatar Logic |
| 121 | $rotation_class = ''; |
| 122 | if ($is_fun) { |
| 123 | $rotation_class = 'hover:rotate-0 transition-all duration-300 shadow-lg'; |
| 124 | if ($index % 3 == 0) |
| 125 | $rotation_class .= ' transform rotate-1'; |
| 126 | elseif ($index % 3 == 1) |
| 127 | $rotation_class .= ' transform -rotate-1'; |
| 128 | else |
| 129 | $rotation_class .= ' transform rotate-2'; |
| 130 | } |
| 131 | |
| 132 | $initial = !empty($reviewer_name) ? strtoupper(substr($reviewer_name, 0, 1)) : 'R'; |
| 133 | $avatar_colors = ['bg-coral-pop/20 text-coral-pop', 'bg-blue-sky/20 text-blue-sky', 'bg-yellow-sun/20 text-navy']; |
| 134 | $avatar_color_class = $avatar_colors[$index % 3]; |
| 135 | |
| 136 | $content = get_the_content(); |
| 137 | $unique_content_id = 'review-content-' . get_the_ID(); |
| 138 | $word_count = str_word_count(strip_tags($content)); |
| 139 | ?> |
| 140 | <div class="p-8 <?php echo esc_attr($card_class . ' ' . $rotation_class); ?>" <?php echo $card_style; ?>> |
| 141 | <div class="mb-4 <?php echo esc_attr($star_class); ?>" <?php echo $star_style; ?>> |
| 142 | <?php for ($i = 1; $i <= 5; $i++) |
| 143 | echo $i <= $rating ? '� |
| 144 | ' : '☆'; ?> |
| 145 | </div> |
| 146 | <div class="awt-review-content <?php echo esc_attr($review_text_class); ?> <?php echo esc_attr($text_class); ?>" |
| 147 | <?php echo $text_style; ?>> |
| 148 | "<?php echo wp_trim_words($content, 25, '...'); ?>" |
| 149 | <?php if ($word_count > 25): ?> |
| 150 | <button |
| 151 | class="awt-read-more-btn text-sm font-bold underline ml-2 cursor-pointer py-1 px-3 focus:outline-none" |
| 152 | data-content-id="<?php echo esc_attr($unique_content_id); ?>">Read More</button> |
| 153 | <template |
| 154 | id="<?php echo esc_attr($unique_content_id); ?>"><?php echo wp_kses_post($content); ?></template> |
| 155 | <?php endif; ?> |
| 156 | </div> |
| 157 | <div class="<?php echo esc_attr($meta_container_class); ?>"> |
| 158 | <?php if ($is_fun): ?> |
| 159 | <div |
| 160 | class="w-12 h-12 rounded-full flex items-center justify-center font-black text-xl <?php echo esc_attr($avatar_color_class); ?>"> |
| 161 | <?php echo esc_html($initial); ?> |
| 162 | </div> |
| 163 | <?php endif; ?> |
| 164 | <div> |
| 165 | <h5 class="<?php echo esc_attr($author_name_class); ?> <?php echo esc_attr($text_class); ?>" |
| 166 | <?php echo $text_style; ?>> |
| 167 | <?php echo esc_html($reviewer_name); ?> |
| 168 | </h5> |
| 169 | <span class="<?php echo esc_attr($author_role_class); ?> <?php echo esc_attr($text_class); ?>" |
| 170 | <?php echo $text_style; ?>>Verified Reader</span> |
| 171 | </div> |
| 172 | </div> |
| 173 | </div> |
| 174 | <?php |
| 175 | $index++; |
| 176 | endwhile; |
| 177 | wp_reset_postdata(); |
| 178 | ?> |
| 179 | </div> |
| 180 | |
| 181 | |
| 182 | |
| 183 | <?php else: ?> |
| 184 | <div class="text-center p-8 border-2 border-dashed border-gray-300 rounded-lg bg-white/50"> |
| 185 | <p class="text-gray-500 text-lg">No reviews found. Add some Book Reviews in the dashboard!</p> |
| 186 | </div> |
| 187 | <?php endif; ?> |
| 188 | |
| 189 | </div> |
| 190 | |
| 191 | <div id="awt-review-modal" |
| 192 | class="fixed inset-0 z-50 flex items-center justify-center hidden opacity-0 transition-opacity duration-300" |
| 193 | role="dialog"> |
| 194 | <div class="absolute inset-0 bg-black/60 backdrop-blur-sm" id="awt-modal-backdrop"></div> |
| 195 | <div class="relative bg-white rounded-2xl p-8 max-w-lg w-full mx-4 shadow-2xl transform scale-95 transition-transform duration-300" |
| 196 | id="awt-modal-content"> |
| 197 | <button id="awt-modal-close" class="absolute top-4 right-4 text-white hover:text-navy transition-colors"> |
| 198 | <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" |
| 199 | stroke="currentColor"> |
| 200 | <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" /> |
| 201 | </svg> |
| 202 | </button> |
| 203 | <div class="text-4xl text-yellow-sun mb-4">� |
| 204 | � |
| 205 | � |
| 206 | � |
| 207 | � |
| 208 | </div> |
| 209 | <div id="awt-modal-text" |
| 210 | class="text-lg text-navy italic leading-relaxed opacity-80 max-h-[60vh] overflow-y-auto pr-2"></div> |
| 211 | </div> |
| 212 | </div> |
| 213 | </section> |