@phosart/common 0.4.22

package/src/lib/util/phosart_config.svelte.ts

@@ -0,0 +1,101 @@
+import type Gallery from '../Gallery.svelte';
+import type FullGallery from '../FullGallery.svelte';
+import { createContext, type ComponentProps } from 'svelte';
+import type { ArtPiece, NormalizedArtist, NormalizedCharacter } from './art.ts';
+
+const [get, set] = createContext<LibraryConfig | undefined>();
+
+export type ChipAction<T> =
+	| {
+			onclick: (data: T) => void;
+			makeHref?: never;
+	  }
+	| {
+			makeHref: (data: T) => string;
+			onclick?: never;
+	  };
+
+type ChipOptionBase<T> =
+	| { action?: ChipAction<T> | null; hidden?: never }
+	| { hidden?: true; action?: never };
+
+type ChipOptionTypes = {
+	tag: string;
+	artist: NormalizedArtist;
+	character: NormalizedCharacter;
+	permalink: ArtPiece;
+};
+
+export type ChipOptions<T> = ChipOptionBase<T>;
+export type DataType<Type extends keyof ChipOptionTypes> = ChipOptionTypes[Type];
+
+export type ChipOptionsByType = {
+	[K in keyof ChipOptionTypes]?: ChipOptions<DataType<K>>;
+};
+
+export interface LibraryConfig {
+	siteName: string;
+	gallery?: {
+		DefaultCardComponent?: NonNullable<ComponentProps<typeof FullGallery>['CardComponent']> | null;
+		DefaultPieceComponent?: NonNullable<ComponentProps<typeof Gallery>['PieceComponent']> | null;
+	};
+	modal?: { chipOptionsByType?: ChipOptionsByType | null };
+}
+
+const DEFAULT_CONFIG: LibraryConfig = {
+	siteName: '',
+	gallery: {
+		DefaultCardComponent: undefined, // TODO
+		DefaultPieceComponent: undefined // TODO
+	},
+	modal: {
+		chipOptionsByType: {
+			artist: {
+				action: { makeHref: (artist) => `/artist/${artist.name}` }
+			},
+			tag: { action: { makeHref: (tag) => `/tag/${tag}` } },
+			character: { action: { makeHref: (ch) => `/characters/${ch.name}` } },
+			permalink: { action: { makeHref: (pl) => `/piece/${pl.slug}` } }
+		}
+	}
+};
+
+function spread(cfg: LibraryConfig): LibraryConfig {
+	const modalBase = DEFAULT_CONFIG.modal;
+	let gallery = DEFAULT_CONFIG.gallery;
+	let modal = modalBase;
+	let chipOptionsByType = modalBase?.chipOptionsByType;
+
+	if (cfg.gallery) {
+		gallery = { ...DEFAULT_CONFIG.gallery, ...cfg.gallery };
+	}
+	if (cfg.modal) {
+		if (cfg.modal.chipOptionsByType) {
+			chipOptionsByType = { ...modalBase?.chipOptionsByType, ...cfg.modal.chipOptionsByType };
+		}
+		modal = { ...modalBase, ...cfg.modal, chipOptionsByType };
+	}
+
+	return { ...cfg, gallery, modal };
+}
+
+export function useChipConfig<Type extends keyof ChipOptionsByType>(
+	type: Type
+): ChipOptions<DataType<Type>> | null {
+	const config = useLibraryConfig();
+	if (!config.modal) {
+		return null;
+	}
+	return config.modal.chipOptionsByType?.[type] ?? null;
+}
+
+export function setLibraryConfig(config: LibraryConfig) {
+	set(spread(config));
+	$effect(() => {
+		set(spread(config));
+	});
+}
+
+export function useLibraryConfig(): LibraryConfig {
+	return get() ?? DEFAULT_CONFIG;
+}

package/src/lib/util/search.ts

@@ -0,0 +1,28 @@
+import fz from 'fuzzysort';
+import { normalizeArtist, normalizeCharacter, type ArtPiece } from './art.ts';
+import { asRecord } from './util.ts';
+
+export function executeSearch(query: string, pieces: ArtPiece[]): ArtPiece[] {
+	const allPieces = asRecord(pieces, (p) => p.slug);
+
+	const searchObj = Object.values(allPieces).map((p) => ({
+		name: p.name,
+		description: p.description,
+		alt: p.alt,
+		tags: p.tags.join(', '),
+		characters: p.characters
+			.map((ch) => normalizeCharacter(ch))
+			.map((ch) => `${ch.name} ${ch.from}`),
+		artists: normalizeArtist(p.artist)
+			.map((a) => a.name)
+			.join(', '),
+		slug: p.slug
+	}));
+
+	const results = fz.go(query, searchObj, {
+		keys: ['name', 'characters', 'artists', 'tags', 'alt', 'description'],
+		threshold: 0.3
+	});
+
+	return results.map((res) => allPieces[res.obj.slug]);
+}

