krzysiej/biblio
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Displaying progress bar and a progress editor.

Browse Source
This commit is contained in:
krzysiej
2022-06-07 15:10:32 +02:00
parent 0831b2bbfb
commit 4b22850ac9
4 changed files with 160 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
templates/book/show.html.twig
View File

@@ -4,68 +4,65 @@
{% block body %}
<div class="progress" style="height: 2px;">
<div class="progress-bar" role="progressbar" style="width: {{ (book.getProgress().first().pages / book.pages*100) | round }}%"></div>
<div class="progress-bar bg-secondary bg-opacity-10" role="progressbar" style="width: {{ 100-(book.getProgress().first().pages / book.pages*100) | round }}%"></div>
</div>
<div class="d-flex">
<div>
{% if file_exists(asset('book_covers/cover_' ~ book.id ~ '.jpg')) %}
<img class="img-thumbnail"
style="max-width: 80px"
src="{{ asset('book_covers/cover_' ~ book.id ~ '.jpg' ) }}"/> {% endif %}
</div>
<div class="mx-3">
<h1>{{ book.title }}</h1>
<h3>{{ book.subtitle }}</h3>
<p>{{ book.author }}</p>
<p>{% for i in range(1, book.rating) %}⭐{% endfor %}</p>
</div>
</div>
<table class="table">
<tbody>
<tr>
<th>Category</th>
<td colspan="3">{{ book.category }}</td>
</tr>
<tr>
<th>Description</th>
<td colspan="3">{{ book.description | nl2br }}</td>
</tr>
<tr>
<th>Publisher</th>
<td>{{ book.publisher }}</td>
<th>Publish date</th>
<td>{{ book.publishDate ? book.publishDate|date('Y-m-d') : '' }}</td>
</tr>
<tr>
<th>Isbn</th>
<td colspan="3">{{ book.isbn }}</td>
</tr>
<tr>
<th>Tags</th>
<td colspan="3">{{ book.tags }}</td>
</tr>
<tr>
<th>Series</th>
<td colspan="3">{{ book.series }} {{ book.volume }}</td>
</tr>
<tr>
<th>Language</th>
<td colspan="3">{{ book.language }}</td>
</tr>
<tr>
<th>Progress</th>
<td>{{ book.getProgress().first().pages }}</td>
<th>Pages</th>
<td>{{ book.pages }}</td>
</tr>
</tbody>
</table>
<div id="app">
{% set progress_pages = book.getProgress() | length ? (book.getProgress().first().pages) : 0 %}
{% set progress = (progress_pages / book.pages*100) | round %}
<progressbar :read-pages="{{ progress_pages }}" :total-pages="{{ book.pages }}"></progressbar>
<div class="d-flex">
<div>
{% if file_exists(asset('book_covers/cover_' ~ book.id ~ '.jpg')) %}
<img class="img-thumbnail"
style="max-width: 80px"
src="{{ asset('book_covers/cover_' ~ book.id ~ '.jpg' ) }}"/> {% endif %}
</div>
<div class="mx-3">
<h1>{{ book.title }}</h1>
<h3>{{ book.subtitle }}</h3>
<p>{{ book.author }}</p>
<p>{% for i in range(1, book.rating) %}⭐{% endfor %}</p>
</div>
</div>
<table class="table">
<tbody>
<tr>
<th>Category</th>
<td>{{ book.category }}</td>
<th>Tags</th>
<td>{{ book.tags }}</td>
</tr>
<tr>
<th>Description</th>
<td colspan="3">{{ book.description | nl2br }}</td>
</tr>
<tr>
<th>Publisher</th>
<td>{{ book.publisher }}</td>
<th>Publish date</th>
<td>{{ book.publishDate ? book.publishDate|date('Y-m-d') : '' }}</td>
</tr>
<tr>
<th>ISBN</th>
<td>{{ book.isbn }}</td>
<th>Language</th>
<td>{{ book.language }}</td>
</tr>
{% if(book.series) %}
<tr>
<th>Series</th>
<td colspan="3">{{ book.series }} {{ book.volume }}</td>
</tr>
{% endif %}
<tr>
<th>Progress</th>
<td><progresseditor :read-pages="{{ progress_pages }}" :total-pages="{{ book.pages }}"></progresseditor></td>
<th>Pages</th>
<td>{{ book.pages }}</td>
</tr>
</tbody>
</table>
<files></files>
</div>