diff --git a/src/components/NewUI/Event.tsx b/src/components/NewUI/Event.tsx index 98332c7..c260fb2 100644 --- a/src/components/NewUI/Event.tsx +++ b/src/components/NewUI/Event.tsx @@ -1,4 +1,5 @@ import { useState } from 'react'; +import latlongdist, { R_miles } from './latlongdist'; import UIButton from './UIButton'; import UIPlacesAutocomplete from './UIPlacesAutocomplete'; import UISecondaryBox from './UISecondaryBox'; @@ -186,57 +187,90 @@ function Carpools({ event }: { event: IEvent }) { export type IPerson = { id: number; name: string; - extraDistance: number; + latitude: number; + longitude: number; }; const dummyPeopleData: IPerson[] = [ { id: 0, name: 'Rushil Umaretiya', - extraDistance: 10, + latitude: 11.1, + longitude: 10.09, }, { id: 1, name: 'Nitin Kanchinadam', - extraDistance: 12, + latitude: 11.09, + longitude: 10.12, }, ]; function People({ event }: { event: IEvent }) { const PADDING = '1rem'; // eslint-disable-next-line const [people, setPeople] = useState(dummyPeopleData); + const myLatitude = 10; + const myLongitude = 10; + const locationLatitude = 12; + const locationLongitude = 12; return (

People

- {people.map(({ name, extraDistance, id }) => ( -
- {name}: +{extraDistance} miles + {people.map(({ name, latitude, longitude, id }) => { + const meToThem = latlongdist( + latitude, + longitude, + myLatitude, + myLongitude, + R_miles + ); + const themToLocation = latlongdist( + latitude, + longitude, + locationLatitude, + locationLongitude, + R_miles + ); + const totalWithThem = meToThem + themToLocation; + const totalWithoutThem = latlongdist( + myLatitude, + myLongitude, + locationLatitude, + locationLongitude, + R_miles + ); + const extraDistance = totalWithThem - totalWithoutThem; + + return (
- Invite to carpool + {name}: +{extraDistance.toFixed(1)} miles +
+ Invite to carpool +
-
- ))} + ); + })}
); } diff --git a/src/components/NewUI/latlongdist.ts b/src/components/NewUI/latlongdist.ts new file mode 100644 index 0000000..3face9a --- /dev/null +++ b/src/components/NewUI/latlongdist.ts @@ -0,0 +1,35 @@ +export const R_meters = 6371e3; +export const R_miles = 3958.8; + +/** + * Calculates the distance from point 1 to point 2 based on R, the radius (in whatever units) + * + * Source: https://www.movable-type.co.uk/scripts/latlong.html + * + * @param lat1 Latitude of the first point + * @param lon1 Longitude of the first point + * @param lat2 Latitude of the second point + * @param lon2 Longitude of the second point + * @returns The distance in meters between point 1 and point 2 + */ +export default function latlongdist( + lat1: number, + lon1: number, + lat2: number, + lon2: number, + R = R_meters +) { + const φ1 = (lat1 * Math.PI) / 180; // φ, λ in radians + const φ2 = (lat2 * Math.PI) / 180; + const Δφ = ((lat2 - lat1) * Math.PI) / 180; + const Δλ = ((lon2 - lon1) * Math.PI) / 180; + + const a = + Math.sin(Δφ / 2) * Math.sin(Δφ / 2) + + Math.cos(φ1) * Math.cos(φ2) * Math.sin(Δλ / 2) * Math.sin(Δλ / 2); + const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a)); + + const d = R * c; // in metres + + return d; +}