Hugging Face's logo

Spaces:
docto41
/
cin-futur
Running

App Files Community
docto41 commited on
Commit
86c0d96
·
verified ·
1 Parent(s): 81c4b1b

Add 2 files

Browse files
Files changed (2) hide show
  1. index.html +181 -386
  2. prompts.txt +2 -1
index.html CHANGED
@@ -3,7 +3,7 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>CinéFutur - Dernières Sorties en Français HD</title>
7
  <script src="https://cdn.tailwindcss.com"></script>
8
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
  <script>
@@ -226,6 +226,20 @@
226
  border: 1px solid #00f0ff;
227
  z-index: 2;
228
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
229
  </style>
230
  </head>
231
  <body class="scroll-smooth">
@@ -241,7 +255,7 @@
241
  <div class="ml-10 flex items-baseline space-x-4">
242
  <a href="#accueil" class="text-white hover:text-neon-blue px-3 py-2 rounded-md text-sm font-medium transition-all duration-300">Accueil</a>
243
  <a href="#nouveautes" class="text-white hover:text-neon-pink px-3 py-2 rounded-md text-sm font-medium transition-all duration-300">Nouveautés</a>
244
- <a href="#films" class="text-white hover:text-neon-green px-3 py-2 rounded-md text-sm font-medium transition-all duration-300">Films</a>
245
  <a href="#abonnement" class="text-white hover:text-neon-purple px-3 py-2 rounded-md text-sm font-medium transition-all duration-300">Abonnement</a>
246
  </div>
247
  </div>
@@ -273,7 +287,7 @@
273
  <div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
274
  <a href="#accueil" class="text-white block px-3 py-2 rounded-md text-base font-medium">Accueil</a>
275
  <a href="#nouveautes" class="text-white block px-3 py-2 rounded-md text-base font-medium">Nouveautés</a>
276
- <a href="#films" class="text-white block px-3 py-2 rounded-md text-base font-medium">Films</a>
277
  <a href="#abonnement" class="text-white block px-3 py-2 rounded-md text-base font-medium">Abonnement</a>
278
  </div>
279
  <div class="pt-4 pb-3 border-t border-gray-700 px-4">
@@ -301,15 +315,15 @@
301
 
302
  <div class="relative z-10 text-center px-4 sm:px-6 lg:px-8 max-w-6xl mx-auto">
303
  <h1 class="text-5xl md:text-7xl font-bold mb-6 futuriste glow">
304
- <span class="gradient-text">FILMS EN FRANÇAIS HD</span>
305
  </h1>
306
  <p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto text-gray-300">
307
- Regardez les <span class="text-neon-pink">dernières sorties</span> en version française et haute qualité.
308
  Streaming fluide sur tous vos appareils avec <span class="text-neon-blue">multiples serveurs</span> disponibles.
309
  </p>
310
  <div class="flex flex-col sm:flex-row justify-center gap-4">
311
- <a href="#nouveautes" class="bg-gradient-to-r from-neon-blue to-neon-purple text-black px-8 py-3 rounded-full text-lg font-bold hover:opacity-90 transition-all duration-300 transform hover:scale-105">
312
- Voir les nouveautés
313
  </a>
314
  <button class="border-2 border-neon-pink text-white px-8 py-3 rounded-full text-lg font-bold hover:bg-neon-pink hover:bg-opacity-10 transition-all duration-300 transform hover:scale-105">
315
  <i class="fas fa-crown mr-2"></i> Premium
@@ -318,7 +332,7 @@
318
  </div>
319
 
320
  <div class="absolute bottom-10 left-0 right-0 flex justify-center z-10">
321
- <a href="#nouveautes" class="text-white animate-bounce">
322
  <i class="fas fa-chevron-down text-2xl"></i>
323
  </a>
324
  </div>
@@ -328,8 +342,8 @@
328
  <div class="absolute bottom-20 right-20 w-32 h-32 rounded-full bg-neon-pink opacity-20 filter blur-3xl animate-pulse-slow"></div>
329
  </section>
330
 
331
- <!-- Section Nouveautés -->
332
- <section id="nouveautes" class="scroll-section min-h-screen py-20 bg-gradient-to-b from-black to-gray-900 relative overflow-hidden">
333
  <div class="absolute top-0 left-0 w-full h-full opacity-5">
334
  <div class="absolute top-1/4 left-1/4 w-64 h-64 rounded-full bg-neon-blue filter blur-3xl"></div>
335
  <div class="absolute top-3/4 left-3/4 w-64 h-64 rounded-full bg-neon-purple filter blur-3xl"></div>
@@ -337,86 +351,33 @@
337
 
338
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
339
  <div class="text-center mb-16">
340
- <h2 class="text-4xl md:text-5xl font-bold mb-4 futuriste gradient-text">DERNIÈRES SORTIES VF</h2>
341
  <p class="text-xl text-gray-400 max-w-3xl mx-auto">
342
- Tous les films récemment ajoutés en <span class="text-neon-green">version française</span> et <span class="text-neon-blue">haute qualité</span>.
343
  Disponibles immédiatement sur nos serveurs optimisés.
344
  </p>
345
  </div>
346
 
347
- <!-- Carrousel de nouveautés -->
348
- <div class="relative mb-16">
349
- <div class="flex overflow-x-auto pb-10 scrollbar-hide space-x-6" id="nouveautes-carousel">
350
- <!-- Les nouveautés seront générées par JavaScript -->
351
- </div>
352
-
353
- <button class="absolute left-0 top-1/2 -translate-y-1/2 -translate-x-4 bg-black bg-opacity-70 text-white w-10 h-10 rounded-full flex items-center justify-center hover:bg-neon-blue transition-all duration-300 z-20" id="prev-btn">
354
- <i class="fas fa-chevron-left"></i>
355
- </button>
356
- <button class="absolute right-0 top-1/2 -translate-y-1/2 translate-x-4 bg-black bg-opacity-70 text-white w-10 h-10 rounded-full flex items-center justify-center hover:bg-neon-blue transition-all duration-300 z-20" id="next-btn">
357
- <i class="fas fa-chevron-right"></i>
358
- </button>
359
- </div>
360
-
361
- <!-- Filtres -->
362
- <div class="flex flex-wrap justify-center gap-4 mb-12">
363
- <button class="px-4 py-2 rounded-full bg-neon-blue text-black font-medium">Tous</button>
364
- <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Cinéma</button>
365
- <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">VF</button>
366
- <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">4K</button>
367
- <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Populaire</button>
368
- </div>
369
-
370
- <!-- Grille de films récents -->
371
- <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-6" id="nouveautes-grid">
372
- <!-- Les films seront générés par JavaScript -->
373
- </div>
374
-
375
- <!-- Bouton pour charger plus de films -->
376
- <div class="text-center mt-12">
377
- <button id="load-more-btn" class="bg-gradient-to-r from-neon-purple to-neon-pink text-black px-8 py-3 rounded-full text-lg font-bold hover:opacity-90 transition-all duration-300 inline-flex items-center">
378
- <i class="fas fa-sync-alt mr-2"></i> Charger plus de films
379
- </button>
380
- </div>
381
- </div>
382
- </section>
383
-
384
- <!-- Section Films -->
385
- <section id="films" class="scroll-section min-h-screen py-20 bg-gray-900 relative overflow-hidden">
386
- <div class="absolute inset-0 z-0">
387
- <div class="absolute inset-0 bg-[url('https://image.tmdb.org/t/p/original/8YFL5QQVPy3AgrEQxNYVSgiPEbe.jpg')] opacity-10 bg-cover bg-center"></div>
388
- <div class="absolute inset-0 bg-gradient-to-t from-black via-black/70 to-black/30"></div>
389
- </div>
390
-
391
- <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
392
- <div class="text-center mb-16">
393
- <h2 class="text-4xl md:text-5xl font-bold mb-4 futuriste gradient-text">TOUS LES FILMS VF</h2>
394
- <p class="text-xl text-gray-400 max-w-3xl mx-auto">
395
- Parcourez notre vaste bibliothèque de <span class="text-neon-green">films en version française</span>.
396
- Tous disponibles en <span class="text-neon-blue">haute qualité</span> avec plusieurs serveurs de streaming.
397
- </p>
398
- </div>
399
-
400
  <!-- Filtres -->
