{% extends "/themes/test/core.html" %}

{% block main %}
<link href="/css/books.css" rel="stylesheet">

<section id="book">

	<h2>{{ book.title|e }}</h2>

	<img id="page" class="unselectable" src="/storage/books/{{ book.identifier|e }}/{{ page|e }}"
		alt='Страница отсутствует'>


	<nav>
		<ul>
			{% if page != last %}
			<!-- <li class="previous unselectable" type="button"><a href="/books/{{ book.identifier|e }}/{{ last|e }}"
					title="Страница №{{ last|e }}">Назад</a></li> -->

			<li class="previous unselectable">
				<a href="/books/{{ book.identifier|e }}/{{ last|e }}" title="Страница №{{ last|e }}"><i
						class="icon arrow" style="--rotate: 180deg; color:#9b3d10"></i></a>
			</li>
			{% endif %}

			{% if account.permissions.books is defined and account.permissions.books == 1 %}
			<li class="middle icon unselectable"><i class="fa-solid fa-rotate-right unselectable" type="button"
					onclick="rotate({{ book.identifier|e }}, {{ page|e }}, true)" title="Повернуть страницу"></i></li>
			<script type="text/javascript" src="/js/book/rotate.js"></script>

			{% else %}
			<li class="middle icon unselectable"><i class="fa-solid fa-rotate-right unselectable" type="button"
					onclick="turning()" title="Повернуть страницу"></i></li>
			<script type="text/javascript" src="/js/book/turning.js"></script>
			{% endif %}

			{%if page != next %}
			<li class="next unselectable"><a href="/books/{{ book.identifier|e }}/{{ next|e }}"
					title="Страница №{{ next|e }}"><i class="icon arrow" style="--rotate: 0deg;color:#9b3d10"></i></a>
			</li>
			{%endif%}
		</ul>
	</nav>


</section>
{% endblock %}