helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2026-08-29 13:15:45 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 14

Add Slideshow Settings for Animate switch and Pan / Zoom Strength

Browse source
This commit is contained in:
Hartley Raabis 2026-07-30 10:19:13 -06:00
parent 0293414abd
commit 9915418260
3 changed files with 28 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

3
i18n/en.json
View file

@ -2022,6 +2022,9 @@
"skip_to_folders": "Skip to folders",
"skip_to_tags": "Skip to tags",
"slideshow": "Slideshow",
"slideshow_animate": "Animate slideshow",
"slideshow_animate_pan_strength": "Pan strength percentage",
"slideshow_animate_zoom_strength": "Zoom strength percentage",
"slideshow_body": "Sit back and watch your photos play in a full-screen slideshow.",
"slideshow_metadata_overlay_mode": "Overlay content",
"slideshow_metadata_overlay_mode_description_only": "Description only",

19
web/src/lib/modals/SlideshowSettingsModal.svelte
View file

@ -22,6 +22,9 @@
const {
slideshowDelay,
showProgressBar,
slideshowAnimate,
slideshowAnimatePanStrength,
slideshowAnimateZoomStrength,
slideshowNavigation,
slideshowLook,
slideshowTransition,
@ -41,6 +44,9 @@
// Temporary variables to hold the settings - marked as reactive with $state() but initialized with store values
let tempSlideshowDelay = $state($slideshowDelay);
let tempShowProgressBar = $state($showProgressBar);
let tempSlideshowAnimate = $state($slideshowAnimate);
let tempSlideshowAnimatePanStrength = $state($slideshowAnimatePanStrength);
let tempSlideshowAnimateZoomStrength = $state($slideshowAnimateZoomStrength);
let tempSlideshowNavigation = $state($slideshowNavigation);
let tempSlideshowLook = $state($slideshowLook);
let tempSlideshowTransition = $state($slideshowTransition);
@ -84,6 +90,9 @@
const onSubmit = () => {
$slideshowDelay = tempSlideshowDelay;
$showProgressBar = tempShowProgressBar;
$slideshowAnimate = tempSlideshowAnimate;
$slideshowAnimatePanStrength = tempSlideshowAnimatePanStrength;
$slideshowAnimateZoomStrength = tempSlideshowAnimateZoomStrength;
$slideshowNavigation = tempSlideshowNavigation;
$slideshowLook = tempSlideshowLook;
$slideshowTransition = tempSlideshowTransition;
@ -151,5 +160,15 @@
<NumberInput min={1} bind:value={tempSlideshowDelay} />
<HelperText>{$t('admin.slideshow_duration_description')}</HelperText>
</Field>
<Field label={$t('slideshow_animate')}>
<Switch bind:checked={tempSlideshowAnimate} />
</Field>
<Field label={$t('slideshow_animate_pan_strength')}>
<NumberInput bind:value={tempSlideshowAnimatePanStrength} min={1} max={100} disabled={!tempSlideshowAnimate} />
</Field>
<Field label={$t('slideshow_animate_zoom_strength')}>
<NumberInput bind:value={tempSlideshowAnimateZoomStrength} min={1} max={100} disabled={!tempSlideshowAnimate} />
</Field>
</div>
</FormModal>

6
web/src/lib/stores/slideshow.store.ts
View file

@ -42,6 +42,9 @@ function createSlideshowStore() {
const slideshowState = writable<SlideshowState>(SlideshowState.None);
const showProgressBar = persisted<boolean>('slideshow-show-progressbar', true);
const slideshowAnimate = persisted<boolean>('slideshow-animate', false);
const slideshowAnimatePanStrength = persisted<number>('slideshow-animate-pan-strength', 50, {});
const slideshowAnimateZoomStrength = persisted<number>('slideshow-animate-zoom-strength', 50, {});
const slideshowDelay = persisted<number>('slideshow-delay', 5, {});
const slideshowTransition = persisted<boolean>('slideshow-transition', true);
const slideshowAutoplay = persisted<boolean>('slideshow-autoplay', true, {});
@ -89,6 +92,9 @@ function createSlideshowStore() {
slideshowRepeat,
slideshowShowMetadataOverlay,
slideshowMetadataOverlayMode,
slideshowAnimate,
slideshowAnimatePanStrength,
slideshowAnimateZoomStrength,
};
}