Spaces:

coollsd
/

fileuploader

Running

App Files Files Community

coollsd commited on Sep 17

Commit

aa79c07

•

1 Parent(s): 2c943e0

Update app.py

Browse files

Files changed (1) hide show

app.py +238 -138

app.py CHANGED Viewed

@@ -3,8 +3,6 @@ from fastapi.responses import HTMLResponse, JSONResponse, StreamingResponse
 import requests
 import time
 from typing import Dict
-import urllib.parse
-import re
 app = FastAPI()
@@ -13,106 +11,158 @@ HTML_CONTENT = """
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Radd PRO Uploader</title>
     <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
     <style>
         body {
             font-family: 'Poppins', sans-serif;
-            background: #121212;
-            height: 100vh;
-            margin: 0;
-            display: flex;
-            justify-content: center;
-            align-items: center;
             color: #e0e0e0;
         }
         .container {
-            background: rgba(255, 255, 255, 0.1);
-            padding: 2.5rem;
             border-radius: 15px;
-            box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
-            backdrop-filter: blur(4px);
-            border: 1px solid rgba(255, 255, 255, 0.18);
             text-align: center;
-            max-width: 450px;
-            width: 100%;
-            transition: all 0.3s ease;
-        }
-        .container:hover {
-            background: rgba(255, 255, 255, 0.2);
-            transform: translateY(-5px);
-            box-shadow: 0 0 30px rgba(255, 255, 255, 0.3);
         }
-        h1, h2 {
             color: #ffffff;
-            margin-bottom: 1.5rem;
-            font-weight: 600;
-        }
-        .file-input {
-            display: none;
         }
         .btn {
-            background-color: #ffffff;
-            color: #121212;
-            padding: 12px 24px;
-            border-radius: 5px;
-            cursor: pointer;
-            transition: all 0.3s ease;
             display: inline-block;
             font-weight: 600;
             border: none;
-            font-size: 1rem;
-            margin: 0.5rem;
-            position: relative;
             overflow: hidden;
         }
-        .btn::after {
             content: '';
             position: absolute;
-            top: 50%;
-            left: 50%;
-            width: 5px;
-            height: 5px;
-            background: rgba(0, 0, 0, 0.3);
-            opacity: 0;
-            border-radius: 100%;
-            transform: scale(1, 1) translate(-50%);
-            transform-origin: 50% 50%;
-        }
-        @keyframes ripple {
             0% {
-                transform: scale(0, 0);
-                opacity: 1;
             }
-            20% {
-                transform: scale(25, 25);
-                opacity: 1;
             }
             100% {
-                opacity: 0;
-                transform: scale(40, 40);
             }
         }
-        .btn:focus:not(:active)::after {
-            animation: ripple 1s ease-out;
-        }
-        .btn:hover {
-            background-color: #f0f0f0;
         }
         .btn:disabled {
-            background-color: #555;
             cursor: not-allowed;
         }
         .file-name {
             margin-top: 1rem;
             font-size: 0.9rem;
             color: #aaa;
         }
         .progress-container {
-            margin-top: 1.5rem;
             display: none;
         }
         .progress-bar {
             width: 100%;
             height: 10px;
@@ -121,12 +171,20 @@ HTML_CONTENT = """
             overflow: hidden;
             margin-bottom: 10px;
         }
         .progress {
             width: 0%;
             height: 100%;
-            background-color: #ffffff;
-            transition: width 0.3s ease;
         }
         .loading-spinner {
             display: none;
             width: 40px;
@@ -137,14 +195,18 @@ HTML_CONTENT = """
             animation: spin 1s linear infinite;
             margin: 20px auto;
         }
         @keyframes spin {
             0% { transform: rotate(0deg); }
             100% { transform: rotate(360deg); }
         }
         .result-container {
             display: none;
             margin-top: 1.5rem;
         }
         .result-link {
             color: #ffffff;
             text-decoration: none;
@@ -152,43 +214,64 @@ HTML_CONTENT = """
             transition: all 0.3s ease;
             margin-right: 10px;
         }
         .result-link:hover {
             text-decoration: underline;
         }
         .copy-btn, .embed-btn {
-            background-color: #333;
-            color: #e0e0e0;
             border: none;
-            padding: 5px 10px;
             border-radius: 5px;
             cursor: pointer;
-            transition: all 0.3s ease;
-            margin-right: 5px;
         }
-        .copy-btn:hover, .embed-btn:hover {
-            background-color: #444;
         }
         .file-types {
             margin-top: 2rem;
             font-size: 0.8rem;
             color: #aaa;
         }