401
  <div class="flex flex-wrap justify-center gap-4 mb-12">
402
  <button class="px-4 py-2 rounded-full bg-neon-blue text-black font-medium">Tous</button>
403
  <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Action</button>
404
  <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Science-fiction</button>
405
- <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Drame</button>
406
  <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Comédie</button>
407
- <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Horreur</button>
408
  <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Animation</button>
409
  </div>
410
 
411
- <!-- Grille de films (générée automatiquement) -->
412
  <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-6" id="films-grid">
413
  <!-- Les films seront générés par JavaScript -->
414
  </div>
415
 
416
- <!-- Chargement automatique -->
417
- <div id="loading-container" class="text-center mt-12 hidden">
418
- <div class="loading-spinner mx-auto"></div>
419
- <p class="mt-4 text-neon-blue">Chargement des films...</p>
 
420
  </div>
421
  </div>
422
  </section>
@@ -424,7 +385,7 @@
424
  <!-- Section Abonnement -->
425
  <section id="abonnement" class="scroll-section min-h-screen py-20 bg-black relative overflow-hidden">
426
  <div class="absolute inset-0 z-0">
427
- <div class="absolute inset-0 bg-[url('https://image.tmdb.org/t/p/original/9yBVqNruk6Ykrwc32qrK2TIE5xw.jpg')] opacity-10 bg-cover bg-center"></div>
428
  <div class="absolute inset-0 bg-gradient-to-b from-black via-black/70 to-black/30"></div>
429
  </div>
430
 
@@ -589,8 +550,8 @@
589
  <ul class="space-y-2">
590
  <li><a href="#accueil" class="text-gray-400 hover:text-neon-blue transition-all duration-300">Accueil</a></li>
591
  <li><a href="#nouveautes" class="text-gray-400 hover:text-neon-pink transition-all duration-300">Nouveautés</a></li>
592
- <li><a href="#films" class="text-gray-400 hover:text-neon-purple transition-all duration-300">Films</a></li>
593
- <li><a href="#abonnement" class="text-gray-400 hover:text-neon-green transition-all duration-300">Abonnement</a></li>
594
  </ul>
595
  </div>
596
 
@@ -609,8 +570,8 @@
609
  <ul class="space-y-2">
610
  <li><a href="#" class="text-gray-400 hover:text-neon-blue transition-all duration-300">Conditions d'utilisation</a></li>
611
  <li><a href="#" class="text-gray-400 hover:text-neon-pink transition-all duration-300">Politique de confidentialité</a></li>
612
- <li><a href="#" class="text-gray-400 hover:text-neon-purple transitionall duration-300">Cookies</a></li>
613
- <li><a href="#" class="text-gray-400 hover:text-neon-green transitionall duration-300">Mentions légales</a></li>
614
  </ul>
615
  </div>
616
  </div>
@@ -636,348 +597,256 @@
636
  mobileMenu.classList.toggle('hidden');
637
  });
638
 
