Implement adding/removing favorite from location info menu

This commit is contained in:
Reimar 2024-08-27 10:40:01 +02:00
parent cbe1bc8abd
commit a1c8a5e25e
Signed by: Reimar
GPG Key ID: 93549FA07F0AE268
2 changed files with 97 additions and 49 deletions

View File

@ -63,7 +63,7 @@ class _FavoritesPage extends State<FavoritesPage> {
Widget build(BuildContext context) {
return SideMenu(
selectedIndex: 1,
body: Container(
body: SingleChildScrollView(child: Container(
decoration: const BoxDecoration(color: Color(0xFFF9F9F9)),
width: MediaQuery.of(context).size.width,
padding: const EdgeInsets.all(20.0),
@ -106,6 +106,6 @@ class _FavoritesPage extends State<FavoritesPage> {
)).toList(),
),
),
);
));
}
}

View File

@ -47,13 +47,14 @@ class MyHomePage extends StatefulWidget {
class _MyHomePageState extends State<MyHomePage> {
final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
final GlobalKey<ScaffoldState> _locationScaffoldKey = GlobalKey<ScaffoldState>();
List<Favorite> _favorites = [];
LatLng? _selectedPoint;
void _showLocation(TapPosition _, LatLng point) async {
setState(() => _selectedPoint = point);
final location;
final dynamic location;
try {
final response = await http.get(
Uri.parse('https://nominatim.openstreetmap.org/reverse.php?lat=${point.latitude}&lon=${point.longitude}&zoom=18&format=jsonv2'),
@ -77,6 +78,7 @@ class _MyHomePageState extends State<MyHomePage> {
barrierColor: Colors.black.withOpacity(0.3),
context: context,
builder: (builder) {
return StatefulBuilder(builder: (BuildContext context, StateSetter setModalState) {
return Wrap(children: [
Container(
color: Colors.white,
@ -91,26 +93,62 @@ class _MyHomePageState extends State<MyHomePage> {
Text(location['display_name']),
],
)),
const Column(children: [
IconButton(icon: Icon(Icons.star), iconSize: 32, onPressed: null),
IconButton(icon: Icon(Icons.rate_review), iconSize: 32, onPressed: null),
Column(children: [
IconButton(
icon: const Icon(Icons.star),
iconSize: 32,
color: _favorites.where((fav) => fav.lat == point.latitude && fav.lng == point.longitude).isEmpty ? Colors.grey : Colors.yellow,
onPressed: () => _toggleFavorite(point, location['name'], location['display_name'], setModalState, context)
),
const IconButton(icon: Icon(Icons.rate_review), iconSize: 32, onPressed: null),
]),
]),
),
]);
});
},
);
setState(() => _selectedPoint = null);
}
@override
void didChangeDependencies() {
super.didChangeDependencies();
void _toggleFavorite(LatLng point, String name, String description, StateSetter setModalState, BuildContext context) async {
final messenger = ScaffoldMessenger.of(context);
final favorite = _favorites.where((fav) => fav.lat == point.latitude && fav.lng == point.longitude).firstOrNull;
api.isLoggedIn(context).then((isLoggedIn) async {
if (!isLoggedIn || !mounted) return;
if (!await api.isLoggedIn(context)) {
messenger.showSnackBar(const SnackBar(content: Text('You need to login to do that')));
return;
}
if (!context.mounted) return;
if (favorite == null) {
if (await api.request(context, api.ApiService.app, 'POST', '/favorites', {'lat': point.latitude, 'lng': point.longitude}) == null) {
return;
}
_fetchFavorites();
setModalState(() {});
messenger.showSnackBar(const SnackBar(content: Text('Added to favorites')));
return;
}
if (await api.request(context, api.ApiService.app, 'DELETE', '/favorites/${favorite.id}', null) == null) {
return;
}
setState(() {
_favorites = _favorites.where((fav) => fav.id != favorite.id).toList();
});
setModalState(() {});
messenger.showSnackBar(const SnackBar(content: Text('Removed from favorites')));
}
void _fetchFavorites() async {
final response = await api.request(context, api.ApiService.app, 'GET', '/favorites', null);
if (response == null) return;
@ -118,6 +156,16 @@ class _MyHomePageState extends State<MyHomePage> {
setState(() {
_favorites = favorites.map((favorite) => Favorite(favorite['id'], favorite['user_id'], favorite['lat'], favorite['lng'], favorite['name'], favorite['description'])).toList();
});
}
@override
void didChangeDependencies() {
super.didChangeDependencies();
api.isLoggedIn(context).then((isLoggedIn) {
if (!isLoggedIn || !mounted) return;
_fetchFavorites();
});
}
@ -136,22 +184,6 @@ class _MyHomePageState extends State<MyHomePage> {
),
children: [
openStreetMapTileLayer,
..._favorites.map((favorite) =>
MarkerLayer(markers: [
Marker(
point: LatLng(favorite.lat, favorite.lng),
width: 30,
height: 50,
alignment: Alignment.center,
child: const Stack(
children: [
Icon(Icons.location_pin, size: 30, color: Colors.yellow),
Icon(Icons.location_on_outlined, size: 30, color: Colors.black),
]
),
)
]),
),
...(
_selectedPoint != null ? [
MarkerLayer(markers: [
@ -170,6 +202,22 @@ class _MyHomePageState extends State<MyHomePage> {
]),
] : []
),
..._favorites.map((favorite) =>
MarkerLayer(markers: [
Marker(
point: LatLng(favorite.lat, favorite.lng),
width: 30,
height: 50,
alignment: Alignment.center,
child: const Stack(
children: [
Icon(Icons.location_pin, size: 30, color: Colors.yellow),
Icon(Icons.location_on_outlined, size: 30, color: Colors.black),
]
),
)
]),
),
],
),
),