Skip to content

Commit 7bcce54

Browse files
author
Lalit Sharma
committed
feat: update Photography Guide to improve composite visuals and bump mobile version to 1.1.39
1 parent fde93b5 commit 7bcce54

3 files changed

Lines changed: 109 additions & 95 deletions

File tree

‎CHANGELOG.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,15 @@ All notable changes to this project will be documented in this file.
55
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
66
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
77

8+
## [1.1.39] — 2026-02-27
9+
10+
### Fixed
11+
- Updated `Photography Guide` landscape composite visuals so corona rings render only for `total` eclipses at `MAX` (no corona for `partial` or `annular` eclipses).
12+
- Updated composite moon styling to match the sky for non-`MAX` shots, with moon rendered black at `MAX` only for `annular` and `total` eclipses.
13+
14+
### Changed
15+
- Bumped `apps/mobile` version to `1.1.39`.
16+
817
## [1.1.38] — 2026-02-27
918

1019
### Added

‎apps/mobile/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@eclipse-timer/mobile",
3-
"version": "1.1.38",
3+
"version": "1.1.39",
44
"private": true,
55
"main": "index.js",
66
"scripts": {

‎apps/mobile/src/screens/PhotographyGuideScreen.tsx‎

Lines changed: 99 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -28,10 +28,9 @@ import {
2828
const PHOTO_COUNT_OPTIONS: readonly PhotographyGuidePictureCount[] = [3, 5, 7, 9];
2929
const TABLE_THUMB_STAGE_SIZE = 40;
3030
const TABLE_THUMB_SUN_RADIUS = 18;
31+
const DEFAULT_COMPOSITE_SKY_COLOR = "#89b7ef";
3132
const TOTALITY_SKY_COLOR = "#050d24";
3233
const TOTALITY_GROUND_COLOR = "#111827";
33-
const TOTALITY_MOON_COLOR = TOTALITY_SKY_COLOR;
34-
const TOTALITY_MOON_BORDER_COLOR = "#1f2c47";
3534
const TOTALITY_HORIZON_LINE_COLOR = "rgba(255, 174, 205, 0.75)";
3635
const TOTALITY_HORIZON_GLOW_COLOR = "rgba(255, 136, 182, 0.42)";
3736
const LANDSCAPE_HORIZONTAL_FOV_DEG_24MM = 74;
@@ -119,6 +118,11 @@ export default function PhotographyGuideScreen({
119118
height: 0,
120119
});
121120
const isTotalCompositeTheme = payload.kindAtLocation === "total";
121+
const isAnnularOrTotalCompositeTheme =
122+
payload.kindAtLocation === "annular" || payload.kindAtLocation === "total";
123+
const compositeSkyColor = isTotalCompositeTheme
124+
? TOTALITY_SKY_COLOR
125+
: DEFAULT_COMPOSITE_SKY_COLOR;
122126
const isWithinEclipseArea = payload.visible && payload.kindAtLocation !== "none";
123127
const scheduleResult = useMemo(
124128
() =>
@@ -415,12 +419,7 @@ export default function PhotographyGuideScreen({
415419
</Text>
416420
</Pressable>
417421
<View style={styles.compositeFrame} onLayout={handleCompositeStageLayout}>
418-
<View
419-
style={[
420-
styles.compositeSky,
421-
isTotalCompositeTheme ? { backgroundColor: TOTALITY_SKY_COLOR } : null,
422-
]}
423-
/>
422+
<View style={[styles.compositeSky, { backgroundColor: compositeSkyColor }]} />
424423
<View
425424
style={[
426425
styles.compositeGround,
@@ -484,102 +483,108 @@ export default function PhotographyGuideScreen({
484483
},
485484
]}
486485
/>
487-
{compositeLayout.placements.map((placement) => (
488-
<View key={placement.index}>
489-
{!placement.isAboveHorizon ? null : (
490-
<>
491-
{isTotalCompositeTheme &&
492-
placement.phaseBucket === "MAX" &&
493-
placement.showMoon &&
494-
placement.moon ? (
495-
<>
486+
{compositeLayout.placements.map((placement) => {
487+
const showTotalityCorona =
488+
payload.kindAtLocation === "total" &&
489+
placement.phaseBucket === "MAX" &&
490+
placement.showMoon &&
491+
Boolean(placement.moon);
492+
const useBlackMoon =
493+
isAnnularOrTotalCompositeTheme && placement.phaseBucket === "MAX";
494+
const moonColor = useBlackMoon ? "#000000" : compositeSkyColor;
495+
496+
return (
497+
<View key={placement.index}>
498+
{!placement.isAboveHorizon ? null : (
499+
<>
500+
{showTotalityCorona ? (
501+
<>
502+
<View
503+
style={[
504+
styles.compositeCoronaGlow,
505+
{
506+
width: Math.max(placement.sunRadius * 9, 16),
507+
height: Math.max(placement.sunRadius * 9, 16),
508+
borderRadius: Math.max(placement.sunRadius * 4.5, 8),
509+
left: placement.x - Math.max(placement.sunRadius * 4.5, 8),
510+
top: placement.y - Math.max(placement.sunRadius * 4.5, 8),
511+
},
512+
]}
513+
/>
514+
<View
515+
style={[
516+
styles.compositeCoronaRing,
517+
{
518+
width: Math.max(placement.sunRadius * 6, 10),
519+
height: Math.max(placement.sunRadius * 6, 10),
520+
borderRadius: Math.max(placement.sunRadius * 3, 5),
521+
left: placement.x - Math.max(placement.sunRadius * 3, 5),
522+
top: placement.y - Math.max(placement.sunRadius * 3, 5),
523+
},
524+
]}
525+
/>
526+
</>
527+
) : null}
528+
<View
529+
style={[
530+
styles.compositeSun,
531+
{
532+
width: placement.sunRadius * 2,
533+
height: placement.sunRadius * 2,
534+
borderRadius: placement.sunRadius,
535+
left: placement.x - placement.sunRadius,
536+
top: placement.y - placement.sunRadius,
537+
},
538+
]}
539+
/>
540+
{placement.showMoon && placement.moon ? (
496541
<View
497542
style={[
498-
styles.compositeCoronaGlow,
543+
styles.compositeMoon,
499544
{
500-
width: Math.max(placement.sunRadius * 9, 16),
501-
height: Math.max(placement.sunRadius * 9, 16),
502-
borderRadius: Math.max(placement.sunRadius * 4.5, 8),
503-
left: placement.x - Math.max(placement.sunRadius * 4.5, 8),
504-
top: placement.y - Math.max(placement.sunRadius * 4.5, 8),
545+
backgroundColor: moonColor,
546+
borderColor: moonColor,
547+
},
548+
{
549+
width: placement.moon.radius * 2,
550+
height: placement.moon.radius * 2,
551+
borderRadius: placement.moon.radius,
552+
left: placement.moon.x - placement.moon.radius,
553+
top: placement.moon.y - placement.moon.radius,
505554
},
506555
]}
507556
/>
557+
) : null}
558+
{showCompositeMarkings ? (
559+
<View
560+
style={[
561+
styles.compositeShotIndexTag,
562+
{
563+
left: placement.x - 9,
564+
top: placement.y + placement.sunRadius + 3,
565+
},
566+
placement.clamped ? styles.compositeShotIndexTagClamped : null,
567+
]}
568+
>
569+
<Text style={styles.compositeShotIndexText}>{placement.index}</Text>
570+
</View>
571+
) : null}
572+
{showCompositeMarkings && placement.clamped ? (
508573
<View
509574
style={[
510-
styles.compositeCoronaRing,
575+
styles.compositeClampIndicator,
511576
{
512-
width: Math.max(placement.sunRadius * 6, 10),
513-
height: Math.max(placement.sunRadius * 6, 10),
514-
borderRadius: Math.max(placement.sunRadius * 3, 5),
515-
left: placement.x - Math.max(placement.sunRadius * 3, 5),
516-
top: placement.y - Math.max(placement.sunRadius * 3, 5),
577+
left: placement.x + placement.sunRadius - 4,
578+
top: placement.y - placement.sunRadius - 4,
517579
},
518580
]}
519581
/>
520-
</>
521-
) : null}
522-
<View
523-
style={[
524-
styles.compositeSun,
525-
{
526-
width: placement.sunRadius * 2,
527-
height: placement.sunRadius * 2,
528-
borderRadius: placement.sunRadius,
529-
left: placement.x - placement.sunRadius,
530-
top: placement.y - placement.sunRadius,
531-
},
532-
]}
533-
/>
534-
{placement.showMoon && placement.moon ? (
535-
<View
536-
style={[
537-
styles.compositeMoon,
538-
isTotalCompositeTheme
539-
? {
540-
backgroundColor: TOTALITY_MOON_COLOR,
541-
borderColor: TOTALITY_MOON_BORDER_COLOR,
542-
}
543-
: null,
544-
{
545-
width: placement.moon.radius * 2,
546-
height: placement.moon.radius * 2,
547-
borderRadius: placement.moon.radius,
548-
left: placement.moon.x - placement.moon.radius,
549-
top: placement.moon.y - placement.moon.radius,
550-
},
551-
]}
552-
/>
553-
) : null}
554-
{showCompositeMarkings ? (
555-
<View
556-
style={[
557-
styles.compositeShotIndexTag,
558-
{
559-
left: placement.x - 9,
560-
top: placement.y + placement.sunRadius + 3,
561-
},
562-
placement.clamped ? styles.compositeShotIndexTagClamped : null,
563-
]}
564-
>
565-
<Text style={styles.compositeShotIndexText}>{placement.index}</Text>
566-
</View>
567-
) : null}
568-
{showCompositeMarkings && placement.clamped ? (
569-
<View
570-
style={[
571-
styles.compositeClampIndicator,
572-
{
573-
left: placement.x + placement.sunRadius - 4,
574-
top: placement.y - placement.sunRadius - 4,
575-
},
576-
]}
577-
/>
578-
) : null}
579-
</>
580-
)}
581-
</View>
582-
))}
582+
) : null}
583+
</>
584+
)}
585+
</View>
586+
);
587+
})}
583588
</>
584589
) : null}
585590
</View>
@@ -887,11 +892,11 @@ function createStyles(colors: ReturnType<typeof useAppTheme>["colors"]) {
887892
borderWidth: 1,
888893
borderColor: "rgba(255,255,255,0.16)",
889894
overflow: "hidden",
890-
backgroundColor: "#89b7ef",
895+
backgroundColor: DEFAULT_COMPOSITE_SKY_COLOR,
891896
},
892897
compositeSky: {
893898
...StyleSheet.absoluteFillObject,
894-
backgroundColor: "#89b7ef",
899+
backgroundColor: DEFAULT_COMPOSITE_SKY_COLOR,
895900
},
896901
compositeGround: {
897902
position: "absolute",

0 commit comments

Comments
 (0)