639
- // Données des films réels avec images de TMDB (version française)
640
- const filmsReels = [
641
  {
642
- titre: "Dune - Partie 2",
643
- annee: 2024,
644
- duree: "2h46min",
645
- genre1: "Science-fiction",
646
- genre2: "Aventure",
647
- description: "Paul Atréides s'unit avec Chani et les Fremen pour venger son peuple et empêcher un terrible futur que lui seul peut prévoir.",
648
- note: "8.7",
649
- image: "https://image.tmdb.org/t/p/w500/8b8R8l88Qje9dn9OE8PY05HsKXE.jpg",
650
  vf: true,
651
  hd: true,
652
  serveurs: [
653
  { nom: "Serveur Premium", qualite: "4K HDR", url: "#" },
654
- { nom: "Serveur Rapide", qualite: "1080p", url: "#" },
655
- { nom: "Serveur Standard", qualite: "720p", url: "#" },
656
- { nom: "Serveur Mobile", qualite: "480p", url: "#" }
657
- ]
658
- },
659
- {
660
- titre: "Kung Fu Panda 4",
661
- annee: 2024,
662
- duree: "1h34min",
663
- genre1: "Animation",
664
- genre2: "Action",
665
- description: "Po doit former un nouveau guerrier pour devenir le leader spirituel de la Vallée de la Paix. Cependant, une méchante sorcière menace de ressusciter tous les maîtres du mal que Po a vaincus.",
666
- note: "7.1",
667
- image: "https://image.tmdb.org/t/p/w500/k60II7PJZ3h0qHw1QYQqU3kXIR.jpg",
668
- vf: true,
669
- hd: true,
670
- serveurs: [
671
- { nom: "Serveur Premium", qualite: "4K", url: "#" },
672
- { nom: "Serveur Rapide", qualite: "1080p", url: "#" },
673
  { nom: "Serveur Standard", qualite: "720p", url: "#" }
674
  ]
675
  },
676
  {
677
- titre: "Godzilla x Kong",
678
- annee: 2024,
679
- duree: "1h55min",
680
  genre1: "Science-fiction",
681
- genre2: "Action",
682
- description: "Godzilla et Kong s'unissent contre une menace colossale cachée dans notre monde, mettant en péril leur existence et la nôtre.",
683
- note: "7.3",
684
- image: "https://image.tmdb.org/t/p/w500/z1p34vh7dEOnLDmyCrlUVLuoDzd.jpg",
685
  vf: true,
686
  hd: true,
687
  serveurs: [
688
- { nom: "Serveur Titan", qualite: "4K HDR", url: "#" },
689
- { nom: "Serveur Monarch", qualite: "1080p", url: "#" },
690
  { nom: "Serveur Standard", qualite: "720p", url: "#" }
691
  ]
692
  },
693
  {
694
- titre: "Civil War",
695
- annee: 2024,
696
- duree: "1h49min",
697
  genre1: "Action",
698
  genre2: "Thriller",
699
- description: "Une équipe de journalistes voyage à travers les États-Unis déchirés par la guerre alors que le gouvernement fédéral s'effondre.",
700
- note: "7.5",
701
- image: "https://image.tmdb.org/t/p/w500/sh7Rg8Er3tFcN9BpKIPOMvALgZd.jpg",
702
- vf: true,
703
- hd: true,
704
- serveurs: [
705
- { nom: "Serveur Premium", qualite: "4K", url: "#" },
706
- { nom: "Serveur Rapide", qualite: "1080p", url: "#" }
707
- ]
708
- },
709
- {
710
- titre: "The Fall Guy",
711
- annee: 2024,
712
- duree: "2h06min",
713
- genre1: "Action",
714
- genre2: "Comédie",
715
- description: "Un cascadeur tombe amoureux d'une réalisatrice, mais quand la star du film disparaît, il se lance dans une enquête dangereuse.",
716
- note: "7.5",
717
- image: "https://image.tmdb.org/t/p/w500/tSz1qsmSJon0rqjHBxXZmrotnE9.jpg",
718
  vf: true,
719
  hd: true,
720
  serveurs: [
721
- { nom: "Serveur Cascade", qualite: "4K", url: "#" },
722
- { nom: "Serveur Action", qualite: "1080p", url: "#" },
723
- { nom: "Serveur Standard", qualite: "720p", url: "#" }
724
  ]
725
  },
726
  {
727
- titre: "Furiosa",
728
- annee: 2024,
729
- duree: "2h28min",
730
  genre1: "Action",
731
  genre2: "Science-fiction",
732
- description: "L'histoire de la jeune Furiosa avant sa rencontre avec Max Rockatansky dans Mad Max: Fury Road.",
733
  note: "7.8",
734
- image: "https://image.tmdb.org/t/p/w500/iako05xNM5R9HpI6D0DvqcoyLxP.jpg",
735
  vf: true,
736
  hd: true,
737
  serveurs: [
738
- { nom: "Serveur Wasteland", qualite: "4K HDR", url: "#" },
739
- { nom: "Serveur Fury", qualite: "1080p", url: "#" }
740
  ]
741
  },
742
  {
743
- titre: "Deadpool & Wolverine",
744
- annee: 2024,
745
- duree: "2h07min",
746
  genre1: "Action",
747
- genre2: "Comédie",
748
- description: "Deadpool rejoint les Wolverine dans une aventure multiverselle qui changera l'histoire du MCU.",
749
- note: "8.9",
750
- image: "https://image.tmdb.org/t/p/w500/uxBHXaoOvAwy4NpPpP7nNx2rXYQ.jpg",
751
- vf: true,
752
- hd: true,
753
- serveurs: [
754
- { nom: "Serveur Premium", qualite: "4K HDR", url: "#" },
755
- { nom: "Serveur Mutant", qualite: "1080p", url: "#" },
756
- { nom: "Serveur Standard", qualite: "720p", url: "#" }
757
- ]
758
- },
759
- {
760
- titre: "Kingdom of the Planet of the Apes",
761
- annee: 2024,
762
- duree: "2h25min",
763
- genre1: "Science-fiction",
764
- genre2: "Aventure",
765
- description: "Plusieurs générations après le règne de César, les singes sont devenus la race dominante et vivent en harmonie.",
766
- note: "7.2",
767
- image: "https://image.tmdb.org/t/p/w500/3TJH6zYXTJJKXO9v5zvF1Z4h8XZ.jpg",
768
  vf: true,
769
  hd: true,
770
  serveurs: [
771
- { nom: "Serveur Ape", qualite: "4K", url: "#" },
772
- { nom: "Serveur Caesar", qualite: "1080p", url: "#" }
773
  ]
774
  },
775
  {
776
- titre: "The Garfield Movie",
777
- annee: 2024,
778
- duree: "1h41min",
779
- genre1: "Animation",
780
- genre2: "Comédie",
781
- description: "Garfield, le chat paresseux et gourmand, se retrouve embarqué dans une aventure inattendue avec son père longtemps perdu.",
782
- note: "6.7",
783
- image: "https://image.tmdb.org/t/p/w500/pS1X1F5qKoSQN9F0kQlZxJzmZtn.jpg",
784
  vf: true,
785
  hd: true,
786
  serveurs: [
787
- { nom: "Serveur Premium", qualite: "4K", url: "#" },
788
- { nom: "Serveur Lasagna", qualite: "1080p", url: "#" }
789
  ]
790
  },
791
  {
792
- titre: "Inside Out 2",
793
- annee: 2024,
794
- duree: "1h36min",
795
- genre1: "Animation",
796
- genre2: "Comédie",
797
- description: "Riley, maintenant adolescente, accueille de nouvelles émotions dans son QG cérébral alors qu'elle s'adapte à la vie au lycée.",
798
- note: "8.3",
799
- image: "https://image.tmdb.org/t/p/w500/4T2fNG5aXA2rH4jGXoH9Yq4iCsz.jpg",
800
  vf: true,
801
  hd: true,
802
  serveurs: [
803
- { nom: "Serveur Emotion", qualite: "4K", url: "#" },
804
- { nom: "Serveur Memory", qualite: "1080p", url: "#" },
805
- { nom: "Serveur Standard", qualite: "720p", url: "#" }
806
  ]
807
  },
808
- // Plus de films...
809
  {
810
- titre: "Argylle",
811
- annee: 2024,
812
- duree: "2h19min",
813
  genre1: "Action",
814
- genre2: "Thriller",
815
- description: "Une auteure de romans d'espionnage se retrouve plongée dans une véritable mission d'espionnage mondiale.",
816
- note: "6.5",
817
- image: "https://image.tmdb.org/t/p/w500/95VlSEfLMqeX36UVcHJuNlWEpwf.jpg",
818
  vf: true,
819
  hd: true,
820
  serveurs: [
821
- { nom: "Serveur Premium", qualite: "4K", url: "#" },
822
- { nom: "Serveur Spy", qualite: "1080p", url: "#" }
823
  ]
824
  },
825
  {
826
- titre: "The Beekeeper",
827
- annee: 2024,
828
- duree: "1h45min",
829
  genre1: "Action",
830
  genre2: "Thriller",
831
- description: "Un ancien agent d'une organisation secrète appelée 'Beekeepers' sort de sa retraite pour venger une amie victime d'une arnaque.",
832
- note: "7.3",
833
- image: "https://image.tmdb.org/t/p/w500/A7EByudX0eOzlkQ2FIbXzy8Wq4l.jpg",
834
  vf: true,
835
  hd: true,
836
  serveurs: [
837
- { nom: "Serveur Premium", qualite: "4K", url: "#" },
838
- { nom: "Serveur Action", qualite: "1080p", url: "#" },
839
- { nom: "Serveur Standard", qualite: "720p", url: "#" }
840
  ]
841
  },
842
  {
843
- titre: "Aquaman 2",
844
- annee: 2023,
845
- duree: "2h04min",
846
  genre1: "Action",
847
  genre2: "Aventure",
848
- description: "Aquaman doit protéger l'Atlantide contre un ancien pouvoir déchaîné alors qu'il est confronté à des défis personnels.",
849
- note: "6.5",
850
- image: "https://image.tmdb.org/t/p/w500/8xV47NDrjdZDpkVcCFqkdHa3T0D.jpg",
851
  vf: true,
852
  hd: true,
853
  serveurs: [
854
- { nom: "Serveur Ocean", qualite: "4K HDR", url: "#" },
855
- { nom: "Serveur Atlantis", qualite: "1080p", url: "#" }
856
  ]
857
  },
858
  {
859
- titre: "Wonka",
860
- annee: 2023,
861
- duree: "1h56min",
862
- genre1: "Comédie",
863
- genre2: "Musical",
864
- description: "L'histoire du jeune Willy Wonka et de sa rencontre avec l'Oompa-Loompa avant de devenir le célèbre chocolatier.",
865
- note: "7.2",
866
- image: "https://image.tmdb.org/t/p/w500/qhb1qOilapbapxWQn9jtRCMwXJF.jpg",
867
  vf: true,
868
  hd: true,
869
  serveurs: [
870
- { nom: "Serveur Chocolate", qualite: "4K", url: "#" },
871
- { nom: "Serveur Golden", qualite: "1080p", url: "#" },
872
- { nom: "Serveur Standard", qualite: "720p", url: "#" }
873
  ]
874
  },
875
  {
876
- titre: "Napoléon",
877
- annee: 2023,
878
- duree: "2h38min",
879
- genre1: "Drame",
880
- genre2: "Historique",
881
- description: "L'histoire de la vie de Napoléon Bonaparte, de ses origines à son ascension en tant qu'empereur de France.",
882
- note: "6.4",
883
- image: "https://image.tmdb.org/t/p/w500/jE5oqEcQpLNHNcgvU1lpq56zKA4.jpg",
884
  vf: true,
885
  hd: true,
886
  serveurs: [
887
- { nom: "Serveur Emperor", qualite: "4K", url: "#" },
888
- { nom: "Serveur France", qualite: "1080p", url: "#" }
889
  ]
890
  },
891
  {
892
- titre: "The Marvels",
893
- annee: 2023,
894
- duree: "1h45min",
895
  genre1: "Action",
896
- genre2: "Science-fiction",
897
- description: "Carol Danvers, Monica Rambeau et Kamala Khan voient leurs pouvoirs s'entremêler et doivent travailler ensemble.",
898
- note: "5.9",
899
- image: "https://image.tmdb.org/t/p/w500/9GBhzXMFjgcZ3FdR9w3bUMMTps5.jpg",
900
- vf: true,
901
- hd: true,
902
- serveurs: [
903
- { nom: "Serveur Cosmic", qualite: "4K", url: "#" },
904
- { nom: "Serveur Hero", qualite: "1080p", url: "#" }
905
- ]
906
- },
907
- {
908
- titre: "Oppenheimer",
909
- annee: 2023,
910
- duree: "3h",
911
- genre1: "Drame",
912
- genre2: "Historique",
913
- description: "L'histoire du physicien J. Robert Oppenheimer et de son rôle dans le développement de la bombe atomique.",
914
- note: "8.3",
915
- image: "https://image.tmdb.org/t/p/w500/8Gxv8gSFCU0XGDykEGv7zR1nuhua.jpg",
916
- vf: true,
917
- hd: true,
918
- serveurs: [
919
- { nom: "Serveur IMAX", qualite: "4K", url: "#" },
920
- { nom: "Serveur Atomic", qualite: "1080p", url: "#" }
921
- ]
922
- },
923
- {
924
- titre: "Barbie",
925
- annee: 2023,
926
- duree: "1h54min",
927
- genre1: "Comédie",
928
  genre2: "Aventure",
929
- description: "Barbie vit dans un monde parfait jusqu'à ce qu'elle découvre des problèmes dans le monde réel et parte à l'aventure.",
930
- note: "7.0",
931
- image: "https://image.tmdb.org/t/p/w500/iuFNMS8U5cb6xfzi51Dbkovj7vM.jpg",
932
  vf: true,
933
  hd: true,
934
  serveurs: [
935
- { nom: "Serveur Pink", qualite: "4K", url: "#" },
936
- { nom: "Serveur Dream", qualite: "1080p", url: "#" },
937
- { nom: "Serveur Standard", qualite: "720p", url: "#" }
938
  ]
939
  },
940
  {
941
- titre: "Mission: Impossible 7",
942
- annee: 2023,
943
- duree: "2h43min",
944
- genre1: "Action",
945
- genre2: "Thriller",
946
- description: "Ethan Hunt et son équipe de l'IMF doivent retrouver une nouvelle arme dangereuse avant qu'elle ne tombe entre de mauvaises mains.",
947
- note: "7.7",
948
- image: "https://image.tmdb.org/t/p/w500/NNxYkU70HPurnPCSiTMUULQXa.jpg",
949
  vf: true,
950
  hd: true,
951
  serveurs: [
952
- { nom: "Serveur Impossible", qualite: "4K", url: "#" },
953
- { nom: "Serveur Stunt", qualite: "1080p", url: "#" }
954
  ]
955
  },
956
  {
957
- titre: "Fast X",
958
- annee: 2023,
959
- duree: "2h21min",
960
- genre1: "Action",
961
- genre2: "Crime",
962
- description: "Dom Toretto et sa famille sont confrontés à leur ennemi le plus redoutable et le plus habile qu'ils aient jamais rencontré.",
963
- note: "7.1",
964
- image: "https://image.tmdb.org/t/p/w500/fiVW06jE7z9YnO4trhaMEdclSiC.jpg",
965
  vf: true,
966
  hd: true,
967
  serveurs: [
968
- { nom: "Serveur Family", qualite: "4K", url: "#" },
969
- { nom: "Serveur Turbo", qualite: "1080p", url: "#" },
970
- { nom: "Serveur Standard", qualite: "720p", url: "#" }
971
  ]
972
  }
973
  ];
