aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Settings
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib/Settings')
-rw-r--r--src/lib/Settings/Categories/Attributions.svelte2
-rw-r--r--src/lib/Settings/Categories/Cache.svelte6
-rw-r--r--src/lib/Settings/Categories/Calculation.svelte2
-rw-r--r--src/lib/Settings/Categories/Debug.svelte10
-rw-r--r--src/lib/Settings/Categories/Display.svelte24
-rw-r--r--src/lib/Settings/Categories/RSSFeeds.svelte10
-rw-r--r--src/lib/Settings/Categories/SettingSync.svelte12
-rw-r--r--src/lib/Settings/Category.svelte23
-rw-r--r--src/lib/Settings/SettingCheckboxToggle.svelte56
-rw-r--r--src/lib/Settings/SettingHint.svelte9
-rw-r--r--src/lib/Settings/SettingToggle.svelte30
11 files changed, 118 insertions, 66 deletions
diff --git a/src/lib/Settings/Categories/Attributions.svelte b/src/lib/Settings/Categories/Attributions.svelte
index 250b08c3..28f69a74 100644
--- a/src/lib/Settings/Categories/Attributions.svelte
+++ b/src/lib/Settings/Categories/Attributions.svelte
@@ -34,7 +34,7 @@
</li> -->
</ul>
-<p />
+<p></p>
<details open class="card-clear">
<summary>Outbound Link Disclaimer</summary>
diff --git a/src/lib/Settings/Categories/Cache.svelte b/src/lib/Settings/Categories/Cache.svelte
index e65b8081..df0165d5 100644
--- a/src/lib/Settings/Categories/Cache.svelte
+++ b/src/lib/Settings/Categories/Cache.svelte
@@ -11,7 +11,7 @@
<a href="https://due.moe">due.moe</a>'s site data will clear these caches too.
</small>
-<p />
+<p></p>
Re-cache AniList media lists every
<input
@@ -22,7 +22,7 @@ Re-cache AniList media lists every
max="60"
placeholder="30"
size="1"
- on:change={() =>
+ onchange={() =>
($settings.cacheMinutes < 1 && ($settings.cacheMinutes = 1)) ||
($settings.cacheMinutes > 60 && ($settings.cacheMinutes = 60))}
/>
@@ -39,7 +39,7 @@ Re-cache manga data every
max="1440"
placeholder="120"
size="2"
- on:change={() =>
+ onchange={() =>
($settings.cacheMangaMinutes < 5 && ($settings.cacheMangaMinutes = 5)) ||
($settings.cacheMangaMinutes > 1440 && ($settings.cacheMangaMinutes = 1440))}
/>
diff --git a/src/lib/Settings/Categories/Calculation.svelte b/src/lib/Settings/Categories/Calculation.svelte
index 4a202fff..1f6eeaa1 100644
--- a/src/lib/Settings/Categories/Calculation.svelte
+++ b/src/lib/Settings/Categories/Calculation.svelte
@@ -75,7 +75,7 @@
{#if !$settings.calculateGuessingDisabled}
<br />
- <select bind:value={$settings.calculateGuessMethod} on:change={pruneAllManga}>
+ <select bind:value={$settings.calculateGuessMethod} onchange={pruneAllManga}>
<option value="mode">Mode (fast, moderate to low accuracy)</option>
<option value="median">Median (moderate speed, high accuracy, recommended)</option>
<option value="iqr_median">Interquartile Range with Median (slower, high accuracy)</option>
diff --git a/src/lib/Settings/Categories/Debug.svelte b/src/lib/Settings/Categories/Debug.svelte
index 79e18c03..00c5852e 100644
--- a/src/lib/Settings/Categories/Debug.svelte
+++ b/src/lib/Settings/Categories/Debug.svelte
@@ -12,7 +12,7 @@
<SettingCheckboxToggle setting="debugDummyLists" text={$locale().debug.dummyLists} />
<button
- on:click={() => {
+ onclick={() => {
localStorage.removeItem('anime');
localStorage.removeItem('manga');
addNotification(
@@ -23,10 +23,10 @@
}}>{$locale().debug.clearCaches}</button
>
-<p />
+<p></p>
<button
- on:click={() => {
+ onclick={() => {
settings.reset();
addNotification(
options({
@@ -41,10 +41,10 @@
{$locale().debug.resetAllSettings.hint}
</SettingHint>
-<p />
+<p></p>
<button
- on:click={() => {
+ onclick={() => {
localStorage.clear();
addNotification(
options({
diff --git a/src/lib/Settings/Categories/Display.svelte b/src/lib/Settings/Categories/Display.svelte
index 3b572b7b..a83157fb 100644
--- a/src/lib/Settings/Categories/Display.svelte
+++ b/src/lib/Settings/Categories/Display.svelte
@@ -85,7 +85,7 @@
<SettingHint lineBreak>
Media where either the next episode's release date is unknown or the chapter count could not be
resolved is considered unresolved.
- <p />
+ <p></p>
<span>
Additionally, you hard exclude specific media from <a href={root('/')}>due.moe</a> on AniList.
To exclude any media from being included in <b>any</b> <a href={root('/')}>due.moe</a>
@@ -107,7 +107,7 @@
</span>
</SettingHint>
-<p />
+<p></p>
<b>{$locale().settings.display.categories.hidePanels}</b><br />
<SettingCheckboxToggle
@@ -160,7 +160,7 @@
}}
/>
-<p />
+<p></p>
<b>{$locale().settings.display.categories.collapsePanelsByDefault}</b><br />
<SettingCheckboxToggle
@@ -175,7 +175,7 @@
/>
<SettingCheckboxToggle setting="displayMangaCollapsed" text={$locale().settings.media.manga} />
-<p />
+<p></p>
<b>{$locale().settings.display.categories.motionAndAccessibility.title}</b><br />
<SettingCheckboxToggle
@@ -215,7 +215,7 @@
</button>
{/if}
-<p />
+<p></p>
<SettingCheckboxToggle
setting="displayAniListNotifications"
@@ -242,7 +242,7 @@
</SettingHint>
</SettingCheckboxToggle>
-<p />
+<p></p>
<b>{$locale().settings.display.categories.dateAndTime.title}</b><br />
<SettingCheckboxToggle
@@ -262,7 +262,7 @@
text={$locale().settings.display.categories.dateAndTime.fields.abbreviateCountdown}
/>
-<p />
+<p></p>
<SettingCheckboxToggle
setting="displayDisableLastActivityWarning"
@@ -277,7 +277,7 @@
</SettingHint>
</SettingCheckboxToggle>
-<p />
+<p></p>
<b>Show lists with media covers instead of text</b><br />
<SettingCheckboxToggle setting="displayCoverModeAnime" text="Anime" lineBreak={false} />
@@ -297,7 +297,7 @@
min="50"
placeholder="116.609"
size="3"
- on:change={() => {
+ onchange={() => {
if ($settings.displayCoverWidth === null) {
$settings.displayCoverWidth = 116.609;
@@ -313,7 +313,7 @@
<br />
{/if}
-<p />
+<p></p>
<b>{$locale().settings.display.categories.media.title}</b><br />
<SettingCheckboxToggle
@@ -357,7 +357,7 @@
<br />
{/if}
-<p />
+<p></p>
<select bind:value={$settings.displayOutboundLinksTo}>
<option value="anilist">AniList</option>
@@ -390,7 +390,7 @@
<br />
-<select bind:value={$settings.displayAoButa} on:change={onHelperChange}>
+<select bind:value={$settings.displayAoButa} onchange={onHelperChange}>
<option value="mai">{$locale().settings.display.categories.helper.options.mai}</option>
<option value="mai_2">{$locale().settings.display.categories.helper.options.mai} #2</option>
<option value="nodoka">{$locale().settings.display.categories.helper.options.nodoka}</option>
diff --git a/src/lib/Settings/Categories/RSSFeeds.svelte b/src/lib/Settings/Categories/RSSFeeds.svelte
index a225b137..9ced917b 100644
--- a/src/lib/Settings/Categories/RSSFeeds.svelte
+++ b/src/lib/Settings/Categories/RSSFeeds.svelte
@@ -6,13 +6,17 @@
import SettingHint from '../SettingHint.svelte';
import tooltip from '$lib/Tooltip/tooltip';
- export let user: any;
+ interface Props {
+ user: any;
+ }
+
+ let { user }: Props = $props();
const { addNotification } = getNotificationsContext();
</script>
<button
- on:click={() => {
+ onclick={() => {
addNotification(
options({
heading: 'RSS feed URL copied to clipboard'
@@ -31,7 +35,7 @@ Your AniList notifications RSS feed URL
<SettingHint lineBreak>
This <a
href={'#'}
- on:click={(e) => e.preventDefault()}
+ onclick={(e) => e.preventDefault()}
target="_blank"
title={$locale().settings.rssFeeds.tooltips.rss}
use:tooltip
diff --git a/src/lib/Settings/Categories/SettingSync.svelte b/src/lib/Settings/Categories/SettingSync.svelte
index 39e62954..24a35c79 100644
--- a/src/lib/Settings/Categories/SettingSync.svelte
+++ b/src/lib/Settings/Categories/SettingSync.svelte
@@ -13,7 +13,7 @@
{#if !$settings.settingsSync}
<button
- on:click={() => {
+ onclick={() => {
$settings.settingsSync = true;
fetch(root(`/api/configuration?id=${$identity.id}`)).then((response) => {
@@ -50,9 +50,9 @@
<SettingHint lineBreak>
{$locale().settings.settingsSync.buttons.pull.hint}
</SettingHint>
- <p />
+ <p></p>
<button
- on:click={() => {
+ onclick={() => {
$settings.settingsSync = true;
fetch(root(`/api/configuration`), {
@@ -76,7 +76,7 @@
</SettingHint>
{:else}
<button
- on:click={() => {
+ onclick={() => {
$settings.settingsSync = false;
addNotification(
@@ -89,7 +89,7 @@
{$locale().settings.settingsSync.buttons.disable}
</button>
<button
- on:click={() => {
+ onclick={() => {
fetch(root(`/api/configuration?id=${$identity.id}`), {
method: 'DELETE'
}).then((response) => {
@@ -108,7 +108,7 @@
{$locale().settings.settingsSync.buttons.delete}
</button>
- <p />
+ <p></p>
<b>Last Push</b>: {$locale().dateFormatter($settingsSyncTimes.lastPush)}
<br />
diff --git a/src/lib/Settings/Category.svelte b/src/lib/Settings/Category.svelte
index a5b3e211..aef86d77 100644
--- a/src/lib/Settings/Category.svelte
+++ b/src/lib/Settings/Category.svelte
@@ -1,8 +1,19 @@
<script lang="ts">
- export let title = '';
- export let id = title.toLowerCase();
- export let open = true;
- export let newLine = true;
+ interface Props {
+ title?: string;
+ id?: any;
+ open?: boolean;
+ newLine?: boolean;
+ children?: import('svelte').Snippet;
+ }
+
+ let {
+ title = '',
+ id = title.toLowerCase(),
+ open = true,
+ newLine = true,
+ children
+ }: Props = $props();
</script>
<details {open} {id}>
@@ -10,9 +21,9 @@
<summary>{title}</summary>
{/if}
- <slot />
+ {@render children?.()}
</details>
{#if newLine}
- <p />
+ <p></p>
{/if}
diff --git a/src/lib/Settings/SettingCheckboxToggle.svelte b/src/lib/Settings/SettingCheckboxToggle.svelte
index 6a16edec..85dbfcdc 100644
--- a/src/lib/Settings/SettingCheckboxToggle.svelte
+++ b/src/lib/Settings/SettingCheckboxToggle.svelte
@@ -1,4 +1,6 @@
<script lang="ts">
+ import { run } from 'svelte/legacy';
+
import settings, { type Settings } from '$stores/settings';
type BooleanSettingsKeys<T> = {
@@ -6,19 +8,37 @@
};
type SettingsBooleanKeys = BooleanSettingsKeys<Settings>;
- export let sectionBreak = false;
- export let disabled = false;
- export let text: string | (() => string);
- export let setting: SettingsBooleanKeys[keyof SettingsBooleanKeys];
- export let lineBreak = true;
- export let onChange: () => void = () => {
- return;
- };
- export let invert = false;
- export let id: string | null = null;
-
- $: checked = setting ? (invert ? !$settings[setting] : $settings[setting]) : false;
- $: field = text instanceof Function ? text() : text;
+ interface Props {
+ sectionBreak?: boolean;
+ disabled?: boolean;
+ text: string | (() => string);
+ setting: SettingsBooleanKeys[keyof SettingsBooleanKeys];
+ lineBreak?: boolean;
+ onChange?: () => void;
+ invert?: boolean;
+ id?: string | null;
+ children?: import('svelte').Snippet;
+ }
+
+ let {
+ sectionBreak = false,
+ disabled = false,
+ text,
+ setting,
+ lineBreak = true,
+ onChange = () => {
+ return;
+ },
+ invert = false,
+ id = null,
+ children
+ }: Props = $props();
+
+ let checked = $state(false);
+ run(() => {
+ checked = setting ? (invert ? !$settings[setting] : $settings[setting]) : false;
+ });
+ let field = $derived(text instanceof Function ? text() : text);
// const toggler = (key: keyof Settings) => [
// () =>
@@ -53,11 +73,11 @@
};
</script>
-<input type="checkbox" on:change={check} bind:checked {id} />
+<input type="checkbox" onchange={check} bind:checked {id} />
<span
- on:click={flip}
- on:keydown={() => {
+ onclick={flip}
+ onkeydown={() => {
return;
}}
role="button"
@@ -72,12 +92,12 @@
{/if}
</span>
-<slot />
+{@render children?.()}
{#if lineBreak}
<br />
{/if}
{#if sectionBreak}
- <p />
+ <p></p>
{/if}
diff --git a/src/lib/Settings/SettingHint.svelte b/src/lib/Settings/SettingHint.svelte
index f82f061c..c5a9072f 100644
--- a/src/lib/Settings/SettingHint.svelte
+++ b/src/lib/Settings/SettingHint.svelte
@@ -1,5 +1,10 @@
<script lang="ts">
- export let lineBreak = false;
+ interface Props {
+ lineBreak?: boolean;
+ children?: import('svelte').Snippet;
+ }
+
+ let { lineBreak = false, children }: Props = $props();
</script>
{#if lineBreak}
@@ -7,5 +12,5 @@
{/if}
<small style="opacity: 80%;">
- <slot />
+ {@render children?.()}
</small>
diff --git a/src/lib/Settings/SettingToggle.svelte b/src/lib/Settings/SettingToggle.svelte
index 0d177b50..0d3b893a 100644
--- a/src/lib/Settings/SettingToggle.svelte
+++ b/src/lib/Settings/SettingToggle.svelte
@@ -1,16 +1,28 @@
<script lang="ts">
import settings, { type Settings } from '$stores/settings';
- export let setting: keyof Settings;
- export let on = '';
- export let off = '';
- export let sectionBreak = false;
- export let disabled = false;
+ interface Props {
+ setting: keyof Settings;
+ on?: string;
+ off?: string;
+ sectionBreak?: boolean;
+ disabled?: boolean;
+ children?: import('svelte').Snippet;
+ }
+
+ let {
+ setting,
+ on = '',
+ off = '',
+ sectionBreak = false,
+ disabled = false,
+ children
+ }: Props = $props();
</script>
<a
href={'#'}
- on:click={() =>
+ onclick={() =>
disabled
? {}
: $settings[setting]
@@ -20,16 +32,16 @@
{#if disabled}
<strike>
{$settings[setting] ? on : off}
- <slot />
+ {@render children?.()}
</strike>
{:else}
{$settings[setting] ? on : off}
- <slot />
+ {@render children?.()}
{/if}
</a>
<br />
{#if sectionBreak}
- <p />
+ <p></p>
{/if}
generated by cgit v1.2.3 (git 2.25.1) at 2026-03-11 13:03:01 +0000