Spaces:
Running
Running
Update login.html
Browse files- login.html +67 -1
login.html
CHANGED
@@ -440,4 +440,70 @@
|
|
440 |
document.getElementById('registerPassword').value = '';
|
441 |
setTimeout(() => {
|
442 |
toggleForm();
|
443 |
-
}, 1500);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
440 |
document.getElementById('registerPassword').value = '';
|
441 |
setTimeout(() => {
|
442 |
toggleForm();
|
443 |
+
}, 1500);
|
444 |
+
} else {
|
445 |
+
showMessage('registerMessage', data.detail, true);
|
446 |
+
}
|
447 |
+
} catch (error) {
|
448 |
+
showMessage('registerMessage', 'حدث خطأ في الاتصال', true);
|
449 |
+
}
|
450 |
+
}
|
451 |
+
|
452 |
+
function isValidEmail(email) {
|
453 |
+
return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
|
454 |
+
}
|
455 |
+
|
456 |
+
// Add Enter key response
|
457 |
+
document.querySelectorAll('input').forEach(input => {
|
458 |
+
input.addEventListener('keypress', (e) => {
|
459 |
+
if (e.key === 'Enter') {
|
460 |
+
const form = input.closest('.form-box');
|
461 |
+
if (form.classList.contains('login-form')) {
|
462 |
+
login();
|
463 |
+
} else {
|
464 |
+
register();
|
465 |
+
}
|
466 |
+
}
|
467 |
+
});
|
468 |
+
});
|
469 |
+
|
470 |
+
// Add loading state to buttons
|
471 |
+
const buttons = document.querySelectorAll('button:not(.toggle-btn)');
|
472 |
+
buttons.forEach(button => {
|
473 |
+
button.addEventListener('click', function() {
|
474 |
+
this.style.position = 'relative';
|
475 |
+
this.style.pointerEvents = 'none';
|
476 |
+
const originalText = this.textContent;
|
477 |
+
this.textContent = '...جاري التنفيذ';
|
478 |
+
|
479 |
+
setTimeout(() => {
|
480 |
+
this.textContent = originalText;
|
481 |
+
this.style.pointerEvents = 'auto';
|
482 |
+
}, 2000);
|
483 |
+
});
|
484 |
+
});
|
485 |
+
|
486 |
+
// Add smooth fade-in animation on load
|
487 |
+
document.addEventListener('DOMContentLoaded', function() {
|
488 |
+
document.body.style.opacity = '0';
|
489 |
+
setTimeout(() => {
|
490 |
+
document.body.style.transition = 'opacity 0.5s ease';
|
491 |
+
document.body.style.opacity = '1';
|
492 |
+
}, 100);
|
493 |
+
});
|
494 |
+
|
495 |
+
// Add input focus effects
|
496 |
+
document.querySelectorAll('input').forEach(input => {
|
497 |
+
input.addEventListener('focus', function() {
|
498 |
+
this.parentElement.classList.add('focused');
|
499 |
+
});
|
500 |
+
|
501 |
+
input.addEventListener('blur', function() {
|
502 |
+
if (!this.value) {
|
503 |
+
this.parentElement.classList.remove('focused');
|
504 |
+
}
|
505 |
+
});
|
506 |
+
});
|
507 |
+
</script>
|
508 |
+
</body>
|
509 |
+
</html>
|