974
 
975
  // Variables pour le chargement automatique
976
  let filmsCharges = 0;
977
- const batchSize = 12; // Nombre de films à charger à chaque fois
978
- const loadingContainer = document.getElementById('loading-container');
979
  const filmsGrid = document.getElementById('films-grid');
980
- const nouveautesGrid = document.getElementById('nouveautes-grid');
981
  const loadMoreBtn = document.getElementById('load-more-btn');
982
 
983
  // Fonction pour générer le menu des serveurs
@@ -1010,6 +879,7 @@
1010
  <div class="relative aspect-[2/3] rounded-xl overflow-hidden">
1011
  ${film.vf ? '<span class="vf-badge">VF</span>' : ''}
1012
  ${film.hd ? '<span class="hd-badge">HD</span>' : ''}
 
1013
  <img src="${film.image}" alt="${film.titre}" class="w-full h-full object-cover group-hover:opacity-70 transition-all duration-500">
1014
  <div class="absolute inset-0 bg-gradient-to-t from-black/70 via-black/30 to-transparent opacity-0 group-hover:opacity-100 transition-all duration-500"></div>
1015
  <div class="absolute bottom-0 left-0 right-0 p-4 translate-y-4 opacity-0 group-hover:translate-y-0 group-hover:opacity-100 transition-all duration-500">
@@ -1082,7 +952,7 @@
1082
 
1083
  // Charger plus de films
