Update index.html
Browse files- index.html +9 -19
index.html
CHANGED
|
@@ -6,7 +6,7 @@
|
|
| 6 |
<title>ورود به پنل اختصاصی</title>
|
| 7 |
<link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;700&display=swap" rel="stylesheet">
|
| 8 |
<style>
|
| 9 |
-
/* CSS styles
|
| 10 |
:root { --primary-color: #3d5afe; --secondary-color: #00b0ff; --text-color: #e0e0e0; --bg-color-start: #1a2940; --bg-color-end: #2b3b58; --glass-bg: rgba(255, 255, 255, 0.05); --glass-border: rgba(255, 255, 255, 0.2); }
|
| 11 |
@keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
|
| 12 |
@keyframes spin { to { transform: rotate(360deg); } }
|
|
@@ -43,7 +43,7 @@
|
|
| 43 |
</head>
|
| 44 |
<body>
|
| 45 |
|
| 46 |
-
<!-- HTML
|
| 47 |
<div id="delta-gate-container">
|
| 48 |
<svg class="gate-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" color="#fff"><path d="M17 3.25H7C4.65279 3.25 2.75 5.15279 2.75 7.5V16.5C2.75 18.8472 4.65279 20.75 7 20.75H17C19.3472 20.75 21.25 18.8472 21.25 16.5V7.5C21.25 5.15279 19.3472 3.25 17 3.25ZM19.75 7.5V16.5C19.75 18.0376 18.5376 19.25 17 19.25H7C5.46243 19.25 4.25 18.0376 4.25 16.5V7.5C4.25 5.96243 5.46243 4.75 7 4.75H17C18.5376 4.75 19.75 5.96243 19.75 7.5ZM12 7.75C12.4142 7.75 12.75 8.08579 12.75 8.5V11H14.25C14.6642 11 15 11.3358 15 11.75V13.25C15 13.6642 14.6642 14 14.25 14H12.75V15.5C12.75 15.9142 12.4142 16.25 12 16.25C11.5858 16.25 11.25 15.9142 11.25 15.5V14H9.75C9.33579 14 9 13.6642 9 13.25V11.75C9 11.3358 9.33579 11 9.75 11H11.25V8.5C11.25 8.08579 11.5858 7.75 12 7.75Z"></path></svg>
|
| 49 |
<h1>ورود به پنل اختصاصی</h1>
|
|
@@ -52,12 +52,11 @@
|
|
| 52 |
<button id="verify-button">تأیید و ورود</button>
|
| 53 |
<div id="error-message"></div>
|
| 54 |
</div>
|
| 55 |
-
<div id="main-content-container">
|
| 56 |
-
<!-- Main content will be loaded here -->
|
| 57 |
-
</div>
|
| 58 |
|
| 59 |
<script>
|
| 60 |
-
|
|
|
|
| 61 |
const gateContainer = document.getElementById('delta-gate-container');
|
| 62 |
const mainContentContainer = document.getElementById('main-content-container');
|
| 63 |
const verifyButton = document.getElementById('verify-button');
|
|
@@ -65,7 +64,6 @@ document.addEventListener('DOMContentLoaded', () => {
|
|
| 65 |
const errorMessage = document.getElementById('error-message');
|
| 66 |
const buttonOriginalText = verifyButton.innerHTML;
|
| 67 |
|
| 68 |
-
// The main app's HTML content
|
| 69 |
const mainAppHTML = `
|
| 70 |
<div id="huggingface-vevo-api-container">
|
| 71 |
<div class="container">
|
|
@@ -93,7 +91,6 @@ document.addEventListener('DOMContentLoaded', () => {
|
|
| 93 |
gateContainer.style.display = 'none';
|
| 94 |
mainContentContainer.style.display = 'block';
|
| 95 |
mainContentContainer.innerHTML = mainAppHTML;
|
| 96 |
-
// Now, initialize the Vevo API script AFTER the content is on the page
|
| 97 |
initializeVevoAPI();
|
| 98 |
}, 500);
|
| 99 |
};
|
|
@@ -105,33 +102,31 @@ document.addEventListener('DOMContentLoaded', () => {
|
|
| 105 |
verifyButton.addEventListener('click', async () => {
|
| 106 |
const code = codeInput.value.trim();
|
| 107 |
errorMessage.textContent = '';
|
| 108 |
-
|
| 109 |
if (code.length < 38 || code.length > 44) {
|
| 110 |
errorMessage.textContent = 'کد دلتا نامعتبر است. طول کد باید بین ۳۸ تا ۴۴ کاراکتر باشد.';
|
| 111 |
return;
|
| 112 |
}
|
| 113 |
-
|
| 114 |
verifyButton.disabled = true;
|
| 115 |
verifyButton.innerHTML = '<div class="loader"></div>';
|
| 116 |
|
| 117 |
try {
|
| 118 |
-
const response = await fetch(window.location.href, {
|
| 119 |
method: 'POST',
|
| 120 |
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
|
| 121 |
body: `delta_code=${encodeURIComponent(code)}`
|
| 122 |
});
|
| 123 |
|
| 124 |
if (!response.ok) {
|
|
|
|
| 125 |
throw new Error('خطای سرور');
|
| 126 |
}
|
| 127 |
|
| 128 |
-
const result = await response.json();
|
| 129 |
|
| 130 |
if (result.status === 'success') {
|
| 131 |
localStorage.setItem('isDeltaCodeValidated', 'true');
|
| 132 |
showMainContent();
|
| 133 |
} else {
|
| 134 |
-
// Show error message from server (e.g., "Failed to contact Telegram")
|
| 135 |
throw new Error(result.message || 'خطای ناشناخته از سمت سرور.');
|
| 136 |
}
|
| 137 |
|
|
@@ -142,20 +137,15 @@ document.addEventListener('DOMContentLoaded', () => {
|
|
| 142 |
}
|
| 143 |
});
|
| 144 |
|
| 145 |
-
// --- Vevo API Logic is now in its own function ---
|
| 146 |
function initializeVevoAPI() {
|
| 147 |
const container = document.getElementById('huggingface-vevo-api-container');
|
| 148 |
-
if (!container) return;
|
| 149 |
-
|
| 150 |
const generateBtn = container.querySelector('#generateBtn');
|
| 151 |
const sourceAudioInput = container.querySelector('#sourceAudio');
|
| 152 |
const timbreRefInput = container.querySelector('#timbreRef');
|
| 153 |
const statusDiv = container.querySelector('#status');
|
| 154 |
const resultDiv = container.querySelector('#result');
|
| 155 |
-
|
| 156 |
const API_URL = "https://amphion-vevo.hf.space/gradio_api/";
|
| 157 |
-
|
| 158 |
-
// ... (The rest of the Vevo API JavaScript is identical, no changes needed)
|
| 159 |
const generateSessionHash = () => Math.random().toString(36).substring(2, 15);
|
| 160 |
async function uploadFile(file) {
|
| 161 |
const formData = new FormData();
|
|
|
|
| 6 |
<title>ورود به پنل اختصاصی</title>
|
| 7 |
<link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;700&display=swap" rel="stylesheet">
|
| 8 |
<style>
|
| 9 |
+
/* CSS styles are identical to the previous version. No changes needed here. */
|
| 10 |
:root { --primary-color: #3d5afe; --secondary-color: #00b0ff; --text-color: #e0e0e0; --bg-color-start: #1a2940; --bg-color-end: #2b3b58; --glass-bg: rgba(255, 255, 255, 0.05); --glass-border: rgba(255, 255, 255, 0.2); }
|
| 11 |
@keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
|
| 12 |
@keyframes spin { to { transform: rotate(360deg); } }
|
|
|
|
| 43 |
</head>
|
| 44 |
<body>
|
| 45 |
|
| 46 |
+
<!-- HTML Part is identical -->
|
| 47 |
<div id="delta-gate-container">
|
| 48 |
<svg class="gate-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" color="#fff"><path d="M17 3.25H7C4.65279 3.25 2.75 5.15279 2.75 7.5V16.5C2.75 18.8472 4.65279 20.75 7 20.75H17C19.3472 20.75 21.25 18.8472 21.25 16.5V7.5C21.25 5.15279 19.3472 3.25 17 3.25ZM19.75 7.5V16.5C19.75 18.0376 18.5376 19.25 17 19.25H7C5.46243 19.25 4.25 18.0376 4.25 16.5V7.5C4.25 5.96243 5.46243 4.75 7 4.75H17C18.5376 4.75 19.75 5.96243 19.75 7.5ZM12 7.75C12.4142 7.75 12.75 8.08579 12.75 8.5V11H14.25C14.6642 11 15 11.3358 15 11.75V13.25C15 13.6642 14.6642 14 14.25 14H12.75V15.5C12.75 15.9142 12.4142 16.25 12 16.25C11.5858 16.25 11.25 15.9142 11.25 15.5V14H9.75C9.33579 14 9 13.6642 9 13.25V11.75C9 11.3358 9.33579 11 9.75 11H11.25V8.5C11.25 8.08579 11.5858 7.75 12 7.75Z"></path></svg>
|
| 49 |
<h1>ورود به پنل اختصاصی</h1>
|
|
|
|
| 52 |
<button id="verify-button">تأیید و ورود</button>
|
| 53 |
<div id="error-message"></div>
|
| 54 |
</div>
|
| 55 |
+
<div id="main-content-container"></div>
|
|
|
|
|
|
|
| 56 |
|
| 57 |
<script>
|
| 58 |
+
// JavaScript part is identical to the previous version. No changes needed.
|
| 59 |
+
document.addEventListener('DOMContentLoaded', () => {
|
| 60 |
const gateContainer = document.getElementById('delta-gate-container');
|
| 61 |
const mainContentContainer = document.getElementById('main-content-container');
|
| 62 |
const verifyButton = document.getElementById('verify-button');
|
|
|
|
| 64 |
const errorMessage = document.getElementById('error-message');
|
| 65 |
const buttonOriginalText = verifyButton.innerHTML;
|
| 66 |
|
|
|
|
| 67 |
const mainAppHTML = `
|
| 68 |
<div id="huggingface-vevo-api-container">
|
| 69 |
<div class="container">
|
|
|
|
| 91 |
gateContainer.style.display = 'none';
|
| 92 |
mainContentContainer.style.display = 'block';
|
| 93 |
mainContentContainer.innerHTML = mainAppHTML;
|
|
|
|
| 94 |
initializeVevoAPI();
|
| 95 |
}, 500);
|
| 96 |
};
|
|
|
|
| 102 |
verifyButton.addEventListener('click', async () => {
|
| 103 |
const code = codeInput.value.trim();
|
| 104 |
errorMessage.textContent = '';
|
|
|
|
| 105 |
if (code.length < 38 || code.length > 44) {
|
| 106 |
errorMessage.textContent = 'کد دلتا نامعتبر است. طول کد باید بین ۳۸ تا ۴۴ کاراکتر باشد.';
|
| 107 |
return;
|
| 108 |
}
|
|
|
|
| 109 |
verifyButton.disabled = true;
|
| 110 |
verifyButton.innerHTML = '<div class="loader"></div>';
|
| 111 |
|
| 112 |
try {
|
| 113 |
+
const response = await fetch(window.location.href, {
|
| 114 |
method: 'POST',
|
| 115 |
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
|
| 116 |
body: `delta_code=${encodeURIComponent(code)}`
|
| 117 |
});
|
| 118 |
|
| 119 |
if (!response.ok) {
|
| 120 |
+
// This will be triggered for server errors like 500
|
| 121 |
throw new Error('خطای سرور');
|
| 122 |
}
|
| 123 |
|
| 124 |
+
const result = await response.json();
|
| 125 |
|
| 126 |
if (result.status === 'success') {
|
| 127 |
localStorage.setItem('isDeltaCodeValidated', 'true');
|
| 128 |
showMainContent();
|
| 129 |
} else {
|
|
|
|
| 130 |
throw new Error(result.message || 'خطای ناشناخته از سمت سرور.');
|
| 131 |
}
|
| 132 |
|
|
|
|
| 137 |
}
|
| 138 |
});
|
| 139 |
|
|
|
|
| 140 |
function initializeVevoAPI() {
|
| 141 |
const container = document.getElementById('huggingface-vevo-api-container');
|
| 142 |
+
if (!container) return;
|
|
|
|
| 143 |
const generateBtn = container.querySelector('#generateBtn');
|
| 144 |
const sourceAudioInput = container.querySelector('#sourceAudio');
|
| 145 |
const timbreRefInput = container.querySelector('#timbreRef');
|
| 146 |
const statusDiv = container.querySelector('#status');
|
| 147 |
const resultDiv = container.querySelector('#result');
|
|
|
|
| 148 |
const API_URL = "https://amphion-vevo.hf.space/gradio_api/";
|
|
|
|
|
|
|
| 149 |
const generateSessionHash = () => Math.random().toString(36).substring(2, 15);
|
| 150 |
async function uploadFile(file) {
|
| 151 |
const formData = new FormData();
|