john-okeefe/anitrack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed search dialog opening anime

Browse Source
This commit is contained in:
John O'Keefe 2024-09-04 12:26:26 -04:00
parent 5a34c89cd5
commit aeec8f79b2
2 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
frontend/src/App.svelte
View File

@ -34,7 +34,6 @@
import Home from "./routes/Home.svelte";
import {wrap} from "svelte-spa-router/wrap";
import Spinner from "./helperComponents/Spinner.svelte";
import Anime from "./routes/Anime.svelte";
import Header from "./helperComponents/Header.svelte";
@ -111,7 +110,7 @@
<Router routes={{
'/': Home,
'/anime/:id': wrap({
component: Anime,
asyncComponent: () => import('./routes/Anime.svelte'),
conditions: [
async (detail) => {
await GetAniListSingleItem(Number(detail.params.id), true)

25
frontend/src/helperComponents/Search.svelte
View File

@ -2,7 +2,7 @@
import {AniListSearch} from "../../wailsjs/go/main/App";
import type {AniSearchList} from "../anilist/types/AniListTypes";
import {GetAniListSingleItem, loading} from "./GlobalVariablesAndHelperFunctions.svelte";
import {push} from "svelte-spa-router";
let aniSearch = ""
let aniListSearch: AniSearchList
@ -30,7 +30,14 @@
<div class="relative w-full">
<input type="search" id="anime-search" bind:value={aniSearch}
class="rounded-s-lg block p-2.5 w-full z-20 text-sm text-gray-900 bg-gray-50 rounded-e-lg border-s-gray-50 border-s-2 border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-s-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:border-blue-500"
placeholder="Search for Anime" required/>
placeholder="Search for Anime"
on:keypress={(e) => {
if (e.key === "Enter") {
searchDropdown()
if(aniSearch.length > 0) runAniListSearch()
}
}}
required/>
<button id="aniListSearchButton"
class="absolute top-0 end-0 h-full p-2.5 text-sm font-medium text-white bg-blue-700 rounded-e-lg border border-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
on:click={() => {
@ -55,22 +62,16 @@
<li class="w-full">
<div class="flex w-full items-start p-1 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white rounded-lg">
<button on:click={() => {
loading.set(true)
GetAniListSingleItem(media.id, false).then(() => {
loading.set(false)
searchDropdown()
})
searchDropdown()
push(`#/anime/${media.id}`)
}}
>
<img class="rounded-bl-lg rounded-tl-lg max-w-24 max-h-24" src={media.coverImage.large}
alt="{media.title.english === '' || media.title.english === null ? media.title.romaji : media.title.english} Cover">
</button>
<button class="rounded-bl-lg rounded-tl-lg w-full h-24" on:click={() => {
loading.set(true)
GetAniListSingleItem(media.id, false).then(() => {
loading.set(false)
searchDropdown()
})
searchDropdown()
push(`#/anime/${media.id}`)
}} >{media.title.english === '' || media.title.english === null ? media.title.romaji : media.title.english }</button>
</div>
</li>