2025-05-17 22:57:08 -04:00
|
|
|
import type { TimelineAsset } from '$lib/stores/assets-store.svelte';
|
2024-12-14 19:30:33 +01:00
|
|
|
import { user } from '$lib/stores/user.store';
|
2025-05-19 17:40:48 -04:00
|
|
|
import { AssetVisibility, type UserAdminResponseDto } from '@immich/sdk';
|
2024-12-14 19:30:33 +01:00
|
|
|
import { SvelteSet } from 'svelte/reactivity';
|
|
|
|
|
import { fromStore } from 'svelte/store';
|
|
|
|
|
|
|
|
|
|
export class AssetInteraction {
|
2025-05-17 22:57:08 -04:00
|
|
|
selectedAssets = $state<TimelineAsset[]>([]);
|
2025-03-18 10:14:46 -04:00
|
|
|
hasSelectedAsset(assetId: string) {
|
2025-03-19 11:55:50 -04:00
|
|
|
return this.selectedAssets.some((asset) => asset.id === assetId);
|
2025-03-18 10:14:46 -04:00
|
|
|
}
|
2025-03-19 11:55:50 -04:00
|
|
|
selectedGroup = new SvelteSet<string>();
|
2025-05-17 22:57:08 -04:00
|
|
|
assetSelectionCandidates = $state<TimelineAsset[]>([]);
|
2025-03-18 10:14:46 -04:00
|
|
|
hasSelectionCandidate(assetId: string) {
|
2025-03-19 11:55:50 -04:00
|
|
|
return this.assetSelectionCandidates.some((asset) => asset.id === assetId);
|
2025-03-18 10:14:46 -04:00
|
|
|
}
|
2025-05-17 22:57:08 -04:00
|
|
|
assetSelectionStart = $state<TimelineAsset | null>(null);
|
2025-03-19 11:55:50 -04:00
|
|
|
selectionActive = $derived(this.selectedAssets.length > 0);
|
2024-12-14 19:30:33 +01:00
|
|
|
|
|
|
|
|
private user = fromStore<UserAdminResponseDto | undefined>(user);
|
|
|
|
|
private userId = $derived(this.user.current?.id);
|
|
|
|
|
|
2025-03-19 11:55:50 -04:00
|
|
|
isAllTrashed = $derived(this.selectedAssets.every((asset) => asset.isTrashed));
|
2025-05-19 17:40:48 -04:00
|
|
|
isAllArchived = $derived(this.selectedAssets.every((asset) => asset.visibility === AssetVisibility.Archive));
|
2025-03-19 11:55:50 -04:00
|
|
|
isAllFavorite = $derived(this.selectedAssets.every((asset) => asset.isFavorite));
|
|
|
|
|
isAllUserOwned = $derived(this.selectedAssets.every((asset) => asset.ownerId === this.userId));
|
2024-12-14 19:30:33 +01:00
|
|
|
|
2025-05-17 22:57:08 -04:00
|
|
|
selectAsset(asset: TimelineAsset) {
|
2025-03-19 11:55:50 -04:00
|
|
|
if (!this.hasSelectedAsset(asset.id)) {
|
|
|
|
|
this.selectedAssets.push(asset);
|
|
|
|
|
}
|
2024-12-14 19:30:33 +01:00
|
|
|
}
|
|
|
|
|
|
2025-05-17 22:57:08 -04:00
|
|
|
selectAssets(assets: TimelineAsset[]) {
|
2024-12-14 19:30:33 +01:00
|
|
|
for (const asset of assets) {
|
2025-03-19 11:55:50 -04:00
|
|
|
this.selectAsset(asset);
|
2024-12-14 19:30:33 +01:00
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2025-03-19 11:55:50 -04:00
|
|
|
removeAssetFromMultiselectGroup(assetId: string) {
|
|
|
|
|
const index = this.selectedAssets.findIndex((a) => a.id == assetId);
|
|
|
|
|
if (index !== -1) {
|
|
|
|
|
this.selectedAssets.splice(index, 1);
|
2025-03-18 10:14:46 -04:00
|
|
|
}
|
2024-12-14 19:30:33 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
addGroupToMultiselectGroup(group: string) {
|
|
|
|
|
this.selectedGroup.add(group);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
removeGroupFromMultiselectGroup(group: string) {
|
|
|
|
|
this.selectedGroup.delete(group);
|
|
|
|
|
}
|
|
|
|
|
|
2025-05-17 22:57:08 -04:00
|
|
|
setAssetSelectionStart(asset: TimelineAsset | null) {
|
2024-12-14 19:30:33 +01:00
|
|
|
this.assetSelectionStart = asset;
|
|
|
|
|
}
|
|
|
|
|
|
2025-05-17 22:57:08 -04:00
|
|
|
setAssetSelectionCandidates(assets: TimelineAsset[]) {
|
2025-03-19 11:55:50 -04:00
|
|
|
this.assetSelectionCandidates = assets;
|
2024-12-14 19:30:33 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
clearAssetSelectionCandidates() {
|
2025-03-19 11:55:50 -04:00
|
|
|
this.assetSelectionCandidates = [];
|
2024-12-14 19:30:33 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
clearMultiselect() {
|
|
|
|
|
// Multi-selection
|
2025-03-19 11:55:50 -04:00
|
|
|
this.selectedAssets = [];
|
2024-12-14 19:30:33 +01:00
|
|
|
this.selectedGroup.clear();
|
|
|
|
|
|
|
|
|
|
// Range selection
|
2025-03-19 11:55:50 -04:00
|
|
|
this.assetSelectionCandidates = [];
|
2024-12-14 19:30:33 +01:00
|
|
|
this.assetSelectionStart = null;
|
|
|
|
|
}
|
|
|
|
|
}
|