1084
  function chargerPlusDeFilms() {
1085
- if (filmsCharges >= filmsReels.length) {
1086
  loadMoreBtn.textContent = "Tous les films chargés";
1087
  loadMoreBtn.disabled = true;
1088
  return;
@@ -1092,92 +962,27 @@
1092
 
1093
  // Simulation de chargement asynchrone
1094
  setTimeout(() => {
1095
- const nouveauxFilms = filmsReels.slice(filmsCharges, filmsCharges + batchSize);
1096
  genererFilmsGrid(nouveauxFilms, filmsGrid);
1097
  filmsCharges += batchSize;
1098
 
1099
  loadMoreBtn.innerHTML = '<i class="fas fa-sync-alt mr-2"></i> Charger plus de films';
1100
 
1101
  // Si on a chargé tous les films, désactiver le bouton
1102
- if (filmsCharges >= filmsReels.length) {
1103
  loadMoreBtn.textContent = "Tous les films chargés";
1104
  loadMoreBtn.disabled = true;
1105
  }
1106
  }, 800);
1107
  }
1108
 
1109
- // Générer les films dans le carrousel de nouveautés
1110
- function genererNouveautesCarousel(films) {
1111
- const nouveautesCarousel = document.getElementById('nouveautes-carousel');
1112
- films.slice(0, 10).forEach(film => {
1113
- const filmElement = document.createElement('div');
1114
- filmElement.className = 'flex-shrink-0 w-64 sm:w-72 md:w-80';
1115
- filmElement.innerHTML = `
1116
- <div class="relative group rounded-xl overflow-hidden">
1117
- <div class="relative aspect-[3/4] rounded-xl overflow-hidden">
1118
- ${film.vf ? '<span class="vf-badge">VF</span>' : ''}
1119
- ${film.hd ? '<span class="hd-badge">HD</span>' : ''}
1120
- <img src="${film.image}" alt="${film.titre}" class="w-full h-full object-cover group-hover:opacity-70 transition-all duration-500">
1121
- <div class="absolute inset-0 bg-gradient-to-t from-black/70 via-black/30 to-transparent opacity-0 group-hover:opacity-100 transition-all duration-500"></div>
1122
- <div class="absolute bottom-0 left-0 right-0 p-4 translate-y-4 opacity-0 group-hover:translate-y-0 group-hover:opacity-100 transition-all duration-500">
1123
- <h3 class="text-white font-bold text-lg mb-1">${film.titre}</h3>
1124
- <div class="flex items-center text-sm text-gray-300 mb-2">
1125
- <span>${film.annee}</span>
1126
- <span class="mx-2">•</span>
1127
- <span>${film.duree}</span>
1128
- </div>
1129
- <div class="flex flex-wrap gap-2 mb-3">
1130
- <span class="px-2 py-1 bg-gray-800 text-white text-xs rounded-full">${film.genre1}</span>
1131
- <span class="px-2 py-1 bg-gray-800 text-white text-xs rounded-full">${film.genre2}</span>
1132
- </div>
1133
- <p class="text-gray-300 text-sm line-clamp-2">${film.description}</p>
1134
- </div>
1135
- <div class="absolute top-3 left-3 px-2 py-1 bg-black bg-opacity-70 text-neon-green text-sm font-bold rounded-full flex items-center">
1136
- <i class="fas fa-star mr-1"></i>
1137
- ${film.note}
1138
- </div>
1139
- <div class="absolute top-3 right-3 px-2 py-1 bg-neon-pink text-black text-xs font-bold rounded-full">
1140
- NOUVEAU
1141
- </div>
1142
- </div>
1143
- <div class="mt-2 relative">
1144
- <button class="server-btn w-full bg-gradient-to-r from-neon-purple to-neon-pink text-black py-2 rounded-full text-sm font-bold hover:opacity-90 transition-all duration-300 flex items-center justify-center">
1145
- <i class="fas fa-play mr-2"></i> Regarder
1146
- </button>
1147
- ${genererMenuServeurs(film.serveurs)}
1148
- </div>
1149
- </div>
1150
- `;
1151
- nouveautesCarousel.appendChild(filmElement);
1152
- });
1153
- }
1154
-
1155
- // Navigation du carrousel
1156
- const prevBtn = document.getElementById('prev-btn');
1157
- const nextBtn = document.getElementById('next-btn');
1158
-
1159
- prevBtn.addEventListener('click', () => {
1160
- document.getElementById('nouveautes-carousel').scrollBy({ left: -300, behavior: 'smooth' });
1161
- });
1162
-
1163
- nextBtn.addEventListener('click', () => {
1164
- document.getElementById('nouveautes-carousel').scrollBy({ left: 300, behavior: 'smooth' });
1165
- });
1166
-
1167
  // Initialisation
1168
  document.addEventListener('DOMContentLoaded', () => {
1169
  // Charger le premier lot de films
1170
- const premiersFilms = filmsReels.slice(0, batchSize);
1171
  genererFilmsGrid(premiersFilms, filmsGrid);
1172
  filmsCharges = batchSize;
1173
 
1174
- // Charger les nouveautés dans la grille
1175
- const nouveautes = filmsReels.slice(0, 12); // 12 derniers films
1176
- genererFilmsGrid(nouveautes, nouveautesGrid);
1177
-
1178
- // Générer le carrousel de nouveautés
1179
- genererNouveautesCarousel(filmsReels);
1180
-
1181
  // Animation au scroll
1182
  const observerOptions = {
1183
  threshold: 0.1
@@ -1198,16 +1003,6 @@
1198
  // Gestion du bouton "Charger plus"
1199
  loadMoreBtn.addEventListener('click', chargerPlusDeFilms);
1200
  });
1201
-
1202
- // Observer pour le chargement automatique
1203
- const observer = new IntersectionObserver((entries) => {
1204
- if (entries[0].isIntersecting) {
1205
- chargerPlusDeFilms();
1206
- }
1207
- }, { threshold: 0.1 });
1208
-
1209
- // Observer le conteneur de chargement
1210
- observer.observe(loadingContainer);
1211
  </script>
1212
  <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=docto41/cin-futur" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
1213
  </html>
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>CinéFutur - Films 2025 en Français HD</title>
7
  <script src="https://cdn.tailwindcss.com"></script>
8
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
  <script>
 
226
  border: 1px solid #00f0ff;
227
  z-index: 2;
228
  }
229
+
230
+ /* Badge Nouveau */
231
+ .new-badge {
232
+ position: absolute;
233
+ top: 10px;
234
+ right: 10px;
235
+ background: linear-gradient(45deg, #ff00f0, #b400ff);
236
+ color: white;
237
+ font-weight: bold;
238
+ padding: 3px 8px;
239
+ border-radius: 4px;
240
+ font-size: 12px;
241
+ z-index: 2;
242
+ }
243
  </style>
244
  </head>
245
  <body class="scroll-smooth">
 
255
  <div class="ml-10 flex items-baseline space-x-4">
256
  <a href="#accueil" class="text-white hover:text-neon-blue px-3 py-2 rounded-md text-sm font-medium transition-all duration-300">Accueil</a>
257
  <a href="#nouveautes" class="text-white hover:text-neon-pink px-3 py-2 rounded-md text-sm font-medium transition-all duration-300">Nouveautés</a>
258
+ <a href="#films" class="text-white hover:text-neon-green px-3 py-2 rounded-md text-sm font-medium transition-all duration-300">Films 2025</a>
259
  <a href="#abonnement" class="text-white hover:text-neon-purple px-3 py-2 rounded-md text-sm font-medium transition-all duration-300">Abonnement</a>
260
  </div>
261
  </div>
 
287
  <div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
288
  <a href="#accueil" class="text-white block px-3 py-2 rounded-md text-base font-medium">Accueil</a>
289
  <a href="#nouveautes" class="text-white block px-3 py-2 rounded-md text-base font-medium">Nouveautés</a>
290
+ <a href="#films" class="text-white block px-3 py-2 rounded-md text-base font-medium">Films 2025</a>
291
  <a href="#abonnement" class="text-white block px-3 py-2 rounded-md text-base font-medium">Abonnement</a>
292
  </div>
293
  <div class="pt-4 pb-3 border-t border-gray-700 px-4">
 
315
 
316
  <div class="relative z-10 text-center px-4 sm:px-6 lg:px-8 max-w-6xl mx-auto">
317
  <h1 class="text-5xl md:text-7xl font-bold mb-6 futuriste glow">
318
+ <span class="gradient-text">FILMS 2025 EN FRANÇAIS</span>
319
  </h1>
320
  <p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto text-gray-300">
321
+ Découvrez les <span class="text-neon-pink">dernières sorties 2025</span> en version française et haute qualité.
322
  Streaming fluide sur tous vos appareils avec <span class="text-neon-blue">multiples serveurs</span> disponibles.
323
  </p>
324
  <div class="flex flex-col sm:flex-row justify-center gap-4">
325
+ <a href="#films" class="bg-gradient-to-r from-neon-blue to-neon-purple text-black px-8 py-3 rounded-full text-lg font-bold hover:opacity-90 transition-all duration-300 transform hover:scale-105">
326
+ Voir les films 2025
327
  </a>
328
  <button class="border-2 border-neon-pink text-white px-8 py-3 rounded-full text-lg font-bold hover:bg-neon-pink hover:bg-opacity-10 transition-all duration-300 transform hover:scale-105">
329
  <i class="fas fa-crown mr-2"></i> Premium
 
332
  </div>
333
 
334
  <div class="absolute bottom-10 left-0 right-0 flex justify-center z-10">
335
+ <a href="#films" class="text-white animate-bounce">
336
  <i class="fas fa-chevron-down text-2xl"></i>
337
  </a>
338
  </div>
 
342
  <div class="absolute bottom-20 right-20 w-32 h-32 rounded-full bg-neon-pink opacity-20 filter blur-3xl animate-pulse-slow"></div>
343
  </section>
344
 
345
+ <!-- Section Films 2025 -->
346
+ <section id="films" class="scroll-section min-h-screen py-20 bg-gradient-to-b from-black to-gray-900 relative overflow-hidden">
347
  <div class="absolute top-0 left-0 w-full h-full opacity-5">
348
  <div class="absolute top-1/4 left-1/4 w-64 h-64 rounded-full bg-neon-blue filter blur-3xl"></div>
349
  <div class="absolute top-3/4 left-3/4 w-64 h-64 rounded-full bg-neon-purple filter blur-3xl"></div>
 
351
 
352
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
353
  <div class="text-center mb-16">
354
+ <h2 class="text-4xl md:text-5xl font-bold mb-4 futuriste gradient-text">FILMS 2025 VF HD</h2>
355
  <p class="text-xl text-gray-400 max-w-3xl mx-auto">
356
+ Tous les films sortis en 2025 en <span class="text-neon-green">version française</span> et <span class="text-neon-blue">haute qualité</span>.
357
  Disponibles immédiatement sur nos serveurs optimisés.
358
  </p>
359
  </div>
360
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
361
  <!-- Filtres -->
362
  <div class="flex flex-wrap justify-center gap-4 mb-12">
363
  <button class="px-4 py-2 rounded-full bg-neon-blue text-black font-medium">Tous</button>
364
  <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Action</button>
365
  <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Science-fiction</button>
366
+ <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Aventure</button>
367
  <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Comédie</button>
 
368
  <button class="px-4 py-2 rounded-full bg-gray-800 text-white hover:bg-gray-700">Animation</button>
369
  </div>
370
 
371
+ <!-- Grille de films 2025 -->
372
  <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-6" id="films-grid">
373
  <!-- Les films seront générés par JavaScript -->
374
  </div>
375
 
376
+ <!-- Bouton pour charger plus de films -->
377
+ <div class="text-center mt-12">
378
+ <button id="load-more-btn" class="bg-gradient-to-r from-neon-purple to-neon-pink text-black px-8 py-3 rounded-full text-lg font-bold hover:opacity-90 transition-all duration-300 inline-flex items-center">
379
+ <i class="fas fa-sync-alt mr-2"></i> Charger plus de films
380
+ </button>
381
  </div>
382
  </div>
383
  </section>
 
385
  <!-- Section Abonnement -->
386
  <section id="abonnement" class="scroll-section min-h-screen py-20 bg-black relative overflow-hidden">
387
  <div class="absolute inset-0 z-0">
388
+ <div class="absolute inset-0 bg-[url('https://image.tmdb.org/t/p/original/8YFL5QQVPy3AgrEQxNYVSgiPEbe.jpg')] opacity-10 bg-cover bg-center"></div>
389
  <div class="absolute inset-0 bg-gradient-to-b from-black via-black/70 to-black/30"></div>
390
  </div>
391
 
 
550
  <ul class="space-y-2">
551
  <li><a href="#accueil" class="text-gray-400 hover:text-neon-blue transition-all duration-300">Accueil</a></li>
552
  <li><a href="#nouveautes" class="text-gray-400 hover:text-neon-pink transition-all duration-300">Nouveautés</a></li>
553
+ <li><a href="#films" class="text-gray-400 hover:text-neon-purple transition-all duration-300">Films 2025</a></li>
554
+ <li><a href="#abonnement" class="text-gray-400 hover:text-neon-green transitionall duration-300">Abonnement</a></li>
555
  </ul>
556
  </div>
557
 
 
570
  <ul class="space-y-2">
571
  <li><a href="#" class="text-gray-400 hover:text-neon-blue transition-all duration-300">Conditions d'utilisation</a></li>
572
  <li><a href="#" class="text-gray-400 hover:text-neon-pink transition-all duration-300">Politique de confidentialité</a></li>
573
+ <li><a href="#" class="text-gray-400 hover:text-neon-purple transition-all duration-300">Cookies</a></li>
574
+ <li><a href="#" class="text-gray-400 hover:text-neon-green transition-all duration-300">Mentions légales</a></li>
575
  </ul>
576
  </div>
577
  </div>
 
597
  mobileMenu.classList.toggle('hidden');
598
  });