-        .drop-zone {
-            border: 2px dashed #aaa;
-            border-radius: 10px;
-            padding: 20px;
-            text-align: center;
-            cursor: pointer;
-            transition: all 0.3s ease;
-        }
-        .drop-zone:hover, .drop-zone.drag-over {
-            border-color: #ffffff;
-            background-color: rgba(255, 255, 255, 0.1);
-        }
         .modal {
             display: none;
             position: fixed;
-            z-index: 1;
             left: 0;
             top: 0;
             width: 100%;
@@ -196,6 +279,7 @@ HTML_CONTENT = """
             overflow: auto;
             background-color: rgba(0,0,0,0.8);
         }
         .modal-content {
             background-color: #1e1e1e;
             margin: 15% auto;
@@ -206,78 +290,103 @@ HTML_CONTENT = """
             border-radius: 10px;
             color: #e0e0e0;
             animation: modalFadeIn 0.3s;
         }
         @keyframes modalFadeIn {
             from {opacity: 0; transform: scale(0.8);}
             to {opacity: 1; transform: scale(1);}
         }
         .close {
             color: #aaa;
-            float: right;
             font-size: 28px;
             font-weight: bold;
             transition: color 0.3s ease;
         }
         .close:hover,
         .close:focus {
             color: #fff;
             text-decoration: none;
             cursor: pointer;
         }
         #embedLink {
-            width: 100%;
             padding: 10px;
-            margin-top: 10px;
             background-color: #333;
             border: 1px solid #555;
             color: #e0e0e0;
             border-radius: 5px;
-            text-align: center;
         }
-        .embed-btn {
             position: relative;
             overflow: hidden;
         }
-        .embed-btn::before {
             content: '';
             position: absolute;
-            top: -50%;
-            left: -50%;
-            width: 200%;
-            height: 200%;
-            background: radial-gradient(circle, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0) 70%);
-            transform: scale(0);
-            transition: transform 0.3s ease-out;
-        }
-        .embed-btn:hover::before {
-            transform: scale(1);
-        }
-        .copy-embed-btn {
-            background-color: #333;
-            color: white;
-            border: none;
-            padding: 10px 20px;
-            text-align: center;
-            text-decoration: none;
-            display: inline-block;
-            font-size: 16px;
-            margin: 4px 2px;
-            transition-duration: 0.4s;
-            cursor: pointer;
             border-radius: 5px;
         }
         .copy-embed-btn:hover {
-            background-color: #444;
         }
-        .embed-container {
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            margin-top: 15px;
         }
-        #embedLink {
-            flex-grow: 1;
-            margin-right: 10px;
         }
     </style>
 </head>
@@ -438,7 +547,7 @@ HTML_CONTENT = """
             }
         }
-                function resetUploadState() {
             fileInput.value = '';
             fileName.textContent = '';
             document.getElementById('uploadBtn').style.display = 'none';
@@ -449,13 +558,13 @@ HTML_CONTENT = """
         function addResultLink(url, fileName) {
             const linkContainer = document.createElement('div');
             linkContainer.style.marginBottom = '10px';
             const link = document.createElement('a');
             link.href = url;
             link.textContent = `View ${fileName}`;
             link.className = 'result-link';
             link.target = '_blank';
             const copyBtn = document.createElement('button');
             copyBtn.textContent = 'Copy Link';
             copyBtn.className = 'copy-btn';
@@ -464,7 +573,7 @@ HTML_CONTENT = """
                     alert('Link copied to clipboard!');
                 });
             };
             linkContainer.appendChild(link);
             linkContainer.appendChild(copyBtn);
@@ -483,7 +592,7 @@ HTML_CONTENT = """
         }
         function showEmbedModal(url) {
-            const embedUrl = `${window.location.origin}/embed?url=${encodeURIComponent(window.location.origin + url)}&thumbnail=${encodeURIComponent('https://coollsd-fileuploader.hf.space/rbxg/LdiWpl4JO8XmYc6m2PbfrwZgSOjRUX0kPaJzp2IDSN5fYVHK/Untitled.png')}`;
             embedLinkInput.value = embedUrl;
             modal.style.display = "block";
         }
@@ -564,7 +673,7 @@ async def embed_video(url: str, thumbnail: str):
         <meta property="og:image:height" content="720">
         <meta property="og:image:type" content="image/png">
         <style>
-            body, html {{ margin: 0; padding: 0; height: 100%; }}
             #thumbnail {{ width: 100%; height: 100%; object-fit: contain; cursor: pointer; }}
             #video {{ display: none; width: 100%; height: 100%; object-fit: contain; }}
         </style>
