@@ -543,6 +543,39 @@ const search = (0, _instantsearchJsDefault.default)({
543543 indexName: "prod_freepythoncourse",
544544 searchClient
545545});
546+ async function displayFirstAvailableImage(imgElement, imageUrl) {
547+ const imageUrls = [
548+ imageUrl.replace("{size}", "40").replace(".jpg", ".png"),
549+ imageUrl.replace("{size}", "40").replace(".png", ".jpg"),
550+ imageUrl.replace("{size}", "25").replace(".jpg", ".png"),
551+ imageUrl.replace("{size}", "25").replace(".png", ".jpg")
552+ ];
553+ for(let i = 0; i < imageUrls.length; i++)try {
554+ const response = await fetch(imageUrls[i], {
555+ method: "HEAD"
556+ });
557+ if (response.ok) {
558+ imgElement.src = imageUrls[i];
559+ return;
560+ }
561+ } catch (error) {}
562+ imgElement.remove();
563+ }
564+ const observer = new MutationObserver((mutationsList)=>{
565+ for (const mutation of mutationsList)if (mutation.addedNodes.length) mutation.addedNodes.forEach((node)=>{
566+ if (node.querySelectorAll) {
567+ const imgElements = node.querySelectorAll(".search-hit-avatar");
568+ imgElements.forEach((imgElement)=>{
569+ const imageUrl = imgElement.getAttribute("data-img");
570+ displayFirstAvailableImage(imgElement, imageUrl);
571+ });
572+ }
573+ });
574+ });
575+ observer.observe(document.body, {
576+ childList: true,
577+ subtree: true
578+ });
546579search.addWidgets([
547580 (0, _widgets.searchBox)({
548581 container: "#searchbox"
@@ -551,15 +584,42 @@ search.addWidgets([
551584 container: "#hits",
552585 templates: {
553586 item: (hit, { html , components })=>html`
554- <article>
555- <h1>${components.Highlight({
587+ <article class="search-hit">
588+ <header class="search-hit-header">
589+ <img src="letter_avatar_proxy/v4/letter/o/5f8ce5.png" data-img="https://forums.pythonic.guru${hit.avatar_template}" alt="${hit.display_username}'s avatar" class="search-hit-avatar" />
590+ <div class="search-hit-info">
591+ <h2 class="search-hit-title">
592+ <a href="${hit.url}" class="search-hit-link">
593+ ${components.Highlight({
556594 hit,
557- attribute: "cooked"
558- })}</h1>
559- <p>${components.Snippet({
595+ attribute: "topic_title"
596+ })}
597+ </a>
598+ </h2>
599+ <p class="search-hit-meta">
600+ ${hit.display_username && html`פורסם על־ידי ${hit.display_username} `}
601+ בתאריך ${hit.created_at}
602+ </p>
603+ </div>
604+ </header>
605+ <section class="search-hit-content">
606+ <p class="search-hit-text">${components.Snippet({
560607 hit,
561- attribute: "display_username "
608+ attribute: "cooked "
562609 })}</p>
610+ </section>
611+ <footer class="search-hit-footer">
612+ <div class="search-hit-category">קטגוריה: ${hit.category_name}</div>
613+ ${hit.tags.length > 0 && html`
614+ <div class="search-hit-tags">תגיות: ${" "} ${hit.tags.map((t, index)=>html`
615+ <a class="tag-link" href="https://forums.pythonic.guru/t/${t}.html">${t}</a>
616+ ${index < hit.tags.length - 1 ? ", " : ""}`)}
617+ </div>
618+ `}
619+ <div class="search-hit-read-more">
620+ <a href="${hit.url}" class="search-hit-link">לפורום</a>
621+ </div>
622+ </footer>
563623 </article>
564624 `
565625 }
@@ -569,19 +629,15 @@ search.addWidgets([
569629 }),
570630 (0, _widgets.panel)({
571631 templates: {
572- labelText ({ count }, { html }) {
573- return html`תגיות (${count})`;
574- }
632+ header: "תגיות"
575633 }
576634 })((0, _widgets.refinementList))({
577635 container: "#tags-list",
578636 attribute: "tags"
579637 }),
580638 (0, _widgets.panel)({
581639 templates: {
582- labelText ({ count }, { html }) {
583- return html`תגיות (${count})`;
584- }
640+ header: "קטגוריות"
585641 }
586642 })((0, _widgets.refinementList))({
587643 container: "#category_name-list",
0 commit comments