blob: 3cf7b09e8e637681b583d8a779f89bd875485b54 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
|
<script lang="ts">
import Spacer from "$lib/Layout/Spacer.svelte";
import {
activityHistory,
fillMissingDays,
type ActivityHistoryEntry,
} from "$lib/Data/AniList/activity";
import { onMount } from "svelte";
import userIdentity from "$stores/identity";
import type { AniListAuthorisation } from "$lib/Data/AniList/identity";
import { clearAllParameters } from "../../Utility/parameters";
import { domToBlob } from "modern-screenshot";
import ActivityHistoryGrid from "./Grid.svelte";
import SettingHint from "$lib/Settings/SettingHint.svelte";
import Skeleton from "$lib/Loading/Skeleton.svelte";
import LogInRestricted from "$lib/Error/LogInRestricted.svelte";
export let user: AniListAuthorisation;
let activityHistoryData: Promise<ActivityHistoryEntry[]>;
let generated = false;
onMount(async () => {
clearAllParameters();
if (user !== undefined) activityHistoryData = activityHistory($userIdentity);
});
// const incrementDate = (date: Date): Date => {
// date.setDate(date.getDate() + 1);
// return date;
// };
const screenshot = async () => {
let element = document.querySelector(".grid") as HTMLElement;
if (element !== null) {
domToBlob(element, {
quality: 1,
scale: 2,
}).then((blob) => {
const downloadWrapper = document.createElement("a");
const image = document.createElement("img");
const object = (
window.URL ||
window.webkitURL ||
window ||
{}
).createObjectURL(blob);
downloadWrapper.href = object;
downloadWrapper.target = "_blank";
image.src = object;
downloadWrapper.appendChild(image);
const gridFinal = document.getElementById("grid-final");
if (gridFinal !== null) {
gridFinal.innerHTML = "";
gridFinal.appendChild(downloadWrapper);
generated = true;
}
downloadWrapper.click();
});
}
};
</script>
{#if user === undefined}
<LogInRestricted />
{:else}
{#await activityHistoryData}
<Skeleton card={false} count={5} height="0.9rem" list />
{:then activities}
{#if activities === undefined}
<Skeleton card={false} count={5} height="0.9rem" list />
{:else}
{@const filledActivities = fillMissingDays(activities)}
<div class="card">
<ActivityHistoryGrid {user} />
<Spacer />
<div id="grid-final"></div>
{#if generated}
<Spacer />
{/if}
<button onclick={screenshot}>Generate grid image</button>
</div>
<Spacer />
<details open>
<summary>Days in risk of developing an activity history hole</summary>
<SettingHint>
Days in which you did not log any activity or only have one activity logged.
</SettingHint>
<ul>
{#each filledActivities as activity}
{#if activity.amount === 0}
<li>
{new Date(
activity.date * 1000 + new Date().getTimezoneOffset() * 60 * 1000
).toDateString()}
</li>
{/if}
{/each}
</ul>
</details>
{/if}
{/await}
{/if}
|