Hugging Face's logo

Spaces:
docto41
/
cin-full
Running

App Files Community
docto41 commited on
Commit
f45c3d5
·
verified ·
1 Parent(s): 0aed9a0

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +1048 -19
  3. prompts.txt +11 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Cin Full
3
- emoji: 📊
4
- colorFrom: gray
5
- colorTo: green
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: cin-full
3
+ emoji: 🐳
4
+ colorFrom: green
5
+ colorTo: pink
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,1048 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="fr">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>CinéFull - Films Complets en 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
+ <style>
10
+ .player-container {
11
+ aspect-ratio: 16/9;
12
+ }
13
+ .loading-spinner {
14
+ border-top-color: transparent;
15
+ animation: spin 1s linear infinite;
16
+ }
17
+ @keyframes spin {
18
+ 0% { transform: rotate(0deg); }
19
+ 100% { transform: rotate(360deg); }
20
+ }
21
+ .quality-badge {
22
+ position: absolute;
23
+ top: 8px;
24
+ right: 8px;
25
+ background: rgba(0,0,0,0.7);
26
+ }
27
+ .server-btn.active {
28
+ background-color: #3b82f6;
29
+ }
30
+ .progress-container {
31
+ height: 4px;
32
+ background-color: #4b5563;
33
+ }
34
+ .progress-bar {
35
+ height: 100%;
36
+ background-color: #3b82f6;
37
+ width: 0%;
38
+ }
39
+ .film-controls {
40
+ opacity: 0;
41
+ transition: opacity 0.3s;
42
+ }
43
+ .film-container:hover .film-controls {
44
+ opacity: 1;
45
+ }
46
+ .search-dropdown {
47
+ max-height: 400px;
48
+ overflow-y: auto;
49
+ }
50
+ .movie-card:hover .movie-overlay {
51
+ opacity: 1;
52
+ }
53
+ .movie-overlay {
54
+ transition: all 0.3s ease;
55
+ }
56
+ .blur-bg {
57
+ position: absolute;
58
+ top: 0;
59
+ left: 0;
60
+ right: 0;
61
+ bottom: 0;
62
+ background-size: cover;
63
+ filter: blur(20px);
64
+ opacity: 0.3;
65
+ z-index: -1;
66
+ }
67
+ .category-btn.active {
68
+ background-color: #3b82f6;
69
+ color: white;
70
+ }
71
+ </style>
72
+ </head>
73
+ <body class="bg-gray-900 text-white">
74
+ <!-- Header -->
75
+ <header class="bg-gray-800 shadow-lg sticky top-0 z-50">
76
+ <div class="container mx-auto px-4 py-3 flex items-center justify-between">
77
+ <div class="flex items-center space-x-2">
78
+ <i class="fas fa-film text-blue-500 text-2xl"></i>
79
+ <h1 class="text-xl font-bold">Ciné<span class="text-blue-500">Full</span></h1>
80
+ </div>
81
+
82
+ <div class="hidden md:flex items-center space-x-6">
83
+ <a href="#" class="hover:text-blue-400">Accueil</a>
84
+ <a href="#" class="hover:text-blue-400">Films</a>
85
+ <a href="#" class="hover:text-blue-400">Séries</a>
86
+ <a href="#" class="hover:text-blue-400">Nouveautés</a>
87
+ <a href="#" class="hover:text-blue-400">Catégories</a>
88
+ </div>
89
+
90
+ <div class="flex items-center space-x-4">
91
+ <div class="relative">
92
+ <input type="text" id="search-input" placeholder="Rechercher un film..."
93
+ class="bg-gray-700 px-4 py-2 rounded-md w-64 focus:outline-none focus:ring-2 focus:ring-blue-500">
94
+ <div id="search-results" class="absolute left-0 mt-2 w-full bg-gray-800 rounded-md shadow-xl search-dropdown hidden z-50"></div>
95
+ </div>
96
+ <button class="bg-blue-600 hover:bg-blue-700 px-4 py-2 rounded-md">
97
+ <i class="fas fa-user mr-2"></i>Connexion
98
+ </button>
99
+ <button class="md:hidden" id="mobile-menu-btn">
100
+ <i class="fas fa-bars text-xl"></i>
101
+ </button>
102
+ </div>
103
+ </div>
104
+ </header>
105
+
106
+ <!-- Mobile Menu -->
107
+ <div id="mobile-menu" class="hidden md:hidden bg-gray-800 px-4 py-2">
108
+ <div class="flex flex-col space-y-2">
109
+ <a href="#" class="hover:text-blue-400 py-1">Accueil</a>
110
+ <a href="#" class="hover:text-blue-400 py-1">Films</a>
111
+ <a href="#" class="hover:text-blue-400 py-1">Séries</a>
112
+ <a href="#" class="hover:text-blue-400 py-1">Nouveautés</a>
113
+ <a href="#" class="hover:text-blue-400 py-1">Catégories</a>
114
+ </div>
115
+ </div>
116
+
117
+ <!-- Main Content -->
118
+ <main class="container mx-auto px-4 py-6">
119
+ <!-- Categories Navigation -->
120
+ <div class="flex overflow-x-auto pb-4 mb-6 scrollbar-hide">
121
+ <div class="flex space-x-2">
122
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-800 hover:bg-gray-700" data-category="all">Tous</button>
123
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-800 hover:bg-gray-700" data-category="french">Français</button>
124
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-800 hover:bg-gray-700" data-category="action">Action</button>
125
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-800 hover:bg-gray-700" data-category="comedy">Comédie</button>
126
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-800 hover:bg-gray-700" data-category="drama">Drame</button>
127
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-800 hover:bg-gray-700" data-category="sf">Science-Fiction</button>
128
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-800 hover:bg-gray-700" data-category="horror">Horreur</button>
129
+ <button class="category-btn px-4 py-2 rounded-full bg-gray-800 hover:bg-gray-700" data-category="adventure">Aventure</button>
130
+ </div>
131
+ </div>
132
+
133
+ <!-- Featured Movie -->
134
+ <section class="mb-12">
135
+ <div class="relative film-container">
136
+ <!-- Background blur effect -->
137
+ <div id="movie-backdrop" class="blur-bg"></div>
138
+
139
+ <!-- Video Player -->
140
+ <div class="relative player-container bg-black rounded-lg overflow-hidden shadow-xl">
141
+ <div id="full-movie-container">
142
+ <iframe id="full-movie" class="w-full h-full" src="https://www.youtube.com/embed/zSWdZVtXT7E?autoplay=1" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
143
+ </div>
144
+
145
+ <!-- Loading Overlay -->
146
+ <div id="loading-overlay" class="absolute inset-0 bg-black bg-opacity-70 flex items-center justify-center hidden">
147
+ <div class="w-16 h-16 border-4 border-blue-500 border-t-transparent rounded-full loading-spinner"></div>
148
+ <span class="ml-3">Chargement du film...</span>
149
+ </div>
150
+
151
+ <!-- Controls Overlay -->
152
+ <div class="film-controls absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black to-transparent p-4">
153
+ <div class="progress-container mb-2">
154
+ <div id="progress-bar" class="progress-bar"></div>
155
+ </div>
156
+ <div class="flex justify-between items-center">
157
+ <div class="flex items-center space-x-4">
158
+ <button id="play-pause-btn" class="text-white hover:text-blue-400">
159
+ <i class="fas fa-pause text-xl"></i>
160
+ </button>
161
+ <span id="current-time" class="text-sm">00:00</span>
162
+ <span class="text-gray-400">/</span>
163
+ <span id="duration" class="text-sm">00:00</span>
164
+ </div>
165
+ <div class="flex items-center space-x-4">
166
+ <button id="mute-btn" class="text-white hover:text-blue-400">
167
+ <i class="fas fa-volume-up text-xl"></i>
168
+ </button>
169
+ <button class="text-white hover:text-blue-400">
170
+ <i class="fas fa-closed-captioning text-xl"></i>
171
+ </button>
172
+ <button onclick="toggleFullscreen('full-movie')" class="text-white hover:text-blue-400">
173
+ <i class="fas fa-expand text-xl"></i>
174
+ </button>
175
+ </div>
176
+ </div>
177
+ </div>
178
+ </div>
179
+
180
+ <!-- Movie Info -->
181
+ <div class="mt-6 bg-gray-800 bg-opacity-80 rounded-lg p-6 backdrop-blur-sm">
182
+ <div class="flex flex-col md:flex-row gap-6">
183
+ <div class="flex-shrink-0">
184
+ <img id="current-movie-poster" src="https://image.tmdb.org/t/p/w500/gEU2QniE6E77NI6lCU6MxlNBvIx.jpg" alt="Interstellar" class="w-48 rounded-lg shadow-md">
185
+ </div>
186
+ <div class="flex-grow">
187
+ <h2 id="current-movie-title" class="text-3xl font-bold mb-2">Interstellar (2014)</h2>
188
+ <div class="flex items-center mb-4">
189
+ <div id="current-movie-rating" class="flex text-yellow-400 mr-3">
190
+ <i class="fas fa-star"></i>
191
+ <i class="fas fa-star"></i>
192
+ <i class="fas fa-star"></i>
193
+ <i class="fas fa-star"></i>
194
+ <i class="fas fa-star-half-alt"></i>
195
+ </div>
196
+ <span class="mr-4">4.7/5</span>
197
+ <span class="px-2 py-1 bg-blue-600 rounded text-xs mr-2">HD 1080p</span>
198
+ <span id="current-movie-duration" class="text-gray-400">2h 49min</span>
199
+ </div>
200
+
201
+ <p id="current-movie-description" class="text-gray-300 mb-4">
202
+ Dans un futur proche, la Terre est devenue hostile pour l'humanité. Un groupe d'explorateurs utilise un vaisseau spatial pour franchir un trou de ver permettant de parcourir des distances jusque-là insurmontables, dans le but de sauver l'humanité.
203
+ </p>
204
+
205
+ <div id="current-movie-genres" class="flex flex-wrap gap-2 mb-6">
206
+ <span class="px-3 py-1 bg-gray-700 rounded-full text-sm">Science-fiction</span>
207
+ <span class="px-3 py-1 bg-gray-700 rounded-full text-sm">Aventure</span>
208
+ <span class="px-3 py-1 bg-gray-700 rounded-full text-sm">Espace</span>
209
+ <span class="px-3 py-1 bg-gray-700 rounded-full text-sm">Drame</span>
210
+ </div>
211
+
212
+ <div class="flex items-center space-x-4">
213
+ <button class="bg-blue-600 hover:bg-blue-700 px-4 py-2 rounded-md flex items-center">
214
+ <i class="fas fa-bookmark mr-2"></i> Ajouter à ma liste
215
+ </button>
216
+ <button class="bg-gray-700 hover:bg-gray-600 px-4 py-2 rounded-md flex items-center">
217
+ <i class="fas fa-share-alt mr-2"></i> Partager
218
+ </button>
219
+ </div>
220
+ </div>
221
+ </div>
222
+
223
+ <!-- Server Selection -->
224
+ <div class="mt-8">
225
+ <h3 class="text-xl font-bold mb-4">Serveurs Disponibles</h3>
226
+ <div id="server-buttons" class="flex flex-wrap gap-3">
227
+ <button class="server-btn px-4 py-2 rounded-md flex items-center active bg-blue-600"
228
+ onclick="changeServer('https://www.youtube.com/embed/zSWdZVtXT7E?autoplay=1', 'YouTube')">
229
+ <i class="fas fa-server mr-2"></i> YouTube <span class="ml-2 text-xs bg-black bg-opacity-50 px-2 py-1 rounded">HD 1080p</span>
230
+ </button>
231
+ <button class="server-btn px-4 py-2 rounded-md flex items-center bg-gray-700 hover:bg-gray-600"
232
+ onclick="changeServer('https://player.vimeo.com/video/24456787?autoplay=1', 'Vimeo')">
233
+ <i class="fas fa-server mr-2"></i> Vimeo <span class="ml-2 text-xs bg-black bg-opacity-50 px-2 py-1 rounded">HD 720p</span>
234
+ </button>
235
+ <button class="server-btn px-4 py-2 rounded-md flex items-center bg-gray-700 hover:bg-gray-600"
236
+ onclick="changeServer('https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1', 'Dailymotion')">
237
+ <i class="fas fa-server mr-2"></i> Dailymotion <span class="ml-2 text-xs bg-black bg-opacity-50 px-2 py-1 rounded">HD 720p</span>
238
+ </button>
239
+ </div>
240
+ </div>
241
+ </div>
242
+ </div>
243
+ </section>
244
+
245
+ <!-- Movie Categories -->
246
+ <section class="mb-12">
247
+ <h2 class="text-2xl font-bold mb-6 flex items-center">
248
+ <i class="fas fa-fire text-red-500 mr-2"></i> Films Tendances
249
+ </h2>
250
+ <div id="trending-movies" class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4">
251
+ <!-- Movies will be loaded here -->
252
+ </div>
253
+ </section>
254
+
255
+ <section class="mb-12">
256
+ <h2 class="text-2xl font-bold mb-6 flex items-center">
257
+ <i class="fas fa-star text-yellow-500 mr-2"></i> Meilleurs Films
258
+ </h2>
259
+ <div id="top-rated-movies" class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4">
260
+ <!-- Movies will be loaded here -->
261
+ </div>
262
+ </section>
263
+
264
+ <section class="mb-12">
265
+ <h2 class="text-2xl font-bold mb-6 flex items-center">
266
+ <i class="fas fa-clock text-blue-500 mr-2"></i> Nouveaux Films
267
+ </h2>
268
+ <div id="new-releases" class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4">
269
+ <!-- Movies will be loaded here -->
270
+ </div>
271
+ </section>
272
+ </main>
273
+
274
+ <!-- Footer -->
275
+ <footer class="bg-gray-900 pt-12 pb-6">
276
+ <div class="container mx-auto px-4">
277
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8 mb-8">
278
+ <div>
279
+ <h3 class="text-xl font-bold mb-4 flex items-center">
280
+ <i class="fas fa-film text-blue-500 mr-2"></i> CinéFull
281
+ </h3>
282
+ <p class="text-gray-400 mb-4">La meilleure plateforme pour regarder des films complets en streaming gratuit.</p>
283
+ <div class="flex space-x-4">
284
+ <a href="#" class="text-gray-400 hover:text-blue-400">
285
+ <i class="fab fa-facebook-f"></i>
286
+ </a>
287
+ <a href="#" class="text-gray-400 hover:text-blue-400">
288
+ <i class="fab fa-twitter"></i>
289
+ </a>
290
+ <a href="#" class="text-gray-400 hover:text-blue-400">
291
+ <i class="fab fa-telegram"></i>
292
+ </a>
293
+ </div>
294
+ </div>
295
+
296
+ <div>
297
+ <h4 class="font-bold mb-4">Navigation</h4>
298
+ <ul class="space-y-2">
299
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">Accueil</a></li>
300
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">Films</a></li>
301
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">Séries</a></li>
302
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">Nouveautés</a></li>
303
+ </ul>
304
+ </div>
305
+
306
+ <div>
307
+ <h4 class="font-bold mb-4">Catégories</h4>
308
+ <ul class="space-y-2">
309
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">Action</a></li>
310
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">Science-fiction</a></li>
311
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">Drame</a></li>
312
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">Aventure</a></li>
313
+ </ul>
314
+ </div>
315
+
316
+ <div>
317
+ <h4 class="font-bold mb-4">Légal</h4>
318
+ <ul class="space-y-2">
319
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">Mentions légales</a></li>
320
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">CGU</a></li>
321
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">DMCA</a></li>
322
+ <li><a href="#" class="text-gray-400 hover:text-blue-400">Contact</a></li>
323
+ </ul>
324
+ </div>
325
+ </div>
326
+
327
+ <div class="pt-6 border-t border-gray-800 text-center text-gray-500 text-sm">
328
+ <p>© 2023 CinéFull. Tous droits réservés.</p>
329
+ <p class="mt-2">Ce site fournit des liens vers des serveurs externes.</p>
330
+ </div>
331
+ </div>
332
+ </footer>
333
+
334
+ <script>
335
+ // Base de données complète de films avec liens de streaming
336
+ const movieDatabase = [
337
+ // Films français
338
+ {
339
+ id: 101,
340
+ title: "Intouchables",
341
+ year: 2011,
342
+ description: "À la suite d'un accident de parapente, Philippe, riche aristocrate, engage comme aide à domicile Driss, un jeune de banlieue tout juste sorti de prison. Deux univers vont se télescoper et se transformer.",
343
+ poster: "https://image.tmdb.org/t/p/w500/4mGsTyAYXrsUY0ZRDPVInZlpBdD.jpg",
344
+ backdrop: "https://image.tmdb.org/t/p/original/ih2O4WmeWqVn5dILhrOqfgw1pQq.jpg",
345
+ rating: 4.5,
346
+ duration: "1h 52min",
347
+ genres: ["Comédie", "Drame"],
348
+ tags: ["french", "comedy", "drama"],
349
+ servers: [
350
+ { name: "YouTube", url: "https://www.youtube.com/embed/34WIbmXkewU?autoplay=1", quality: "HD 1080p" },
351
+ { name: "Dailymotion", url: "https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1", quality: "HD 720p" }
352
+ ],
353
+ trending: true,
354
+ topRated: true
355
+ },
356
+ {
357
+ id: 102,
358
+ title: "Le Fabuleux Destin d'Amélie Poulain",
359
+ year: 2001,
360
+ description: "Amélie, une jeune serveuse parisienne, décide de se consacrer aux autres après avoir découvert une boîte à souvenirs cachée dans son appartement.",
361
+ poster: "https://image.tmdb.org/t/p/w500/7sv2QkIeL9xQpQFZzFqVtxYxZ1G.jpg",
362
+ backdrop: "https://image.tmdb.org/t/p/original/7Z7WVzJsSReG8P0Yb3S4vZv4XvT.jpg",
363
+ rating: 4.3,
364
+ duration: "2h 02min",
365
+ genres: ["Comédie", "Romance"],
366
+ tags: ["french", "comedy", "romance"],
367
+ servers: [
368
+ { name: "YouTube", url: "https://www.youtube.com/embed/sECzJY07oK4?autoplay=1", quality: "HD 1080p" },
369
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" }
370
+ ],
371
+ trending: false,
372
+ topRated: true
373
+ },
374
+ {
375
+ id: 103,
376
+ title: "Léon",
377
+ year: 1994,
378
+ description: "Léon, tueur à gages, prend sous son aile Mathilda, 12 ans, dont la famille a été assassinée par un policier corrompu. Une relation inhabituelle se développe entre eux.",
379
+ poster: "https://image.tmdb.org/t/p/w500/gdEOmRvQvQkqRzgYE7ZxjyLArBm.jpg",
380
+ backdrop: "https://image.tmdb.org/t/p/original/7YwjaHLmuy1iKBOk9QmQrYHjSuq.jpg",
381
+ rating: 4.4,
382
+ duration: "2h 13min",
383
+ genres: ["Action", "Drame", "Thriller"],
384
+ tags: ["french", "action", "drama"],
385
+ servers: [
386
+ { name: "YouTube", url: "https://www.youtube.com/embed/jawVxq1IICo?autoplay=1", quality: "HD 1080p" },
387
+ { name: "Dailymotion", url: "https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1", quality: "HD 720p" }
388
+ ],
389
+ trending: true,
390
+ topRated: true
391
+ },
392
+ {
393
+ id: 104,
394
+ title: "La Haine",
395
+ year: 1995,
396
+ description: "24 heures dans la vie de trois jeunes de banlieue après une émeute provoquée par le passage à tabac d'un adolescent par la police.",
397
+ poster: "https://image.tmdb.org/t/p/w500/4T4S4XDRQ3wgaVQe8O5QeZfKjUF.jpg",
398
+ backdrop: "https://image.tmdb.org/t/p/original/1X4v8BQTZtcX4BmS8nHkxVE3SOp.jpg",
399
+ rating: 4.4,
400
+ duration: "1h 38min",
401
+ genres: ["Drame"],
402
+ tags: ["french", "drama"],
403
+ servers: [
404
+ { name: "YouTube", url: "https://www.youtube.com/embed/FW0ljJCXqyM?autoplay=1", quality: "HD 1080p" },
405
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" }
406
+ ],
407
+ trending: false,
408
+ topRated: true
409
+ },
410
+ {
411
+ id: 105,
412
+ title: "Le Dîner de Cons",
413
+ year: 1998,
414
+ description: "Chaque mercredi, Pierre Brochant et ses amis organisent un "dîner de cons". Le gagnant est celui qui aura amené le plus bel idiot. Ce soir, Brochant croit tenir le champion du monde...",
415
+ poster: "https://image.tmdb.org/t/p/w500/1Xx4q4hTzWYktu3yQdQzqTkXlwM.jpg",
416
+ backdrop: "https://image.tmdb.org/t/p/original/9FaCH2fXvYqYXQmh9JY4VqDyYBW.jpg",
417
+ rating: 4.6,
418
+ duration: "1h 20min",
419
+ genres: ["Comédie"],
420
+ tags: ["french", "comedy"],
421
+ servers: [
422
+ { name: "YouTube", url: "https://www.youtube.com/embed/VKqJ09GjX6E?autoplay=1", quality: "HD 1080p" },
423
+ { name: "Dailymotion", url: "https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1", quality: "HD 720p" }
424
+ ],
425
+ trending: false,
426
+ topRated: true
427
+ },
428
+ {
429
+ id: 106,
430
+ title: "Astérix & Obélix : Mission Cléopâtre",
431
+ year: 2002,
432
+ description: "Cléopâtre parie avec César qu'elle est capable de faire construire un palais somptueux en trois mois. Elle confie cette tâche à l'architecte Numérobis qui fait appel à Astérix et Obélix.",
433
+ poster: "https://image.tmdb.org/t/p/w500/2JZ5g5qGJUgHmLP4Kx0gTZ3XwVN.jpg",
434
+ backdrop: "https://image.tmdb.org/t/p/original/9FaCH2fXvYqYXQmh9JY4VqDyYBW.jpg",
435
+ rating: 4.2,
436
+ duration: "1h 47min",
437
+ genres: ["Comédie", "Aventure", "Familial"],
438
+ tags: ["french", "comedy", "adventure"],
439
+ servers: [
440
+ { name: "YouTube", url: "https://www.youtube.com/embed/ZZU5aRR3z4I?autoplay=1", quality: "HD 1080p" },
441
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" }
442
+ ],
443
+ trending: true,
444
+ topRated: false
445
+ },
446
+ {
447
+ id: 107,
448
+ title: "Les Choristes",
449
+ year: 2004,
450
+ description: "En 1949, Clément Mathieu, professeur de musique sans emploi, accepte un poste de surveillant dans un internat de rééducation pour mineurs. Il va tenter de changer les choses en créant une chorale.",
451
+ poster: "https://image.tmdb.org/t/p/w500/1Xx4q4hTzWYktu3yQdQzqTkXlwM.jpg",
452
+ backdrop: "https://image.tmdb.org/t/p/original/9FaCH2fXvYqYXQmh9JY4VqDyYBW.jpg",
453
+ rating: 4.1,
454
+ duration: "1h 37min",
455
+ genres: ["Drame", "Musique"],
456
+ tags: ["french", "drama", "music"],
457
+ servers: [
458
+ { name: "YouTube", url: "https://www.youtube.com/embed/5xH0HfJHsaY?autoplay=1", quality: "HD 1080p" },
459
+ { name: "Dailymotion", url: "https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1", quality: "HD 720p" }
460
+ ],
461
+ trending: false,
462
+ topRated: true
463
+ },
464
+ {
465
+ id: 108,
466
+ title: "Le Petit Nicolas",
467
+ year: 2009,
468
+ description: "Nicolas mène une existence paisible. Il a des parents qui l'aiment, une bande de chouettes copains avec lesquels il s'amuse bien. Mais un jour, il croit comprendre que sa mère est enceinte...",
469
+ poster: "https://image.tmdb.org/t/p/w500/2JZ5g5qGJUgHmLP4Kx0gTZ3XwVN.jpg",
470
+ backdrop: "https://image.tmdb.org/t/p/original/9FaCH2fXvYqYXQmh9JY4VqDyYBW.jpg",
471
+ rating: 4.0,
472
+ duration: "1h 31min",
473
+ genres: ["Comédie", "Familial"],
474
+ tags: ["french", "comedy", "family"],
475
+ servers: [
476
+ { name: "YouTube", url: "https://www.youtube.com/embed/8g18jFHCLXk?autoplay=1", quality: "HD 1080p" },
477
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" }
478
+ ],
479
+ trending: false,
480
+ topRated: false
481
+ },
482
+ {
483
+ id: 109,
484
+ title: "Bienvenue chez les Ch'tis",
485
+ year: 2008,
486
+ description: "Philippe Abrams est directeur de la poste de Salon-de-Provence. Muté dans le Nord, il invente une dépression pour éviter d'y aller. Mais il est démasqué et doit partir à Bergues.",
487
+ poster: "https://image.tmdb.org/t/p/w500/1Xx4q4hTzWYktu3yQdQzqTkXlwM.jpg",
488
+ backdrop: "https://image.tmdb.org/t/p/original/9FaCH2fXvYqYXQmh9JY4VqDyYBW.jpg",
489
+ rating: 4.2,
490
+ duration: "1h 46min",
491
+ genres: ["Comédie"],
492
+ tags: ["french", "comedy"],
493
+ servers: [
494
+ { name: "YouTube", url: "https://www.youtube.com/embed/5xH0HfJHsaY?autoplay=1", quality: "HD 1080p" },
495
+ { name: "Dailymotion", url: "https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1", quality: "HD 720p" }
496
+ ],
497
+ trending: false,
498
+ topRated: true
499
+ },
500
+ {
501
+ id: 110,
502
+ title: "OSS 117 : Le Caire, nid d'espions",
503
+ year: 2006,
504
+ description: "En 1955, l'agent secret français Hubert Bonisseur de la Bath, alias OSS 117, est envoyé au Caire pour une mission des plus périlleuses.",
505
+ poster: "https://image.tmdb.org/t/p/w500/2JZ5g5qGJUgHmLP4Kx0gTZ3XwVN.jpg",
506
+ backdrop: "https://image.tmdb.org/t/p/original/9FaCH2fXvYqYXQmh9JY4VqDyYBW.jpg",
507
+ rating: 4.0,
508
+ duration: "1h 39min",
509
+ genres: ["Comédie", "Action"],
510
+ tags: ["french", "comedy", "action"],
511
+ servers: [
512
+ { name: "YouTube", url: "https://www.youtube.com/embed/5xH0HfJHsaY?autoplay=1", quality: "HD 1080p" },
513
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" }
514
+ ],
515
+ trending: false,
516
+ topRated: false
517
+ },
518
+
519
+ // Films internationaux
520
+ {
521
+ id: 201,
522
+ title: "Interstellar",
523
+ year: 2014,
524
+ description: "Dans un futur proche, la Terre est devenue hostile pour l'humanité. Un groupe d'explorateurs utilise un vaisseau spatial pour franchir un trou de ver permettant de parcourir des distances jusque-là insurmontables, dans le but de sauver l'humanité.",
525
+ poster: "https://image.tmdb.org/t/p/w500/gEU2QniE6E77NI6lCU6MxlNBvIx.jpg",
526
+ backdrop: "https://image.tmdb.org/t/p/original/rAiYTfKGqDCRIIqo664sY9XZIvQ.jpg",
527
+ rating: 4.7,
528
+ duration: "2h 49min",
529
+ genres: ["Science-fiction", "Aventure", "Espace", "Drame"],
530
+ tags: ["sf", "adventure", "drama"],
531
+ servers: [
532
+ { name: "YouTube", url: "https://www.youtube.com/embed/zSWdZVtXT7E?autoplay=1", quality: "HD 1080p" },
533
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" },
534
+ { name: "Dailymotion", url: "https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1", quality: "HD 720p" }
535
+ ],
536
+ trending: true,
537
+ topRated: true
538
+ },
539
+ {
540
+ id: 202,
541
+ title: "Inception",
542
+ year: 2010,
543
+ description: "Dom Cobb est un voleur expérimenté dans l'art dangereux de l'extraction : sa spécialité consiste à s'approprier les secrets les plus précieux d'un individu, enfouis au plus profond de son subconscient, pendant qu'il rêve.",
544
+ poster: "https://image.tmdb.org/t/p/w500/9gk7adHYeDvHkCSEqAvQNLV5Uge.jpg",
545
+ backdrop: "https://image.tmdb.org/t/p/original/s3TBrRGB1iav7gFOCNx3H31MoES.jpg",
546
+ rating: 4.3,
547
+ duration: "2h 28min",
548
+ genres: ["Science-fiction", "Action", "Thriller"],
549
+ tags: ["sf", "action"],
550
+ servers: [
551
+ { name: "YouTube", url: "https://www.youtube.com/embed/YoHD9XEInc0?autoplay=1", quality: "HD 1080p" },
552
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" }
553
+ ],
554
+ trending: true,
555
+ topRated: true
556
+ },
557
+ {
558
+ id: 203,
559
+ title: "The Dark Knight",
560
+ year: 2008,
561
+ description: "Batman relève le défi ultime en affrontant le Joker, un génie criminel qui sème la terreur et le chaos dans Gotham City.",
562
+ poster: "https://image.tmdb.org/t/p/w500/qJ2tW6WMUDux911r6m7haRef0WH.jpg",
563
+ backdrop: "https://image.tmdb.org/t/p/original/h3jYanWMEJq6VNrsCwJG5RqmS1z.jpg",
564
+ rating: 4.5,
565
+ duration: "2h 32min",
566
+ genres: ["Action", "Crime", "Drama"],
567
+ tags: ["action", "drama"],
568
+ servers: [
569
+ { name: "YouTube", url: "https://www.youtube.com/embed/EXeTwQWrcwY?autoplay=1", quality: "HD 1080p" },
570
+ { name: "Dailymotion", url: "https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1", quality: "HD 720p" }
571
+ ],
572
+ trending: false,
573
+ topRated: true
574
+ },
575
+ {
576
+ id: 204,
577
+ title: "Avengers: Endgame",
578
+ year: 2019,
579
+ description: "Les Avengers et leurs alliés doivent être prêts à tout sacrifier pour vaincre Thanos et restaurer l'équilibre de l'univers.",
580
+ poster: "https://image.tmdb.org/t/p/w500/or06FN3Dka5tukK1e9sl16pB3iy.jpg",
581
+ backdrop: "https://image.tmdb.org/t/p/original/7RyHsO4yDXtBv1zUU3mTpHeQ0d5.jpg",
582
+ rating: 4.4,
583
+ duration: "3h 1min",
584
+ genres: ["Action", "Aventure", "Science-fiction"],
585
+ tags: ["action", "adventure", "sf"],
586
+ servers: [
587
+ { name: "YouTube", url: "https://www.youtube.com/embed/TcMBFSGVi1c?autoplay=1", quality: "HD 1080p" },
588
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" }
589
+ ],
590
+ trending: true,
591
+ topRated: false
592
+ },
593
+ {
594
+ id: 205,
595
+ title: "The Shawshank Redemption",
596
+ year: 1994,
597
+ description: "Deux hommes emprisonnés se lient d'amitié au fil des ans, trouvant réconfort et rédemption finale grâce à des actes de bonté commune.",
598
+ poster: "https://image.tmdb.org/t/p/w500/q6y0Go1tsGEsmtFryDOJo3dEmqu.jpg",
599
+ backdrop: "https://image.tmdb.org/t/p/original/9faGSFi5jam6pDWGNd0N8gB3X7b.jpg",
600
+ rating: 4.8,
601
+ duration: "2h 22min",
602
+ genres: ["Drame", "Crime"],
603
+ tags: ["drama"],
604
+ servers: [
605
+ { name: "YouTube", url: "https://www.youtube.com/embed/6hB3S9bIaco?autoplay=1", quality: "HD 1080p" },
606
+ { name: "Dailymotion", url: "https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1", quality: "HD 720p" }
607
+ ],
608
+ trending: false,
609
+ topRated: true
610
+ },
611
+ {
612
+ id: 206,
613
+ title: "Pulp Fiction",
614
+ year: 1994,
615
+ description: "Les vies de deux hommes de main, d'un boxeur, d'un gangster et de sa femme, et d'un couple de petits braqueurs s'entrecroisent dans une histoire de crime à Los Angeles.",
616
+ poster: "https://image.tmdb.org/t/p/w500/d5iIlFn5s0ImszYzBPb8JPIfbXD.jpg",
617
+ backdrop: "https://image.tmdb.org/t/p/original/suaEOtk1N1sgg2MTM7oZd2cfVp3.jpg",
618
+ rating: 4.3,
619
+ duration: "2h 34min",
620
+ genres: ["Crime", "Drame"],
621
+ tags: ["drama"],
622
+ servers: [
623
+ { name: "YouTube", url: "https://www.youtube.com/embed/s7EdQ4FqbhY?autoplay=1", quality: "HD 1080p" },
624
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" }
625
+ ],
626
+ trending: false,
627
+ topRated: true
628
+ },
629
+ {
630
+ id: 207,
631
+ title: "The Matrix",
632
+ year: 1999,
633
+ description: "Un pirate informatique découvre que la réalité est une simulation contrôlée par des machines intelligentes qui utilisent les humains comme source d'énergie.",
634
+ poster: "https://image.tmdb.org/t/p/w500/f89U3ADr1oiB1s9GkdPOEpXUk5H.jpg",
635
+ backdrop: "https://image.tmdb.org/t/p/original/7u3pxc0K1wx32IleAkLv78MKgrw.jpg",
636
+ rating: 4.2,
637
+ duration: "2h 16min",
638
+ genres: ["Action", "Science-fiction"],
639
+ tags: ["action", "sf"],
640
+ servers: [
641
+ { name: "YouTube", url: "https://www.youtube.com/embed/vKQi3bBA1y8?autoplay=1", quality: "HD 1080p" },
642
+ { name: "Dailymotion", url: "https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1", quality: "HD 720p" }
643
+ ],
644
+ trending: true,
645
+ topRated: false
646
+ },
647
+ {
648
+ id: 208,
649
+ title: "Parasite",
650
+ year: 2019,
651
+ description: "Les membres d'une famille pauvre s'infiltrent dans une riche famille en se faisant passer pour des professionnels hautement qualifiés.",
652
+ poster: "https://image.tmdb.org/t/p/w500/7IiTTgloJzvGI1TAYymCfbfl3vT.jpg",
653
+ backdrop: "https://image.tmdb.org/t/p/original/TU9NIjwzjoKPwQHoHshkFcQUCG.jpg",
654
+ rating: 4.6,
655
+ duration: "2h 12min",
656
+ genres: ["Comédie", "Drame", "Thriller"],
657
+ tags: ["drama", "comedy"],
658
+ servers: [
659
+ { name: "YouTube", url: "https://www.youtube.com/embed/5xH0HfJHsaY?autoplay=1", quality: "HD 1080p" },
660
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" }
661
+ ],
662
+ trending: true,
663
+ topRated: true
664
+ },
665
+ {
666
+ id: 209,
667
+ title: "The Godfather",
668
+ year: 1972,
669
+ description: "Le patriarche vieillissant d'une dynastie criminelle new-yorkaise transfère le contrôle de son empire clandestin à son fils réticent.",
670
+ poster: "https://image.tmdb.org/t/p/w500/3bhkrj58Vtu7enYsRolD1fZdja1.jpg",
671
+ backdrop: "https://image.tmdb.org/t/p/original/rSPw7tgCH9c6NqICZef4kZjFOQ5.jpg",
672
+ rating: 4.7,
673
+ duration: "2h 55min",
674
+ genres: ["Crime", "Drame"],
675
+ tags: ["drama"],
676
+ servers: [
677
+ { name: "YouTube", url: "https://www.youtube.com/embed/sY1S34973zA?autoplay=1", quality: "HD 1080p" },
678
+ { name: "Dailymotion", url: "https://www.dailymotion.com/embed/video/x8j1j4v?autoplay=1", quality: "HD 720p" }
679
+ ],
680
+ trending: false,
681
+ topRated: true
682
+ },
683
+ {
684
+ id: 210,
685
+ title: "Dune",
686
+ year: 2021,
687
+ description: "Paul Atreides, un jeune homme brillant et doué, doit voyager vers la planète la plus dangereuse de l'univers pour assurer l'avenir de sa famille et de son peuple.",
688
+ poster: "https://image.tmdb.org/t/p/w500/d5NXSklXo0qyIYkgV94XAgMIckC.jpg",
689
+ backdrop: "https://image.tmdb.org/t/p/original/jYEW5xZkZk2WTrdbMGAPFuBqbDc.jpg",
690
+ rating: 4.1,
691
+ duration: "2h 35min",
692
+ genres: ["Science-fiction", "Aventure"],
693
+ tags: ["sf", "adventure"],
694
+ servers: [
695
+ { name: "YouTube", url: "https://www.youtube.com/embed/8g18jFHCLXk?autoplay=1", quality: "HD 1080p" },
696
+ { name: "Vimeo", url: "https://player.vimeo.com/video/24456787?autoplay=1", quality: "HD 720p" }
697
+ ],
698
+ trending: true,
699
+ topRated: false
700
+ }
701
+ ];
702
+
703
+ // Toggle fullscreen mode
704
+ function toggleFullscreen(videoId) {
705
+ const video = document.getElementById(videoId);
706
+ if (!document.fullscreenElement) {
707
+ video.requestFullscreen().catch(err => {
708
+ alert(`Erreur lors du passage en plein écran: ${err.message}`);
709
+ });
710
+ } else {
711
+ document.exitFullscreen();
712
+ }
713
+ }
714
+
715
+ // Change server
716
+ function changeServer(src, serverName) {
717
+ const videoContainer = document.getElementById('full-movie-container');
718
+ const loadingOverlay = document.getElementById('loading-overlay');
719
+
720
+ // Show loading
721
+ loadingOverlay.classList.remove('hidden');
722
+
723
+ // Reset all server buttons
724
+ document.querySelectorAll('.server-btn').forEach(btn => {
725
+ btn.classList.remove('active');
726
+ btn.classList.add('bg-gray-700', 'hover:bg-gray-600');
727
+ });
728
+
729
+ // Set active server button
730
+ event.target.classList.add('active');
731
+ event.target.classList.remove('bg-gray-700', 'hover:bg-gray-600');
732
+
733
+ // Create new iframe for the video
734
+ let videoHTML;
735
+ if (src.includes('youtube.com')) {
736
+ videoHTML = `<iframe id="full-movie" class="w-full h-full" src="${src}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>`;
737
+ } else if (src.includes('vimeo.com')) {
738
+ videoHTML = `<iframe id="full-movie" class="w-full h-full" src="${src}" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>`;
739
+ } else if (src.includes('dailymotion.com')) {
740
+ videoHTML = `<iframe id="full-movie" class="w-full h-full" src="${src}" frameborder="0" allow="autoplay" allowfullscreen></iframe>`;
741
+ } else {
742
+ videoHTML = `<video id="full-movie" class="w-full h-full" autoplay muted controls>
743
+ <source src="${src}" type="video/mp4">
744
+ Votre navigateur ne supporte pas la lecture de vidéos.
745
+ </video>`;
746
+ }
747
+
748
+ // Replace video content
749
+ videoContainer.innerHTML = videoHTML;
750
+
751
+ // Hide loading after a delay
752
+ setTimeout(() => {
753
+ loadingOverlay.classList.add('hidden');
754
+
755
+ // Re-attach event listeners if it's a video element
756
+ const newVideo = document.getElementById('full-movie');
757
+ if (newVideo.tagName === 'VIDEO') {
758
+ setupVideoControls(newVideo);
759
+ }
760
+ }, 1500);
761
+ }
762
+
763
+ // Setup video controls for HTML5 video
764
+ function setupVideoControls(video) {
765
+ const playPauseBtn = document.getElementById('play-pause-btn');
766
+ const currentTime = document.getElementById('current-time');
767
+ const duration = document.getElementById('duration');
768
+ const progressBar = document.getElementById('progress-bar');
769
+ const muteBtn = document.getElementById('mute-btn');
770
+
771
+ // Format time
772
+ function formatTime(seconds) {
773
+ const minutes = Math.floor(seconds / 60);
774
+ const remainingSeconds = Math.floor(seconds % 60);
775
+ return `${minutes}:${remainingSeconds < 10 ? '0' : ''}${remainingSeconds}`;
776
+ }
777
+
778
+ // Update time display
779
+ function updateTime() {
780
+ currentTime.textContent = formatTime(video.currentTime);
781
+ duration.textContent = formatTime(video.duration);
782
+
783
+ // Update progress bar
784
+ const progress = (video.currentTime / video.duration) * 100;
785
+ progressBar.style.width = `${progress}%`;
786
+ }
787
+
788
+ // Toggle play/pause
789
+ playPauseBtn.addEventListener('click', function() {
790
+ if (video.paused) {
791
+ video.play();
792
+ playPauseBtn.innerHTML = '<i class="fas fa-pause text-xl"></i>';
793
+ } else {
794
+ video.pause();
795
+ playPauseBtn.innerHTML = '<i class="fas fa-play text-xl"></i>';
796
+ }
797
+ });
798
+
799
+ // Toggle mute
800
+ muteBtn.addEventListener('click', function() {
801
+ video.muted = !video.muted;
802
+ muteBtn.innerHTML = video.muted
803
+ ? '<i class="fas fa-volume-mute text-xl"></i>'
804
+ : '<i class="fas fa-volume-up text-xl"></i>';
805
+ });
806
+
807
+ // Update time on timeupdate
808
+ video.addEventListener('timeupdate', updateTime);
809
+
810
+ // Update duration when metadata is loaded
811
+ video.addEventListener('loadedmetadata', function() {
812
+ duration.textContent = formatTime(video.duration);
813
+ });
814
+
815
+ // Click on progress bar to seek
816
+ document.querySelector('.progress-container').addEventListener('click', function(e) {
817
+ const rect = this.getBoundingClientRect();
818
+ const pos = (e.pageX - rect.left) / this.offsetWidth;
819
+ video.currentTime = pos * video.duration;
820
+ });
821
+
822
+ // Auto-play video with muted sound (to bypass browser restrictions)
823
+ video.muted = true;
824
+ video.play().catch(e => {
825
+ console.log('Autoplay prevented, showing controls');
826
+ video.controls = true;
827
+ });
828
+
829
+ // Toggle play/pause icon when video is played/paused
830
+ video.addEventListener('play', function() {
831
+ playPauseBtn.innerHTML = '<i class="fas fa-pause text-xl"></i>';
832
+ });
833
+
834
+ video.addEventListener('pause', function() {
835
+ playPauseBtn.innerHTML = '<i class="fas fa-play text-xl"></i>';
836
+ });
837
+ }
838
+
839
+ // Load movie into player
840
+ function loadMovie(movieId) {
841
+ const movie = movieDatabase.find(m => m.id === movieId);
842
+ if (!movie) return;
843
+
844
+ // Update movie info
845
+ document.getElementById('current-movie-title').textContent = `${movie.title} (${movie.year})`;
846
+ document.getElementById('current-movie-poster').src = movie.poster;
847
+ document.getElementById('current-movie-description').textContent = movie.description;
848
+ document.getElementById('current-movie-duration').textContent = movie.duration;
849
+
850
+ // Update backdrop
851
+ document.getElementById('movie-backdrop').style.backgroundImage = `url(${movie.backdrop})`;
852
+
853
+ // Update rating stars
854
+ const ratingContainer = document.getElementById('current-movie-rating');
855
+ ratingContainer.innerHTML = '';
856
+ const fullStars = Math.floor(movie.rating);
857
+ const hasHalfStar = movie.rating % 1 >= 0.5;
858
+
859
+ for (let i = 0; i < 5; i++) {
860
+ if (i < fullStars) {
861
+ ratingContainer.innerHTML += '<i class="fas fa-star"></i>';
862
+ } else if (i === fullStars && hasHalfStar) {
863
+ ratingContainer.innerHTML += '<i class="fas fa-star-half-alt"></i>';
864
+ } else {
865
+ ratingContainer.innerHTML += '<i class="far fa-star"></i>';
866
+ }
867
+ }
868
+
869
+ // Update genres
870
+ const genresContainer = document.getElementById('current-movie-genres');
871
+ genresContainer.innerHTML = '';
872
+ movie.genres.forEach(genre => {
873
+ genresContainer.innerHTML += `<span class="px-3 py-1 bg-gray-700 rounded-full text-sm">${genre}</span>`;
874
+ });
875
+
876
+ // Update servers
877
+ const serversContainer = document.getElementById('server-buttons');
878
+ serversContainer.innerHTML = '';
879
+ movie.servers.forEach((server, index) => {
880
+ serversContainer.innerHTML += `
881
+ <button class="server-btn px-4 py-2 rounded-md flex items-center ${index === 0 ? 'active bg-blue-600' : 'bg-gray-700 hover:bg-gray-600'}"
882
+ onclick="changeServer('${server.url}', '${server.name}')">
883
+ <i class="fas fa-server mr-2"></i> ${server.name} <span class="ml-2 text-xs bg-black bg-opacity-50 px-2 py-1 rounded">${server.quality}</span>
884
+ </button>
885
+ `;
886
+ });
887
+
888
+ // Load first server by default with autoplay
889
+ if (movie.servers.length > 0) {
890
+ const videoContainer = document.getElementById('full-movie-container');
891
+ let videoHTML;
892
+
893
+ if (movie.servers[0].url.includes('youtube.com')) {
894
+ videoHTML = `<iframe id="full-movie" class="w-full h-full" src="${movie.servers[0].url}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>`;
895
+ } else if (movie.servers[0].url.includes('vimeo.com')) {
896
+ videoHTML = `<iframe id="full-movie" class="w-full h-full" src="${movie.servers[0].url}" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>`;
897
+ } else if (movie.servers[0].url.includes('dailymotion.com')) {
898
+ videoHTML = `<iframe id="full-movie" class="w-full h-full" src="${movie.servers[0].url}" frameborder="0" allow="autoplay" allowfullscreen></iframe>`;
899
+ } else {
900
+ videoHTML = `<video id="full-movie" class="w-full h-full" autoplay muted controls>
901
+ <source src="${movie.servers[0].url}" type="video/mp4">
902
+ Votre navigateur ne supporte pas la lecture de vidéos.
903
+ </video>`;
904
+ }
905
+
906
+ videoContainer.innerHTML = videoHTML;
907
+
908
+ // Setup controls if it's a video element
909
+ const video = document.getElementById('full-movie');
910
+ if (video.tagName === 'VIDEO') {
911
+ setupVideoControls(video);
912
+ }
913
+ }
914
+ }
915
+
916
+ // Create movie card
917
+ function createMovieCard(movie) {
918
+ return `
919
+ <div class="group movie-card" onclick="loadMovie(${movie.id})">
920
+ <div class="relative overflow-hidden rounded-lg aspect-[2/3]">
921
+ <img src="${movie.poster}" alt="${movie.title}" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-300">
922
+ <div class="movie-overlay absolute inset-0 bg-black bg-opacity-30 flex items-center justify-center opacity-0">
923
+ <button class="bg-blue-600 hover:bg-blue-700 w-12 h-12 rounded-full flex items-center justify-center">
924
+ <i class="fas fa-play"></i>
925
+ </button>
926
+ </div>
927
+ <span class="absolute top-2 right-2 bg-yellow-500 text-black text-xs font-bold px-2 py-1 rounded">${movie.rating.toFixed(1)}</span>
928
+ </div>
929
+ <h4 class="mt-2 font-medium">${movie.title} <span class="text-gray-400">(${movie.year})</span></h4>
930
+ </div>
931
+ `;
932
+ }
933
+
934
+ // Filter movies by category
935
+ function filterMoviesByCategory(category) {
936
+ if (category === 'all') return movieDatabase;
937
+
938
+ const categoryMap = {
939
+ 'french': m => m.tags.includes('french'),
940
+ 'action': m => m.tags.includes('action'),
941
+ 'comedy': m => m.tags.includes('comedy'),
942
+ 'drama': m => m.tags.includes('drama'),
943
+ 'sf': m => m.tags.includes('sf'),
944
+ 'horror': m => m.tags.includes('horror'),
945
+ 'adventure': m => m.tags.includes('adventure')
946
+ };
947
+
948
+ return movieDatabase.filter(categoryMap[category] || (() => true));
949
+ }
950
+
951
+ // Search movies
952
+ function searchMovies(query) {
953
+ if (!query) return [];
954
+ return movieDatabase.filter(movie =>
955
+ movie.title.toLowerCase().includes(query.toLowerCase())
956
+ );
957
+ }
958
+
959
+ // Initialize the page
960
+ document.addEventListener('DOMContentLoaded', function() {
961
+ // Add container div for the video player
962
+ const videoContainer = document.querySelector('.player-container');
963
+ videoContainer.innerHTML = `<div id="full-movie-container"></div>`;
964
+
965
+ // Search functionality
966
+ const searchInput = document.getElementById('search-input');
967
+ const searchResults = document.getElementById('search-results');
968
+ const mobileMenuBtn = document.getElementById('mobile-menu-btn');
969
+ const mobileMenu = document.getElementById('mobile-menu');
970
+
971
+ searchInput.addEventListener('input', function() {
972
+ const query = this.value;
973
+ if (query.length > 2) {
974
+ const results = searchMovies(query);
975
+ if (results.length > 0) {
976
+ searchResults.innerHTML = results.map(movie => `
977
+ <div class="p-3 hover:bg-gray-700 cursor-pointer flex items-center" onclick="loadMovie(${movie.id})">
978
+ <img src="${movie.poster}" alt="${movie.title}" class="w-10 h-14 object-cover rounded mr-3">
979
+ <div>
980
+ <div class="font-medium">${movie.title}</div>
981
+ <div class="text-xs text-gray-400">${movie.year} • ${movie.genres.join(', ')}</div>
982
+ </div>
983
+ </div>
984
+ `).join('');
985
+ searchResults.classList.remove('hidden');
986
+ } else {
987
+ searchResults.innerHTML = '<div class="p-3 text-gray-400">Aucun résultat trouvé</div>';
988
+ searchResults.classList.remove('hidden');
989
+ }
990
+ } else {
991
+ searchResults.classList.add('hidden');
992
+ }
993
+ });
994
+
995
+ // Close search results when clicking outside
996
+ document.addEventListener('click', function(e) {
997
+ if (!searchInput.contains(e.target) && !searchResults.contains(e.target)) {
998
+ searchResults.classList.add('hidden');
999
+ }
1000
+ });
1001
+
1002
+ // Mobile menu toggle
1003
+ mobileMenuBtn.addEventListener('click', function() {
1004
+ mobileMenu.classList.toggle('hidden');
1005
+ });
1006
+
1007
+ // Category filter
1008
+ document.querySelectorAll('.category-btn').forEach(btn => {
1009
+ btn.addEventListener('click', function() {
1010
+ // Set active button
1011
+ document.querySelectorAll('.category-btn').forEach(b => b.classList.remove('active', 'bg-blue-600'));
1012
+ this.classList.add('active', 'bg-blue-600');
1013
+
1014
+ // Filter movies
1015
+ const category = this.dataset.category;
1016
+ const filteredMovies = filterMoviesByCategory(category);
1017
+
1018
+ // Update movie sections
1019
+ document.getElementById('trending-movies').innerHTML =
1020
+ filteredMovies.filter(m => m.trending).map(createMovieCard).join('');
1021
+
1022
+ document.getElementById('top-rated-movies').innerHTML =
1023
+ filteredMovies.filter(m => m.topRated).map(createMovieCard).join('');
1024
+
1025
+ document.getElementById('new-releases').innerHTML =
1026
+ filteredMovies.filter(m => m.year >= new Date().getFullYear() - 2).map(createMovieCard).join('');
1027
+ });
1028
+ });
1029
+
1030
+ // Load initial movie with autoplay
1031
+ loadMovie(1);
1032
+
1033
+ // Load trending movies
1034
+ const trendingMovies = movieDatabase.filter(movie => movie.trending);
1035
+ document.getElementById('trending-movies').innerHTML = trendingMovies.map(createMovieCard).join('');
1036
+
1037
+ // Load top rated movies
1038
+ const topRatedMovies = movieDatabase.filter(movie => movie.topRated);
1039
+ document.getElementById('top-rated-movies').innerHTML = topRatedMovies.map(createMovieCard).join('');
1040
+
1041
+ // Load new releases (last 2 years)
1042
+ const currentYear = new Date().getFullYear();
1043
+ const newReleases = movieDatabase.filter(movie => movie.year >= currentYear - 2);
1044
+ document.getElementById('new-releases').innerHTML = newReleases.map(createMovieCard).join('');
1045
+ });
1046
+ </script>
1047
+ <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-full" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
1048
+ </html>
prompts.txt ADDED
@@ -0,0 +1,11 @@
 
 
 
 
 
 
 
 
 
 
 
 
1
+ Films Complets en HD Regardez vos films préférés en entier, sans coupure, avec une qualité optimale. Plus de 20,000 films disponibles. regarder les film original complet en ouverture lecteur automatique , plussieur zone de lecture du film en automatique
2
+ afficher toutes les images d'origines des film :aucun bouton fonctione active toutes les boutons afin de les faire fonctionner directemen en automatique
3
+ JE VEUX LES ZONE DES LECTURE ORIGINE
4
+ ACTIVER LES FILM COMPLET A REGARDER
5
+ AUCUN SERVEUR FONCIONNE ACTIVER LES SERVEUR ORIGINAL DES FILM A REGARDER EN COMPLET AVEC MTV ET LIEN ORIGINAL DES FILM
6
+ lancer le film lecture complet
7
+ ajouter le plus puissant base de donnes de film complet pret a regarder en entier avec divers serveur de lecture
8
+ afficher les images des films en vrai et activer les lecture des film en automatique
9
+ ajouter toutes les liens url des film complet
10
+ ajouter les liens des film complet a regarder tout de suite
11
+ ajouté une base de données des film complet avec leur liens des serveur des film a regarder en complet en francais