eweng.space/assets/main.js

/* === ANIMATION TITRE-NAV (toutes les pages) === */
function animerTitreNav() {
    document.querySelectorAll('.fenetre-nom').forEach(el => {
        el.innerHTML = el.textContent.split('').map((c, i) => {
            if (c === ' ') return ' ';
            const delayColor = (i * 0.3).toFixed(1);
            const delayLevite = (Math.random() * 4).toFixed(2);
            const duree = (3 + Math.random() * 3).toFixed(2);
            return `<span style="display:inline-block;animation:colorshift 12s ease-in-out infinite,levite ${duree}s ease-in-out infinite;animation-delay:-${delayColor}s,-${delayLevite}s">${c}</span>`;
        }).join('');
    });
}

/* === /NOW (index.html) === */
function afficherNow() {
    const phrasesNow = [
        "/now : faut que je fasses les courses.",
        "/now : les arbres vibrent !",
        "/now : les mains, les jambes, avancent..",
        "/now : lave toi le visage.",
        "/now : il pleut, et c'est très bien comme ça.",
        "/now : pas mal la page d'accueil !",
        "/now : i love my computer",
        "/now : demain je serais en cours, j'espère",
        "/now : je resterais auprès de toi pour toujours",
        "/now : je serais toi j'irais prendre l'air",
        "/now : je dois vraiment aller dormir la"
    ];

    const spanNow = document.querySelector('.now');
    if (spanNow) {
        const indexAleatoire = Math.floor(Math.random() * phrasesNow.length);
        spanNow.textContent = phrasesNow[indexAleatoire];
    }
}

/* === GRILLE ALBUMS (reviews/index.html) === */
function toSlug(titre) {
    return titre
        .toLowerCase()
        .normalize('NFD').replace(/[\u0300-\u036f]/g, '')
        .replace(/\s+/g, '-')
        .replace(/[^a-z0-9-]/g, '');
}

function chargerAlbums() {
    fetch('data/albums.json')
        .then(r => r.json())
        .then(albums => {
            const grille = document.getElementById('grille');

            albums.forEach(album => {
                const carte = document.createElement('div');
                carte.className = 'carte';

                const media = album.cover
                    ? `<img src="${album.cover}" alt="${album.titre}" onerror="this.outerHTML='<div class=\\'placeholder\\'>${album.titre}</div>'">`
                    : `<div class="placeholder">${album.titre}</div>`;

                const fav = album.favoris ? '<span class="badge-fav">♥</span>' : '';

                carte.innerHTML = `
                    ${fav}
                    ${media}
                    <div class="nom">
                        ${album.titre}<br>
                        <span class="artiste">${album.artiste}</span>
                    </div>
                `;

                carte.addEventListener('mouseenter', () => {
                    grille.classList.add('hovering');
                    carte.classList.add('actif');
                });
                carte.addEventListener('mouseleave', () => {
                    grille.classList.remove('hovering');
                    carte.classList.remove('actif');
                });

                carte.addEventListener('click', () => {
                    window.location.href = `albums/${toSlug(album.titre)}.html`;
                });

                grille.appendChild(carte);
            });
        })
        .catch(() => {
            document.getElementById('grille').textContent = 'impossible de charger les albums.';
        });
}

/* === FEED DEPECHES (depeches.html) === */
function chargerDepeches() {
    fetch('/api/depeches')
        .then(r => r.json())
        .then(depeches => {
            const feed = document.getElementById('feed');
            feed.innerHTML = '';

            if (depeches.length === 0) {
                feed.innerHTML = '<p class="chargement">aucune dépêche pour l\'instant.</p>';
                return;
            }

            depeches.forEach(d => {
                const el = document.createElement('div');
                el.className = 'depeche';

                const img = d.image
                    ? `<img src="${d.image}" class="depeche-image" alt="">`
                    : '';

                el.innerHTML = `
                    <div class="depeche-date">ewen - ${d.date}</div>
                    <div class="depeche-texte">${d.texte}</div>
                    ${img}
                `;

                feed.appendChild(el);
            });
        })
        .catch(() => {
            document.getElementById('feed').innerHTML =
                '<p class="chargement">impossible de charger les dépêches.</p>';
        });
}

/* === INIT === */
document.addEventListener('DOMContentLoaded', () => {
    animerTitreNav();

    if (document.querySelector('.now')) {
        afficherNow();
    }

    if (document.getElementById('grille')) {
        chargerAlbums();
    }

    if (document.getElementById('feed')) {
        chargerDepeches();
    }
});