From ad249074f702726d1ea2a4bbf5f021a5b1cecf94 Mon Sep 17 00:00:00 2001
From: Kenimarru <chehami.kamal@mail.com>
Date: Sun, 7 Jan 2024 18:00:01 +0100
Subject: v0.2.5

---
 LICENSE                 | 21 ++++++++++++++++++
 components/Details.vue  | 57 ++++++++++++++++++++++---------------------------
 components/Popular.vue  | 22 ++++++-------------
 components/Stream.vue   | 34 +++++++++++++----------------
 components/Trending.vue | 22 ++++++-------------
 nuxt.config.ts          |  9 +++++---
 package-lock.json       |  4 ++--
 package.json            |  6 ++++--
 server/api/episodes.js  |  5 +++++
 server/api/info.js      |  5 +++++
 server/api/popular.js   |  4 ++++
 server/api/stream.js    |  5 +++++
 server/api/trending.js  |  4 ++++
 13 files changed, 108 insertions(+), 90 deletions(-)
 create mode 100644 LICENSE
 create mode 100644 server/api/episodes.js
 create mode 100644 server/api/info.js
 create mode 100644 server/api/popular.js
 create mode 100644 server/api/stream.js
 create mode 100644 server/api/trending.js

diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..6ba0eb4
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 kenimarru
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
\ No newline at end of file
diff --git a/components/Details.vue b/components/Details.vue
index ae8bce4..7bb5557 100644
--- a/components/Details.vue
+++ b/components/Details.vue
@@ -1,53 +1,53 @@
 <template>
     <section class="space-y-4">
         <section class="space-y-4">
-            <section v-if="information.info.bannerImage" class="flex justify-center items-center">
-                <NuxtImg :src="information.info.bannerImage" :alt="information.info.title.romaji"
-                    :title="information.info.title.romaji" class="w-full h-20 md:h-40 object-cover rounded-sm opacity-75" />
+            <section v-if="info.bannerImage" class="flex justify-center items-center">
+                <NuxtImg :src="info.bannerImage" :alt="info.title.romaji"
+                    :title="info.title.romaji" class="w-full h-20 md:h-40 object-cover rounded-sm opacity-75" />
             </section>
             <section class="flex flex-col">
-                <h2 class="text-secondary text-2xl font-semibold">{{ information.info.title.romaji }}</h2>
-                <p class="text-primary">{{ information.info.title.native }}</p>
+                <h2 class="text-secondary text-2xl font-semibold">{{ info.title.romaji }}</h2>
+                <p class="text-primary">{{ info.title.native }}</p>
             </section>
             <section class="grid grid-cols-[auto,1fr] gap-4">
                 <div class="hidden md:flex flex-col gap-2">
-                    <NuxtImg :src="information.info.coverImage.large" :alt="information.info.title.romaji"
-                        :title="information.info.title.romaji" class="w-full h-72 object-cover rounded-sm" />
-                    <NuxtLink v-if="information.episodes.episodes && information.episodes.episodes.length > 0"
-                        :to="`/e/${id}/${information.episodes.episodes[0].id}`"
+                    <NuxtImg :src="info.coverImage.large" :alt="info.title.romaji"
+                        :title="info.title.romaji" class="w-full h-72 object-cover rounded-sm" />
+                     <NuxtLink v-if="episodes && episodes.length > 0"
+                        :to="`/e/${id}/${episodes[0].id}`"
                         class="text-primary bg-secondary text-center rounded-sm py-1 hover:bg-opacity-75">
                         Watch Now</NuxtLink>
                 </div>
                 <div class="flex flex-col gap-2">
                     <div class="flex items-center gap-1">
-                        <p class="text-primary">{{ information.info.season }}</p>
-                        <p class="text-primary">{{ information.info.year }}</p>
+                        <p class="text-primary">{{ info.season }}</p>
+                        <p class="text-primary">{{ info.seasonYear }}</p>
                     </div>
                     <div class="flex flex-wrap items-center gap-1">
-                        <p class="text-primary bg-secondary rounded-sm px-2">{{ information.info.episodes ?
-                            information.info.episodes : "?" }} Episodes
+                        <p class="text-primary bg-secondary rounded-sm px-2">{{ info.episodes ?
+                            info.episodes : "?" }} Episodes
                         </p>
