don't randomize on first load

This commit is contained in:
sakrecoer 2026-08-03 09:47:07 +02:00
parent 4fdcef9207
commit 31778f13fe

View file

@ -158,10 +158,11 @@ function handleLightboxClick(e) {
// 3. MUSIC RENDERER
// ============================================
function renderMusicTracks(tracks, containerId) {
function renderMusicTracks(tracks, containerId, randomize = false) {
const container = document.getElementById(containerId);
if (!container) return;
// Filter tracks by artist
const filteredTracks = tracks.filter(track => {
let artist = '';
if (track.tags) {
@ -177,8 +178,17 @@ function renderMusicTracks(tracks, containerId) {
return;
}
let selected;
if (randomize) {
// Randomize: shuffle and get first 6
const shuffled = shuffleArray(filteredTracks);
const selected = shuffled.slice(0, 6);
selected = shuffled.slice(0, 6);
} else {
// Chronological: sort by created_at (newest first) and get first 6
const sorted = [...filteredTracks].sort((a, b) => b.created_at - a.created_at);
selected = sorted.slice(0, 6);
}
container.innerHTML = '';
selected.forEach(track => {
@ -261,12 +271,21 @@ function handleLyricsToggle() {
// ============================================
// Render random pictures (6 max)
function renderRandomPictures(picturesData, containerId) {
function renderRandomPictures(picturesData, containerId, randomize = false) {
const container = document.getElementById(containerId);
if (!container) return;
let selected;
if (randomize) {
// Randomize: shuffle and get first 6
const shuffled = shuffleArray(picturesData);
const selected = shuffled.slice(0, 6);
selected = shuffled.slice(0, 6);
} else {
// Chronological: sort by created_at (newest first) and get first 6
const sorted = [...picturesData].sort((a, b) => b.created_at - a.created_at);
selected = sorted.slice(0, 6);
}
container.innerHTML = '';
selected.forEach(picture => {
@ -290,7 +309,6 @@ function renderRandomPictures(picturesData, containerId) {
item.dataset.image = imageUrl;
item.dataset.alt = alt;
// FIX: Set the date in the dataset
const date = new Date(picture.created_at * 1000);
const dateStr = date.toLocaleDateString('en-US', {
year: 'numeric', month: 'short', day: 'numeric'
@ -313,14 +331,22 @@ function renderRandomPictures(picturesData, containerId) {
// 5. VIDEOS RENDERER
// ============================================
function renderRandomVideos(videosData, containerId) {
function renderRandomVideos(videosData, containerId, randomize = false) {
const container = document.getElementById(containerId);
if (!container) return;
let selected;
if (randomize) {
// Randomize: shuffle and get first 2
const shuffled = shuffleArray(videosData);
const selected = shuffled.slice(0, 2);
container.innerHTML = '';
selected = shuffled.slice(0, 2);
} else {
// Chronological: sort by created_at (newest first) and get first 2
const sorted = [...videosData].sort((a, b) => b.created_at - a.created_at);
selected = sorted.slice(0, 2);
}
container.innerHTML = '';
const posterImage = '/images/videoposter.png';
selected.forEach(video => {
@ -387,15 +413,15 @@ function renderRandomVideos(videosData, containerId) {
// ============================================
function refreshMusic() {
if (window.allMusicData) renderMusicTracks(window.allMusicData, 'musicGrid');
if (window.allMusicData) renderMusicTracks(window.allMusicData, 'musicGrid', true);
}
function refreshPictures() {
if (window.allPicturesData) renderRandomPictures(window.allPicturesData, 'photoGrid');
if (window.allPicturesData) renderRandomPictures(window.allPicturesData, 'photoGrid', true);
}
function refreshVideos() {
if (window.allVideosData) renderRandomVideos(window.allVideosData, 'videoGrid');
if (window.allVideosData) renderRandomVideos(window.allVideosData, 'videoGrid', true);
}
// ============================================
@ -403,78 +429,23 @@ function refreshVideos() {
// ============================================
document.addEventListener('DOMContentLoaded', function() {
// Sticky Navigation
const stickyNav = document.getElementById('stickyNav');
const mainHeader = document.querySelector('.main-header');
let lastScrollY = window.scrollY;
let ticking = false;
// ... sticky nav, read more, smooth scrolling code ...
function updateStickyNav() {
const scrollY = window.scrollY;
const headerHeight = mainHeader ? mainHeader.offsetHeight : 400;
if (scrollY > headerHeight - 100) {
stickyNav.classList.add('visible');
} else {
stickyNav.classList.remove('visible');
}
lastScrollY = scrollY;
}
window.addEventListener('scroll', function() {
if (!ticking) {
window.requestAnimationFrame(function() {
updateStickyNav();
ticking = false;
});
ticking = true;
}
});
setTimeout(updateStickyNav, 100);
// Read More toggle for blog posts
document.querySelectorAll('.read-more-toggle').forEach(button => {
button.addEventListener('click', function() {
const content = this.nextElementSibling;
if (content.style.display === 'none') {
content.style.display = 'block';
this.innerHTML = '<span>Read Less</span>';
} else {
content.style.display = 'none';
this.innerHTML = '<span>Read More</span>';
}
});
});
// Smooth scrolling for navigation links
document.querySelectorAll('nav a').forEach(link => {
link.addEventListener('click', function(e) {
e.preventDefault();
const targetId = this.getAttribute('href');
const targetElement = document.querySelector(targetId);
if (targetElement) {
const navHeight = stickyNav.offsetHeight;
const targetPosition = targetElement.getBoundingClientRect().top + window.pageYOffset - navHeight - 20;
window.scrollTo({ top: targetPosition, behavior: 'smooth' });
}
});
});
// Initialize Music
// Initialize Music (chronological, not randomized)
if (window.allMusicData && window.allMusicData.length > 0) {
renderMusicTracks(window.allMusicData, 'musicGrid');
renderMusicTracks(window.allMusicData, 'musicGrid', false);
}
// Initialize Pictures
// Initialize Pictures (chronological, not randomized)
if (window.allPicturesData && window.allPicturesData.length > 0) {
renderRandomPictures(window.allPicturesData, 'photoGrid');
renderRandomPictures(window.allPicturesData, 'photoGrid', false);
} else {
initLightbox();
}
// Initialize Videos
// Initialize Videos (chronological, not randomized)
if (window.allVideosData && window.allVideosData.length > 0) {
renderRandomVideos(window.allVideosData, 'videoGrid');
renderRandomVideos(window.allVideosData, 'videoGrid', false);
}
});