]> git.lizzy.rs Git - frontend-next.git/blob - src/routes/index.svelte
feat: image homepages
[frontend-next.git] / src / routes / index.svelte
1 <!-- This file is part of api-worker <https://github.com/senpy-club/api-worker>.
2 Copyright (C) 2022-2022 Fuwn <contact@fuwn.me>
3
4 This program is free software: you can redistribute it and/or modify
5 it under the terms of the GNU General Public License as published by
6 the Free Software Foundation, version 3.
7
8 This program is distributed in the hope that it will be useful, but
9 WITHOUT ANY WARRANTY; without even the implied warranty of
10 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
11 General Public License for more details.
12
13 You should have received a copy of the GNU General Public License
14 along with this program. If not, see <http://www.gnu.org/licenses/>.
15
16 Copyright (C) 2022-2022 Fuwn <contact@fuwn.me>
17 SPDX-License-Identifier: GPL-3.0-only -->
18 <script>
19   import { onMount } from "svelte";
20   import { fetchRandomImage } from "$lib/api";
21
22   let image, fetchTime;
23   let complete = false;
24
25   onMount(async () => {
26     fetchTime = performance.now();
27     image = (await fetchRandomImage());
28     fetchTime = performance.now() - fetchTime;
29     complete = true;
30   });
31 </script>
32
33 <svelte:head>
34   <title>Home | The Senpy Club</title>
35 </svelte:head>
36
37 <section>
38   <h1>Home</h1>
39
40   {#if !complete}
41     <p>Fetching a random image...</p>
42   {:else}
43     <div class="highlight-image">
44       <a href={`/language?language=${image.language}&image=${image.image}`}>
45         <img
46           src={image.image}
47           alt="Image of an anime girl holding a programming book"
48         />
49       </a>
50     </div>
51
52     <p>Double fetch_time = {fetchTime}; /* ms */</p>
53   {/if}
54
55   <h2>Contributing</h2>
56   <p>
57     If you'd like to support the project in any way, check out the repositories:
58   </p>
59   <ul>
60     <li><a href="https://github.com/senpy-club/api-worker">API</a></li>
61     <li><a href="https://github.com/senpy-club/frontend-next">Frontend</a></li>
62   </ul>
63 </section>