-                        <p v-if="information.info.score.averageScore" class="text-primary bg-secondary rounded-sm px-2">{{
-                            information.info.score.averageScore }}%</p>
-                        <p class="text-primary bg-secondary rounded-sm px-2">{{ information.info.format }}</p>
-                        <p class="text-primary bg-secondary rounded-sm px-2">{{ information.info.status }}</p>
+                        <p v-if="info.averageScore" class="text-primary bg-secondary rounded-sm px-2">{{
+                            info.averageScore }}%</p>
+                        <p class="text-primary bg-secondary rounded-sm px-2">{{ info.format }}</p>
+                        <p class="text-primary bg-secondary rounded-sm px-2">{{ info.status }}</p>
                     </div>
                     <div class="flex flex-wrap items-center gap-1">
-                        <div v-for="(genre, index) in information.info.genres" :key="index">
+                        <div v-for="(genre, index) in info.genres" :key="index">
                             <p class="text-secondary bg-primary rounded-sm px-2">{{ genre }}</p>
                         </div>
                     </div>
-                    <div v-html="information.info.description" class="text-primary w-full h-48 overflow-y-auto pr-2" />
+                    <div v-html="info.description" class="text-primary w-full h-48 overflow-y-auto pr-2" />
                 </div>
             </section>
             <section class="flex md:hidden justify-center items-center w-full">
-                <NuxtLink v-if="information.episodes.episodes && information.episodes.episodes.length > 0"
-                    :to="`/e/${id}/${information.episodes.episodes[0].id}`"
+                <NuxtLink v-if="episodes && episodes.length > 0"
+                    :to="`/e/${id}/${episodes[0].id}`"
                     class="text-primary bg-secondary w-full text-center rounded-sm py-1 hover:bg-opacity-75">
                     Watch Now</NuxtLink>
             </section>
         </section>
-        <section v-if="information.recommendations.results && information.recommendations.results.length > 0"
+        <!-- <section v-if="information.recommendations.results && information.recommendations.results.length > 0"
             class="space-y-4">
             <section class="flex flex-col">
                 <h2 class="text-secondary text-xl font-semibold">Recommendations</h2>
@@ -65,19 +65,12 @@
                     </div>
                 </NuxtLink>
             </section>
-        </section>
+        </section> -->
     </section>
 </template>
 
 <script setup>
 const { id } = defineProps(["id"]);
-const { data: information } = await useAsyncData("information", async () => {
-    const [info, episodes, recommendations] = await Promise.all([
-        $fetch("https://api.amvstr.me/api/v2/info/" + id),
-        $fetch("https://api.amvstr.me/api/v2/episode/" + id),
-        $fetch("https://api.amvstr.me/api/v2/recommendations/" + id)
-    ]);
-
-    return { info, episodes, recommendations }
-});
+const { data: info } = await useFetch("/api/info?id=" + id);
+const { data: episodes } = await useFetch("/api/episodes?id=" + id);
 </script>
\ No newline at end of file
diff --git a/components/Popular.vue b/components/Popular.vue
index 4b2dbcf..a8ac5d7 100644
--- a/components/Popular.vue
+++ b/components/Popular.vue
@@ -5,13 +5,13 @@
             <p class="text-primary text-sm">Most Popular Anime</p>
         </section>
         <section class="grid grid-cols-2 md:grid-cols-8 gap-2">
-            <NuxtLink :to="`/i/${item.id}`" class="w-full space-y-1" v-for="item in popular">
-                <NuxtImg :src="item.cover" :alt="item.title" :title="item.title"
+            <NuxtLink :to="`/i/${item.id}`" class="w-full space-y-1" v-for="item in data">
+                <NuxtImg :src="item.coverImage.large" :alt="item.title.romaji" :title="item.title.romaji"
                     class="w-full h-44 md:h-56 object-cover rounded-sm hover:scale-95" />
-                <h6 class="text-primary text-sm truncate">{{ item.title }}</h6>
+                <h6 class="text-primary text-sm truncate">{{ item.title.romaji }}</h6>
                 <div class="flex items-center gap-1">
-                    <p class="text-primary bg-secondary text-sm rounded-sm px-1.5">{{ item.type }}</p>
-                    <p class="text-secondary bg-primary text-sm rounded-sm px-1.5">{{ item.year }}</p>
+                    <p class="text-primary bg-secondary text-sm rounded-sm px-1.5">{{ item.format }}</p>
+                    <p class="text-secondary bg-primary text-sm rounded-sm px-1.5">{{ item.seasonYear }}</p>
                 </div>
             </NuxtLink>
         </section>
@@ -19,15 +19,5 @@
 </template>
 
 <script setup>
-const { data: popular } = await useFetch("https://api.amvstr.me/api/v2/popular?limit=8", {
-    transform: (popular) => {
-        return popular.results.map((anime) => ({
-            id: anime.id,
-            title: anime.title.romaji,
-            cover: anime.coverImage.large,
-            type: anime.format,
-            year: anime.seasonYear
-        }));
-    }
-});
+const { data } = await useFetch("/api/popular");
 </script>
