made it so we login and grab user watchlist on startup
This commit is contained in:
parent
2f272fe7af
commit
7af14ad7f3
@ -1,13 +1,22 @@
|
||||
<script lang="ts">
|
||||
import {anilistModal, GetAniListSingleItemAndOpenModal, title} from "./GetAniListSingleItemAndOpenModal.svelte";
|
||||
import {GetAniListUserWatchingList, SimklLogin} from "../wailsjs/go/main/App";
|
||||
import {MediaListSort} from "./anilist/types/AniListTypes";
|
||||
import {
|
||||
CheckIfAniListLoggedIn,
|
||||
CheckIfSimklLoggedIn,
|
||||
GetAniListLoggedInUser,
|
||||
GetAniListUserWatchingList,
|
||||
GetSimklLoggedInUser, SimklGetUserWatchlist,
|
||||
} from "../wailsjs/go/main/App";
|
||||
import {type AniListUser, MediaListSort} from "./anilist/types/AniListTypes";
|
||||
import type {AniListCurrentUserWatchList} from "./anilist/types/AniListCurrentUserWatchListType"
|
||||
import Header from "./Header.svelte";
|
||||
import StarRatting from '@ernane/svelte-star-rating'
|
||||
import {Modal} from "flowbite-svelte";
|
||||
import {Button, Modal} from "flowbite-svelte";
|
||||
|
||||
import ChangeDataDialogue from "./ChangeDataDialogue.svelte";
|
||||
import {onMount} from "svelte";
|
||||
import type {SimklUser, SimklWatchList} from "./simkl/types/simklTypes";
|
||||
import {writable} from "svelte/store";
|
||||
|
||||
const config = {
|
||||
readOnly: false,
|
||||
@ -19,7 +28,9 @@
|
||||
},
|
||||
score: 0.0,
|
||||
showScore: true,
|
||||
scoreFormat: function(){ return `(${this.score.toFixed(1)}/${this.countStars})` },
|
||||
scoreFormat: function () {
|
||||
return `(${this.score.toFixed(1)}/${this.countStars})`
|
||||
},
|
||||
name: "",
|
||||
starConfig: {
|
||||
size: 20,
|
||||
@ -31,11 +42,63 @@
|
||||
}
|
||||
|
||||
let aniListLoggedIn = false
|
||||
let aniListPrimary = true
|
||||
let simklUser: SimklUser
|
||||
let simklLoggedIn = false
|
||||
let aniListUser: AniListUser
|
||||
let aniListWatchlist: AniListCurrentUserWatchList
|
||||
export let simklWatchList = writable({} as SimklWatchList)
|
||||
let page = 1
|
||||
let perPage = 20
|
||||
const size = "xl"
|
||||
|
||||
onMount(async () => {
|
||||
await CheckIfAniListLoggedIn().then(result => {
|
||||
if (result) {
|
||||
GetAniListLoggedInUser().then(result => {
|
||||
aniListUser = result
|
||||
if (aniListPrimary) {
|
||||
GetAniListUserWatchingList(page, perPage, MediaListSort.UpdatedTimeDesc).then((result) => {
|
||||
aniListWatchlist = result
|
||||
aniListLoggedIn = true
|
||||
})
|
||||
} else {
|
||||
aniListLoggedIn = result
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
await CheckIfSimklLoggedIn().then(result => {
|
||||
if (result) {
|
||||
GetSimklLoggedInUser().then(result => {
|
||||
simklUser = result
|
||||
SimklGetUserWatchlist().then(result => {
|
||||
simklWatchList.set(result)
|
||||
simklLoggedIn = result
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
function loginToSimkl(): void {
|
||||
GetSimklLoggedInUser().then(result => {
|
||||
simklUser = result
|
||||
simklLoggedIn = true
|
||||
})
|
||||
}
|
||||
|
||||
function loginToAniList(): void {
|
||||
GetAniListLoggedInUser().then(result => {
|
||||
aniListUser = result
|
||||
aniListLoggedIn = true
|
||||
if (aniListPrimary) {
|
||||
GetAniListUserWatchingList(page, perPage, MediaListSort.UpdatedTimeDesc).then(result => aniListWatchlist = result)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function anilistGetUserWatchlist(): void {
|
||||
GetAniListUserWatchingList(page, perPage, MediaListSort.UpdatedTimeDesc).then((result) => {
|
||||
aniListWatchlist = result
|
||||
@ -61,12 +124,16 @@
|
||||
<Header/>
|
||||
|
||||
<main>
|
||||
|
||||
|
||||
<button class="btn" on:click={anilistGetUserWatchlist}>Login to AniList</button>
|
||||
<button class="btn" on:click={SimklLogin}>Login to Simkl</button>
|
||||
{#if aniListLoggedIn}
|
||||
<div>You are logged in {aniListWatchlist.data.Page.mediaList[0].user.name}!</div>
|
||||
<div>You are logged into AniList, {aniListWatchlist.data.Page.mediaList[0].user.name}!</div>
|
||||
{:else}
|
||||
<button class="btn" on:click={loginToAniList}>Login to AniList</button>
|
||||
{/if}
|
||||
|
||||
{#if simklLoggedIn}
|
||||
<div>You are logged into Simkl, {simklUser.user.name}</div>
|
||||
{:else}
|
||||
<Button class="btn" on:click={loginToSimkl}>Login to Simkl</Button>
|
||||
{/if}
|
||||
|
||||
{#if aniListLoggedIn}
|
||||
@ -112,7 +179,7 @@
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 12H4"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<input bind:value={count} class="text-2xl font-bold mx-4" />
|
||||
<input bind:value={count} class="text-2xl font-bold mx-4"/>
|
||||
<button on:click={increment}
|
||||
class="flex justify-center items-center w-10 h-10 rounded-full text-white focus:outline-none bg-indigo-500 hover:bg-indigo-600">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
@ -120,25 +187,25 @@
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<!-- <div class="relative max-w-sm">-->
|
||||
<!-- <div class="absolute inset-y-0 start-0 flex items-center ps-3.5 pointer-events-none">-->
|
||||
<!-- <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">-->
|
||||
<!-- <path d="M20 4a2 2 0 0 0-2-2h-2V1a1 1 0 0 0-2 0v1h-3V1a1 1 0 0 0-2 0v1H6V1a1 1 0 0 0-2 0v1H2a2 2 0 0 0-2 2v2h20V4ZM0 18a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8H0v10Zm5-8h10a1 1 0 0 1 0 2H5a1 1 0 0 1 0-2Z"/>-->
|
||||
<!-- </svg>-->
|
||||
<!-- </div>-->
|
||||
<!-- <input-->
|
||||
<!-- datepicker-->
|
||||
<!-- datepicker-buttons-->
|
||||
<!-- datepicker-autoselect-today-->
|
||||
<!-- datepicker-autohide-->
|
||||
<!-- datepicker-title="Started At"-->
|
||||
<!-- id="startedAt"-->
|
||||
<!-- type="text"-->
|
||||
<!-- class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500-->
|
||||
<!-- focus:border-blue-500 block w-full ps-10 p-2.5 dark:bg-gray-700 dark:border-gray-600-->
|
||||
<!-- dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"-->
|
||||
<!-- placeholder="Select date">-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="relative max-w-sm">-->
|
||||
<!-- <div class="absolute inset-y-0 start-0 flex items-center ps-3.5 pointer-events-none">-->
|
||||
<!-- <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">-->
|
||||
<!-- <path d="M20 4a2 2 0 0 0-2-2h-2V1a1 1 0 0 0-2 0v1h-3V1a1 1 0 0 0-2 0v1H6V1a1 1 0 0 0-2 0v1H2a2 2 0 0 0-2 2v2h20V4ZM0 18a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8H0v10Zm5-8h10a1 1 0 0 1 0 2H5a1 1 0 0 1 0-2Z"/>-->
|
||||
<!-- </svg>-->
|
||||
<!-- </div>-->
|
||||
<!-- <input-->
|
||||
<!-- datepicker-->
|
||||
<!-- datepicker-buttons-->
|
||||
<!-- datepicker-autoselect-today-->
|
||||
<!-- datepicker-autohide-->
|
||||
<!-- datepicker-title="Started At"-->
|
||||
<!-- id="startedAt"-->
|
||||
<!-- type="text"-->
|
||||
<!-- class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500-->
|
||||
<!-- focus:border-blue-500 block w-full ps-10 p-2.5 dark:bg-gray-700 dark:border-gray-600-->
|
||||
<!-- dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"-->
|
||||
<!-- placeholder="Select date">-->
|
||||
<!-- </div>-->
|
||||
<Modal title={$title} bind:open={$anilistModal} {size} autoclose={false}>
|
||||
<ChangeDataDialogue/>
|
||||
</Modal>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user