{% extends "base.html" %}

{% block title %}Ошибка сервера - Капитал & Рынок{% endblock %}

{% block screen_content %}
<div class="header">
    <a href="{{ url_for('rooms') }}" class="back-button">←</a>
    <div class="logo-container">
        <img src="{{ url_for('static', filename='images/logo.png') }}" alt="Капитал & Рынок" class="logo">
    </div>
</div>

<div class="container">
    <div class="card text-center">
        <div style="font-size: 5rem; color: var(--danger-color); margin: 20px 0;">500</div>
        <h2>Ошибка сервера</h2>
        <p>Произошла внутренняя ошибка сервера. Мы уже работаем над её устранением.</p>
        
        <div style="margin: 30px 0;">
            <div style="font-size: 8rem; color: #f0f0f0; margin-bottom: 20px;">💥📊</div>
            <p style="color: var(--light-text); font-size: 0.9rem;">
            Рынок временно не работает. Пожалуйста, попробуйте позже.
            </p>
        </div>
        
        <div class="flex flex-col gap-2 mt-4">
            <button onclick="window.location.reload()" class="button">
                Попробовать снова
            </button>
            <a href="{{ url_for('rooms') }}" class="button secondary">
                Вернуться к списку комнат
            </a>
            <a href="{{ url_for('index') }}" class="button">
                На главную
            </a>
        </div>
    </div>
    
    <div class="card">
        <h3>Техническая информация</h3>
        <p style="margin-top: 10px; font-size: 0.9rem; color: var(--light-text);">
            Если ошибка повторяется, пожалуйста, свяжитесь с администратором:
        </p>
        
        <div style="background-color: #f8f9fa; padding: 15px; border-radius: var(--border-radius); margin-top: 15px; font-family: monospace; font-size: 0.85rem;">
            <div>Время ошибки: <span id="error-time">{{ now.strftime('%Y-%m-%d %H:%M:%S') if now else '' }}</span></div>
            <div>Путь: <span id="error-path">{{ request.path if request else '' }}</span></div>
        </div>
        
        <div style="margin-top: 20px;">
            <button onclick="copyErrorInfo()" class="button secondary">
                Скопировать информацию об ошибке
            </button>
        </div>
    </div>
</div>
{% endblock %}

{% block scripts %}
<script>
function copyErrorInfo() {
    const errorInfo = `Ошибка 500\nПуть: ${document.getElementById('error-path').textContent}\nВремя: ${document.getElementById('error-time').textContent}\nUser Agent: ${navigator.userAgent}`;
    
    navigator.clipboard.writeText(errorInfo).then(() => {
        alert('Информация об ошибке скопирована в буфер обмена');
    });
}

// Автоматическая перезагрузка через 30 секунд
setTimeout(() => {
    console.log('Пытаемся перезагрузить страницу через 30 секунд после ошибки...');
}, 30000);
</script>
{% endblock %}