-
Notifications
You must be signed in to change notification settings - Fork 7
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
c3792f1
commit 2f9ba42
Showing
11 changed files
with
253 additions
and
194 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,70 @@ | ||
| /* eslint-disable sort-keys-fix/sort-keys-fix */ | ||
| /** | ||
| * This mapping was calculated manually using an online latitude/longitude coordinates to tile z/x/y coordinates converter (see below). | ||
| * The goal is to reduce the number of API calls done during the precache of map tiles. | ||
| * | ||
| * Used coordinates ([lat, lon]): | ||
| * - start (top right): [60, -018] | ||
| * - end (bottom left): [37, 018] | ||
| * | ||
| * @notice: The key is the zoom level: we cache from zoom 0 to zoom 11. | ||
| * | ||
| * @see https://developer.tomtom.com/map-display-api/documentation/zoom-levels-and-tile-grid | ||
| */ | ||
| export const ZOOM_TO_START_END_TILE_INDICES: Record< | ||
| number, | ||
| { | ||
| end: [number, number] | ||
| start: [number, number] | ||
| } | ||
| > = { | ||
| 0: { | ||
| end: [0, 0], | ||
| start: [0, 0] | ||
| }, | ||
| 1: { | ||
| end: [1, 0], | ||
| start: [0, 0] | ||
| }, | ||
| 2: { | ||
| end: [2, 1], | ||
| start: [1, 1] | ||
| }, | ||
| 3: { | ||
| end: [4, 3], | ||
| start: [3, 2] | ||
| }, | ||
| 4: { | ||
| end: [8, 6], | ||
| start: [7, 4] | ||
| }, | ||
| 5: { | ||
| end: [17, 12], | ||
| start: [14, 9] | ||
| }, | ||
| 6: { | ||
| end: [35, 24], | ||
| start: [28, 18] | ||
| }, | ||
| 7: { | ||
| end: [70, 49], | ||
| start: [57, 36] | ||
| }, | ||
| 8: { | ||
| end: [140, 99], | ||
| start: [115, 72] | ||
| }, | ||
| 9: { | ||
| end: [281, 199], | ||
| start: [231, 145] | ||
| }, | ||
| 10: { | ||
| end: [563, 398], | ||
| start: [463, 291] | ||
| }, | ||
| 11: { | ||
| end: [1126, 797], | ||
| start: [926, 594] | ||
| } | ||
| } | ||
| /* eslint-enable sort-keys-fix/sort-keys-fix */ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,82 @@ | ||
| import ky from 'ky' | ||
| import { chunk, range } from 'lodash' | ||
|
|
||
| import { ZOOM_TO_START_END_TILE_INDICES } from './constants' | ||
|
|
||
| /** | ||
| * This function is used to store tiles in the navigator Cache API. | ||
| * | ||
| * It fetches all paths with a sleep time every 10 chunks (to avoid timeout) | ||
| * It restart from where it has been stopped previously (thanks to the `startFromIndex` parameter) | ||
| * | ||
| * @see `fetch` event of serviceWorker.ts | ||
| */ | ||
| export async function fetchAllByChunk(zoomToPaths: string[][], chunkSize: number, startFromIndex: number) { | ||
| const subDomains = ['a', 'b', 'c', 'd'] | ||
| const waitTime = 1000 | ||
| let currentIndex = 0 | ||
|
|
||
| // eslint-disable-next-line no-restricted-syntax | ||
| for (const paths of zoomToPaths) { | ||
| const chunkedPaths = chunk(paths, chunkSize) | ||
|
|
||
| // eslint-disable-next-line no-restricted-syntax | ||
| for (const chunkOfPaths of chunkedPaths) { | ||
| currentIndex += chunkOfPaths.length | ||
|
|
||
| // If the tiles have already been downloaded, do not retry the download | ||
| if (currentIndex < startFromIndex) { | ||
| // eslint-disable-next-line no-continue | ||
| continue | ||
| } | ||
|
|
||
| const subDomain = subDomains[Math.floor(Math.random() * subDomains.length)] | ||
|
|
||
| chunkOfPaths.forEach(path => ky.get(`https://${subDomain}.basemaps.cartocdn.com/light_all/${path}.png`)) | ||
|
|
||
| // An await is used to reduce the number of HTTP requests send per second | ||
| // eslint-disable-next-line no-await-in-loop | ||
| await sleep(waitTime) | ||
| } | ||
| } | ||
| } | ||
|
|
||
| const sleep = (ms: number) => | ||
| new Promise(r => { | ||
| setTimeout(r, ms) | ||
| }) | ||
|
|
||
| /** | ||
| * @see https://developer.tomtom.com/map-display-api/documentation/zoom-levels-and-tile-grid | ||
| * @return number[] - the array index is the zoom number | ||
| */ | ||
| export function getMaxXYRange(maxZoom: number): number[] { | ||
| return range(maxZoom).map(zoom => getMaxXYAtZoom(zoom + 1)) | ||
| } | ||
|
|
||
| /** | ||
| * @see https://developer.tomtom.com/map-display-api/documentation/zoom-levels-and-tile-grid | ||
| * @param zoomLevel | ||
| */ | ||
| export function getMaxXYAtZoom(zoomLevel: number) { | ||
| return Math.sqrt(2 ** zoomLevel * 2 ** zoomLevel) | ||
| } | ||
|
|
||
| /** | ||
| * Return the list of path to requests: | ||
| * - The first array index is the zoom number | ||
| * - The second array is the list of paths for a given zoom | ||
| */ | ||
| export function getZoomToRequestPaths() { | ||
| return Object.keys(ZOOM_TO_START_END_TILE_INDICES) | ||
| .map(key => ZOOM_TO_START_END_TILE_INDICES[key]) | ||
| .map((value, index) => { | ||
| const zoom = index | ||
|
|
||
| // We add `+ 1` as the `range()` function is not including the `end` number | ||
| const xRange = range(value.start[0], value.end[0] + 1) | ||
| const yRange = range(value.start[1], value.end[1] + 1) | ||
|
|
||
| return xRange.map(x => yRange.map(y => `${zoom}/${x}/${y}`)).flat() | ||
| }) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,29 @@ | ||
| import { ToastContainer } from 'react-toastify' | ||
| import styled from 'styled-components' | ||
|
|
||
| import { LoadOffline } from '../features/LoadOffline/components/LoadOffline' | ||
|
|
||
| export function NavBackoffice() { | ||
| return ( | ||
| <Wrapper> | ||
| <LoadOffline /> | ||
| <ToastContainer /> | ||
| </Wrapper> | ||
| ) | ||
| } | ||
|
|
||
| const Wrapper = styled.div` | ||
| color: white; | ||
| font-size: 13px; | ||
| text-align: center; | ||
| width: 100vw; | ||
| padding-top: 35vh; | ||
| height: 100vh; | ||
| overflow: hidden; | ||
| background: url('landing_background.png') no-repeat center center fixed; | ||
| -webkit-background-size: cover; | ||
| -moz-background-size: cover; | ||
| -o-background-size: cover; | ||
| background-size: cover; | ||
| ` |
Oops, something went wrong.