From 8ff534a65bb051b29eaa433d261b806d170e9a6b Mon Sep 17 00:00:00 2001 From: Sam Becker Date: Sun, 26 Jan 2025 14:42:17 -0600 Subject: [PATCH] Enable zoom controls by default --- README.md | 2 +- src/components/cmdk/CommandKClient.tsx | 8 ++++---- src/photo/PhotoLarge.tsx | 4 ++-- src/site/SiteChecklistClient.tsx | 20 ++++++++++---------- src/site/config.ts | 6 +++--- src/state/AppState.ts | 4 ++-- src/state/AppStateProvider.tsx | 10 +++++----- 7 files changed, 27 insertions(+), 27 deletions(-) diff --git a/README.md b/README.md index 15a85110..8bf08af1 100644 --- a/README.md +++ b/README.md @@ -111,6 +111,7 @@ Application behavior can be changed by configuring the following environment var #### Display - `NEXT_PUBLIC_HIDE_EXIF_DATA = 1` hides EXIF data in photo details and OG images (potentially useful for portfolios, which don't focus on photography) +- `NEXT_PUBLIC_HIDE_ZOOM_CONTROLS = 1` hides fullscreen photo zoom controls - `NEXT_PUBLIC_HIDE_TAKEN_AT_TIME = 1` hides taken at time from photo meta - `NEXT_PUBLIC_HIDE_SOCIAL = 1` removes X button from share modal - `NEXT_PUBLIC_HIDE_FILM_SIMULATIONS = 1` prevents Fujifilm simulations showing up in `/grid` sidebar and CMD-K search results @@ -119,7 +120,6 @@ Application behavior can be changed by configuring the following environment var #### Settings - `NEXT_PUBLIC_GRID_HOMEPAGE = 1` shows grid layout on homepage - `NEXT_PUBLIC_DEFAULT_THEME = light | dark` sets preferred initial theme (defaults to `system` when not configured) -- `NEXT_PUBLIC_ZOOM_CONTROLS = 1` enables fullscreen photo zoom controls - `NEXT_PUBLIC_MATTE_PHOTOS = 1` constrains the size of each photo, and enables a surrounding border (potentially useful for photos with tall aspect ratios) - `NEXT_PUBLIC_GEO_PRIVACY = 1` disables collection/display of location-based data (⚠️ re-compresses uploaded images in order to remove GPS information) - `NEXT_PUBLIC_ALLOW_PUBLIC_DOWNLOADS = 1` enables public photo downloads for all visitors (⚠️ may result in increased bandwidth usage) diff --git a/src/components/cmdk/CommandKClient.tsx b/src/components/cmdk/CommandKClient.tsx index 9cf33da6..9bbf79a0 100644 --- a/src/components/cmdk/CommandKClient.tsx +++ b/src/components/cmdk/CommandKClient.tsx @@ -92,7 +92,7 @@ export default function CommandKClient({ selectedPhotoIds, setSelectedPhotoIds, isGridHighDensity, - areZoomControlsEnabled, + areZoomControlsShown, arePhotosMatted, shouldShowBaselineGrid, shouldDebugImageFallbacks, @@ -100,7 +100,7 @@ export default function CommandKClient({ setShouldRespondToKeyboardCommands, setShouldShowBaselineGrid, setIsGridHighDensity, - setAreZoomControlsEnabled, + setAreZoomControlsShown, setArePhotosMatted, setShouldDebugImageFallbacks, } = useAppState(); @@ -253,8 +253,8 @@ export default function CommandKClient({ accessory: , items: [{ label: 'Toggle Zoom Controls', - action: () => setAreZoomControlsEnabled?.(prev => !prev), - annotation: areZoomControlsEnabled ? : undefined, + action: () => setAreZoomControlsShown?.(prev => !prev), + annotation: areZoomControlsShown ? : undefined, }, { label: 'Toggle Photo Matting', action: () => setArePhotosMatted?.(prev => !prev), diff --git a/src/photo/PhotoLarge.tsx b/src/photo/PhotoLarge.tsx index 81203416..6de07a27 100644 --- a/src/photo/PhotoLarge.tsx +++ b/src/photo/PhotoLarge.tsx @@ -85,12 +85,12 @@ export default function PhotoLarge({ const refZoomControlsContainer = useRef(null); const { - areZoomControlsEnabled, + areZoomControlsShown, arePhotosMatted, isUserSignedIn, } = useAppState(); - const showZoomControls = showZoomControlsProp && areZoomControlsEnabled; + const showZoomControls = showZoomControlsProp && areZoomControlsShown; const tags = sortTags(photo.tags, primaryTag); diff --git a/src/site/SiteChecklistClient.tsx b/src/site/SiteChecklistClient.tsx index 1234536b..38861a81 100644 --- a/src/site/SiteChecklistClient.tsx +++ b/src/site/SiteChecklistClient.tsx @@ -60,6 +60,7 @@ export default function SiteChecklistClient({ isBlurEnabled, // Display showExifInfo, + showZoomControls, showTakenAtTimeHidden, showSocial, showFilmSimulations, @@ -68,7 +69,6 @@ export default function SiteChecklistClient({ isGridHomepageEnabled, hasDefaultTheme, defaultTheme, - areZoomControlsEnabled, arePhotosMatted, isGeoPrivacyEnabled, gridAspectRatio, @@ -474,6 +474,15 @@ export default function SiteChecklistClient({ Set environment variable to {'"1"'} to hide EXIF data: {renderEnvVars(['NEXT_PUBLIC_HIDE_EXIF_DATA'])} + + Set environment variable to {'"1"'} to hide + fullscreen photo zoom controls: + {renderEnvVars(['NEXT_PUBLIC_HIDE_ZOOM_CONTROLS'])} + - - Set environment variable to {'"1"'} to enable - fullscreen photo zoom controls: - {renderEnvVars(['NEXT_PUBLIC_ZOOM_CONTROLS'])} - > - areZoomControlsEnabled?: boolean - setAreZoomControlsEnabled?: Dispatch> + areZoomControlsShown?: boolean + setAreZoomControlsShown?: Dispatch> arePhotosMatted?: boolean setArePhotosMatted?: Dispatch> shouldDebugImageFallbacks?: boolean diff --git a/src/state/AppStateProvider.tsx b/src/state/AppStateProvider.tsx index 7cd7b225..39e7382e 100644 --- a/src/state/AppStateProvider.tsx +++ b/src/state/AppStateProvider.tsx @@ -9,7 +9,7 @@ import useSWR from 'swr'; import { HIGH_DENSITY_GRID, MATTE_PHOTOS, - ZOOM_CONTROLS_ENABLED, + SHOW_ZOOM_CONTROLS, } from '@/site/config'; import { getPhotosHiddenMetaCachedAction } from '@/photo/actions'; import { ShareModalProps } from '@/share'; @@ -50,8 +50,8 @@ export default function AppStateProvider({ // DEBUG const [isGridHighDensity, setIsGridHighDensity] = useState(HIGH_DENSITY_GRID); - const [areZoomControlsEnabled, setAreZoomControlsEnabled] = - useState(ZOOM_CONTROLS_ENABLED); + const [areZoomControlsShown, setAreZoomControlsShown] = + useState(SHOW_ZOOM_CONTROLS); const [arePhotosMatted, setArePhotosMatted] = useState(MATTE_PHOTOS); const [shouldDebugImageFallbacks, setShouldDebugImageFallbacks] = @@ -122,8 +122,8 @@ export default function AppStateProvider({ // DEBUG isGridHighDensity, setIsGridHighDensity, - areZoomControlsEnabled, - setAreZoomControlsEnabled, + areZoomControlsShown, + setAreZoomControlsShown, arePhotosMatted, setArePhotosMatted, shouldDebugImageFallbacks,