@@ -614,9 +723,6 @@ async def initiate_upload(cookies: Dict[str, str], filename: str, content_type:
             'Sec-GPC': '1',
             'Priority': 'u=1, i'
         })
-        print(f'Initiate upload response status: {response.status_code}')
-        print(f'Initiate upload response headers: {response.headers}')
-        print(f'Response body: {response.text}')
         return response.json()
     except Exception as e:
         print(f'Error initiating upload: {e}')
@@ -625,8 +731,6 @@ async def initiate_upload(cookies: Dict[str, str], filename: str, content_type:
 async def upload_file(upload_url: str, file_content: bytes, content_type: str) -> bool:
     try:
         response = requests.put(upload_url, data=file_content, headers={'Content-Type': content_type})
-        print(f'File upload response status: {response.status_code}')
-        print(f'File upload response headers: {response.headers}')
         return response.status_code == 200
     except Exception as e:
         print(f'Error uploading file: {e}')
@@ -634,14 +738,10 @@ async def upload_file(upload_url: str, file_content: bytes, content_type: str) -
 async def retry_upload(upload_url: str, file_content: bytes, content_type: str, max_retries: int = 5, delay: int = 1) -> bool:
     for attempt in range(1, max_retries + 1):
-        print(f'Upload attempt {attempt} of {max_retries}')
         success = await upload_file(upload_url, file_content, content_type)
         if success:
-            print('Upload successful')
             return True
         if attempt < max_retries:
-            print(f'Upload failed, retrying in {delay}s...')
             time.sleep(delay)
             delay *= 2  # Exponential backoff
-    print('Upload failed after all retry attempts')
     return False

 import requests
 import time
 from typing import Dict
 app = FastAPI()
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <title>Radd PRO Uploader</title>
     <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
     <style>
+        /* Global Styles */
         body {
             font-family: 'Poppins', sans-serif;
+            background-color: #121212;
             color: #e0e0e0;
+            margin: 0;
+            height: 100vh;
+            overflow: hidden;
         }
+        /* Moving Grainy Background */
+        body::before {
+            content: "";
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAQAAACM/9unAAAACXBIWXMAAAsTAAALEwEAmpwYAAABF0lEQVR4nO3YMRLCQBRE0clsYgxZwwq7oLGxAgp2AtbsqQZsYgEG0wEWc/LSZnb9HcMjR8fHvEKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgsK8tJOq9fzs7vlkNlWvf5ELi+20t5k2VSL7p/iHJ5Rz5ynOhU7rQ4pUi+6b4hyeUc+cpzoVO60OkV7rQ4pUi+6b4hxenu+en4rQAOkaks/eJegGaUfOHI+nRvQCND1w2J9yf8C2KZwNjkeUsAKRa7Nz50tQAokVbO/U6AaiWjl5wd6kQAOke8Xpx3JgTQKVq7Heh0ADpFvF6cd0kE0Claux3odAA6RfxenHc+BNCpWrsd6HQAOkX8Xpx3PgTQqVq7Heh0ADpF/F6cdz4E0KlarjdI/cR1FBQUGBgYGBgYGBgYG/AT4AIHph6aQGU7oAAAAASUVORK5CYII=') repeat;
+            animation: grain 8s steps(10) infinite;
+            opacity: 0.2;
+            pointer-events: none;
+        }
+        @keyframes grain {
+            0% { transform: translate(0, 0); }
+            10% { transform: translate(-5%, -5%); }
+            20% { transform: translate(-10%, 5%); }
+            30% { transform: translate(5%, -10%); }
+            40% { transform: translate(-5%, 15%); }
+            50% { transform: translate(-10%, 5%); }
+            60% { transform: translate(15%, 0); }
+            70% { transform: translate(0, 10%); }
+            80% { transform: translate(-15%, 0); }
+            90% { transform: translate(10%, 5%); }
+            100% { transform: translate(5%, 0); }
+        }
         .container {
+            position: relative;
+            max-width: 450px;
+            margin: 0 auto;
+            padding: 3rem 2rem;
+            background: rgba(18, 18, 18, 0.9);
+            backdrop-filter: blur(10px);
             border-radius: 15px;
+            z-index: 1;
             text-align: center;
+            box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
         }
+        h1 {
+            margin-bottom: 2rem;
+            font-size: 2rem;
             color: #ffffff;
+            text-shadow: 0 0 5px rgba(255, 255, 255, 0.2);
         }
+        /* Buttons */
         .btn {
             display: inline-block;
+            position: relative;
+            padding: 12px 24px;
+            margin: 0.5rem;
+            font-size: 1rem;
             font-weight: 600;
+            color: #ffffff;
+            background-color: transparent;
             border: none;
+            border-radius: 5px;
+            cursor: pointer;
             overflow: hidden;
+            z-index: 1;
+            transition: color 0.3s ease;
+        }
+        .btn:hover {
+            color: #e0e0e0;
         }
+        .btn::before {
             content: '';
             position: absolute;
+            inset: 0;
+            border-radius: 5px;
+            padding: 3px;
+            background: linear-gradient(45deg, #0000ff, #ffffff, #000000);
+            -webkit-mask:
+                linear-gradient(#fff 0 0) content-box,
+                linear-gradient(#fff 0 0);
+            -webkit-mask-composite: destination-out;
+            mask-composite: exclude;
+            animation: borderAnimation 5s infinite;
+        }
+        @keyframes borderAnimation {
             0% {
+                background-position: 0% 50%;
             }
+            50% {
+                background-position: 100% 50%;
             }
             100% {
+                background-position: 0% 50%;
             }
         }
+        .btn:active {
+            transform: scale(0.98);
         }
         .btn:disabled {
+            color: #555;
             cursor: not-allowed;
         }
+        /* Drop Zone */
+        .drop-zone {
+            position: relative;
+            padding: 20px;
+            margin-bottom: 1rem;
+            border: 2px dashed #aaa;
+            border-radius: 10px;
+            cursor: pointer;
+            transition: all 0.3s ease;
+            background: rgba(255, 255, 255, 0.05);
+        }
+        .drop-zone:hover, .drop-zone.drag-over {
+            border-color: #ffffff;
+            background: rgba(255, 255, 255, 0.1);
+        }
+        .file-input {
+            display: none;
+        }
         .file-name {
             margin-top: 1rem;
             font-size: 0.9rem;
             color: #aaa;
         }
+        /* Progress Bar */
         .progress-container {
             display: none;
+            margin-top: 1.5rem;
         }
         .progress-bar {
             width: 100%;
             height: 10px;
             overflow: hidden;
             margin-bottom: 10px;
         }
         .progress {
             width: 0%;
             height: 100%;
+            background: linear-gradient(90deg, #0000ff, #ffffff, #000000);
+            animation: progressAnimation 2s infinite;
         }
+        @keyframes progressAnimation {
+            0% { background-position: 0% 50%; }
+            100% { background-position: 100% 50%; }
+        }
+        /* Loading Spinner */
         .loading-spinner {
             display: none;
             width: 40px;
             animation: spin 1s linear infinite;
             margin: 20px auto;
         }
         @keyframes spin {
             0% { transform: rotate(0deg); }
             100% { transform: rotate(360deg); }
         }
+        /* Result Container */
         .result-container {
             display: none;
             margin-top: 1.5rem;
         }
         .result-link {
             color: #ffffff;
             text-decoration: none;
             transition: all 0.3s ease;
             margin-right: 10px;
         }
         .result-link:hover {
             text-decoration: underline;
         }
         .copy-btn, .embed-btn {
+            position: relative;
+            padding: 10px 20px;
+            margin: 0.5rem;
+            font-size: 0.9rem;
+            font-weight: 600;
+            color: #ffffff;
+            background-color: transparent;
             border: none;
             border-radius: 5px;
             cursor: pointer;
+            overflow: hidden;
+            z-index: 1;
+            transition: color 0.3s ease;
         }
+        .copy-btn::before,
+        .embed-btn::before {
+            content: '';
+            position: absolute;
+            inset: 0;
+            border-radius: 5px;
+            padding: 3px;
+            background: linear-gradient(45deg, #0000ff, #ffffff, #000000);
+            -webkit-mask:
+                linear-gradient(#fff 0 0) content-box,
+                linear-gradient(#fff 0 0);
+            -webkit-mask-composite: destination-out;
+            mask-composite: exclude;
+            animation: borderAnimation 5s infinite;
+        }
+        .copy-btn:hover,
+        .embed-btn:hover {
+            color: #e0e0e0;
         }
+        .copy-btn:active,
+        .embed-btn:active {
+            transform: scale(0.98);
+        }
         .file-types {
             margin-top: 2rem;
             font-size: 0.8rem;
             color: #aaa;
         }
+        /* Modal Styles */
         .modal {
             display: none;
             position: fixed;
+            z-index: 2;
             left: 0;
             top: 0;
             width: 100%;
             overflow: auto;
             background-color: rgba(0,0,0,0.8);
         }
         .modal-content {
             background-color: #1e1e1e;
             margin: 15% auto;
             border-radius: 10px;
             color: #e0e0e0;
             animation: modalFadeIn 0.3s;
+            position: relative;
         }
         @keyframes modalFadeIn {
             from {opacity: 0; transform: scale(0.8);}
             to {opacity: 1; transform: scale(1);}
         }
         .close {
             color: #aaa;
+            position: absolute;
+            top: 10px;
+            right: 15px;
             font-size: 28px;
             font-weight: bold;
             transition: color 0.3s ease;
         }
         .close:hover,
         .close:focus {
             color: #fff;
             text-decoration: none;
             cursor: pointer;
         }
+        .embed-container {
+            display: flex;
+            align-items: center;
+            margin-top: 15px;
+        }
         #embedLink {
+            flex-grow: 1;
             padding: 10px;
             background-color: #333;
             border: 1px solid #555;
             color: #e0e0e0;
             border-radius: 5px;
+            margin-right: 10px;
         }
+        .copy-embed-btn {
             position: relative;
+            padding: 10px 20px;
+            font-size: 0.9rem;
+            font-weight: 600;
+            color: #ffffff;
+            background-color: transparent;
+            border: none;
+            border-radius: 5px;
+            cursor: pointer;
             overflow: hidden;
+            z-index: 1;
+            transition: color 0.3s ease;
         }
+        .copy-embed-btn::before {
             content: '';
             position: absolute;
+            inset: 0;
             border-radius: 5px;
+            padding: 3px;
+            background: linear-gradient(45deg, #0000ff, #ffffff, #000000);
+            -webkit-mask:
+                linear-gradient(#fff 0 0) content-box,
+                linear-gradient(#fff 0 0);
+            -webkit-mask-composite: destination-out;
+            mask-composite: exclude;
+            animation: borderAnimation 5s infinite;
         }
         .copy-embed-btn:hover {
+            color: #e0e0e0;
         }
+        .copy-embed-btn:active {
+            transform: scale(0.98);
         }
+        /* Media Queries */
+        @media (max-width: 480px) {
+            .container {
+                padding: 2rem 1rem;
+            }
+            h1 {
+                font-size: 1.5rem;
+            }
+            .embed-container {
+                flex-direction: column;
+            }
+            #embedLink {
+                margin-bottom: 10px;
+                margin-right: 0;
+            }
         }
     </style>
 </head>
             }
         }
+        function resetUploadState() {
             fileInput.value = '';
             fileName.textContent = '';
             document.getElementById('uploadBtn').style.display = 'none';
         function addResultLink(url, fileName) {
             const linkContainer = document.createElement('div');
             linkContainer.style.marginBottom = '10px';
             const link = document.createElement('a');
             link.href = url;
             link.textContent = `View ${fileName}`;
             link.className = 'result-link';
             link.target = '_blank';
             const copyBtn = document.createElement('button');
             copyBtn.textContent = 'Copy Link';
             copyBtn.className = 'copy-btn';
                     alert('Link copied to clipboard!');
                 });
             };
             linkContainer.appendChild(link);
             linkContainer.appendChild(copyBtn);
         }
         function showEmbedModal(url) {
+            const embedUrl = `${window.location.origin}/embed?url=${encodeURIComponent(window.location.origin + url)}&thumbnail=${encodeURIComponent('https://example.com/thumbnail.png')}`;
             embedLinkInput.value = embedUrl;
             modal.style.display = "block";
         }
         <meta property="og:image:height" content="720">
         <meta property="og:image:type" content="image/png">
         <style>
+            body, html {{ margin: 0; padding: 0; height: 100%; background: #000; }}
             #thumbnail {{ width: 100%; height: 100%; object-fit: contain; cursor: pointer; }}
             #video {{ display: none; width: 100%; height: 100%; object-fit: contain; }}
         </style>
             'Sec-GPC': '1',
             'Priority': 'u=1, i'
         })
         return response.json()
     except Exception as e:
         print(f'Error initiating upload: {e}')
 async def upload_file(upload_url: str, file_content: bytes, content_type: str) -> bool:
     try:
         response = requests.put(upload_url, data=file_content, headers={'Content-Type': content_type})
         return response.status_code == 200
     except Exception as e:
         print(f'Error uploading file: {e}')
 async def retry_upload(upload_url: str, file_content: bytes, content_type: str, max_retries: int = 5, delay: int = 1) -> bool:
     for attempt in range(1, max_retries + 1):
         success = await upload_file(upload_url, file_content, content_type)
         if success:
             return True
         if attempt < max_retries:
             time.sleep(delay)
             delay *= 2  # Exponential backoff
     return False