{% extends "base.html" %}
{% load static %}
{% block title %}{{ title }}{% endblock %}

{% block content %}

    <div class="container m-0">
    <div class="row justify-content-center w-100">
        <div class="btn-group" role="group" aria-label="Basic example">

            <button id="prev" class="btn btn-secondary">Previous</button>
            <button id="pages" class="btn btn-secondary"><span id="page_num"></span> / <span id="page_count"></span></button>

            <button id="next" class="btn btn-secondary">Next</button>

        </div>
    </div>
    <div class="row w-100">
        <canvas id="the-canvas" width="100%"></canvas>
    </div>
    </div>

{% endblock %}

{% block script %}
    <script type="text/javascript" src="{% static "pdfjs/build/pdf.js" %}"></script>
    {{ nav|json_script:"nav" }}
    {{ status.last_read_page|json_script:"last_read_page" }}
    <script type="text/javascript" src="{% static 'js/read_comic_pdf.min.js' %}"></script>
{% endblock %}