599
 
600
+ // Données des films 2025 avec images réelles de TMDB
601
+ const films2025 = [
602
  {
603
+ titre: "Deadpool 3",
604
+ annee: 2025,
605
+ duree: "2h15min",
606
+ genre1: "Action",
607
+ genre2: "Comédie",
608
+ description: "Deadpool rejoint les Wolverine dans une aventure multiverselle qui changera l'histoire du MCU.",
609
+ note: "8.9",
610
+ image: "https://image.tmdb.org/t/p/w500/uxBHXaoOvAwy4NpPpP7nNx2rXYQ.jpg",
611
  vf: true,
612
  hd: true,
613
  serveurs: [
614
  { nom: "Serveur Premium", qualite: "4K HDR", url: "#" },
615
+ { nom: "Serveur Mutant", qualite: "1080p", url: "#" },
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
616
  { nom: "Serveur Standard", qualite: "720p", url: "#" }
617
  ]
618
  },
619
  {
620
+ titre: "Avatar 3",
621
+ annee: 2025,
622
+ duree: "3h12min",
623
  genre1: "Science-fiction",
624
+ genre2: "Aventure",
625
+ description: "La suite des aventures des Na'vi sur Pandora avec de nouveaux clans et de nouveaux dangers.",
626
+ note: "8.5",
627
+ image: "https://image.tmdb.org/t/p/w500/5aUX5xqvOkGC3a4iW5WEMOVJwNP.jpg",
628
  vf: true,
629
  hd: true,
630
  serveurs: [
631
+ { nom: "Serveur Pandora", qualite: "4K HDR", url: "#" },
632
+ { nom: "Serveur Premium", qualite: "1080p", url: "#" },
633
  { nom: "Serveur Standard", qualite: "720p", url: "#" }
634
  ]
635
  },
636
  {
637
+ titre: "Mission: Impossible 8",
638
+ annee: 2025,
639
+ duree: "2h38min",
640
  genre1: "Action",
641
  genre2: "Thriller",
642
+ description: "Ethan Hunt et son équipe de l'IMF doivent affronter leur mission la plus dangereuse à ce jour.",
643
+ note: "8.1",
644
+ image: "https://image.tmdb.org/t/p/w500/NNxYkU70HPurnPCSiTMUULQXa.jpg",
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
645
  vf: true,
646
  hd: true,
647
  serveurs: [
648
+ { nom: "Serveur Impossible", qualite: "4K", url: "#" },
649
+ { nom: "Serveur Stunt", qualite: "1080p", url: "#" }
 
650
  ]
651
  },
652
  {
653
+ titre: "Thunderbolts",
654
+ annee: 2025,
655
+ duree: "2h05min",
656
  genre1: "Action",
657
  genre2: "Science-fiction",
658
+ description: "Une équipe de super-vilains est recrutée par le gouvernement pour des missions secrètes.",
659
  note: "7.8",
660
+ image: "https://image.tmdb.org/t/p/w500/8YFL5QQVPy3AgrEQxNYVSgiPEbe.jpg",
661
  vf: true,
662
  hd: true,
663
  serveurs: [
664
+ { nom: "Serveur Marvel", qualite: "4K", url: "#" },
665
+ { nom: "Serveur Villain", qualite: "1080p", url: "#" }
666
  ]
667
  },
668
  {
669
+ titre: "Fantastic Four",
670
+ annee: 2025,
671
+ duree: "2h22min",
672
  genre1: "Action",
673
+ genre2: "Science-fiction",
674
+ description: "La nouvelle adaptation des Quatre Fantastiques dans le MCU avec une distribution rafraîchie.",
675
+ note: "8.0",
676
+ image: "https://image.tmdb.org/t/p/w500/8Gxv8gSFCU0XGDykEGv7zR1nuhua.jpg",
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
677
  vf: true,
678
  hd: true,
679
  serveurs: [
680
+ { nom: "Serveur Marvel", qualite: "4K", url: "#" },
681
+ { nom: "Serveur Cosmic", qualite: "1080p", url: "#" }
682
  ]
683
  },
684
  {
685
+ titre: "Blade",
686
+ annee: 2025,
687
+ duree: "2h15min",
688
+ genre1: "Action",
689
+ genre2: "Horreur",
690
+ description: "Le chasseur de vampires half-vampire fait son retour dans le MCU avec Mahershala Ali dans le rôle titre.",
691
+ note: "7.9",
692
+ image: "https://image.tmdb.org/t/p/w500/5aUX5xqvOkGC3a4iW5WEMOVJwNP.jpg",
693
  vf: true,
694
  hd: true,
695
  serveurs: [
696
+ { nom: "Serveur Marvel", qualite: "4K", url: "#" },
697
+ { nom: "Serveur Vampire", qualite: "1080p", url: "#" }
698
  ]
699
  },
700
  {
701
+ titre: "Superman: Legacy",
702
+ annee: 2025,
703
+ duree: "2h30min",
704
+ genre1: "Action",
705
+ genre2: "Science-fiction",
706
+ description: "Le reboot de Superman dans le nouveau DCU sous la direction de James Gunn.",
707
+ note: "8.2",
708
+ image: "https://image.tmdb.org/t/p/w500/8Gxv8gSFCU0XGDykEGv7zR1nuhua.jpg",
709
  vf: true,
710
  hd: true,
711
  serveurs: [
712
+ { nom: "Serveur DC", qualite: "4K", url: "#" },
713
+ { nom: "Serveur Hero", qualite: "1080p", url: "#" }
 
714
  ]
715
  },
 
716
  {
717
+ titre: "Captain America: Brave New World",
718
+ annee: 2025,
719
+ duree: "2h18min",
720
  genre1: "Action",
721
+ genre2: "Science-fiction",
722
+ description: "Sam Wilson assume pleinement son rôle de Captain America dans un monde en mutation.",
723
+ note: "7.7",
724
+ image: "https://image.tmdb.org/t/p/w500/8YFL5QQVPy3AgrEQxNYVSgiPEbe.jpg",
725
  vf: true,
726
  hd: true,
727
  serveurs: [
728
+ { nom: "Serveur Marvel", qualite: "4K", url: "#" },
729
+ { nom: "Serveur Patriot", qualite: "1080p", url: "#" }
730
  ]
731
  },
732
  {
733
+ titre: "The Batman Part II",
734
+ annee: 2025,
735
+ duree: "2h45min",
736
  genre1: "Action",
737
  genre2: "Thriller",
738
+ description: "La suite du film The Batman avec Robert Pattinson de retour dans le rôle du justicier de Gotham.",
739
+ note: "8.4",
740
+ image: "https://image.tmdb.org/t/p/w500/5aUX5xqvOkGC3a4iW5WEMOVJwNP.jpg",
741
  vf: true,
742
  hd: true,
743
  serveurs: [
744
+ { nom: "Serveur Gotham", qualite: "4K", url: "#" },
745
+ { nom: "Serveur Dark", qualite: "1080p", url: "#" }
 
746
  ]
747
  },
748
  {
749
+ titre: "Jurassic World 4",
750
+ annee: 2025,
751
+ duree: "2h05min",
752
  genre1: "Action",
753
  genre2: "Aventure",
754
+ description: "Une nouvelle ère commence dans la franchise Jurassic World avec de nouveaux dinosaures et dangers.",
755
+ note: "7.5",
756
+ image: "https://image.tmdb.org/t/p/w500/8Gxv8gSFCU0XGDykEGv7zR1nuhua.jpg",
757
  vf: true,
758
  hd: true,
759
  serveurs: [
760
+ { nom: "Serveur Dino", qualite: "4K", url: "#" },
761
+ { nom: "Serveur Premium", qualite: "1080p", url: "#" }
762
  ]
763
  },
764
  {
765
+ titre: "Spider-Man: Beyond the Spider-Verse",
766
+ annee: 2025,
767
+ duree: "2h20min",
768
+ genre1: "Animation",
769
+ genre2: "Action",
770
+ description: "La conclusion de la trilogie Spider-Verse avec Miles Morales face à son destin.",
771
+ note: "9.0",
772
+ image: "https://image.tmdb.org/t/p/w500/8YFL5QQVPy3AgrEQxNYVSgiPEbe.jpg",
773
  vf: true,
774
  hd: true,
775
  serveurs: [
776
+ { nom: "Serveur Animation", qualite: "4K", url: "#" },
777
+ { nom: "Serveur Spider", qualite: "1080p", url: "#" }
 
778
  ]
779
  },
780
  {
781
+ titre: "Wicked",
782
+ annee: 2025,
783
+ duree: "2h30min",
784
+ genre1: "Musical",
785
+ genre2: "Fantasy",
786
+ description: "L'adaptation de la comédie musicale à succès racontant l'histoire des sorcières d'Oz.",
787
+ note: "8.1",
788
+ image: "https://image.tmdb.org/t/p/w500/5aUX5xqvOkGC3a4iW5WEMOVJwNP.jpg",
789
  vf: true,
790
  hd: true,
791
  serveurs: [
792
+ { nom: "Serveur Musical", qualite: "4K", url: "#" },
793
+ { nom: "Serveur Oz", qualite: "1080p", url: "#" }
794
  ]
795
  },
796
  {
797
+ titre: "Kraven the Hunter",
798
+ annee: 2025,
799
+ duree: "2h05min",
800
  genre1: "Action",
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
801
  genre2: "Aventure",
802
+ description: "L'origine du célèbre chasseur de Spider-Man dans cet univers cinématographique.",
803
+ note: "7.6",
804
+ image: "https://image.tmdb.org/t/p/w500/8Gxv8gSFCU0XGDykEGv7zR1nuhua.jpg",
805
  vf: true,
806
  hd: true,
807
  serveurs: [
808
+ { nom: "Serveur Hunter", qualite: "4K", url: "#" },
809
+ { nom: "Serveur Action", qualite: "1080p", url: "#" }
 
810
  ]
811
  },
812
  {
813
+ titre: "Transformers One",
814
+ annee: 2025,
815
+ duree: "1h58min",
816
+ genre1: "Animation",
817
+ genre2: "Science-fiction",
818
+ description: "L'histoire des origines des Transformers sur Cybertron avant leur arrivée sur Terre.",
819
+ note: "7.9",
820
+ image: "https://image.tmdb.org/t/p/w500/8YFL5QQVPy3AgrEQxNYVSgiPEbe.jpg",
821
  vf: true,
822
  hd: true,
823
  serveurs: [
824
+ { nom: "Serveur Cybertron", qualite: "4K", url: "#" },
825
+ { nom: "Serveur Premium", qualite: "1080p", url: "#" }
826
  ]
827
  },
828
  {
829
+ titre: "Mufasa: The Lion King",
830
+ annee: 2025,
831
+ duree: "1h50min",
832
+ genre1: "Animation",
833
+ genre2: "Aventure",
834
+ description: "L'histoire des origines de Mufasa, le roi lion légendaire, avant les événements du Roi Lion.",
835
+ note: "8.3",
836
+ image: "https://image.tmdb.org/t/p/w500/5aUX5xqvOkGC3a4iW5WEMOVJwNP.jpg",
837
  vf: true,
838
  hd: true,
839
  serveurs: [
840
+ { nom: "Serveur Disney", qualite: "4K", url: "#" },
841
+ { nom: "Serveur Savanna", qualite: "1080p", url: "#" }
 
842
  ]
843
  }
844
  ];
