Spaces:
Running
Running
No video outcome came it's zero second video.
Browse files- dance-styles.html +12 -12
- index.html +8 -8
dance-styles.html
CHANGED
|
@@ -34,8 +34,8 @@
|
|
| 34 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 35 |
<div class="relative h-48 overflow-hidden">
|
| 36 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 37 |
-
<source src="https://
|
| 38 |
-
|
| 39 |
</div>
|
| 40 |
<div class="p-6">
|
| 41 |
<h3 class="text-xl font-bold text-gray-800 mb-2">Hip Hop</h3>
|
|
@@ -49,8 +49,8 @@
|
|
| 49 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 50 |
<div class="relative h-48 overflow-hidden">
|
| 51 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 52 |
-
<source src="https://
|
| 53 |
-
|
| 54 |
</div>
|
| 55 |
<div class="p-6">
|
| 56 |
<h3 class="text-xl font-bold text-gray-800 mb-2">Salsa</h3>
|
|
@@ -64,8 +64,8 @@
|
|
| 64 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 65 |
<div class="relative h-48 overflow-hidden">
|
| 66 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 67 |
-
<source src="https://
|
| 68 |
-
|
| 69 |
</div>
|
| 70 |
<div class="p-6">
|
| 71 |
<h3 class="text-xl font-bold text-gray-800 mb-2">Ballet</h3>
|
|
@@ -79,8 +79,8 @@
|
|
| 79 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 80 |
<div class="relative h-48 overflow-hidden">
|
| 81 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 82 |
-
<source src="https://
|
| 83 |
-
|
| 84 |
</div>
|
| 85 |
<div class="p-6">
|
| 86 |
<h3 class="text-xl font-bold text-gray-800 mb-2">Breakdance</h3>
|
|
@@ -94,8 +94,8 @@
|
|
| 94 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 95 |
<div class="relative h-48 overflow-hidden">
|
| 96 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 97 |
-
<source src="https://
|
| 98 |
-
|
| 99 |
</div>
|
| 100 |
<div class="p-6">
|
| 101 |
<h3 class="text-xl font-bold text-gray-800 mb-2">Twerk</h3>
|
|
@@ -109,8 +109,8 @@
|
|
| 109 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 110 |
<div class="relative h-48 overflow-hidden">
|
| 111 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 112 |
-
<source src="https://
|
| 113 |
-
|
| 114 |
</div>
|
| 115 |
<div class="p-6">
|
| 116 |
<h3 class="text-xl font-bold text-gray-800 mb-2">K-Pop</h3>
|
|
|
|
| 34 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 35 |
<div class="relative h-48 overflow-hidden">
|
| 36 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 37 |
+
<source src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerJoyrides.mp4" type="video/mp4">
|
| 38 |
+
</video>
|
| 39 |
</div>
|
| 40 |
<div class="p-6">
|
| 41 |
<h3 class="text-xl font-bold text-gray-800 mb-2">Hip Hop</h3>
|
|
|
|
| 49 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 50 |
<div class="relative h-48 overflow-hidden">
|
| 51 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 52 |
+
<source src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerBlazes.mp4" type="video/mp4">
|
| 53 |
+
</video>
|
| 54 |
</div>
|
| 55 |
<div class="p-6">
|
| 56 |
<h3 class="text-xl font-bold text-gray-800 mb-2">Salsa</h3>
|
|
|
|
| 64 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 65 |
<div class="relative h-48 overflow-hidden">
|
| 66 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 67 |
+
<source src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerFun.mp4" type="video/mp4">
|
| 68 |
+
</video>
|
| 69 |
</div>
|
| 70 |
<div class="p-6">
|
| 71 |
<h3 class="text-xl font-bold text-gray-800 mb-2">Ballet</h3>
|
|
|
|
| 79 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 80 |
<div class="relative h-48 overflow-hidden">
|
| 81 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 82 |
+
<source src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerMeltdowns.mp4" type="video/mp4">
|
| 83 |
+
</video>
|
| 84 |
</div>
|
| 85 |
<div class="p-6">
|
| 86 |
<h3 class="text-xl font-bold text-gray-800 mb-2">Breakdance</h3>
|
|
|
|
| 94 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 95 |
<div class="relative h-48 overflow-hidden">
|
| 96 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 97 |
+
<source src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/TearsOfSteel.mp4" type="video/mp4">
|
| 98 |
+
</video>
|
| 99 |
</div>
|
| 100 |
<div class="p-6">
|
| 101 |
<h3 class="text-xl font-bold text-gray-800 mb-2">Twerk</h3>
|
|
|
|
| 109 |
<div class="bg-white rounded-xl shadow-md overflow-hidden">
|
| 110 |
<div class="relative h-48 overflow-hidden">
|
| 111 |
<video autoplay loop muted class="w-full h-full object-cover">
|
| 112 |
+
<source src="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/WeAreGoingOnBullrun.mp4" type="video/mp4">
|
| 113 |
+
</video>
|
| 114 |
</div>
|
| 115 |
<div class="p-6">
|
| 116 |
<h3 class="text-xl font-bold text-gray-800 mb-2">K-Pop</h3>
|
index.html
CHANGED
|
@@ -261,11 +261,12 @@ const resultContainer = document.getElementById('resultContainer');
|
|
| 261 |
</button>
|
| 262 |
</div>
|
| 263 |
`;
|
| 264 |
-
|
| 265 |
-
|
|
|
|
|
|
|
| 266 |
resultContainer.parentNode.insertBefore(videoContainer, resultContainer.nextSibling);
|
| 267 |
-
|
| 268 |
-
danceBtn.innerHTML = '<i data-feather="activity" class="w-4 h-4 mr-2"></i> Make Me Dance';
|
| 269 |
danceBtn.disabled = false;
|
| 270 |
feather.replace();
|
| 271 |
}, 4000);
|
|
@@ -324,11 +325,10 @@ uploadArea.innerHTML = `
|
|
| 324 |
|
| 325 |
// Simulate AI processing with timeout
|
| 326 |
setTimeout(() => {
|
| 327 |
-
//
|
| 328 |
-
resultVideo.src = 'https://
|
| 329 |
resultVideo.load();
|
| 330 |
-
|
| 331 |
-
resultVideo.classList.remove('hidden');
|
| 332 |
placeholderText.classList.add('hidden');
|
| 333 |
resultContainer.classList.add('show');
|
| 334 |
|
|
|
|
| 261 |
</button>
|
| 262 |
</div>
|
| 263 |
`;
|
| 264 |
+
// Insert after result container with reliable video source
|
| 265 |
+
const danceVideo = videoContainer.querySelector('video');
|
| 266 |
+
danceVideo.src = 'https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerBlazes.mp4';
|
| 267 |
+
danceVideo.load();
|
| 268 |
resultContainer.parentNode.insertBefore(videoContainer, resultContainer.nextSibling);
|
| 269 |
+
danceBtn.innerHTML = '<i data-feather="activity" class="w-4 h-4 mr-2"></i> Make Me Dance';
|
|
|
|
| 270 |
danceBtn.disabled = false;
|
| 271 |
feather.replace();
|
| 272 |
}, 4000);
|
|
|
|
| 325 |
|
| 326 |
// Simulate AI processing with timeout
|
| 327 |
setTimeout(() => {
|
| 328 |
+
// Use a reliable demo video source
|
| 329 |
+
resultVideo.src = 'https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerJoyrides.mp4';
|
| 330 |
resultVideo.load();
|
| 331 |
+
resultVideo.classList.remove('hidden');
|
|
|
|
| 332 |
placeholderText.classList.add('hidden');
|
| 333 |
resultContainer.classList.add('show');
|
| 334 |
|