fix: the avatar in comment form.

This commit is contained in:
Yufan Sheng 2024-06-19 03:59:00 +08:00
parent 080f85b08f
commit 6a4f8a948a
Signed by: syhily
GPG Key ID: 9D18A22A7DCD5A9B
2 changed files with 7 additions and 3 deletions

View File

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

View File

@ -1,6 +1,8 @@
---
import { getConfig, loadComments } from '@/components/comment/artalk';
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.
interface Props {
@ -25,7 +27,8 @@ const comments = config != null ? await loadComments(commentKey, title, 0, confi
<div class="comment-from-avatar flex-avatar">
<img
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"
height="40"
width="40"