Add request logging middleware and improve avatar/image URL handling

This commit is contained in:
ImBenji
2025-12-31 13:30:24 +00:00
parent 1d60f55cb8
commit 410a78ab2b
2 changed files with 229 additions and 38 deletions

View File

@@ -47,13 +47,17 @@
width: 40px;
height: 40px;
border-radius: 50%;
background-size: cover;
background-position: center;
background-color: rgb(51, 54, 57);
position: relative;
overflow: hidden;
}
.avatar img {
width: 100%;
height: 100%;
object-fit: cover;
}
.avatar-placeholder {
width: 100%;
height: 100%;
@@ -180,6 +184,7 @@
<div class="tweet-header">
<div class="avatar-container">
<div class="avatar" id="avatar">
<img id="avatarImg" style="display: none;" />
<div class="avatar-placeholder" id="avatarPlaceholder" style="display: none;">
<div class="css-175oi2r r-sdzlij r-1udh08x r-45ll9u r-u8s1d r-1v2oles r-176fswd" style="width: calc(100% - 4px); height: calc(100% - 4px);">
<div class="css-175oi2r r-172uzmj r-1pi2tsx r-13qz1uu r-1ny4l3l"></div>
@@ -260,33 +265,44 @@
};
function loadTweetData() {
const config = window.tweetConfig;
try {
const config = window.tweetConfig;
console.log('Loading tweet data with config:', config);
document.getElementById('displayName').textContent = config.displayName;
document.getElementById('username').textContent = config.username;
document.getElementById('tweetText').textContent = config.text;
document.getElementById('tweetTime').textContent = config.timestamp;
document.getElementById('viewsCount').textContent = config.viewsCount;
document.getElementById('displayName').textContent = config.displayName;
document.getElementById('username').textContent = config.username;
document.getElementById('tweetText').textContent = config.text;
document.getElementById('tweetTime').textContent = config.timestamp;
document.getElementById('viewsCount').textContent = config.viewsCount;
const avatar = document.getElementById('avatar');
const avatarPlaceholder = document.getElementById('avatarPlaceholder');
const avatarImg = document.getElementById('avatarImg');
const avatarPlaceholder = document.getElementById('avatarPlaceholder');
if (config.avatarUrl) {
avatar.style.backgroundImage = `url("${config.avatarUrl}")`;
avatarPlaceholder.style.display = 'none';
} else {
avatar.style.backgroundImage = 'none';
avatarPlaceholder.style.display = 'flex';
}
if (config.avatarUrl) {
console.log('Setting avatar URL, length:', config.avatarUrl.length);
avatarImg.src = config.avatarUrl;
avatarImg.style.display = 'block';
avatarPlaceholder.style.display = 'none';
console.log('Avatar image set successfully');
} else {
console.log('No avatarUrl provided, showing placeholder');
avatarImg.style.display = 'none';
avatarPlaceholder.style.display = 'flex';
}
const imageContainer = document.getElementById('imageContainer');
const tweetImage = document.getElementById('tweetImage');
const imageContainer = document.getElementById('imageContainer');
const tweetImage = document.getElementById('tweetImage');
if (config.imageUrl) {
tweetImage.src = config.imageUrl;
imageContainer.style.display = 'block';
} else {
imageContainer.style.display = 'none';
if (config.imageUrl) {
console.log('Setting image URL, length:', config.imageUrl.length);
tweetImage.src = config.imageUrl;
imageContainer.style.display = 'block';
} else {
console.log('No imageUrl provided, hiding image container');
imageContainer.style.display = 'none';
}
} catch (error) {
console.error('Error loading tweet data:', error);
}
}