{% extends "layout.html" %}

{% block title %}{{ progress.current.title }}{% parent %}{% endblock %}
{% block description %}{% endblock %}
{% block robots %}index, follow{% endblock %}
{% block content %}
<div class="book {% if _input == "README.md" %}with-summary{% endif %}" data-github="{{ githubId }}" data-level="{{ progress.current.level }}">
    {% include "includes/book/header.html" %}
    {% include "includes/book/summary.html" %}
    <div class="book-body">
        <div class="page-wrapper">
            <div class="book-progress">
                <div class="bar">
                    <div class="inner" style="width: {{ progress.percent }}%;min-width: {{ progress.prevPercent }}%;"></div>
                </div>
                <div class="chapters">
                {% for p in progress.chapters %}
                    <a href="{{ basePath }}/{{ p.path }}" title="{{ p.title }}" class="chapter {% if p.done %}done{% endif %} {% if p.level.length == 1 %}new-chapter{% endif %}" data-progress="{{ p.level }}" style="left: {{ p.percent }}%;"></a>
                {% endfor %}
                </div>
            </div>

            <div class="page-inner">
            {% for section in content %}
                <section class="{{ section.type }}" id="section-{{ section.id }}">
                {% if section.type == "normal" %}
                    {% autoescape false %}{{ section.content }}{% endautoescape %}
                {% elif section.type == "exercise" %}
                    {% include "./includes/book/exercise.html" with {section: section} %}
                {% endif %}
                </section>
            {% endfor %}
            </div>

            <div class="page-footer">
                {% if _input == "README.md" %}
                    <a href="{{ basePath }}/{{ progress.current.next.path }}" class="navigation-link">Start</a>
                {% else %}
                    {% if progress.current.next %}
                        {% if progress.current.next.path %}
                        <a href="{{ basePath }}/{{ progress.current.next.path }}" class="navigation-link next">Next</a>
                        {% else %}
                        <div class="navigation-link coming-soon">Coming soon</div>
                        {% endif %}
                    {% else %}
                    <div class="navigation-link finished">Finished!</div>
                    {% endif %}
                {% endif %}
            </div>
        </div>
    </div>
</div>
{% endblock %}