Hugging Face's logo

Spaces:
coollsd
/
fileuploader
Running

App Files Community
coollsd commited on
Commit
8dfc205
•
1 Parent(s): 88721d0

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +26 -14
app.py CHANGED
@@ -156,17 +156,18 @@ HTML_CONTENT = """
156
  text-decoration: underline;
157
  }
158
  .copy-btn, .embed-btn {
159
- background-color: #333;
160
- color: #e0e0e0;
161
  border: none;
162
- padding: 5px 10px;
163
  border-radius: 5px;
164
  cursor: pointer;
165
  transition: all 0.3s ease;
166
  margin-right: 5px;
 
167
  }
168
  .copy-btn:hover, .embed-btn:hover {
169
- background-color: #444;
170
  }
171
  .file-types {
172
  margin-top: 2rem;
@@ -194,15 +195,17 @@ HTML_CONTENT = """
194
  width: 100%;
195
  height: 100%;
196
  overflow: auto;
197
- background-color: rgba(0,0,0,0.4);
198
  }
199
  .modal-content {
200
- background-color: #fefefe;
201
  margin: 15% auto;
202
  padding: 20px;
203
- border: 1px solid #888;
204
  width: 80%;
205
  max-width: 600px;
 
 
206
  }
207
  .close {
208
  color: #aaa;
@@ -212,10 +215,19 @@ HTML_CONTENT = """
212
  }
213
  .close:hover,
214
  .close:focus {
215
- color: black;
216
  text-decoration: none;
217
  cursor: pointer;
218
  }
 
 
 
 
 
 
 
 
 
219
  </style>
220
  </head>
221
  <body>
@@ -243,8 +255,8 @@ HTML_CONTENT = """
243
  <span class="close">&times;</span>
244
  <h2>Embed Video Link</h2>
245
  <p>Copy the following link to embed the video:</p>
246
- <input type="text" id="embedLink" readonly style="width: 100%; padding: 5px;">
247
- <button onclick="copyEmbedLink()" style="margin-top: 10px;">Copy Embed Link</button>
248
  </div>
249
  </div>
250
 
@@ -408,7 +420,7 @@ HTML_CONTENT = """
408
 
409
  const copyBtn = document.createElement('button');
410
  copyBtn.textContent = 'Copy Link';
411
- copyBtn.className = 'copy-btn';
412
  copyBtn.onclick = () => {
413
  navigator.clipboard.writeText(window.location.origin + url).then(() => {
414
  alert('Link copied to clipboard!');
@@ -418,10 +430,10 @@ HTML_CONTENT = """
418
  linkContainer.appendChild(link);
419
  linkContainer.appendChild(copyBtn);
420
 
421
- if (fileName.toLowerCase().endsWith('.mp4')) {
422
  const embedBtn = document.createElement('button');
423
  embedBtn.textContent = 'Embed Video for Discord';
424
- embedBtn.className = 'embed-btn';
425
  embedBtn.onclick = () => {
426
  showEmbedModal(url);
427
  };
@@ -432,7 +444,7 @@ HTML_CONTENT = """
432
  resultContainer.style.display = 'block';
433
  }
434
 
435
- function showEmbedModal(url) {
436
  const embedUrl = `${window.location.origin}/embed?url=${encodeURIComponent(window.location.origin + url)}&thumbnail=${encodeURIComponent('https://coollsd-fileuploader.hf.space/rbxg/LdiWpl4JO8XmYc6m2PbfrwZgSOjRUX0kPaJzp2IDSN5fYVHK/Untitled.png')}`;
437
  embedLinkInput.value = embedUrl;
438
  modal.style.display = "block";
 
156
  text-decoration: underline;
157
  }
158
  .copy-btn, .embed-btn {
159
+ background-color: #ffffff;
160
+ color: #121212;
161
  border: none;
162
+ padding: 12px 24px;
163
  border-radius: 5px;
164
  cursor: pointer;
165
  transition: all 0.3s ease;
166
  margin-right: 5px;
167
+ font-weight: 600;
168
  }
169
  .copy-btn:hover, .embed-btn:hover {
170
+ background-color: #f0f0f0;
171
  }
172
  .file-types {
173
  margin-top: 2rem;
 
195
  width: 100%;
196
  height: 100%;
197
  overflow: auto;
198
+ background-color: rgba(0,0,0,0.8);
199
  }
200
  .modal-content {
201
+ background-color: #1e1e1e;
202
  margin: 15% auto;
203
  padding: 20px;
204
+ border: 1px solid #333;
205
  width: 80%;
206
  max-width: 600px;
207
+ border-radius: 10px;
208
+ color: #e0e0e0;
209
  }
210
  .close {
211
  color: #aaa;
 
215
  }
216
  .close:hover,
217
  .close:focus {
218
+ color: #fff;
219
  text-decoration: none;
220
  cursor: pointer;
221
  }
222
+ #embedLink {
223
+ width: 100%;
224
+ padding: 10px;
225
+ margin-top: 10px;
226
+ background-color: #333;
227
+ border: 1px solid #555;
228
+ color: #e0e0e0;
229
+ border-radius: 5px;
230
+ }
231
  </style>
232
  </head>
233
  <body>
 
255
  <span class="close">&times;</span>
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" style="margin-top: 10px;">Copy Embed Link</button>
260
  </div>
261
  </div>
262
 
 
420
 
421
  const copyBtn = document.createElement('button');
422
  copyBtn.textContent = 'Copy Link';
423
+ copyBtn.className = 'btn copy-btn';
424
  copyBtn.onclick = () => {
425
  navigator.clipboard.writeText(window.location.origin + url).then(() => {
426
  alert('Link copied to clipboard!');
 
430
  linkContainer.appendChild(link);
431
  linkContainer.appendChild(copyBtn);
432
 
433
+ if (fileName.toLowerCase().endsWith('.mp4')) {
434
  const embedBtn = document.createElement('button');
435
  embedBtn.textContent = 'Embed Video for Discord';
436
+ embedBtn.className = 'btn embed-btn';
437
  embedBtn.onclick = () => {
438
  showEmbedModal(url);
439
  };
 
444
  resultContainer.style.display = 'block';
445
  }
446
 
447
+ function showEmbedModal(url) {
448
  const embedUrl = `${window.location.origin}/embed?url=${encodeURIComponent(window.location.origin + url)}&thumbnail=${encodeURIComponent('https://coollsd-fileuploader.hf.space/rbxg/LdiWpl4JO8XmYc6m2PbfrwZgSOjRUX0kPaJzp2IDSN5fYVHK/Untitled.png')}`;
449
  embedLinkInput.value = embedUrl;
450
  modal.style.display = "block";