Spaces:
Running
Running
Update app.py
Browse files
app.py
CHANGED
|
@@ -205,12 +205,18 @@ HTML_CONTENT = """
|
|
| 205 |
max-width: 600px;
|
| 206 |
border-radius: 10px;
|
| 207 |
color: #e0e0e0;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 208 |
}
|
| 209 |
.close {
|
| 210 |
color: #aaa;
|
| 211 |
float: right;
|
| 212 |
font-size: 28px;
|
| 213 |
font-weight: bold;
|
|
|
|
| 214 |
}
|
| 215 |
.close:hover,
|
| 216 |
.close:focus {
|
|
@@ -228,6 +234,41 @@ HTML_CONTENT = """
|
|
| 228 |
border-radius: 5px;
|
| 229 |
text-align: center;
|
| 230 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 231 |
</style>
|
| 232 |
</head>
|
| 233 |
<body>
|
|
@@ -256,7 +297,7 @@ HTML_CONTENT = """
|
|
| 256 |
<h2>Embed Video Link</h2>
|
| 257 |
<p>Copy the following link to embed the video:</p>
|
| 258 |
<input type="text" id="embedLink" readonly>
|
| 259 |
-
<button onclick="copyEmbedLink()" class="btn"
|
| 260 |
</div>
|
| 261 |
</div>
|
| 262 |
|
|
@@ -392,14 +433,7 @@ HTML_CONTENT = """
|
|
| 392 |
xhr.send(formData);
|
| 393 |
}
|
| 394 |
|
| 395 |
-
|
| 396 |
-
if (event.lengthComputable) {
|
| 397 |
-
const percentComplete = (event.loaded / event.total) * 100;
|
| 398 |
-
progressBar.style.width = percentComplete + '%';
|
| 399 |
-
}
|
| 400 |
-
}
|
| 401 |
-
|
| 402 |
-
function resetUploadState() {
|
| 403 |
fileInput.value = '';
|
| 404 |
fileName.textContent = '';
|
| 405 |
uploadBtn.style.display = 'none';
|
|
@@ -430,7 +464,7 @@ HTML_CONTENT = """
|
|
| 430 |
linkContainer.appendChild(link);
|
| 431 |
linkContainer.appendChild(copyBtn);
|
| 432 |
|
| 433 |
-
|
| 434 |
const embedBtn = document.createElement('button');
|
| 435 |
embedBtn.textContent = 'Embed Video for Discord';
|
| 436 |
embedBtn.className = 'embed-btn';
|
|
|
|
| 205 |
max-width: 600px;
|
| 206 |
border-radius: 10px;
|
| 207 |
color: #e0e0e0;
|
| 208 |
+
animation: modalFadeIn 0.3s;
|
| 209 |
+
}
|
| 210 |
+
@keyframes modalFadeIn {
|
| 211 |
+
from {opacity: 0; transform: scale(0.8);}
|
| 212 |
+
to {opacity: 1; transform: scale(1);}
|
| 213 |
}
|
| 214 |
.close {
|
| 215 |
color: #aaa;
|
| 216 |
float: right;
|
| 217 |
font-size: 28px;
|
| 218 |
font-weight: bold;
|
| 219 |
+
transition: color 0.3s ease;
|
| 220 |
}
|
| 221 |
.close:hover,
|
| 222 |
.close:focus {
|
|
|
|
| 234 |
border-radius: 5px;
|
| 235 |
text-align: center;
|
| 236 |
}
|
| 237 |
+
.embed-btn {
|
| 238 |
+
position: relative;
|
| 239 |
+
overflow: hidden;
|
| 240 |
+
}
|
| 241 |
+
.embed-btn::before {
|
| 242 |
+
content: '';
|
| 243 |
+
position: absolute;
|
| 244 |
+
top: -50%;
|
| 245 |
+
left: -50%;
|
| 246 |
+
width: 200%;
|
| 247 |
+
height: 200%;
|
| 248 |
+
background: radial-gradient(circle, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0) 70%);
|
| 249 |
+
transform: scale(0);
|
| 250 |
+
transition: transform 0.3s ease-out;
|
| 251 |
+
}
|
| 252 |
+
.embed-btn:hover::before {
|
| 253 |
+
transform: scale(1);
|
| 254 |
+
}
|
| 255 |
+
.copy-embed-btn {
|
| 256 |
+
background-color: #4CAF50;
|
| 257 |
+
color: white;
|
| 258 |
+
border: none;
|
| 259 |
+
padding: 10px 20px;
|
| 260 |
+
text-align: center;
|
| 261 |
+
text-decoration: none;
|
| 262 |
+
display: inline-block;
|
| 263 |
+
font-size: 16px;
|
| 264 |
+
margin: 4px 2px;
|
| 265 |
+
transition-duration: 0.4s;
|
| 266 |
+
cursor: pointer;
|
| 267 |
+
border-radius: 25px;
|
| 268 |
+
}
|
| 269 |
+
.copy-embed-btn:hover {
|
| 270 |
+
background-color: #45a049;
|
| 271 |
+
}
|
| 272 |
</style>
|
| 273 |
</head>
|
| 274 |
<body>
|
|
|
|
| 297 |
<h2>Embed Video Link</h2>
|
| 298 |
<p>Copy the following link to embed the video:</p>
|
| 299 |
<input type="text" id="embedLink" readonly>
|
| 300 |
+
<button onclick="copyEmbedLink()" class="copy-embed-btn">Copy Embed Link</button>
|
| 301 |
</div>
|
| 302 |
</div>
|
| 303 |
|
|
|
|
| 433 |
xhr.send(formData);
|
| 434 |
}
|
| 435 |
|
| 436 |
+
function resetUploadState() {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 437 |
fileInput.value = '';
|
| 438 |
fileName.textContent = '';
|
| 439 |
uploadBtn.style.display = 'none';
|
|
|
|
| 464 |
linkContainer.appendChild(link);
|
| 465 |
linkContainer.appendChild(copyBtn);
|
| 466 |
|
| 467 |
+
if (fileName.toLowerCase().endsWith('.mp4')) {
|
| 468 |
const embedBtn = document.createElement('button');
|
| 469 |
embedBtn.textContent = 'Embed Video for Discord';
|
| 470 |
embedBtn.className = 'embed-btn';
|