Skip to content

Commit 8ca762c

Browse files
committed
Activer le fond panoramax dans les fonds de carte
1 parent 050b7bf commit 8ca762c

File tree

5 files changed

+166
-8
lines changed

5 files changed

+166
-8
lines changed

app/Container.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -229,6 +229,7 @@ export default function Container({
229229
panoramaxImages,
230230
resetZoneImages,
231231
zoom,
232+
setZoom,
232233
searchParams,
233234
style,
234235
styleChooser,

app/Content.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ export default function Content({
4444
state,
4545
setState,
4646
zoom,
47+
setZoom,
4748
sideSheet, // This gives us the indication that we're on the desktop version, where the Content is on the left, always visible, as opposed to the mobile version where a pull-up modal is used
4849
searchParams,
4950
snap,
@@ -257,7 +258,9 @@ export default function Content({
257258
/>
258259

259260
{styleChooser ? (
260-
<StyleChooser {...{ setStyleChooser, style, setSnap }} />
261+
<StyleChooser
262+
{...{ setStyleChooser, style, setSnap, searchParams, zoom, setZoom }}
263+
/>
261264
) : (
262265
showContent && (
263266
<ContentSection>

app/Map.tsx

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -216,6 +216,11 @@ export default function Map({
216216

217217
useTerrainControl(map, style)
218218

219+
useEffect(() => {
220+
if (!map) return
221+
if (Math.round(map.getZoom()) === zoom) return
222+
map.flyTo({ zoom })
223+
}, [zoom, map])
219224
useEffect(() => {
220225
if (!map) return
221226
map.on('zoom', () => {
@@ -373,7 +378,10 @@ export default function Map({
373378
}, [lesGaresProches, map, zoom, clickGare, clickedGare?.uic])
374379

375380
useDrawPanoramaxPosition(map, panoramaxPosition)
376-
useAddPanoramaxLayer(map, searchParams.panoramax != null)
381+
useAddPanoramaxLayer(
382+
map,
383+
searchParams.panoramax != null || searchParams.rue === 'oui'
384+
)
377385

378386
return (
379387
<>

app/styles/StyleChooser.tsx

Lines changed: 58 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,31 @@
11
import css from '@/components/css/convertToJs'
22
import useSetSearchParams from '@/components/useSetSearchParams'
3+
import informationIcon from '@/public/information.svg'
4+
import panoramaxIcon from '@/public/panoramax-simple.svg'
5+
import Image from 'next/image'
36
import Link from 'next/link'
7+
import { useLocalStorage } from 'usehooks-ts'
48
import { ModalCloseButton } from '../UI'
59
import { styles } from './styles'
6-
import { useLocalStorage } from 'usehooks-ts'
7-
import Image from 'next/image'
8-
import informationIcon from '@/public/information.svg'
910

1011
const styleList = Object.entries(styles)
11-
export default function StyleChooser({ style, setStyleChooser, setSnap }) {
12+
export default function StyleChooser({
13+
style,
14+
setStyleChooser,
15+
setSnap,
16+
searchParams,
17+
zoom,
18+
setZoom,
19+
}) {
1220
const setSearchParams = useSetSearchParams()
1321
return (
1422
<section
1523
css={`
16-
h2 {
24+
h1 {
25+
font-size: 160%;
26+
font-weight: 300;
1727
margin-top: 0;
28+
margin-left: 0.4rem;
1829
}
1930
position: relative;
2031
`}
@@ -26,7 +37,48 @@ export default function StyleChooser({ style, setStyleChooser, setSnap }) {
2637
setSearchParams({ 'choix du style': undefined })
2738
}}
2839
/>
29-
<h2>Choisir le fond de carte</h2>
40+
<h1>Fond de carte</h1>
41+
<section
42+
css={`
43+
padding: 0 1rem;
44+
label {
45+
display: flex;
46+
align-items: center;
47+
input {
48+
margin-right: 0.4rem;
49+
}
50+
cursor: pointer;
51+
img {
52+
width: 1.3rem;
53+
margin-bottom: 0.15rem;
54+
height: auto;
55+
margin-right: 0.2rem;
56+
vertical-align: middle;
57+
}
58+
}
59+
`}
60+
>
61+
<label title="Afficher sur la carte les photos de rue Panoramax disponibles">
62+
<input
63+
type="checkbox"
64+
checked={
65+
searchParams.panoramax != null || searchParams.rue === 'oui'
66+
}
67+
onChange={() => {
68+
if (searchParams.rue === 'oui')
69+
setSearchParams({ rue: undefined })
70+
else {
71+
if (zoom < 7) setZoom(7)
72+
setSearchParams({ rue: 'oui' })
73+
}
74+
}}
75+
/>
76+
<span>
77+
<Image src={panoramaxIcon} alt="Logo du projet Panoramax" />
78+
Photos de rue
79+
</span>
80+
</label>
81+
</section>
3082
<Styles
3183
styleList={styleList.filter(([, el]) => !el.secondary)}
3284
setSearchParams={setSearchParams}

public/panoramax-simple.svg

Lines changed: 94 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)