|
@@ -73,6 +73,9 @@ import {
|
|
} from '@api/location';
|
|
} from '@api/location';
|
|
import UserItem from './UserItem';
|
|
import UserItem from './UserItem';
|
|
|
|
|
|
|
|
+const defaultUserAvatar = require('assets/icon-user-share-location-solid.png');
|
|
|
|
+const logo = require('assets/logo-ua.png');
|
|
|
|
+
|
|
MapLibreGL.setAccessToken(null);
|
|
MapLibreGL.setAccessToken(null);
|
|
MapLibreGL.Logger.setLogLevel('error');
|
|
MapLibreGL.Logger.setLogLevel('error');
|
|
|
|
|
|
@@ -423,44 +426,6 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
|
|
}
|
|
}
|
|
}, [seriesIcons]);
|
|
}, [seriesIcons]);
|
|
|
|
|
|
- useEffect(() => {
|
|
|
|
- if (nomads && nomads.features) {
|
|
|
|
- const loadImages = async () => {
|
|
|
|
- let loadedNomadsImages: any = {};
|
|
|
|
- loadedNomadsImages['default_icon'] = require('assets/logo-ua.png');
|
|
|
|
-
|
|
|
|
- const promises = nomads.features.map(async (feature) => {
|
|
|
|
- const user_id = feature.properties?.avatar
|
|
|
|
- ? `user_${feature.properties?.id}`
|
|
|
|
- : 'default_icon';
|
|
|
|
- const avatarPath = feature.properties?.avatar;
|
|
|
|
- const avatarUrl = { uri: `${API_HOST}${avatarPath}`, cache: 'force-cache' };
|
|
|
|
-
|
|
|
|
- if (feature.properties) {
|
|
|
|
- feature.properties.icon_key = user_id;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- if (avatarPath && !images[user_id]) {
|
|
|
|
- const cachedUrls = await ExpoImage.getCachePathAsync(avatarUrl.uri);
|
|
|
|
- if (!cachedUrls) {
|
|
|
|
- ExpoImage.prefetch([`${API_HOST}${avatarPath}`]);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- return (loadedNomadsImages[user_id] = avatarUrl);
|
|
|
|
- } else {
|
|
|
|
- return Promise.resolve();
|
|
|
|
- }
|
|
|
|
- });
|
|
|
|
-
|
|
|
|
- await Promise.all(promises);
|
|
|
|
-
|
|
|
|
- setImages((prevImages: any) => ({ ...prevImages, ...loadedNomadsImages }));
|
|
|
|
- };
|
|
|
|
-
|
|
|
|
- loadImages();
|
|
|
|
- }
|
|
|
|
- }, [nomads]);
|
|
|
|
-
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
const loadDatabases = async () => {
|
|
const loadDatabases = async () => {
|
|
const firstDb = await getFirstDatabase();
|
|
const firstDb = await getFirstDatabase();
|
|
@@ -1115,7 +1080,7 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
|
|
if (selectedFeature) {
|
|
if (selectedFeature) {
|
|
setSelectedUser({
|
|
setSelectedUser({
|
|
coordinates,
|
|
coordinates,
|
|
- avatar: avatar ? { uri: API_HOST + avatar } : require('assets/logo-ua.png'),
|
|
|
|
|
|
+ avatar: avatar ? { uri: API_HOST + avatar } : logo,
|
|
first_name,
|
|
first_name,
|
|
last_name,
|
|
last_name,
|
|
flag: { uri: API_HOST + flag },
|
|
flag: { uri: API_HOST + flag },
|
|
@@ -1355,7 +1320,7 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
|
|
75, 23,
|
|
75, 23,
|
|
100, 25
|
|
100, 25
|
|
],
|
|
],
|
|
- circleColor: 'rgba(255, 126, 0, 1)',
|
|
|
|
|
|
+ circleColor: 'rgba(237, 147, 52, 1)',
|
|
circleStrokeWidth: 2,
|
|
circleStrokeWidth: 2,
|
|
circleStrokeColor: '#FFFFFF',
|
|
circleStrokeColor: '#FFFFFF',
|
|
circleOpacity: 1
|
|
circleOpacity: 1
|
|
@@ -1384,33 +1349,21 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
|
|
textAllowOverlap: true
|
|
textAllowOverlap: true
|
|
}}
|
|
}}
|
|
/>
|
|
/>
|
|
- <MapLibreGL.CircleLayer
|
|
|
|
- id="nomads_circle_outline"
|
|
|
|
- filter={['!', ['has', 'point_count']]}
|
|
|
|
- aboveLayerID={Platform.OS === 'android' ? 'place-continent' : undefined}
|
|
|
|
- style={{
|
|
|
|
- circleRadius: ['interpolate', ['linear'], ['zoom'], 0, 15, 5, 18, 10, 21, 15, 24, 20, 27],
|
|
|
|
- circleColor: 'rgba(255, 126, 0, 1)',
|
|
|
|
- circleStrokeWidth: 2,
|
|
|
|
- circleStrokeColor: '#FFFFFF',
|
|
|
|
- circleOpacity: 1
|
|
|
|
- }}
|
|
|
|
- />
|
|
|
|
<MapLibreGL.SymbolLayer
|
|
<MapLibreGL.SymbolLayer
|
|
id="nomads_symbol"
|
|
id="nomads_symbol"
|
|
filter={['!', ['has', 'point_count']]}
|
|
filter={['!', ['has', 'point_count']]}
|
|
- aboveLayerID="nomads_circle_outline"
|
|
|
|
|
|
+ aboveLayerID={Platform.OS === 'android' ? 'place-continent' : undefined}
|
|
style={{
|
|
style={{
|
|
- iconImage: ['get', 'icon_key'],
|
|
|
|
|
|
+ iconImage: defaultUserAvatar,
|
|
iconSize: [
|
|
iconSize: [
|
|
'interpolate',
|
|
'interpolate',
|
|
['linear'],
|
|
['linear'],
|
|
['zoom'],
|
|
['zoom'],
|
|
- 0, 0.1,
|
|
|
|
- 5, 0.12,
|
|
|
|
- 10, 0.14,
|
|
|
|
- 15, 0.16,
|
|
|
|
- 20, 0.18
|
|
|
|
|
|
+ 0, 0.24,
|
|
|
|
+ 5, 0.28,
|
|
|
|
+ 10, 0.33,
|
|
|
|
+ 15, 0.38,
|
|
|
|
+ 20, 0.42
|
|
],
|
|
],
|
|
iconAllowOverlap: true
|
|
iconAllowOverlap: true
|
|
}}
|
|
}}
|