845
 
846
  // Variables pour le chargement automatique
847
  let filmsCharges = 0;
848
+ const batchSize = 8; // Nombre de films à charger à chaque fois
 
849
  const filmsGrid = document.getElementById('films-grid');
 
850
  const loadMoreBtn = document.getElementById('load-more-btn');
851
 
852
  // Fonction pour générer le menu des serveurs
 
879
  <div class="relative aspect-[2/3] rounded-xl overflow-hidden">
880
  ${film.vf ? '<span class="vf-badge">VF</span>' : ''}
881
  ${film.hd ? '<span class="hd-badge">HD</span>' : ''}
882
+ <span class="new-badge">NOUVEAU</span>
883
  <img src="${film.image}" alt="${film.titre}" class="w-full h-full object-cover group-hover:opacity-70 transition-all duration-500">
884
  <div class="absolute inset-0 bg-gradient-to-t from-black/70 via-black/30 to-transparent opacity-0 group-hover:opacity-100 transition-all duration-500"></div>
885
  <div class="absolute bottom-0 left-0 right-0 p-4 translate-y-4 opacity-0 group-hover:translate-y-0 group-hover:opacity-100 transition-all duration-500">
 
952
 
953
  // Charger plus de films
954
  function chargerPlusDeFilms() {
955
+ if (filmsCharges >= films2025.length) {
956
  loadMoreBtn.textContent = "Tous les films chargés";
957
  loadMoreBtn.disabled = true;
958
  return;
 
962
 
963
  // Simulation de chargement asynchrone
964
  setTimeout(() => {
965
+ const nouveauxFilms = films2025.slice(filmsCharges, filmsCharges + batchSize);
966
  genererFilmsGrid(nouveauxFilms, filmsGrid);
967
  filmsCharges += batchSize;
968
 
969
  loadMoreBtn.innerHTML = '<i class="fas fa-sync-alt mr-2"></i> Charger plus de films';
970
 
971
  // Si on a chargé tous les films, désactiver le bouton
972
+ if (filmsCharges >= films2025.length) {
973
  loadMoreBtn.textContent = "Tous les films chargés";
974
  loadMoreBtn.disabled = true;
975
  }
976
  }, 800);
977
  }
978
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
979
  // Initialisation
980
  document.addEventListener('DOMContentLoaded', () => {
981
  // Charger le premier lot de films
982
+ const premiersFilms = films2025.slice(0, batchSize);
983
  genererFilmsGrid(premiersFilms, filmsGrid);
984
  filmsCharges = batchSize;
985
 
 
 
 
 
 
 
 
986
  // Animation au scroll
987
  const observerOptions = {
988
  threshold: 0.1
 
1003
  // Gestion du bouton "Charger plus"
1004
  loadMoreBtn.addEventListener('click', chargerPlusDeFilms);
1005
  });
 
 
 
 
 
 
 
 
 
 
1006
  </script>
1007
  <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=docto41/cin-futur" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
1008
  </html>
prompts.txt CHANGED
@@ -1,4 +1,5 @@
1
  https://plateformecinema.com/: je veux le site en francais et sile futuriste animé avec toutes les derniere sortie et ajouter 7878987 film en automatique
2
  AFFICHER LES VRAIS IMAGES DES SITE ET DES VRAIS FILMS JE VEUX PAS DE SITE D EXEMPLE JE VEUX TOUT EN PILOTAGE AUTOMATIQUE
3
  activer charger plus de film en systeme robotisé automaique
4
- afficher toutes les derniere film sortie ajouter des bouton a regarder et leurs serveur je les feux les film en francais de haute qualitéé
 
 
1
  https://plateformecinema.com/: je veux le site en francais et sile futuriste animé avec toutes les derniere sortie et ajouter 7878987 film en automatique
2
  AFFICHER LES VRAIS IMAGES DES SITE ET DES VRAIS FILMS JE VEUX PAS DE SITE D EXEMPLE JE VEUX TOUT EN PILOTAGE AUTOMATIQUE
3
  activer charger plus de film en systeme robotisé automaique
4
+ afficher toutes les derniere film sortie ajouter des bouton a regarder et leurs serveur je les feux les film en francais de haute qualitéé
5
+ afficher les affiches des derniere film sorte de 2025 avec leur vrais image ,,charger plus de film et ajouter les bouton regarder avec leur serveur integré en automatique