{% extends 'base.html' %}

{% block title %}Home{% endblock %}

{% block meta_description %}IJCMSE - International Journal of Computational Materials Science and Engineering. A peer-reviewed journal publishing research in DFT, molecular dynamics, nanomaterials, and computational modeling.{% endblock %}

{% block meta_keywords %}computational materials science, materials engineering, DFT calculations, molecular dynamics, simulation, nanomaterials, peer-reviewed journal, IJCMSE{% endblock %}

{% block schema_org %}
<script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "Periodical",
    "name": "International Journal of Computational Materials Science and Engineering",
    "alternateName": "IJCMSE",
    "issn": ["2047-6841", "2047-685X"],
    "url": "{{ request.host_url }}",
    "description": "A peer-reviewed journal dedicated to publishing high-quality research in computational materials science and engineering.",
    "publisher": {
        "@type": "Organization",
        "name": "IJCMSE"
    }
}
</script>
{% endblock %}

{% block content %}
<!-- Hero Section -->
<section class="hero-section">
    <h1>International Journal of Computational Materials Science and Engineering</h1>
    <p>A peer-reviewed journal dedicated to publishing high-quality research in computational materials science, covering theoretical developments, methodological innovations, and practical applications.</p>
    <div class="hero-actions">
        <a href="{{ url_for('submit_article') }}" class="btn btn-primary">
            <i class="fas fa-paper-plane"></i> Submit an Article
        </a>
        <a href="{{ url_for('aims_scope') }}" class="btn btn-secondary">
            <i class="fas fa-info-circle"></i> Learn More
        </a>
    </div>
</section>

<div class="home-grid">
    <!-- Main Content -->
    <div class="main-column">
        <div class="latest-issue">
            <h2><i class="fas fa-newspaper"></i> Latest Issue</h2>
            {% if latest_volume and latest_volume.issues %}
                {% set latest_issue = latest_volume.issues | sort(attribute='issue_number', reverse=true) | first %}
                {% if latest_issue %}
                    <div class="issue-info mb-20">
                        <p><strong>Volume {{ latest_volume.volume_number }}, Issue {{ latest_issue.issue_number }} ({{ latest_volume.year }})</strong></p>
                        {% if latest_issue.publication_date %}
                            <p class="text-muted">Published: {{ latest_issue.publication_date.strftime('%B %d, %Y') }}</p>
                        {% endif %}
                    </div>
                    
                    {% if latest_issue.articles %}
                        <ul class="article-list">
                            {% for article in latest_issue.articles[:5] %}
                                <li class="article-item">
                                    <h3 class="article-title">
                                        <a href="{{ url_for('view_article', article_id=article.id) }}">{{ article.title }}</a>
                                    </h3>
                                    <p class="article-authors">{{ article.authors }}</p>
                                    <div class="article-meta">
                                        {% if article.pages %}
                                            <span><i class="fas fa-file-alt"></i> Pages: {{ article.pages }}</span>
                                        {% endif %}
                                        {% if article.is_open_access %}
                                            <span class="open-access-badge"><i class="fas fa-lock-open"></i> Open Access</span>
                                        {% endif %}
                                    </div>
                                </li>
                            {% endfor %}
                        </ul>
                        <div class="mt-20">
                            <a href="{{ url_for('view_issue', issue_id=latest_issue.id) }}" class="btn btn-secondary btn-sm">
                                View All Articles <i class="fas fa-arrow-right"></i>
                            </a>
                        </div>
                    {% else %}
                        <p class="text-muted">No articles published yet in this issue.</p>
                    {% endif %}
                {% endif %}
            {% else %}
                <p class="text-muted">No issues published yet. Check back soon!</p>
            {% endif %}
        </div>
    </div>
    
    <!-- Sidebar -->
    <aside class="sidebar">
        <div class="sidebar-widget">
            <h3><i class="fas fa-book"></i> Browse Issues</h3>
            {% if volumes %}
                <ul class="issue-list">
                    {% for volume in volumes[:5] %}
                        <li>
                            <a href="{{ url_for('view_volume', volume_id=volume.id) }}">
                                <strong>Volume {{ volume.volume_number }}</strong> ({{ volume.year }})
                            </a>
                        </li>
                    {% endfor %}
                </ul>
                <div class="mt-20">
                    <a href="{{ url_for('volumes') }}" class="btn btn-secondary btn-sm">View All Volumes</a>
                </div>
            {% else %}
                <p class="text-muted">No volumes available yet.</p>
            {% endif %}
        </div>
        
        <div class="sidebar-widget">
            <h3><i class="fas fa-bullhorn"></i> Announcements</h3>
            <p>IJCMSE is now accepting submissions for the upcoming issue.</p>
            <a href="{{ url_for('call_for_papers') }}" class="btn btn-primary btn-sm mt-20">
                Call for Papers
            </a>
        </div>
        
        <div class="sidebar-widget">
            <h3><i class="fas fa-info-circle"></i> Journal Info</h3>
            <ul class="footer-links">
                <li><strong>ISSN (Print):</strong> 2047-6841</li>
                <li><strong>ISSN (Online):</strong> 2047-685X</li>
            </ul>
        </div>
    </aside>
</div>
{% endblock %}