diff --git a/README.md b/README.md index d1bb34be..e6b2d455 100644 --- a/README.md +++ b/README.md @@ -120,6 +120,7 @@ Application behavior can be changed by configuring the following environment var - `NEXT_PUBLIC_GRID_ASPECT_RATIO = 1.5` sets aspect ratio for grid tiles (defaults to `1`—setting to `0` removes the constraint) - `NEXT_PUBLIC_SHOW_LARGE_THUMBNAILS = 1` ensures large thumbnails on photo grid views - `NEXT_PUBLIC_OG_TEXT_ALIGNMENT = BOTTOM` keeps OG image text bottom aligned (default is top) +- `NEXT_PUBLIC_IMAGE_ACTIONS = 1` enables fullscreen and zoom actions when clicking on an image ## Alternate storage providers diff --git a/src/app/p/[photoId]/page.tsx b/src/app/p/[photoId]/page.tsx index 26faa932..42e53c78 100644 --- a/src/app/p/[photoId]/page.tsx +++ b/src/app/p/[photoId]/page.tsx @@ -82,7 +82,6 @@ export default async function PhotoPage({ photo, photos, photosGrid, - enableImageActions: true, }} /> ); diff --git a/src/photo/PhotoDetailPage.tsx b/src/photo/PhotoDetailPage.tsx index da945e7e..aab19b82 100644 --- a/src/photo/PhotoDetailPage.tsx +++ b/src/photo/PhotoDetailPage.tsx @@ -11,6 +11,7 @@ import HiddenHeader from '@/tag/HiddenHeader'; import FocalLengthHeader from '@/focal/FocalLengthHeader'; import PhotoHeader from './PhotoHeader'; import { JSX } from 'react'; +import { IMAGE_ACTIONS_ENABLED } from '@/site/config'; export default function PhotoDetailPage({ photo, @@ -25,7 +26,6 @@ export default function PhotoDetailPage({ dateRange, shouldShare, includeFavoriteInAdminMenu, - enableImageActions, }: { photo: Photo photos: Photo[] @@ -35,7 +35,6 @@ export default function PhotoDetailPage({ dateRange?: PhotoDateRange shouldShare?: boolean includeFavoriteInAdminMenu?: boolean - enableImageActions?: boolean } & PhotoSetCategory) { let customHeader: JSX.Element | undefined; @@ -114,7 +113,7 @@ export default function PhotoDetailPage({ shouldShareSimulation={simulation !== undefined} shouldScrollOnShare={false} includeFavoriteInAdminMenu={includeFavoriteInAdminMenu} - enableImageActions={enableImageActions} + enableImageActions={IMAGE_ACTIONS_ENABLED} />, ]} /> diff --git a/src/site/SiteChecklistClient.tsx b/src/site/SiteChecklistClient.tsx index 7cadb46a..e291732c 100644 --- a/src/site/SiteChecklistClient.tsx +++ b/src/site/SiteChecklistClient.tsx @@ -66,6 +66,7 @@ export default function SiteChecklistClient({ isPublicApiEnabled, arePublicDownloadsEnabled, isOgTextBottomAligned, + isImageActionsEnabled, gridAspectRatio, hasGridAspectRatio, gridDensity, @@ -599,6 +600,15 @@ export default function SiteChecklistClient({ keep OG image text bottom aligned (default is {'"top"'}): {renderEnvVars(['NEXT_PUBLIC_OG_TEXT_ALIGNMENT'])} + + Set environment variable to {'"1"'} to enable fullscreen and zoom + actions when clicking on an image: + {renderEnvVars(['NEXT_PUBLIC_IMAGE_ACTIONS'])} + } diff --git a/src/site/config.ts b/src/site/config.ts index 7a632de7..eba577a0 100644 --- a/src/site/config.ts +++ b/src/site/config.ts @@ -168,6 +168,8 @@ export const GRID_ASPECT_RATIO = : 1; export const OG_TEXT_BOTTOM_ALIGNMENT = (process.env.NEXT_PUBLIC_OG_TEXT_ALIGNMENT ?? '').toUpperCase() === 'BOTTOM'; +export const IMAGE_ACTIONS_ENABLED = + process.env.NEXT_PUBLIC_IMAGE_ACTIONS === '1'; export const ADMIN_DEBUG_TOOLS_ENABLED = process.env.ADMIN_DEBUG_TOOLS === '1'; export const PREFERS_LOW_DENSITY_GRID = @@ -232,6 +234,7 @@ export const CONFIG_CHECKLIST_STATUS = { isPublicApiEnabled: PUBLIC_API_ENABLED, arePublicDownloadsEnabled: ALLOW_PUBLIC_DOWNLOADS, isOgTextBottomAligned: OG_TEXT_BOTTOM_ALIGNMENT, + isImageActionsEnabled: IMAGE_ACTIONS_ENABLED, gridAspectRatio: GRID_ASPECT_RATIO, hasGridAspectRatio: Boolean(process.env.NEXT_PUBLIC_GRID_ASPECT_RATIO), gridDensity: HIGH_DENSITY_GRID,