add store

materialious/src/lib/Api/index.ts

@@ -3,7 +3,8 @@ import {
 	authStore,
 	deArrowInstanceStore,
 	deArrowThumbnailInstanceStore,
-	returnYTDislikesInstanceStore
+	returnYTDislikesInstanceStore,
+	synciousInstanceStore
 } from '../../store';
 import type {
 	Channel,
@@ -18,6 +19,7 @@ import type {
 	ReturnYTDislikes,
 	SearchSuggestion,
 	Subscription,
+	SynciousProgressModel,
 	Video,
 	VideoPlay
 } from './model';
@@ -301,3 +303,56 @@ export async function getThumbnail(videoId: string, time: number): Promise<strin
 	);
 	return URL.createObjectURL(await resp.blob());
 }
+
+export async function getVideoProgress(videoId: string): Promise<SynciousProgressModel[]> {
+	const resp = await fetchErrorHandle(
+		await fetch(
+			`${get(synciousInstanceStore)}/video/${encodeURIComponent(videoId)}`,
+			buildAuthHeaders()
+		)
+	);
+
+	return resp.json();
+}
+
+export async function saveVideoProgress(videoId: string, time: number) {
+	const headers: Record<string, Record<string, string>> = buildAuthHeaders();
+	headers['headers']['Content-type'] = 'application/json';
+
+	await fetchErrorHandle(
+		await fetch(
+			`${get(synciousInstanceStore)}/video/${encodeURIComponent(videoId)}`,
+			{
+				...headers,
+				method: "POST",
+				body: JSON.stringify({
+					time: time
+				})
+			}
+		)
+	);
+}
+
+export async function deleteVideoProgress(videoId: string) {
+	await fetchErrorHandle(
+		await fetch(
+			`${get(synciousInstanceStore)}/video/${videoId}`,
+			{
+				method: "DELETE",
+				...buildAuthHeaders()
+			}
+		)
+	);
+}
+
+export async function deleteAllVideoProgress() {
+	await fetchErrorHandle(
+		await fetch(
+			`${get(synciousInstanceStore)}/videos`,
+			{
+				method: "DELETE",
+				...buildAuthHeaders()
+			}
+		)
+	);
+}

materialious/src/lib/Api/model.ts

@@ -250,3 +250,12 @@ export interface DeArrow {
 	randomTime: number;
 	videoDuration: number;
 }
+
+export interface SynciousProgressModel {
+	time: number;
+	video_id: string;
+}
+
+export interface SynciousSaveProgressModel {
+	time: number;
+}

materialious/src/routes/+layout.svelte

@@ -42,6 +42,8 @@
 		sponsorBlockUrlStore,
 		syncPartyConnectionsStore,
 		syncPartyPeerStore,
+		synciousInstanceStore,
+		synciousStore,
 		themeColorStore
 	} from '../store';
 
@@ -61,6 +63,7 @@
 	let notifications: Notification[] = [];
 
 	let sponsorBlockInstance = get(sponsorBlockUrlStore);
+	let synciousInstance = get(synciousInstanceStore);
 	let returnYTInstance = get(returnYTDislikesInstanceStore);
 	let deArrowUrl = get(deArrowInstanceStore);
 	let deArrowThumbnailUrl = get(deArrowThumbnailInstanceStore);
@@ -604,6 +607,36 @@
 		</nav>
 	</div>
 
+	<div class="settings">
+		<h6>Syncious</h6>
+
+		<form on:submit|preventDefault={() => synciousInstanceStore.set(synciousInstance)}>
+			<nav>
+				<div class="field label border max">
+					<input bind:value={synciousInstance} name="syncious-instance" type="text" />
+					<label for="syncious-instance">{$_('layout.instanceUrl')}</label>
+				</div>
+				<button class="square round">
+					<i>done</i>
+				</button>
+			</nav>
+		</form>
+
+		<nav class="no-padding">
+			<div class="max">
+				<p>{$_('enabled')}</p>
+			</div>
+			<label class="switch">
+				<input
+					bind:checked={$synciousStore}
+					on:click={() => synciousStore.set(!$synciousStore)}
+					type="checkbox"
+				/>
+				<span></span>
+			</label>
+		</nav>
+	</div>
+
 	<div class="settings">
 		<h6>Sponsorblock</h6>
 

materialious/src/store.ts

@@ -3,10 +3,12 @@ import type { DataConnection } from 'peerjs';
 import { persisted } from 'svelte-persisted-store';
 import { writable, type Writable } from 'svelte/store';
 
-export const returnYTDislikesInstanceStore: Writable<string | null | undefined> = persisted(
-	'returnYTDislikesInstance',
-	import.meta.env.VITE_DEFAULT_RETURNYTDISLIKES_INSTANCE
+export const authStore: Writable<null | { username: string; token: string; }> = persisted(
+	'authToken',
+	null
 );
+
+
 export const darkModeStore: Writable<null | boolean> = persisted('darkMode', null);
 export const themeColorStore: Writable<null | string> = persisted('themeColor', null);
 
@@ -22,15 +24,20 @@ export const playerTheatreModeByDefaultStore = persisted('theatreModeByDefault',
 export const playerAutoplayNextByDefaultStore = persisted('autoplayNextByDefault', false);
 
 export const returnYtDislikesStore = persisted('returnYtDislikes', false);
+export const returnYTDislikesInstanceStore: Writable<string | null | undefined> = persisted(
+	'returnYTDislikesInstance',
+	import.meta.env.VITE_DEFAULT_RETURNYTDISLIKES_INSTANCE
+);
+
+export const synciousStore = persisted('syncious', true);
+export const synciousInstanceStore: Writable<string | null | undefined> = persisted(
+	'synciousInstance',
+	import.meta.env.VITE_DEFAULT_SYNCIOUS_INSTANCE
+);
 
 export const interfaceSearchSuggestionsStore = persisted('searchSuggestions', true);
 export const interfacePreviewVideoOnHoverStore = persisted('previewVideoOnHover', true);
 
-export const authStore: Writable<null | { username: string; token: string; }> = persisted(
-	'authToken',
-	null
-);
-
 export const sponsorBlockStore = persisted('sponsorBlock', true);
 export const sponsorBlockUrlStore: Writable<string | null | undefined> = persisted(
 	'sponsorBlockUrl',