Repos / pytaku / 91090272f9
commit 91090272f9f17f12644b7a6b4935fc7415bedd20
Author: Bùi Thành Nhân <hi@imnhan.com>
Date: Sat Aug 1 15:32:47 2020 +0700
implement chapter page, refactor ibutton
diff --git a/src/mangoapi/__init__.py b/src/mangoapi/__init__.py
index a9870a4..0851216 100644
--- a/src/mangoapi/__init__.py
+++ b/src/mangoapi/__init__.py
@@ -42,4 +42,22 @@ def get_title(title_id):
def get_chapter(chapter_id):
- return {"id": chapter_id}
+ md_resp = requests.get(f"https://mangadex.org/api/?id={chapter_id}&type=chapter")
+ assert md_resp.status_code == 200
+ md_json = md_resp.json()
+ assert md_json["status"] == "OK"
+
+ img_path = f"{md_json['server']}{md_json['hash']}"
+
+ chapter = {
+ 'id': chapter_id,
+ 'title_id': md_json['manga_id'],
+ 'name': md_json['title'],
+ 'pages': [
+ f'{img_path}/{page}'
+ for page in md_json['page_array']
+ ],
+ 'group': md_json['group_name'],
+ **_parse_chapter_number(md_json['chapter']),
+ }
+ return chapter
diff --git a/src/pytaku/static/base.css b/src/pytaku/static/base.css
index 5c3a823..bc1863a 100644
--- a/src/pytaku/static/base.css
+++ b/src/pytaku/static/base.css
@@ -49,6 +49,7 @@ .button {
display: inline-flex;
align-items: center;
justify-content: center;
+ vertical-align: bottom;
gap: 0.3rem;
cursor: pointer;
diff --git a/src/pytaku/templates/base.html b/src/pytaku/templates/base.html
index 77dbb0c..05b0b50 100644
--- a/src/pytaku/templates/base.html
+++ b/src/pytaku/templates/base.html
@@ -1,10 +1,21 @@
{# vim: ft=htmldjango
#}
-{% macro ibutton(icon, text, color='red') -%}
-<button class="{{ color }} button">
- <img src="{{ url_for('static', filename='icons/' + icon + '.svg')}}" alt="{{ text }} icon" />
+
+{% macro ibutton(href='', left_icon='', right_icon='', text='', color='red') -%}
+{% set element = 'a' if href else 'button' %}
+<{{ element }} class="{{ color }} button" {% if href %}href="{{ href }}"{% endif %}>
+ {% if left_icon %}
+ <img src="{{ url_for('static', filename='icons/' + left_icon + '.svg')}}" alt="{{ text }} icon" />
+ {% endif %}
+
+ {% if text %}
<span>{{ text }}</span>
-</button>
+ {% endif %}
+
+ {% if right_icon %}
+ <img src="{{ url_for('static', filename='icons/' + right_icon + '.svg')}}" alt="{{ text }} icon" />
+ {% endif %}
+</{{ element }}>
{%- endmacro %}
<!DOCTYPE html>
diff --git a/src/pytaku/templates/chapter.html b/src/pytaku/templates/chapter.html
index 14e7466..97665a7 100644
--- a/src/pytaku/templates/chapter.html
+++ b/src/pytaku/templates/chapter.html
@@ -1,9 +1,61 @@
{% extends 'base.html' %}
{% block title %}
-Chapter {{ id }}
+Ch.{{ number }} - {{ name }}
+{% endblock %}
+
+{% block head %}
+<style>
+ html {
+ background-color: #444;
+ color: white;
+ }
+
+ .content {
+ max-width: 100%;
+ padding: var(--body-padding) 0;
+ text-align: center;
+ }
+
+ .cover {
+ width: 400px;
+ border: 1px solid black;
+ }
+
+ .pages img {
+ display: block;
+ margin: 0 auto 1rem auto;
+ }
+
+ .buttons {
+ display: flex;
+ flex-direction: row;
+ gap: .5rem;
+ justify-content: center;
+ flex-wrap: wrap;
+ }
+</style>
{% endblock %}
{% block content %}
-Hello {{ id }}
+
+<h1>Ch.{{ number }}: {{ name }}</h1>
+
+{# Put buttons in block to reuse later in this same template #}
+{% block buttons %}
+<div class="buttons">
+{{ ibutton(href='#TODO', left_icon='chevrons-left', text='Previous') }}
+{{ ibutton(left_icon='eye', text='Reading', color='green') }}
+{{ ibutton(href='#TODO', right_icon='chevrons-right', text='Next') }}
+</div>
+{% endblock %}
+
+<div class="pages">
+ {% for page in pages %}
+ <img src="{{ page }}" />
+ {% endfor %}
+</div>
+
+{{ self.buttons() }}
+
{% endblock %}
diff --git a/src/pytaku/templates/title.html b/src/pytaku/templates/title.html
index a6ba007..73c813e 100644
--- a/src/pytaku/templates/title.html
+++ b/src/pytaku/templates/title.html
@@ -17,7 +17,7 @@
<h1>{{ name }}</h1>
-{{ ibutton('bookmark', 'Bookmark', 'blue') }}
+{{ ibutton(left_icon='bookmark', text='Bookmark', color='blue') }}
<img class="cover" src="{{ cover }}" alt="cover" />