Système Séries — Saisons & Épisodes Complet
Refonte architecturale majeure : CineVip supporte désormais pleinement les séries avec gestion
multi-saisons, navigation entre épisodes dans le player, autoplay avec countdown 8 secondes,
et formulaire d'ajout admin entièrement repensé avec builder dynamique.
Nouveau
Séries
Player
Admin
BDD
Base de données — 2 nouvelles tables
Table saisons : contenu_id, numero_saison, titre, description, annee, image_affiche
Table episodes : saison_id, titre, description, duree, video_url, image_miniature, vues
Clés étrangères CASCADE DELETE : episodes → saisons → contenus
watch.php — Page série redesignée
Onglets de saisons cliquables avec compteur d'épisodes par saison
Liste épisodes avec miniature 80×56px, numéro Bebas Neue, titre, durée, date, vues
Bouton "Regarder" dans le hero pointe automatiquement sur S1·E1
Badge série dans les meta : nombre de saisons + total d'épisodes
Scroll interne (max-height 520px) dans la liste d'épisodes
Overlay play rouge au hover sur chaque miniature d'épisode
play.php — Navigation épisodes & Autoplay
Boutons Épisode Précédent / Suivant dans la topbar avec label S·E
Bouton skip épisode dans la barre de contrôles du player
Bannière autoplay à 30s de la fin, countdown 8 secondes avec barre de progression
Bouton "Annuler" l'autoplay — ne se relance pas sur le même épisode
Raccourcis : Shift+→/← = épisode suivant/précédent, N = suivant
Navigation traversant les frontières de saisons (S1E10 → S2E1)
Miniature + titre du prochain épisode affichés dans la bannière autoplay
Vues comptées individuellement par épisode (table episodes.vues)
contenu_add.php — Admin enrichi
Section saisons/épisodes visible uniquement si type = Série ou Anime
Ajout dynamique de saisons : titre, numéro, année, description, image affiche
Ajout d'épisodes par saison : titre, URL vidéo, durée, date sortie, miniature, description
Renumérotation automatique des épisodes après suppression
Saisons collapsibles avec toggle chevron
Compteur d'épisodes en temps réel sur le badge de chaque saison
Insertion BDD en transaction sécurisée (contenu → saisons → épisodes)
Vérification Email OTP + Top 10 + Suggestions
Triple mise à jour : vérification d'email obligatoire par code OTP à 6 chiffres envoyé
via SMTP Hostinger, lancement de la page classement communautaire Top 10, et page de
suggestions personnalisées basées sur l'historique de visionnage.
Nouveau
Sécurité
Email
Communauté
Personnalisation
Vérification Email — OTP 6 chiffres
Code OTP 6 chiffres aléatoire, valable 15 minutes
Email HTML formaté avec design CineVip envoyé via PHPMailer + SMTP Hostinger
Accès au site bloqué tant que l'email n'est pas vérifié
Renvoi du code disponible après cooldown 60 secondes
Marquage automatique email_verified = 1 en BDD après validation
Nouveau fichier includes/send_verification_email.php avec PHPMailer
top10.php — Classement Communautaire
Hero card panoramique pour le #1 avec fond image + glow rouge
Lignes #2 à #10 avec rang coloré : or / argent / bronze pour le podium
Filtres type : Tout / Films / Séries / Animés / Docs
Filtres période : Tous temps / Cette année / 5 dernières années / Ce mois
Score avec étoiles, note /10, nombre total de votes
Stats globales en hero : contenus notés, note moyenne, vues totales
suggestions.php — Recommandations Personnalisées
Algorithme basé sur les 30 dernières entrées de l'historique de visionnage
Pondération par notes : contenu bien noté compte double dans l'analyse des genres
Choix rapide : deux cartes "Film au hasard" / "Série au hasard" avec résultat inline
Exclusion automatique des contenus déjà vus de la liste de suggestions
Stats personnelles : films vus, note moyenne, temps de visionnage, genre favori
Modal explicatif du fonctionnement de l'algorithme de recommandation
Proxy HLS Anti-CORS & Refonte Login
Correction définitive du streaming : les flux HLS zebi.xalaflix.design sont maintenant
proxifiés par ton propre serveur pour contourner les blocages CORS. Redesign complet
de login.php avec esthétique cinématographique dark premium.
Corrigé
Amélioré
Streaming
Auth
hls-proxy.php — Nouveau fichier
Proxy PHP côté serveur : relaie les requêtes vers zebi.xalaflix.design
Réécriture des URLs dans les playlists .m3u8 pour que les segments passent aussi par le proxy
Headers CORS ajoutés automatiquement sur chaque réponse proxifiée
play.php mis à jour : détection automatique domaines à proxifier
login.php — Redesign Cinématographique
Fond noir avec poster wall animé (mur d'affiches en arrière-plan)
Overlay glassmorphism sur le formulaire de connexion
Logo CineVip + tagline "Le streaming premium" au-dessus du form
Fix colonne notification_email/nouveautes/favoris manquantes dans la BDD utilisateurs
Corrections BDD & APIs
api/rate.php : correction nom table evaluations et colonne contenu_id
api/comments.php : correction colonne commentaire → texte
Ajout colonne localisation dans la table utilisateurs
Refonte Profil, Pricing & Changelog
Trois pages entièrement redessinées avec une esthétique premium unifiée : profil utilisateur
avec système d'onglets, page tarification avec 3 plans détaillés, et changelog avec timeline
verticale animée. Même langage visuel Bebas Neue + glow rouge sur les trois.
Amélioré
Design
UX
profile.php — Refait de A à Z
Hero banner avec avatar centré, bordure rouge, initiales Bebas Neue et chips de plan
4 onglets : Informations / Sécurité / Préférences / Statistiques
Toggles notifications : email, push, nouveautés, favoris (enregistrés en BDD)
Changement de mot de passe avec vérification de l'ancien
Statistiques : films vus, temps regardé, genres favoris, note moyenne donnée
Champs profil public : bio, localisation, site web, langue préférée
pricing.php — Plans Tarifaires
3 plans : Free / Premium / VIP avec ribbons "⭐ Populaire" et "👑 Ultimate"
Tableau comparatif des fonctionnalités incluses par plan
Badges prix avec animation pulse sur le plan recommandé
changelog.php — Timeline Redesignée
Timeline verticale avec fil rouge animé dégradé
Dots pulsants pour les versions majeures, icône contextuelle par version
Section stats : version courante, nombre de releases, features, jours actifs
Homepage Desktop-First + Catalogue + Nouveautés
Refonte complète de index.php avec priorité desktop et adaptations mobiles soignées,
redesign simultané de catalog.php et nouveautes.php. Même système de design : poster wall
animé en hero, filtres sticky, cards glassmorphism, popup en bottom sheet sur mobile.
Amélioré
Design
Responsive
index.php — Homepage Cinématographique
Hero carousel 85vh fullscreen, contenu calé en bas à gauche style Netflix/HBO
Auto-rotation toutes les 5 secondes avec pause au hover
Touch gestures swipe gauche/droite sur le carousel mobile
Scroll horizontal pour les sections Films / Séries / Anime sur mobile
Barre de stats globale : films, séries, anime, membres inscrits
Popup détail contenu en bottom sheet sur mobile (slide depuis le bas)
Lazy loading natif sur toutes les images (loading="lazy")
catalog.php & nouveautes.php
Mur de posters animé en hero avec overlay dégradé rouge
Filtres sticky (position:sticky top:90px) qui suivent le scroll
Cards glassmorphism avec hover 3D et overlay play rouge
Bouton "Charger plus" AJAX sans rechargement de page
catalog.php : stats temps réel Films / Séries / Anime / Total en hero
Player Multi-Sources & films.php Premium
play.php supporte désormais trois types de sources vidéo : HLS .m3u8 via HLS.js,
iframes embed (Sharecloudy, YouTube, Vimeo, Streamtape, Doodstream) et MP4 direct.
Redesign complet de la page films.php avec hero section cinématographique.
Amélioré
Streaming
Player
Design
play.php — Détection Multi-Sources
Détection automatique du type : HLS (.m3u8) / iframe embed (sharecloudy, youtube, vimeo...) / MP4
Mode HLS : HLS.js avec fallback natif Safari (canPlayType)
Mode iframe : embed dans un iframe fullscreen avec contrôles topbar
Barre de buffering rouge clair superposée à la barre de progression
Tooltip temps au survol de la barre de progression
Raccourcis : Espace (pause), ← → (±10s), ↑ ↓ (volume), F (fullscreen), M (mute)
Flash central animé play/pause au clic (animation scale + opacity)
films.php — Redesign Premium
Hero section "FILMS." Bebas Neue massif avec poster wall en arrière-plan
Filtres combinables : catégorie + qualité + année + recherche texte
Floating filter button sur mobile (position:fixed en bas à droite)
Système de Commentaires Interactif
Nouvelle fonctionnalité communautaire majeure : les utilisateurs peuvent commenter et
échanger leurs avis sur chaque contenu. Système complet avec protection spoiler,
likes, tri intelligent, pagination et anti-spam.
Nouveau
Communauté
Social
Fonctionnalités
Poster des commentaires (3 à 5000 caractères, compteur live)
Protection spoiler : texte flouté par défaut, révélé au clic
Likes sur commentaires avec compteur en temps réel via API
Tri : Récents / Populaires / Anciens
Suppression de ses propres commentaires (confirmation requise)
Anti-spam : cooldown 10 secondes entre deux commentaires
Chargement paginé "Charger plus" — 10 commentaires par lot
Skeleton loaders pendant le chargement initial
Barre de Recherche Premium
Nouvelle barre de recherche pill-shaped avec bouton clear intelligent et intégration
parfaite avec les filtres existants sur toutes les pages de catalogue.
Préservation des paramètres URL lors des recherches combinées.
Amélioré
UX
Design
Améliorations
Design pill moderne avec border-radius: 26px
Bouton clear qui apparaît/disparaît selon le contenu du champ
Icône de recherche animée avec rotation au submit
Intégration complète avec filtres catégorie / qualité / année
Préservation des paramètres URL lors des recherches combinées
Architecture Fiche + Player Séparés
Refonte architecturale : séparation en deux pages distinctes. watch.php devient la
fiche complète du contenu (infos, bande-annonce, évaluation, commentaires).
play.php devient le player plein écran dédié avec contrôles custom HLS.
Amélioré
Architecture
Player
UX
watch.php — Fiche Contenu
Hero banner 440px avec poster, titre, synopsis, genres, meta (durée, année, qualité)
Modal bande-annonce YouTube avec autoplay à l'ouverture
Bouton "Regarder" → redirige vers play.php?id=X (player plein écran)
Section "Vous aimerez aussi" — contenus similaires par genre
Bouton partage natif (navigator.share) avec fallback clipboard
play.php — Player Plein Écran
Bouton "Retourner sur la fiche" dans la topbar (fond glassmorphism)
Lecture HLS.js avec fallback natif Safari (canPlayType mpegurl)
Incrément automatique des vues (UPDATE contenus SET vues = vues+1)
Écran d'erreur avec bouton "Réessayer" si flux inaccessible
Badge qualité HD/4K/CAM affiché dans les contrôles
Système de Notation 5 Étoiles
Interface de notation redessinée avec 5 étoiles interactives, animation de survol
(translateY -4px), conversion automatique /10 pour la BDD, toast notifications
4 types et feedback haptique sur appareils mobiles.
Nouveau
UX
Fonctionnalités
5 étoiles interactives avec animation hover translateY(-4px)
Conversion automatique étoiles → /10 pour le stockage en BDD
Toast notifications 4 types : success (vert), error (rouge), warning (jaune), info (bleu)
Vibration haptique sur mobile lors de la sélection d'une étoile
Affichage de la note actuelle si l'utilisateur a déjà noté
Pages Films, Séries & Anime Redesignées
Refonte complète des trois pages de catalogue avec hero sections animées distinctes,
filtres sticky, cards glassmorphism et floating filter button mobile.
Amélioré
Design
Fonctionnalités
Hero sections distinctes : 🎬 FILMS / 📺 SÉRIES / 🎌 ANIME avec Bebas Neue
Filtres sticky position:sticky top:90px qui suivent le scroll
Cards glassmorphism effect avec hover 3D et overlay play
Floating filter button pour mobile (position:fixed en bas à droite)
Authentification Discord OAuth
Connexion Discord OAuth en un clic : gestion automatique des comptes existants/nouveaux,
synchronisation des avatars Discord, tokens sécurisés avec refresh et state CSRF.
Nouveau
Auth
Sécurité
Fonctionnalités
Bouton "Connexion Discord" sur la page login, OAuth en 1 clic
Création automatique de compte si premier accès via Discord
Synchronisation de l'avatar Discord en temps réel
State CSRF anti-falsification + tokens access/refresh sécurisés
Homepage avec Carousel Hero
Page d'accueil entièrement redessinée avec un carousel hero 85vh fullscreen inspiré
de Netflix et Disney+. Navigation par dots et flèches, sections de contenu
par type et lazy loading des images.
Amélioré
Design
Fonctionnalités
Carousel hero 85vh avec overlay multicouche (dégradé vertical + latéral + glow rouge)
Auto-rotation toutes les 5 secondes avec pause au hover
Navigation par dots et flèches gauche/droite custom
Lazy loading natif sur toutes les images
Système de Favoris
Ajoutez vos contenus préférés en favoris d'un simple clic sur le cœur.
Page "Mes Favoris" dédiée avec grille paginée, API REST et tri par date d'ajout.
Nouveau
Feature
Fonctionnalités
Bouton cœur toggle sur chaque contenu (rempli si en favoris)
Page "Mes Favoris" avec grille paginée et info "aucun favori"
API REST /api/favoris.php : add, remove, list
Tri par date d'ajout (le plus récent en premier)
🎉 Lancement Officiel de CineVip
Lancement officiel de la plateforme de streaming CineVip ! Catalogue de 80+ contenus,
authentification sécurisée, profils utilisateurs, design dark premium et architecture
BDD robuste avec 39 tables MySQL.
Launch
Major
Features de lancement
Catalogue 80+ films, séries et anime en qualité HD/4K
Authentification sécurisée : bcrypt, sessions PHP, protection CSRF
Profils utilisateurs : avatar personnalisable, bio, préférences
Design dark premium : Bebas Neue + Outfit, accent rouge #c8102e, film grain
Responsive complet : mobile / tablette / desktop
Base de données 39 tables MySQL avec relations et index optimisés
Panel d'administration : gestion contenus, utilisateurs, logs
Historique de visionnage automatique à chaque lecture
Système de notifications intégré
Listes personnalisées : créer et partager des listes de contenus