syhily/yufan.me
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: the avatar in comment form.

Browse Source
This commit is contained in:
Yufan Sheng 2024-06-19 03:59:00 +08:00
parent f0c4ef68e5
commit 28ce980061
Signed by: syhily
GPG Key ID: DEB186763C308C31
2 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/assets/scripts/yufan.me.js
View File

@ -113,6 +113,7 @@ if (typeof comments !== 'undefined' && comments !== null) {
// TODO: Load the commenter information from the cookie. // TODO: Load the commenter information from the cookie.
comments.addEventListener('focusout', (event) => { comments.addEventListener('focusout', (event) => {
const avatar = document.querySelector('#commentForm img.avatar');
if (event.target === document.querySelector('input[name="email"]')) { if (event.target === document.querySelector('input[name="email"]')) {
event.stopPropagation(); event.stopPropagation();
const email = event.target.value; const email = event.target.value;
@ -121,11 +122,11 @@ if (typeof comments !== 'undefined' && comments !== null) {
fetch(`/comments/avatar?email=${email}`) fetch(`/comments/avatar?email=${email}`)
.then((res) => res.text()) .then((res) => res.text())
.then((link) => { .then((link) => {
document.querySelector('#commentForm img.avatar').src = link; avatar.src = link;
}) })
.catch((e) => console.log(e)); .catch((e) => console.log(e));
} else { } else {
document.querySelector('#commentForm img.avatar').src = '/images/default-avatar.png'; avatar.src = avatar.dataset.src;
} }
} }
}); });

5
src/components/comment/Comments.astro
View File

@ -1,6 +1,8 @@
--- ---
import { getConfig, loadComments } from '@/components/comment/artalk'; import { getConfig, loadComments } from '@/components/comment/artalk';
import Comment from '@/components/comment/Comment.astro'; import Comment from '@/components/comment/Comment.astro';
import { urlJoin } from '@/helpers/tools';
import options from '@/options';
// This is a component which loads comments and renders it on server-side. // This is a component which loads comments and renders it on server-side.
interface Props { interface Props {
@ -25,7 +27,8 @@ const comments = config != null ? await loadComments(commentKey, title, 0, confi
<div class="comment-from-avatar flex-avatar"> <div class="comment-from-avatar flex-avatar">
<img <img
alt="头像" alt="头像"
src="/images/default-avatar.png" src={urlJoin(options.assetsPrefix(), '/images/default-avatar.png')}
data-src={urlJoin(options.assetsPrefix(), '/images/default-avatar.png')}
class="avatar avatar-40 photo avatar-default" class="avatar avatar-40 photo avatar-default"
height="40" height="40"
width="40" width="40"