| {% extends "base.html" %}
|
|
|
| {% block title %}Error - Multi-Personality Chat Bot{% endblock %}
|
|
|
| {% block content %}
|
| <div class="container-fluid">
|
| <div class="row justify-content-center">
|
| <div class="col-md-8 col-lg-6">
|
| <div class="terminal-card p-5 text-center">
|
| <div class="error-content">
|
|
|
| <div class="mb-4">
|
| <i class="fas fa-exclamation-triangle text-warning" style="font-size: 4rem;"></i>
|
| </div>
|
|
|
|
|
| <h2 class="text-terminal-green mb-3">
|
| Oops! Something went wrong 🤖
|
| </h2>
|
|
|
|
|
| <div class="error-message mb-4">
|
| {% if error_message %}
|
| <p class="text-light fs-5">{{ error_message }}</p>
|
| {% else %}
|
| <p class="text-light fs-5">An unexpected error occurred. Please try again.</p>
|
| {% endif %}
|
| </div>
|
|
|
|
|
| {% if error_details %}
|
| <div class="error-details bg-dark p-3 rounded border border-secondary mb-4 text-start">
|
| <h6 class="text-terminal-accent mb-2">Error Details:</h6>
|
| <pre class="text-muted small mb-0"><code>{{ error_details }}</code></pre>
|
| </div>
|
| {% endif %}
|
|
|
|
|
| <div class="action-buttons">
|
| <a href="/" class="btn btn-terminal-primary me-3">
|
| <i class="fas fa-home me-2"></i>Back to Home
|
| </a>
|
| <button onclick="history.back()" class="btn btn-outline-light">
|
| <i class="fas fa-arrow-left me-2"></i>Go Back
|
| </button>
|
| </div>
|
|
|
|
|
| <div class="mt-4 pt-4 border-top border-secondary">
|
| <h6 class="text-terminal-accent mb-3">What you can do:</h6>
|
| <div class="row g-3">
|
| <div class="col-md-4">
|
| <div class="tip-card p-3 bg-dark rounded border border-secondary h-100">
|
| <i class="fas fa-refresh text-terminal-green mb-2"></i>
|
| <p class="small mb-0">Refresh the page and try again</p>
|
| </div>
|
| </div>
|
| <div class="col-md-4">
|
| <div class="tip-card p-3 bg-dark rounded border border-secondary h-100">
|
| <i class="fas fa-robot text-terminal-green mb-2"></i>
|
| <p class="small mb-0">Choose a different personality</p>
|
| </div>
|
| </div>
|
| <div class="col-md-4">
|
| <div class="tip-card p-3 bg-dark rounded border border-secondary h-100">
|
| <i class="fas fa-question-circle text-terminal-green mb-2"></i>
|
| <p class="small mb-0">Check your internet connection</p>
|
| </div>
|
| </div>
|
| </div>
|
| </div>
|
| </div>
|
| </div>
|
| </div>
|
| </div>
|
| </div>
|
| {% endblock %}
|
|
|
| {% block scripts %}
|
| <script>
|
|
|
| setTimeout(() => {
|
| const errorMsg = '{{ error_message|lower }}';
|
| if (errorMsg.includes('temporary') || errorMsg.includes('connection') || errorMsg.includes('network')) {
|
| if (confirm('Would you like to refresh the page and try again?')) {
|
| window.location.reload();
|
| }
|
| }
|
| }, 30000);
|
|
|
|
|
| document.addEventListener('keydown', function(e) {
|
| if (e.key === 'Escape' || e.key === 'Backspace') {
|
| history.back();
|
| } else if (e.key === 'Enter' || e.key === ' ') {
|
| window.location.href = '/';
|
| }
|
| });
|
| </script>
|
| {% endblock %} |
