Merge pull request #6 from senpy-club/renovate/eslint-8.x

chore(deps): update dependency eslint to v8.11.0

diff --git a/package.json b/package.json
index da270316da8c12e21f90e726c49c0267429c4f60..26145d4eda55e6021870e8236891180879d7e9d0 100644 (file)
--- a/package.json
+++ b/package.json
@@ -46,7 +46,7 @@
     "eslint": "8.11.0",
     "eslint-config-prettier": "8.5.0",
     "eslint-plugin-svelte3": "3.4.1",
-    "prettier": "2.5.1",
+    "prettier": "2.6.0",
     "prettier-plugin-svelte": "2.6.0",
     "svelte": "3.46.4",
     "svelte-check": "2.4.5",

diff --git a/src/app.css b/src/app.css
index 995e9cdd9fb5b88b2cde31e06f314743c12e1797..62d6d2e74e4dde9ee134828cf55f395859d94631 100644 (file)
--- a/src/app.css
+++ b/src/app.css
@@ -34,15 +34,15 @@ img {
   border-radius: 5px;
 }
 
-#random-image img {
+.highlight-image img {
   height: 20em;
   transition: 0.25s;
 }
-#random-image img:hover {
+.highlight-image img:hover {
   height: 22.5em;
   opacity: 0.75;
 }
-#random-image a:hover {
+.highlight-image a:hover {
   border-bottom: none;
 }
 

diff --git a/src/routes/api.svelte b/src/routes/api.svelte
index a6476da1214fd87df32c0e0d9eed6e0a57101216..e377783bf04848781205050964d6f0c0a27442fe 100644 (file)
--- a/src/routes/api.svelte
+++ b/src/routes/api.svelte
@@ -49,6 +49,6 @@ SPDX-License-Identifier: GPL-3.0-only -->
     <p>Fetching API README...</p>
   {:else}
     {@html rst2html(rst)}
-    <p>RST to HTML time: {rstTime}ms</p>
+    <p>Double rst_to_html_time = {rstTime}; /* ms */</p>
   {/if}
 </section>

diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index a1a3a1cc6e769956c1665a1c6a0bdfe9962867cc..9497358e6f66afee64be5ff2639ba45072c5f9d8 100644 (file)
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -24,7 +24,7 @@ SPDX-License-Identifier: GPL-3.0-only -->
 
   onMount(async () => {
     fetchTime = performance.now();
-    image = (await fetchRandomImage()).image;
+    image = await fetchRandomImage();
     fetchTime = performance.now() - fetchTime;
     complete = true;
   });
