Spaces:
Sleeping
Sleeping
WebashalarForML
commited on
Commit
•
fbd23e6
1
Parent(s):
186d7fc
Update templates/index.html
Browse files- templates/index.html +55 -61
templates/index.html
CHANGED
@@ -145,8 +145,8 @@
|
|
145 |
margin-top: 70px;
|
146 |
}
|
147 |
.disabled {
|
148 |
-
cursor:
|
149 |
-
|
150 |
|
151 |
/* Responsive design */
|
152 |
@media (max-width: 768px) {
|
@@ -201,67 +201,61 @@
|
|
201 |
</div>
|
202 |
|
203 |
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
|
204 |
-
|
205 |
-
|
206 |
-
|
207 |
-
|
208 |
-
|
209 |
-
|
210 |
-
|
211 |
-
|
212 |
-
|
213 |
-
|
214 |
-
|
215 |
-
|
216 |
-
|
217 |
-
|
218 |
-
|
219 |
-
|
220 |
-
|
221 |
-
|
222 |
-
|
223 |
-
processingMessage.style.color = '#e68a10'; // Style as needed
|
224 |
-
document.querySelector('.file-upload-section').appendChild(processingMessage);
|
225 |
-
};
|
226 |
-
|
227 |
-
// Flash message auto-hide
|
228 |
-
setTimeout(function () {
|
229 |
-
let flashMessage = document.getElementById("flash-message");
|
230 |
-
if (flashMessage) {
|
231 |
-
flashMessage.style.transition = "opacity 1s ease";
|
232 |
-
flashMessage.style.opacity = 0;
|
233 |
-
setTimeout(() => flashMessage.remove(), 1000);
|
234 |
-
}
|
235 |
-
|
236 |
-
// After processing is complete (You can adjust this based on your logic)
|
237 |
-
const processingMessage = document.getElementById('processing-message');
|
238 |
-
if (processingMessage) {
|
239 |
-
processingMessage.remove(); // Remove the processing message
|
240 |
-
}
|
241 |
|
242 |
-
|
243 |
-
|
244 |
-
|
245 |
-
|
246 |
-
|
247 |
-
|
248 |
-
|
249 |
-
|
250 |
-
|
251 |
-
|
252 |
-
|
253 |
-
|
254 |
-
|
255 |
-
|
256 |
-
|
257 |
-
|
258 |
-
|
259 |
-
|
|
|
|
|
|
|
|
|
260 |
|
261 |
-
|
262 |
-
|
263 |
-
|
264 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
265 |
</body>
|
266 |
|
267 |
</html>
|
|
|
145 |
margin-top: 70px;
|
146 |
}
|
147 |
.disabled {
|
148 |
+
cursor: not-allowed !important; /* Set cursor to not-allowed */
|
149 |
+
}
|
150 |
|
151 |
/* Responsive design */
|
152 |
@media (max-width: 768px) {
|
|
|
201 |
</div>
|
202 |
|
203 |
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
|
204 |
+
<script>
|
205 |
+
// Loader functionality
|
206 |
+
document.getElementById('fileUploadForm').onsubmit = function() {
|
207 |
+
document.getElementById('loader').style.display = 'block';
|
208 |
+
|
209 |
+
// Disable the tab buttons and apply disabled class
|
210 |
+
const buttons = document.querySelectorAll('.tab button');
|
211 |
+
buttons.forEach(button => {
|
212 |
+
button.setAttribute('disabled', 'true');
|
213 |
+
button.classList.add('disabled'); // Add disabled class
|
214 |
+
});
|
215 |
+
|
216 |
+
// Show processing message
|
217 |
+
const processingMessage = document.createElement('p');
|
218 |
+
processingMessage.id = 'processing-message';
|
219 |
+
processingMessage.textContent = 'Processing, please wait...';
|
220 |
+
processingMessage.style.color = '#e68a10'; // Style as needed
|
221 |
+
document.querySelector('.file-upload-section').appendChild(processingMessage);
|
222 |
+
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
223 |
|
224 |
+
// Flash message auto-hide
|
225 |
+
setTimeout(function () {
|
226 |
+
let flashMessage = document.getElementById("flash-message");
|
227 |
+
if (flashMessage) {
|
228 |
+
flashMessage.style.transition = "opacity 1s ease";
|
229 |
+
flashMessage.style.opacity = 0;
|
230 |
+
setTimeout(() => flashMessage.remove(), 1000);
|
231 |
+
}
|
232 |
+
|
233 |
+
// After processing is complete (You can adjust this based on your logic)
|
234 |
+
const processingMessage = document.getElementById('processing-message');
|
235 |
+
if (processingMessage) {
|
236 |
+
processingMessage.remove(); // Remove the processing message
|
237 |
+
}
|
238 |
+
|
239 |
+
// Re-enable tab buttons and remove disabled class
|
240 |
+
const buttons = document.querySelectorAll('.tab button');
|
241 |
+
buttons.forEach(button => {
|
242 |
+
button.removeAttribute('disabled');
|
243 |
+
button.classList.remove('disabled'); // Remove disabled class
|
244 |
+
});
|
245 |
+
}, 3000); // Adjust timing based on your upload duration
|
246 |
|
247 |
+
// Function to open links in the same tab
|
248 |
+
function openLink(url, element) {
|
249 |
+
window.location.href = url; // Redirects to the specified URL in the same tab
|
250 |
+
|
251 |
+
// Remove "active" class from all buttons
|
252 |
+
const buttons = document.querySelectorAll('.tab button');
|
253 |
+
buttons.forEach(button => button.classList.remove('active'));
|
254 |
+
|
255 |
+
// Add "active" class to the clicked button
|
256 |
+
element.classList.add('active');
|
257 |
+
}
|
258 |
+
</script>
|
259 |
</body>
|
260 |
|
261 |
</html>
|