\ No newline at end of file
diff --git a/components/Stream.vue b/components/Stream.vue
index 393174d..816f8bc 100644
--- a/components/Stream.vue
+++ b/components/Stream.vue
@@ -1,19 +1,20 @@
 <template>
     <section class="space-y-4">
         <section class="flex flex-col">
-            <h2 class="text-secondary text-2xl font-semibold">{{ information.stream.info.title }}</h2>
-            <p class="text-primary">Episode {{ information.stream.info.episode }}</p>
+            <h2 class="text-secondary text-2xl font-semibold">{{ stream.info.title }}</h2>
+            <p class="text-primary">Episode {{ stream.info.episode }}</p>
         </section>
         <section class="grid grid-cols-1 md:grid-cols-2 gap-2 md:gap-4">
-            <iframe :src="information.stream.plyr.main" frameborder="0" class="w-full h-auto md:h-96 rounded-sm" />
-            <div class="flex flex-col gap-2">
-                <h2 class="text-secondary text-2xl font-semibold">Episodes</h2>
-                <div class="flex flex-col w-full h-80 overflow-y-auto gap-2 pr-2">
-                    <NuxtLink :to="`/e/${id}/${episode.id}`" v-for="episode in information.episodes.episodes" class="bg-sub rounded-sm py-2 px-4">
-                        <h6 class="text-secondary text-lg font-semibold">{{ episode.title }}</h6>
-                        <p class="text-primary">Episode {{ episode.number }}</p>
-                    </NuxtLink>
-                </div>
+            <iframe :src="stream.plyr.default" frameborder="0" class="w-full h-auto md:h-96 rounded-sm" />
+        </section>
+        <section class="space-y-4">
+            <h2 class="text-secondary text-2xl font-semibold">Episodes</h2>
+            <div class="grid grid-cols-1 md:grid-cols-6 w-full overflow-y-auto gap-2 pr-2">
+                <NuxtLink :to="`/e/${id}/${episode.id}`" v-for="episode in episodes" :title="episode.title"
+                    class="bg-sub rounded-sm py-2 px-4">
+                    <h6 class="text-secondary text-base font-semibold">Episode {{ episode.number }}</h6>
+                    <p class="text-primary truncate">{{ episode.title }}</p>
+                </NuxtLink>
             </div>
         </section>
     </section>
@@ -21,12 +22,7 @@
 
 <script setup>
 const { id, episode } = defineProps(["id", "episode"]);
-const { data: information } = await useAsyncData("information", async () => {
-    const [episodes, stream] = await Promise.all([
-        $fetch("https://api.amvstr.me/api/v2/episode/" + id),
-        $fetch("https://api.amvstr.me/api/v2/stream/" + episode)
-    ]);
-
-    return { episodes, stream }
-});
+const { data: stream } = await useFetch("/api/stream?id=" + episode);
+const { data: episodes } = await useFetch("/api/episodes?id=" + id);
+console.log(episodes.value);
 </script>
\ No newline at end of file
diff --git a/components/Trending.vue b/components/Trending.vue
index cada286..19477e0 100644
--- a/components/Trending.vue
+++ b/components/Trending.vue
@@ -5,13 +5,13 @@
             <p class="text-primary text-sm">Currently Trending Anime</p>
         </section>
         <section class="grid grid-cols-2 md:grid-cols-8 gap-2">
-            <NuxtLink :to="`/i/${item.id}`" class="w-full space-y-1" v-for="item in trending">
-                <NuxtImg :src="item.cover" :alt="item.title" :title="item.title"
+            <NuxtLink :to="`/i/${item.id}`" class="w-full space-y-1" v-for="item in data">
+                <NuxtImg :src="item.coverImage.large" :alt="item.title.romaji" :title="item.title.romaji"
                     class="w-full h-44 md:h-56 object-cover rounded-sm hover:scale-95" />
-                <h6 class="text-primary text-sm truncate">{{ item.title }}</h6>
+                <h6 class="text-primary text-sm truncate">{{ item.title.romaji }}</h6>
                 <div class="flex items-center gap-1">
-                    <p class="text-primary bg-secondary text-sm rounded-sm px-1.5">{{ item.type }}</p>
-                    <p class="text-secondary bg-primary text-sm rounded-sm px-1.5">{{ item.year }}</p>
+                    <p class="text-primary bg-secondary text-sm rounded-sm px-1.5">{{ item.format }}</p>
+                    <p class="text-secondary bg-primary text-sm rounded-sm px-1.5">{{ item.seasonYear }}</p>
                 </div>
             </NuxtLink>
         </section>