@@ -40,15 +40,16 @@ SPDX-License-Identifier: GPL-3.0-only -->
   {#if !complete}
     <p>Fetching a random image...</p>
   {:else}
-    <div id="random-image">
-      <a href={image}>
+    <div class="highlight-image">
+      <a href={`/language?language=${image.language}&image=${image.image}`}>
         <img
-          src={image}
+          src={image.image}
           alt="Image of an anime girl holding a programming book"
         />
       </a>
     </div>
-    <p>Fetch time: {fetchTime}ms</p>
+
+    <p>Double fetch_time = {fetchTime}; /* ms */</p>
   {/if}
 
   <h2>Contributing</h2>

diff --git a/src/routes/language.svelte b/src/routes/language.svelte
index bbad67bdae0ac0f5cd9c5e5c0525a95dfa045394..55340a0ec91411dcf6642a7ec676405d65b76239 100644 (file)
--- a/src/routes/language.svelte
+++ b/src/routes/language.svelte
@@ -20,15 +20,54 @@ SPDX-License-Identifier: GPL-3.0-only -->
   import { fetchImages } from "$lib/api";
   import { page } from "$app/stores";
 
+  const errorImages = [
+    "https://www.pngarts.com/files/8/Confused-Anime-Transparent-Image.png",
+    "https://cdn130.picsart.com/246838980018212.png?r1024x1024",
+    "https://toppng.com/public/uploads/thumbnail/confused-anime-png-anime-question-png-gif-11563638774nccphyut3x.png",
+    "https://linuxreviews.org/images/8/8d/Blond-anime-girl-with-red-questionmark.png",
+    "https://external-preview.redd.it/VNfYgsb6Pqn4xlEBpYl11534fIpOfN1XeMe7NrzgmQs.png?width=282&auto=webp&s=3247341e1cb8a6d6f63b7b3d63809e52ca0558fd",
+    "https://i.ya-webdesign.com/images/confused-anime-png-5.png",
+    "https://www.pngarts.com/files/8/Confused-Anime-PNG-Picture.png",
+    "https://64.media.tumblr.com/20fb900f57db568393387211c9c4760c/tumblr_olanyyuuQZ1tbejoso2_400.png",
+    "https://stickershop.line-scdn.net/stickershop/v1/product/7982958/LINEStorePC/main.png;compress=true",
+    "https://emoji.gg/assets/emoji/8573_Shikiconfused.png",
+    "https://i.imgur.com/TOgxESH.jpg",
+  ];
+
   let language = $page.url.searchParams.get("language");
-  let images, fetchTime;
+  let images, fetchTime, image, imageSize;
   let complete = false;
+  let imageQuery = $page.url.searchParams.get("image");
 
   onMount(async () => {
     fetchTime = performance.now();
     images = await fetchImages(language);
     fetchTime = performance.now() - fetchTime;
     complete = true;
+
+    if (imageQuery) {
+      image = images.filter((i) => i.includes(imageQuery));
+
+      if (!image[0]) {
+        image =
+          "https://www.pngarts.com/files/8/Confused-Anime-Transparent-Image.png";
+        image = errorImages[Math.floor(Math.random() * errorImages.length)];
+      } else {
+        let xhr = new XMLHttpRequest();
+
+        xhr.open("HEAD", image, true);
+        xhr.onreadystatechange = () => {
+          if (xhr.readyState === 4) {
+            if (xhr.status === 200) {
+              imageSize = `${xhr.getResponseHeader("Content-Length") / 1024}`;
+            } else {
+              imageSize = "Error";
+            }
+          }
+        };
+        xhr.send(null);
+      }
+    }
   });
 </script>
 
@@ -43,11 +82,47 @@ SPDX-License-Identifier: GPL-3.0-only -->
     <p>Fetching images...</p>
   {:else if images.length === 0}
     <p>Sorry, no images were found for this language.</p>
+  {:else if image}
+    {#if errorImages.includes(image)}
+      <div class="highlight-image">
+        <p>
+          <i>Could not locate that specific image!</i>
+          Wanna go <a href={`/language?language=${language}`}>back</a> to language
+          homepage?
+        </p>
+
+        <a href={image}>
+          <img src={image} alt="Image of a confused anime girl" />
+        </a>
+      </div>
+    {:else if image}
+      <div class="highlight-image">
+        <p>
+          Wanna go <a href={`/language?language=${language}`}>back</a> to language
+          homepage?
+        </p>
+
+        <a href={image}>
+          <img
+            src={image}
+            alt="Image of an anime girl holding a programming book"
+          />
+        </a>
+
+        <p>
+          Attributes attributes = &lbrace;<br />
+          &ensp;direct_link: "<a href={image}>url</a>",<br />
+          &ensp;size: {imageSize}, /* kb */<br />
+          &ensp;fetch_time: {fetchTime}, /* ms */<br />
+          &rbrace;;
+        </p>
+      </div>
+    {/if}
   {:else}
     <ul class="image-rack">
       {#each images as image}
         <li id="image-rack-item">
-          <a href={image}>
+          <a href={`/language?language=${language}&image=${image}`}>
             <img
               src={image}
               alt="Image of an anime girl holding a programming book"
@@ -56,6 +131,7 @@ SPDX-License-Identifier: GPL-3.0-only -->
         </li>
       {/each}
     </ul>
-    <p>Fetch time: {fetchTime}ms</p>
+
+    <p>Double fetch_time = {fetchTime}; /* ms */</p>
   {/if}
 </div>

diff --git a/src/routes/languages.svelte b/src/routes/languages.svelte
index 49d44d73b5f76058d5d375fa59291e5281e496c1..cf8a05c6b63e1bdf40fcc6862c53e7481ad68351 100644 (file)
--- a/src/routes/languages.svelte
+++ b/src/routes/languages.svelte
@@ -45,6 +45,8 @@ SPDX-License-Identifier: GPL-3.0-only -->
         <li>
           {#if language === "C#"}
             <a href={"/language?language=C%23"}>C#</a>
+          {:else if language === "C++"}
+            <a href={"/language?language=C%2b%2b"}>C++</a>
           {:else}
             <a href={"/language?language=" + language}>
               {language}
@@ -53,6 +55,7 @@ SPDX-License-Identifier: GPL-3.0-only -->
         </li>
       {/each}
     </ul>
-    <p>Fetch time: {fetchTime}ms</p>
+
+    <p>Double fetch_time = {fetchTime}; /* ms */</p>
   {/if}
 </div>

diff --git a/yarn.lock b/yarn.lock
index 2ab2659c5ad470f1ada96078590caacc9bf5df3f..746d7bd644efce3b7e84be88ad9f0cce15b7a4f7 100644 (file)
--- a/yarn.lock
+++ b/yarn.lock
@@ -2254,10 +2254,10 @@ prettier-plugin-svelte@2.6.0:
   resolved "https://registry.yarnpkg.com/prettier-plugin-svelte/-/prettier-plugin-svelte-2.6.0.tgz#0e845b560b55cd1d951d6c50431b4949f8591746"
   integrity sha512-NPSRf6Y5rufRlBleok/pqg4+1FyGsL0zYhkYP6hnueeL1J/uCm3OfOZPsLX4zqD9VAdcXfyEL2PYqGv8ZoOSfA==
 
-prettier@2.5.1:
-  version "2.5.1"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.5.1.tgz#fff75fa9d519c54cf0fce328c1017d94546bc56a"
-  integrity sha512-vBZcPRUR5MZJwoyi3ZoyQlc1rXeEck8KgeC9AwwOn+exuxLxq5toTRDTSaVrXHxelDMHy9zlicw8u66yxoSUFg==
+prettier@2.6.0:
+  version "2.6.0"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.6.0.tgz#12f8f504c4d8ddb76475f441337542fa799207d4"
+  integrity sha512-m2FgJibYrBGGgQXNzfd0PuDGShJgRavjUoRCw1mZERIWVSXF0iLzLm+aOqTAbLnC3n6JzUhAA8uZnFVghHJ86A==
 
 pretty-format@^27.2.5, pretty-format@^27.5.1:
   version "27.5.1"