diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/lib/Reader/Chapters.svelte | 22 | ||||
| -rw-r--r-- | src/routes/reader/+page.svelte | 23 |
2 files changed, 26 insertions, 19 deletions
diff --git a/src/lib/Reader/Chapters.svelte b/src/lib/Reader/Chapters.svelte new file mode 100644 index 00000000..9953036e --- /dev/null +++ b/src/lib/Reader/Chapters.svelte @@ -0,0 +1,22 @@ +<script lang="ts"> + export let data; +</script> + +<ul> + {#each data.data as chapter} + <li> + {#if chapter.attributes.volume} + Vol. {chapter.attributes.volume} + {/if} + Ch. {chapter.attributes.chapter} + <span class="opaque">|</span> + <a + href={`https://mangadex.org/chapter/${chapter.id}`} + target="_blank" + rel="noopener noreferrer" + > + {chapter.attributes.title || 'Read'} + </a> + </li> + {/each} +</ul> diff --git a/src/routes/reader/+page.svelte b/src/routes/reader/+page.svelte index cbdd3916..05e47274 100644 --- a/src/routes/reader/+page.svelte +++ b/src/routes/reader/+page.svelte @@ -1,5 +1,7 @@ <script> import Notice from '$lib/Error/Notice.svelte'; + import Message from '$lib/Loading/Message.svelte'; + import Chapters from '$lib/Reader/Chapters.svelte'; import InputTemplate from '$lib/Tools/InputTemplate.svelte'; let submission = ''; @@ -10,29 +12,12 @@ <InputTemplate field="MangaDex URL" bind:submission submitText="Read" preserveCase> {#if mangaDexID} {#await fetch(`https://api.mangadex.org/manga/${mangaDexID}/feed?order[chapter]=desc&translatedLanguage[]=en`)} - <!-- --> + <Message message="Loading chapters ..." /> {:then response} {#if response.ok} {#await response.json() then data} {#if data.data} - <ul> - {#each data.data as chapter} - <li> - {#if chapter.attributes.volume} - Vol. {chapter.attributes.volume} - {/if} - Ch. {chapter.attributes.chapter} - <span class="opaque">|</span> - <a - href={`https://mangadex.org/chapter/${chapter.id}`} - target="_blank" - rel="noopener noreferrer" - > - {chapter.attributes.title} - </a> - </li> - {/each} - </ul> + <Chapters {data} /> {:else} <p class="opaque">(⌣_⌣”)</p> {/if} |