package/src/lib/util/smoothscroll.ts

@@ -0,0 +1,21 @@
+export const smoothScroll = (anchor: HTMLAnchorElement) => {
+	const cb = (e: Event) => {
+		e.preventDefault();
+		const href = anchor.getAttribute('href');
+		if (!href || !href.startsWith('#')) return;
+		const target = document.getElementById(href.replace(/^#/g, ''));
+		if (!target) return;
+
+		window.scrollTo({
+			top: target.offsetTop,
+			behavior: 'smooth'
+		});
+	};
+
+	anchor.addEventListener('click', cb);
+	return {
+		destroy() {
+			anchor.removeEventListener('click', cb);
+		}
+	};
+};

package/src/lib/util/tree.ts

@@ -0,0 +1,75 @@
+import type { GalleryCache } from '../server/gallery.ts';
+import type { ArtPiece, Gallery } from './art.ts';
+
+export type FolderElement = { $type: 'folder'; data: GalleryTree; items: number };
+export type GalleryElement = { $type: 'gallery'; data: Gallery; fullpath: string };
+export type TreeElement = FolderElement | GalleryElement;
+
+export type GalleryTree = {
+	[element: string]: TreeElement;
+};
+
+export function asTree(
+	cache: GalleryCache,
+	transformPieces?: (pieces: Array<ArtPiece>) => Array<ArtPiece>
+): FolderElement {
+	const paths: [string, Gallery][] = Object.entries(cache);
+	const tree: TreeElement = { $type: 'folder', data: {}, items: 0 };
+	for (const [path, gallery] of paths) {
+		let cur = tree;
+		tree.items += gallery.pieces.length;
+		const segments = path.split('/');
+		const dir = segments.slice(0, -1);
+		for (const segment of dir) {
+			let next = cur.data[segment];
+			if (!next) {
+				cur.data[segment] = { $type: 'folder', data: {}, items: 0 };
+				next = cur.data[segment];
+			}
+			if (next.$type !== 'folder') {
+				throw new Error('Somehow found gallery + folder with same name??');
+			}
+			next.items += gallery.pieces.length;
+			cur = next;
+		}
+		cur.data[segments.at(-1)!] = {
+			$type: 'gallery',
+			data: {
+				pieces: transformPieces?.(gallery.pieces) ?? gallery.pieces
+			},
+			fullpath: path
+		};
+	}
+
+	return tree;
+}
+
+export function pathView(tree: FolderElement, path: string[]): GalleryTree {
+	let cur: TreeElement = tree;
+	// Go to path
+	for (let i = 0; i < path.length; i++) {
+		const el = path[i];
+		const next: TreeElement = cur.data[el];
+		if (!next) {
+			return {};
+		}
+		if (next.$type !== 'folder') {
+			return {};
+		}
+		cur = next;
+	}
+
+	cur = { ...cur, data: { ...cur.data } };
+
+	// Prune deeper levels
+	for (const [k, el] of Object.entries(cur.data)) {
+		if (el.$type === 'folder') {
+			if (el.items === 0) {
+				delete cur.data[k];
+			} else {
+				cur.data[k] = { $type: 'folder', data: {}, items: el.items };
+			}
+		}
+	}
+	return cur.data;
+}

package/src/lib/util/util.ts

@@ -0,0 +1,37 @@
+function defaultCombine<T>(a: T): T {
+	return a;
+}
+
+export function asRecord<T>(
+	arr: T[],
+	key: (el: T) => string,
+	combine?: (a: T, b: T) => T
+): Record<string, T> {
+	const record: Record<string, T> = {};
+	for (const val of arr) {
+		const k = key(val);
+		if (k in record) {
+			record[k] = (combine ?? defaultCombine)(record[k], val);
+		} else {
+			record[k] = val;
+		}
+	}
+
+	return record;
+}
+
+export function multiRecordBy<T>(arr: T[], key: (el: T) => string): Record<string, T[]> {
+	return asRecord(
+		arr.map((v) => [v]),
+		(arr) => key(arr[0]),
+		(a1, a2) => [...a1, ...a2]
+	);
+}
+
+export function deduplicateBy<T>(
+	arr: T[],
+	key: (el: T) => string,
+	combine?: (a: T, b: T) => T
+): T[] {
+	return Object.values(asRecord(arr, key, combine));
+}