@@ -19,15 +19,5 @@
 </template>
 
 <script setup>
-const { data: trending } = await useFetch("https://api.amvstr.me/api/v2/trending?limit=8", {
-    transform: (trending) => {
-        return trending.results.map((anime) => ({
-            id: anime.id,
-            title: anime.title.romaji,
-            cover: anime.coverImage.large,
-            type: anime.format,
-            year: anime.seasonYear
-        }));
-    }
-});
+const { data } = await useFetch("/api/trending");
 </script>
\ No newline at end of file
diff --git a/nuxt.config.ts b/nuxt.config.ts
index 3c48ebe..a05f077 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -1,6 +1,6 @@
 export default defineNuxtConfig({
     modules: ["@nuxtjs/tailwindcss", "@nuxt/image", "@nuxtjs/google-fonts", "nuxt-icon"],
-    devtools: { enabled: true },
+    devtools: { enabled: false },
     tailwindcss: { viewer: false },
     googleFonts: {
         families: {
@@ -38,7 +38,7 @@ export default defineNuxtConfig({
                 },
                 {
                     property: "og:image",
-                    content: "/public/apple-touch-icon.png",
+                    content: "/apple-touch-icon.png",
                 },
                 {
                     property: "og:url",
@@ -61,9 +61,12 @@ export default defineNuxtConfig({
                 {
                     rel: "shortcut icon",
                     type: "image/x-icon",
-                    href: "/public/favicon.ico"
+                    href: "/favicon.ico"
                 }
             ]
         }
+    },
+    runtimeConfig: {
+        API: process.env.API_URL
     }
 });
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index b800644..28e84e4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
     "name": "hiruki",
-    "version": "0.2.4",
+    "version": "0.2.5",
     "lockfileVersion": 3,
     "requires": true,
     "packages": {
         "": {
             "name": "hiruki",
-            "version": "0.2.4",
+            "version": "0.2.5",
             "hasInstallScript": true,
             "devDependencies": {
                 "@nuxt/image": "^1.1.0",
diff --git a/package.json b/package.json
index 6380b22..8d15942 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "hiruki",
-    "version": "0.2.4",
+    "version": "0.2.5",
     "private": true,
     "type": "module",
     "scripts": {
@@ -19,5 +19,7 @@
         "sass": "^1.69.7",
         "vue": "^3.4.5",
         "vue-router": "^4.2.5"
-    }
+    },
+    "author": "kenimarru",
+    "license": "MIT"
 }
diff --git a/server/api/episodes.js b/server/api/episodes.js
new file mode 100644
index 0000000..6fe520e
--- /dev/null
+++ b/server/api/episodes.js
@@ -0,0 +1,5 @@
+export default defineEventHandler(async (event) => {
+    const { id } = getQuery(event);
+    const { API } = useRuntimeConfig();
+    return await $fetch(API + "/episodes/" + id);
+});
\ No newline at end of file
diff --git a/server/api/info.js b/server/api/info.js
new file mode 100644
index 0000000..0e39bd5
--- /dev/null
+++ b/server/api/info.js
@@ -0,0 +1,5 @@
+export default defineEventHandler(async (event) => {
+    const { id } = getQuery(event);
+    const { API } = useRuntimeConfig();
+    return await $fetch(API + "/info/" + id);
+});
\ No newline at end of file
diff --git a/server/api/popular.js b/server/api/popular.js
new file mode 100644
index 0000000..53859e9
--- /dev/null
+++ b/server/api/popular.js
@@ -0,0 +1,4 @@
+export default defineEventHandler(async () => {
+    const { API } = useRuntimeConfig();
+    return await $fetch(API + "/popular");
+});
\ No newline at end of file
diff --git a/server/api/stream.js b/server/api/stream.js
new file mode 100644
index 0000000..b9f01ec
--- /dev/null
+++ b/server/api/stream.js
@@ -0,0 +1,5 @@
+export default defineEventHandler(async (event) => {
+    const { id } = getQuery(event);
+    const { API } = useRuntimeConfig();
+    return await $fetch(API + "/stream/" + id);
+});
\ No newline at end of file
diff --git a/server/api/trending.js b/server/api/trending.js
new file mode 100644
index 0000000..8cf0c42
--- /dev/null
+++ b/server/api/trending.js
@@ -0,0 +1,4 @@
+export default defineEventHandler(async () => {
+    const { API } = useRuntimeConfig();
+    return await $fetch(API + "/trending");
+});
\ No newline at end of file
-- 
cgit v1.2.3