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()).image;
  28     fetchTime = performance.now() - fetchTime;
  29
  30     complete = true;
  31   });
  32 </script>
  33
  34 <svelte:head>
  35   <title>home | senpy-club</title>
  36 </svelte:head>
  37
  38 <section>
  39   <h1>Home</h1>
  40
  41   {#if !complete}
  42     <p>Fetching a random image...</p>
  43   {:else}
  44     <div id="random-image">
  45       <a href={image}>
  46         <img
  47           src={image}
  48           alt="Image of an anime girl holding a programming book"
  49         />
  50       </a>
  51     </div>
  52     <small>Fetch time: {fetchTime}ms</small>
  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>