(function () { var _socialAbort = null; function initSocialActions() { try { if (_socialAbort) { _socialAbort.abort(); } _socialAbort = new AbortController(); var sig = _socialAbort.signal; } catch (_) { var sig = undefined; } // SSR SocialActionsBar (Like + Comments modal + @mentions) try { var SITE_ORIGIN = "https://hungru.co"; var API_ORIGIN = "https://gql.hungru.co"; var IS_LOGGED_IN = false; var VIEWER_ID = ''; try { IS_LOGGED_IN = !!document.querySelector('[data-ssr-viewer="1"]'); } catch (_) {} try { var vid = document.querySelector('[data-ssr-viewer-id]'); if (vid) VIEWER_ID = String(vid.getAttribute('data-ssr-viewer-id') || ''); } catch (_) {} var I18N = {"likedThis_one":"{{name}} liked this","likedThis_andOneOther":"{{name}} and 1 other liked this","likedThis_andOthers":"Liked by {{name}} and {{count}} others","likedThis_twoNames":"{{names}} liked this","likedThis_twoNamesAndOthers":"{{names}} and {{count}} others liked this","commentCount":"{{count}} comment","commentCount_plural":"{{count}} comments","likesTitle":"Liked by","noLikesYet":"No likes yet","loading":"Loading...","commentsTitle":"{{parentType}} Comments","commentsTitleFor":"Comments for {{label}}","labelDish":"Dish","labelReview":"Review","labelNews":"News Feed","addCommentPlaceholder":"Add a comment... (use @ to mention users)","addCommentLabel":"Add a comment","commentsListLabel":"Comments list","noCommentsYet":"No comments yet","beTheFirst":"Be the first to share your thoughts!","send":"Send","close":"Close","review_translate":"Translate","review_showOriginal":"Show Original"}; try { window.__SSR_SOCIAL_I18N = I18N; } catch (_) {} var __OMIT_COMMENTS_MODAL = true; function toDisplayFormat(content) { try { if (!content) return ''; return String(content).replace(/@\[([^\]]+)\]$[^)]+$/g, '@$1'); } catch (_) { return String(content || ''); } } function escapeHtml(s) { return String(s || '') .replace(/&/g, '&') .replace(//g, '>') .replace(/"/g, '"') .replace(/'/g, '''); } function interpolate(tmpl, vars) { try { return String(tmpl || '').replace(/\{\{\s*([a-zA-Z0-9_]+)\s*\}\}/g, function (_m, k) { var v = vars && (vars[k] !== undefined) ? vars[k] : ''; return v === null || v === undefined ? '' : String(v); }); } catch (_) { return String(tmpl || ''); } } function renderMentionsHtml(storageContent, taggedUsers) { try { var s = String(storageContent || ''); var out = ''; var re = /@\[([^\]]+)\]$([^)]+)$/g; var last = 0; var m; while ((m = re.exec(s)) !== null) { var name = m[1] || ''; var id = m[2] || ''; out += escapeHtml(s.slice(last, m.index)); var slug = ''; if (Array.isArray(taggedUsers)) { for (var i = 0; i < taggedUsers.length; i++) { var u = taggedUsers[i]; if (u && String(u.id || '') === String(id)) { slug = u.slug || u.id || ''; break; } } } var href = slug ? ('/users/' + encodeURIComponent(slug) + '?spa=1') : '#'; out += '@' + escapeHtml(name) + ''; last = m.index + m[0].length; } out += escapeHtml(s.slice(last)); return out; } catch (_) { return escapeHtml(toDisplayFormat(storageContent || '')); } } async function gql(operationName, query, variables) { var resp = await fetch(API_ORIGIN + '/graphql', { method: 'POST', credentials: 'include', headers: { 'content-type': 'application/json' }, body: JSON.stringify({ operationName: operationName, query: query, variables: variables || {} }) }); var json = await resp.json().catch(function () { return null; }); return json || null; } function redirectToLogin() { try { window.dispatchEvent(new CustomEvent('hungru:auth-required', { detail: {} })); return; } catch (_) {} try { window.location.href = SITE_ORIGIN + '/login'; } catch (_) {} } // ---- Likes modal ("Liked by") ---- // z-index above comments overlay (99999) when opened from within comments var likesOverlay = document.getElementById('ssr-likes-overlay'); if (!likesOverlay) { likesOverlay = document.createElement('div'); likesOverlay.id = 'ssr-likes-overlay'; likesOverlay.style.display = 'none'; likesOverlay.style.position = 'fixed'; likesOverlay.style.inset = '0'; likesOverlay.style.zIndex = '100000'; likesOverlay.style.pointerEvents = 'auto'; likesOverlay.innerHTML = '

' + '

' + escapeHtml(I18N.likesTitle || 'Liked by') + '

' + ' ' + '

' + '

'; } var likesMount = document.getElementById('ssr-modal-portal') || document.body; if (!likesOverlay.parentNode) likesMount.appendChild(likesOverlay); var modalScrollLockCount = 0; var savedScrollY = 0; function lockScrollForModal() { modalScrollLockCount++; if (modalScrollLockCount === 1) { savedScrollY = window.scrollY || document.documentElement.scrollTop || 0; document.documentElement.style.overflow = 'hidden'; document.body.style.overflow = 'hidden'; } } function unlockScrollForModal() { modalScrollLockCount = Math.max(0, modalScrollLockCount - 1); if (modalScrollLockCount === 0) { document.documentElement.style.overflow = ''; document.body.style.overflow = ''; try { window.scrollTo(0, savedScrollY); } catch (_) {} } } function closeLikesModal() { likesOverlay.style.display = 'none'; unlockScrollForModal(); } likesOverlay.addEventListener('click', function (e) { try { var tRaw = e && e.target; var t = (tRaw && tRaw.nodeType === 3) ? tRaw.parentElement : tRaw; if (!t) return; var closeBtn = t.closest ? t.closest('[data-ssr-likes-close="1"]') : null; if (closeBtn) return closeLikesModal(); var backdrop = t.closest ? t.closest('[data-ssr-likes-backdrop="1"]') : null; if (backdrop) return closeLikesModal(); } catch (_) {} }); async function fetchUsersByIds(ids) { try { var uniq = {}; var list = []; for (var i = 0; i < (ids || []).length; i++) { var v = String(ids[i] || '').trim(); if (!v || uniq[v]) continue; uniq[v] = 1; list.push(v); if (list.length >= 60) break; } if (!list.length) return {}; var query = 'query SearchUsers($input: SearchUserInput) {' + ' searchUsers(input: $input) { id slug name imageURL }' + '}'; var json = await gql('SearchUsers', query, { input: { ids: list } }); var users = (json && json.data && json.data.searchUsers) || []; var map = {}; for (var j = 0; j < users.length; j++) { var u = users[j]; if (u && u.id) map[String(u.id)] = u; } return map; } catch (_) { return {}; } } async function openLikesModal(title, likes) { try { lockScrollForModal(); likesOverlay.style.pointerEvents = 'auto'; likesOverlay.style.display = 'block'; var titleEl = likesOverlay.querySelector('[data-ssr-likes-title="1"]'); if (titleEl) titleEl.textContent = title || (I18N.likesTitle || 'Liked by'); var listEl = likesOverlay.querySelector('[data-ssr-likes-list="1"]'); if (!listEl) return; if (!Array.isArray(likes) || !likes.length) { listEl.innerHTML = '

' + escapeHtml(I18N.noLikesYet || 'No likes yet') + '

'; return; } listEl.innerHTML = '

' + escapeHtml(I18N.loading || 'Loading...') + '

'; var ids = likes.map(function (l) { return l && l.userId ? String(l.userId) : ''; }).filter(Boolean); var totalIds = ids.length; if (ids.length > 60) ids = ids.slice(0, 60); var usersById = await fetchUsersByIds(ids); listEl.innerHTML = (totalIds > 60 ? ('

Showing first 60 of ' + String(totalIds) + '

') : '') + ids.map(function (id) { var u = usersById[String(id)] || null; var name = u && u.name ? String(u.name) : 'User'; var slug = u && (u.slug || u.id) ? String(u.slug || u.id) : ''; var href = slug ? ('/users/' + encodeURIComponent(slug) + '?spa=1') : '#'; var avatar = u && u.imageURL ? '

' : '

' + '' + '

'; return ( '' + '

' + avatar + '

' + '

' + escapeHtml(name) + '

' + '

' + '' ); }).join(''); } catch (_) {} } function getLang() { try { return String(document.documentElement.lang || 'en'); } catch (_) { return 'en'; } } function isHe() { try { return getLang().toLowerCase().indexOf('he') === 0; } catch (_) { return false; } } function likedSummaryHtml(likeCount, name1, name2) { function tr(key, fallback) { try { return I18N && typeof I18N[key] === 'string' ? I18N[key] : fallback; } catch (_) { return fallback; } } function joinTwo(a, b) { return isHe() ? (a + ' ו' + b) : (a + ' and ' + b); } function joinMany(a, b) { return a + ', ' + b; } if (!likeCount || likeCount <= 0) return ''; if (likeCount === 1) { var s1 = interpolate(tr('likedThis_one', '{{name}} liked this'), { name: '' }); return '' + escapeHtml(name1) + ' ' + escapeHtml(String(s1 || '').trim()); } if (likeCount === 2) { if (name2) { var s2 = interpolate(tr('likedThis_twoNames', '{{names}} liked this'), { names: '' }); return '' + escapeHtml(joinTwo(name1, name2)) + ' ' + escapeHtml(String(s2 || '').trim()); } var s3 = interpolate(tr('likedThis_andOneOther', '{{name}} and 1 other liked this'), { name: '' }); return '' + escapeHtml(name1) + ' ' + escapeHtml(String(s3 || '').trim()); } if (name2) { var others = Math.max(0, likeCount - 2); var s4 = interpolate(tr('likedThis_twoNamesAndOthers', '{{names}} and {{count}} others liked this'), { names: '', count: others }); return '' + escapeHtml(joinMany(name1, name2)) + ' ' + escapeHtml(String(s4 || '').trim()); } var others2 = Math.max(0, likeCount - 1); var s5 = interpolate(tr('likedThis_andOthers', 'Liked by {{name}} and {{count}} others'), { name: '', count: others2 }); return '' + escapeHtml(name1) + ' ' + escapeHtml(String(s5 || '').trim()); } // Clickable like counts -> show "Liked by" modal (function () { function closestAttr(el, attr) { try { return el && el.closest ? el.closest('[' + attr + ']') : null; } catch (_) { return null; } } document.addEventListener('click', function (e) { (async function () { try { var t = e && e.target; if (!t) return; var dishSpan = closestAttr(t, 'data-ssr-like-count'); var reviewSpan = closestAttr(t, 'data-ssr-review-like-count'); var newsSpan = closestAttr(t, 'data-ssr-news-like-count'); if (!dishSpan && !reviewSpan && !newsSpan) return; try { e.preventDefault(); e.stopPropagation(); if (e.stopImmediatePropagation) e.stopImmediatePropagation(); } catch (_) {} var id = dishSpan ? dishSpan.getAttribute('data-ssr-like-count') : reviewSpan ? reviewSpan.getAttribute('data-ssr-review-like-count') : newsSpan.getAttribute('data-ssr-news-like-count'); var parentType = dishSpan ? 'DISH' : (reviewSpan ? 'REVIEW' : 'NEWS_FEED'); if (!id) return; var likes = []; if (parentType === 'DISH') { var q = 'query DishLikes($id: ID!) { dish(id: $id) { id likes { userId email } } }'; var json = await gql('DishLikes', q, { id: id }); likes = (json && json.data && json.data.dish && json.data.dish.likes) || []; } else if (parentType === 'REVIEW') { var q2 = 'query ReviewLikes($id: ID!) { getReview(id: $id) { id likes { userId email } } }'; var json2 = await gql('ReviewLikes', q2, { id: id }); likes = (json2 && json2.data && json2.data.getReview && json2.data.getReview.likes) || []; } else if (parentType === 'NEWS_FEED') { var q3 = 'query NewsFeedLikes($id: ID!) { newsFeedItem(id: $id) { id likes { userId email } } }'; var json3 = await gql('NewsFeedLikes', q3, { id: id }); likes = (json3 && json3.data && json3.data.newsFeedItem && json3.data.newsFeedItem.likes) || []; } await openLikesModal(I18N.likesTitle || 'Liked by', Array.isArray(likes) ? likes : []); } catch (_) {} })(); }, sig ? { capture: true, signal: sig } : true); })(); // ---- Like buttons (delegated) ---- (function () { document.addEventListener('click', function (e) { (async function () { var t = e && e.target; var btn = t && t.closest ? t.closest('[data-ssr-like-btn="1"][data-parent-type][data-parent-id]') : null; if (!btn) return; try { e.preventDefault(); if (!IS_LOGGED_IN) return redirectToLogin(); var parentType = btn.getAttribute('data-parent-type') || ''; var parentId = btn.getAttribute('data-parent-id') || ''; if (!parentType || !parentId) return; var liked = btn.getAttribute('data-liked') === '1'; var op = ''; var query = ''; var vars = {}; if (parentType === 'REVIEW') { op = liked ? 'UnlikeReview' : 'LikeReview'; query = liked ? 'mutation UnlikeReview($reviewId: String!) { unlikeReview(reviewId: $reviewId) { id likes { userId email } } }' : 'mutation LikeReview($reviewId: String!) { likeReview(reviewId: $reviewId) { id likes { userId email } } }'; vars = { reviewId: parentId }; } else if (parentType === 'DISH') { op = liked ? 'UnlikeDish' : 'LikeDish'; query = liked ? 'mutation UnlikeDish($dishId: ID!) { unlikeDish(dishId: $dishId) { id likes { userId email } } }' : 'mutation LikeDish($dishId: ID!) { likeDish(dishId: $dishId) { id likes { userId email } } }'; vars = { dishId: parentId }; } else if (parentType === 'NEWS_FEED') { op = liked ? 'UnlikeNewsFeedItem' : 'LikeNewsFeedItem'; query = liked ? 'mutation UnlikeNewsFeedItem($newsFeedItemId: String!) { unlikeNewsFeedItem(newsFeedItemId: $newsFeedItemId) { id likes { userId email } } }' : 'mutation LikeNewsFeedItem($newsFeedItemId: String!) { likeNewsFeedItem(newsFeedItemId: $newsFeedItemId) { id likes { userId email } } }'; vars = { newsFeedItemId: parentId }; } else { return; } btn.disabled = true; btn.style.opacity = '0.6'; var json = await gql(op, query, vars); var err = json && json.errors && json.errors[0] && json.errors[0].message; if (err && String(err).toLowerCase().indexOf('authentication') !== -1) return redirectToLogin(); var entity = parentType === 'REVIEW' ? (json && json.data && (json.data.likeReview || json.data.unlikeReview)) : parentType === 'DISH' ? (json && json.data && (json.data.likeDish || json.data.unlikeDish)) : (json && json.data && (json.data.likeNewsFeedItem || json.data.unlikeNewsFeedItem)); var likes = entity && entity.likes; var count = Array.isArray(likes) ? likes.length : null; btn.setAttribute('data-liked', liked ? '0' : '1'); btn.style.opacity = liked ? '0.7' : '1'; btn.style.color = liked ? '' : 'var(--color-hungru-gold)'; if (typeof count === 'number') { var sel = parentType === 'REVIEW' ? '[data-ssr-review-like-count="' + parentId + '"]' : parentType === 'NEWS_FEED' ? '[data-ssr-news-like-count="' + parentId + '"]' : '[data-ssr-like-count="' + parentId + '"]'; var spans = Array.prototype.slice.call(document.querySelectorAll(sel)); var ids2 = Array.isArray(likes) ? likes.map(function (l) { return l && l.userId ? String(l.userId) : ''; }).filter(Boolean) : []; var previewIds = ids2.slice(0, 2); var usersById2 = previewIds.length ? await fetchUsersByIds(previewIds) : {}; try { window.__SSR_USERS_BY_ID = window.__SSR_USERS_BY_ID || {}; for (var k = 0; k < previewIds.length; k++) { var pid = previewIds[k]; if (usersById2[String(pid)]) window.__SSR_USERS_BY_ID[String(pid)] = usersById2[String(pid)]; } } catch (_) {} var u1 = previewIds[0] ? (usersById2[String(previewIds[0])] || (window.__SSR_USERS_BY_ID && window.__SSR_USERS_BY_ID[String(previewIds[0])])) : null; var u2 = previewIds[1] ? (usersById2[String(previewIds[1])] || (window.__SSR_USERS_BY_ID && window.__SSR_USERS_BY_ID[String(previewIds[1])])) : null; var n1 = u1 && u1.name ? String(u1.name) : 'User'; var n2 = u2 && u2.name ? String(u2.name) : ''; var html = likedSummaryHtml(count, n1, n2); var showLike = typeof count === "number" && count > 0; for (var i = 0; i < spans.length; i++) { spans[i].innerHTML = html || ""; var likeParent = spans[i].parentElement; if (likeParent && likeParent.classList && likeParent.classList.contains("hungru-social-summary-text")) { likeParent.style.display = showLike ? "" : "none"; } } try { var summaryBtnSel = parentType === 'REVIEW' ? '[data-ssr-comments-open="1"][data-parent-type="REVIEW"][data-parent-id="' + parentId + '"]' : parentType === 'NEWS_FEED' ? '[data-ssr-comments-open="1"][data-parent-type="NEWS_FEED"][data-parent-id="' + parentId + '"]' : '[data-ssr-comments-open="1"][data-parent-type="DISH"][data-parent-id="' + parentId + '"]'; var summaryBtns = Array.prototype.slice.call(document.querySelectorAll(summaryBtnSel)); for (var sb = 0; sb < summaryBtns.length; sb++) { var sep = summaryBtns[sb].querySelector('.hungru-social-summary-sep'); var commentSpanSel = parentType === 'REVIEW' ? '[data-ssr-review-comment-count="' + parentId + '"]' : parentType === 'NEWS_FEED' ? '[data-ssr-news-comment-count="' + parentId + '"]' : '[data-ssr-comment-count="' + parentId + '"]'; var commentSpan = summaryBtns[sb].querySelector(commentSpanSel); var hasCommentsText = commentSpan && String(commentSpan.textContent || '').trim().length > 0; if (sep) sep.style.display = (html && hasCommentsText) ? '' : 'none'; summaryBtns[sb].style.display = (!html && !hasCommentsText) ? 'none' : ''; } } catch (_) {} } } catch (_) {} finally { try { btn.disabled = false; btn.style.opacity = ''; } catch (_) {} } })(); }, sig ? { capture: true, signal: sig } : true); })(); if (!__OMIT_COMMENTS_MODAL) { // ---- Comments modal ---- // z-index must be above cookie banner (5000), sticky tabs (100), everything - use 99999 var overlay = document.getElementById('ssr-comments-overlay'); if (!overlay) { overlay = document.createElement('div'); overlay.id = 'ssr-comments-overlay'; } overlay.style.display = 'none'; overlay.style.position = 'fixed'; overlay.style.top = '0'; overlay.style.left = '0'; overlay.style.right = '0'; overlay.style.bottom = '0'; overlay.style.zIndex = '99999'; overlay.style.pointerEvents = 'auto'; overlay.style.visibility = 'visible'; overlay.style.opacity = '1'; overlay.setAttribute('role', 'dialog'); overlay.setAttribute('aria-modal', 'true'); overlay.setAttribute('aria-labelledby', 'ssr-comments-dialog-title'); overlay.innerHTML = '

' + '

Comments

' + '' + '

' + '

' + '' + '' + '' + '

' + '

' + '' + '

' + '

'; var portal = document.getElementById('ssr-modal-portal'); var mountPoint = portal || document.body; if (!overlay.parentNode) { mountPoint.appendChild(overlay); } var state = { parentId: '', parentType: '', taggedUsers: [], commentsById: {}, mentionStart: null, mentionQuery: '', mentionUsers: [], mentionIndex: 0, }; function closeModal() { overlay.style.display = 'none'; overlay.style.pointerEvents = ''; unlockScrollForModal(); state.parentId = ''; state.parentType = ''; state.taggedUsers = []; hideMention(); } function openModal(parentId, parentType, parentLabel) { lockScrollForModal(); overlay.style.display = 'block'; overlay.style.visibility = 'visible'; overlay.style.pointerEvents = 'auto'; state.parentId = parentId; state.parentType = parentType; state.taggedUsers = []; var list = overlay.querySelector('[data-ssr-comments-list="1"]'); list.innerHTML = '

' + escapeHtml(I18N.loading || 'Loading...') + '

'; try { var titleEl = overlay.querySelector('[data-ssr-comments-title="1"]'); var title = 'Comments'; if (parentLabel && String(parentLabel).trim()) { title = String(interpolate(I18N.commentsTitleFor || 'Comments for {{label}}', { label: parentLabel }) || title).trim(); } else { var pt = parentType === 'REVIEW' ? (I18N.labelReview || 'Review') : parentType === 'DISH' ? (I18N.labelDish || 'Dish') : parentType === 'NEWS_FEED' ? (I18N.labelNews || 'News') : String(parentType || ''); title = String(interpolate(I18N.commentsTitle || '{{parentType}} Comments', { parentType: pt }) || title).trim(); } if (titleEl) titleEl.textContent = title || 'Comments'; } catch (_) {} var input = overlay.querySelector('[data-ssr-comments-input="1"]'); if (input) { input.value = ''; try { requestAnimationFrame(function () { input.focus(); }); } catch (_) {} } loadComments(); } async function loadComments() { var list = overlay.querySelector('[data-ssr-comments-list="1"]'); try { var q = 'query GetComments($parentId: ID!, $parentType: CommentParentType!) {' + ' getComments(parentId: $parentId, parentType: $parentType) {' + ' id content createdAt likes { userId email }' + ' author { id slug name imageURL }' + ' taggedUsers { id slug name imageURL }' + ' }' + '}'; var json = await gql('GetComments', q, { parentId: state.parentId, parentType: state.parentType }); var err = json && json.errors && json.errors[0] && json.errors[0].message; if (err && String(err).toLowerCase().indexOf('authentication') !== -1) return redirectToLogin(); var items = (json && json.data && json.data.getComments) || []; try { state.commentsById = {}; for (var ci = 0; ci < items.length; ci++) { var c0 = items[ci]; if (c0 && c0.id) state.commentsById[String(c0.id)] = c0; } } catch (_) {} try { var sel = state.parentType === 'REVIEW' ? '[data-ssr-review-comment-count="' + state.parentId + '"]' : state.parentType === 'NEWS_FEED' ? '[data-ssr-news-comment-count="' + state.parentId + '"]' : '[data-ssr-comment-count="' + state.parentId + '"]'; var spans = Array.prototype.slice.call(document.querySelectorAll(sel)); var cc = items.length || 0; var txt = ''; try { if (cc > 0) { var tmpl = cc === 1 ? (I18N.commentCount || '{{count}} comment') : (I18N.commentCount_plural || '{{count}} comments'); txt = interpolate(tmpl, { count: cc }); } } catch (_) { txt = cc > 0 ? String(cc) : ''; } for (var si = 0; si < spans.length; si++) spans[si].textContent = txt; try { var btnSel = state.parentType === 'REVIEW' ? '[data-ssr-comments-open="1"][data-parent-type="REVIEW"][data-parent-id="' + state.parentId + '"]' : state.parentType === 'NEWS_FEED' ? '[data-ssr-comments-open="1"][data-parent-type="NEWS_FEED"][data-parent-id="' + state.parentId + '"]' : '[data-ssr-comments-open="1"][data-parent-type="DISH"][data-parent-id="' + state.parentId + '"]'; var btns = Array.prototype.slice.call(document.querySelectorAll(btnSel)); for (var bi = 0; bi < btns.length; bi++) { var sep = btns[bi].querySelector('.hungru-social-summary-sep'); var likeSpanSel = state.parentType === 'REVIEW' ? '[data-ssr-review-like-count="' + state.parentId + '"]' : state.parentType === 'NEWS_FEED' ? '[data-ssr-news-like-count="' + state.parentId + '"]' : '[data-ssr-like-count="' + state.parentId + '"]'; var likeSpan = btns[bi].querySelector(likeSpanSel); var hasLikes = likeSpan && String(likeSpan.innerHTML || '').trim().length > 0; var hasComments = Boolean(txt && String(txt).trim().length > 0); if (sep) sep.style.display = (hasLikes && hasComments) ? '' : 'none'; btns[bi].style.display = (!hasLikes && !hasComments) ? 'none' : ''; } } catch (_) {} } catch (_) {} if (!items.length) { list.innerHTML = '

No comments yet. Be the first.

'; return; } list.innerHTML = items.map(renderComment).join(''); } catch (e) { list.innerHTML = '

Unable to load comments.

'; } } function renderComment(c) { try { var a = c && c.author ? c.author : {}; var name = escapeHtml(a.name || 'User'); var avatar = a.imageURL ? '

' : '

' + '' + '

'; var body = renderMentionsHtml(c.content || '', c.taggedUsers || []); var slug = a.slug || a.id || ''; var profileHref = slug ? ('/users/' + encodeURIComponent(slug) + '?spa=1') : '#'; var likeCount = Array.isArray(c.likes) ? c.likes.length : 0; var likedByMe = false; try { if (VIEWER_ID && Array.isArray(c.likes)) { for (var li = 0; li < c.likes.length; li++) { if (String(c.likes[li] && c.likes[li].userId || '') === String(VIEWER_ID)) { likedByMe = true; break; } } } } catch (_) {} var commentId = c && c.id ? String(c.id) : ''; return ( '

' + '' + avatar + '' + '

' + '' + name + '' + '

' + body + '

' + (commentId ? ( '

' + '' + '' + String(likeCount) + '' + '

' ) : '') + '

' + '

' ); } catch (_) { return ''; } } function hideMention() { var pop = overlay.querySelector('[data-ssr-mention-pop="1"]'); pop.style.display = 'none'; pop.innerHTML = ''; state.mentionUsers = []; state.mentionIndex = 0; state.mentionStart = null; state.mentionQuery = ''; } var mentionDebounce = null; async function searchMention(q) { try { var query = 'query SearchUsers($input: SearchUserInput) {' + ' searchUsers(input: $input) { id slug name imageURL }' + '}'; var json = await gql('SearchUsers', query, { input: { name: q || '' } }); var users = (json && json.data && json.data.searchUsers) || []; state.mentionUsers = Array.isArray(users) ? users.slice(0, 8) : []; state.mentionIndex = 0; renderMentionPop(); } catch (_) {} } function renderMentionPop() { var pop = overlay.querySelector('[data-ssr-mention-pop="1"]'); if (!state.mentionUsers.length) { pop.style.display = 'none'; pop.innerHTML = ''; return; } pop.style.display = 'block'; pop.innerHTML = state.mentionUsers.map(function (u, idx) { var active = idx === state.mentionIndex ? ' style="background:rgba(255,255,255,.06);"' : ''; var img = u.imageURL ? '

' : '

' + '' + '

'; return ( '' ); }).join(''); var btns = Array.prototype.slice.call(pop.querySelectorAll('button[data-idx]')); btns.forEach(function (b) { b.addEventListener('click', function () { try { selectMention(Number(this.getAttribute('data-idx') || '0')); } catch (_) {} }); }); } function selectMention(idx) { var input = overlay.querySelector('[data-ssr-comments-input="1"]'); if (!input) return; var user = state.mentionUsers[idx]; if (!user) return; var v = input.value || ''; var cursor = input.selectionStart || v.length; var start = state.mentionStart; if (start == null) return; var before = v.slice(0, start); var after = v.slice(cursor); var insert = '@' + (user.name || '') + ' '; var next = before + insert + after; input.value = next; if (!state.taggedUsers.some(function (u) { return u.id === user.id; })) state.taggedUsers.push(user); hideMention(); try { var newPos = (before + insert).length; input.focus(); input.setSelectionRange(newPos, newPos); } catch (_) {} } function detectMention() { var input = overlay.querySelector('[data-ssr-comments-input="1"]'); if (!input) return; var v = input.value || ''; var cursor = input.selectionStart || v.length; var before = v.slice(0, cursor); var at = before.lastIndexOf('@'); if (at === -1) return hideMention(); var afterAt = before.slice(at + 1); if (/[\s\n\[\]()]/.test(afterAt)) return hideMention(); state.mentionStart = at; state.mentionQuery = afterAt; if (mentionDebounce) clearTimeout(mentionDebounce); mentionDebounce = setTimeout(function () { searchMention(state.mentionQuery); }, state.mentionQuery.length ? 200 : 0); } overlay.addEventListener('click', function (e) { try { var t = e.target; if (!t) return; if (t.getAttribute && t.getAttribute('data-ssr-comments-backdrop') === '1') closeModal(); if (t.getAttribute && t.getAttribute('data-ssr-comments-close') === '1') closeModal(); } catch (_) {} }); var sendBtn = overlay.querySelector('[data-ssr-comments-send="1"]'); sendBtn.addEventListener('click', function () { (async function () { try { if (!IS_LOGGED_IN) return redirectToLogin(); var input = overlay.querySelector('[data-ssr-comments-input="1"]'); var display = (input.value || '').trim(); if (!display) return; var storage = display; state.taggedUsers.forEach(function (u) { try { var name = String(u.name || '').trim(); var id = String(u.id || '').trim(); if (!name || !id) return; var escaped = name.replace(/[.*+?^()|[\]\\]/g, '\\$&'); var re = new RegExp('@' + escaped + '(?![\[\w])', 'g'); storage = storage.replace(re, '@[' + name + '](' + id + ')'); } catch (_) {} }); var taggedIds = state.taggedUsers.map(function (u) { return String(u.id || ''); }).filter(Boolean); var m = 'mutation CreateComment($input: CreateCommentInput!) {' + ' createComment(input: $input) {' + ' id content createdAt ' + ' author { id slug name imageURL } ' + ' likes { userId email } ' + ' taggedUsers { id slug name imageURL }' + ' }' + '}'; sendBtn.disabled = true; var json = await gql('CreateComment', m, { input: { content: storage, parentId: state.parentId, parentType: state.parentType, taggedUserIds: taggedIds.length ? taggedIds : undefined, } }); var err = json && json.errors && json.errors[0] && json.errors[0].message; if (err && String(err).toLowerCase().indexOf('authentication') !== -1) return redirectToLogin(); var created = json && json.data && json.data.createComment; if (!created) return; input.value = ''; state.taggedUsers = []; hideMention(); await loadComments(); } catch (_) {} finally { try { sendBtn.disabled = false; } catch (_) {} } })(); }); var inputEl = overlay.querySelector('[data-ssr-comments-input="1"]'); inputEl.addEventListener('input', function () { try { detectMention(); } catch (_) {} }); inputEl.addEventListener('keydown', function (e) { try { if (!state.mentionUsers.length) return; if (e.key === 'ArrowDown') { e.preventDefault(); state.mentionIndex = Math.min(state.mentionIndex + 1, state.mentionUsers.length - 1); renderMentionPop(); } if (e.key === 'ArrowUp') { e.preventDefault(); state.mentionIndex = Math.max(state.mentionIndex - 1, 0); renderMentionPop(); } if (e.key === 'Enter' || e.key === 'Tab') { if (state.mentionUsers[state.mentionIndex]) { e.preventDefault(); selectMention(state.mentionIndex); } } if (e.key === 'Escape') { hideMention(); } } catch (_) {} }, true); // Open modal buttons (delegated) (function () { document.addEventListener('click', function (e) { try { var t = e && e.target; if (!t) return; if (t.closest && (t.closest('[data-ssr-like-count]') || t.closest('[data-ssr-review-like-count]') || t.closest('[data-ssr-news-like-count]'))) return; var btn = t.closest ? t.closest('[data-ssr-comments-btn="1"],[data-ssr-comments-open="1"]') : null; if (!btn) return; e.preventDefault(); var parentType = btn.getAttribute('data-parent-type') || ''; var parentId = btn.getAttribute('data-parent-id') || ''; if (!parentType || !parentId) return; var parentLabel = btn.getAttribute('data-parent-label') || ''; openModal(parentId, parentType, parentLabel); } catch (_) {} }, sig ? { capture: true, signal: sig } : true); })(); // Comment like/unlike overlay.addEventListener('click', function (e) { (async function () { try { var t = e && e.target; if (!t) return; var likeCountEl = t.closest ? t.closest('[data-ssr-comment-like-count]') : null; if (likeCountEl) { e.preventDefault(); e.stopPropagation(); var commentId2 = likeCountEl.getAttribute('data-ssr-comment-like-count') || ''; if (!commentId2) return; var c2 = state.commentsById && state.commentsById[String(commentId2)]; var likes2 = c2 && c2.likes ? c2.likes : []; return openLikesModal(I18N.likesTitle || 'Liked by', Array.isArray(likes2) ? likes2 : []); } var btn = t.closest ? t.closest('[data-ssr-comment-like="1"][data-comment-id]') : null; if (!btn) return; e.preventDefault(); if (!IS_LOGGED_IN) return redirectToLogin(); var commentId = btn.getAttribute('data-comment-id') || ''; if (!commentId) return; var liked = btn.getAttribute('data-liked') === '1'; var op = liked ? 'UnlikeComment' : 'LikeComment'; var q = liked ? 'mutation UnlikeComment($commentId: ID!) { unlikeComment(commentId: $commentId) { id likes { userId email } } }' : 'mutation LikeComment($commentId: ID!) { likeComment(commentId: $commentId) { likes { userId email } } }'; btn.disabled = true; var json = await gql(op, q, { commentId: commentId }); var err = json && json.errors && json.errors[0] && json.errors[0].message; if (err && String(err).toLowerCase().indexOf('authentication') !== -1) return redirectToLogin(); var res = json && json.data && (json.data.likeComment || json.data.unlikeComment); var likes = res && res.likes; var count = Array.isArray(likes) ? likes.length : null; btn.setAttribute('data-liked', liked ? '0' : '1'); btn.style.color = liked ? '' : 'var(--color-hungru-gold)'; if (typeof count === 'number') { var spans = Array.prototype.slice.call(overlay.querySelectorAll('[data-ssr-comment-like-count="' + commentId + '"]')); for (var i = 0; i < spans.length; i++) spans[i].textContent = String(count); } if (state.commentsById && state.commentsById[String(commentId)] && Array.isArray(likes)) { state.commentsById[String(commentId)] = Object.assign({}, state.commentsById[String(commentId)], { likes: likes }); } } catch (_) {} finally { try { var t2 = e && e.target; var b2 = t2 && t2.closest ? t2.closest('[data-ssr-comment-like="1"]') : null; if (b2) b2.disabled = false; } catch (_) {} } })(); }); } } catch (e) {} } function runInit() { initSocialActions(); } if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', runInit); } else { runInit(); } window.addEventListener('pageshow', function (e) { if (e.persisted) runInit(); }); window.addEventListener('hungru:init-social-actions', runInit); })();