import 'dart:io';
import 'dart:convert';
import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:path_provider/path_provider.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'osm_layer.dart';
import 'stat_charts.dart';
import '../../consts.dart';
import 'choropleth_map.dart';
import '../data_classes.dart';
import 'satellite_layer.dart';
import 'quick_view_chart.dart';
import '../utils/format_month.dart';
/// MapContainerWidget is the main widget that contains the map with all
/// its layers, polygons and markers.
class MapContainerWidget extends StatefulWidget {
final List<Measurement> measurements;
final Uint8List relation;
final bool serverConnection;
const MapContainerWidget({Key? key,
required this.measurements,
required this.relation,
required this.serverConnection,
}) : super(key: key);
@override
_MapContainerWidgetState createState() => _MapContainerWidgetState();
}
class _MapContainerWidgetState extends State<MapContainerWidget> {
bool isMinimized = true; // Quick view box state tacker
bool satLayer = false; // Satellite layer visibility state
bool osmLayer = false; // OSM layer visibility state
bool isSatTapped = false; // Satellite button tap state tracker
bool isMapTapped = false; // OSM button tap state tracker
Measurement? selectedMeasurement = selectedMarkerList[0];
// Initialise lastUpdate variable from persistent storage if server fetch fails
Future<void> checkAndSetLastUpdate() async {
if (lastUpdate == null) {
final prefs = await SharedPreferences.getInstance();
final updateString = prefs.getString('lastUpdate');
if (updateString != null && updateString.isNotEmpty) {
final updateData = DateTime.parse(updateString);
setState(() {
lastUpdate = updateData;
});
}
}
}
// Tile selection handler
void handleSelection(int index) {
String indexString = index.toString();
setState(() {
for (Measurement measurement in widget.measurements) {
for (SubDiv subdivision in measurement.subDivs) {
if (subdivision.sub_div_id == indexString) {
selectedSubDiv = subdivision;
selectedMeasurement = measurement;
break;
}
}
}
});
}
@override
Widget build(BuildContext context) {
// Initialise selectedMarker to first element in markerList
selectedSubDiv ??= widget.measurements[0].subDivs[0];
checkAndSetLastUpdate();
const double contPadding = 30; // Container padding space
return LayoutBuilder(
builder: (context, constraints) {
double screenWidth = constraints.maxWidth;
double boxWidth = 0.86;
double boxHeight = 1.4;
return Column(
children: [
const SizedBox(height: contPadding*1.5),
ClipRRect(
borderRadius: BorderRadius.circular(20),
child: Stack( // Stack of quick view, map layer, satellite layer, and buttons
children: [
SizedBox( // Colored box behind map
width: screenWidth * boxWidth,
height: screenWidth * boxHeight,
child: Container(
color: Colors.white12,
),
),
SizedBox( // Color coded lake polygon
width: screenWidth * boxWidth,
height: screenWidth * boxHeight,
child: Padding(
padding: const EdgeInsets.all(15.0), // Padding around map
child: ChoroplethMap(
relation: widget.relation,
measurements: widget.measurements,
onSelectionChanged: handleSelection,
),
),
),
SizedBox(
width: screenWidth * boxWidth,
height: screenWidth * boxHeight,
child: Visibility(
visible: osmLayer,
child: OSM(markerList: widget.measurements),
),
),
Positioned( // Satellite button
top: 10,
right: 10,
child: GestureDetector(
onTap: () {
setState(() {
satLayer = !satLayer; // Toggle satellite layer state on press
});
},
child: Container(
padding: const EdgeInsets.all(8),
decoration: satLayer ? const BoxDecoration( // Add decoration only when pressed
shape: BoxShape.circle,
color: Colors.grey,
) : null,
child: const Icon(
Icons.satellite_alt_outlined,
color: Colors.white54,
),
),
),
),
Positioned( // OSmap button
top: 50,
right: 10,
child: GestureDetector(
onTap: () {
setState(() {
osmLayer = !osmLayer; // Toggle satellite layer state on press
});
},
child: Container(
padding: const EdgeInsets.all(8),
decoration: osmLayer ? const BoxDecoration( // Add decoration only when pressed
shape: BoxShape.circle,
color: Colors.grey,
) : null,
child: const Icon(
Icons.map,
color: Colors.white54,
),
),
),
),
Positioned( // Export button
top: 90,
right: 10,
child: GestureDetector(
onTap: () {
showModalBottomSheet(
context: context,
builder: (BuildContext context) {
return SizedBox(
height: 200,
width: screenWidth,
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
"Export ice data for $selectedLake",
style: const TextStyle(fontSize: 20),
),
const SizedBox(height: contPadding),
ElevatedButton(
style: ButtonStyle(
backgroundColor: MaterialStateProperty.all<Color>(Colors.white24),
),
child: const Text("Export JSON"),
onPressed: () {
// Close bottom sheet before displaying progress bar
showProgressIndicator(context);
},
)
],
),
),
);
},
);
},
child: Container(
padding: const EdgeInsets.all(8),
decoration: isSatTapped ? const BoxDecoration(
shape: BoxShape.circle,
color: Colors.blue,
) : null,
child: const Icon(
Icons.share,
color: Colors.white54,
),
),
),
),
],
),
),
Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const SizedBox(height: 5),
Text( // Display time of most recent server fetch
'Last updated at ${lastUpdate != null ?
(lastUpdate?.day == DateTime.now().day &&
lastUpdate?.month == DateTime.now().month &&
lastUpdate?.year == DateTime.now().year ?
'${lastUpdate?.hour}:${lastUpdate?.minute}' :
'${lastUpdate?.day}.${formatMonth(lastUpdate!.month)} ${lastUpdate?.year}') : ''}',
style: GoogleFonts.dmSans(
fontSize: 14,
color: Colors.white60,
),
),
],
),
const SizedBox(height: contPadding), // Padding between containers
Column( // Ice stats container
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
width: screenWidth * boxWidth,
child: Align(
alignment: Alignment.topLeft,
child: Padding(
padding: const EdgeInsets.only(top: 20, left: 30), // Updated padding
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Ice stats',
style: titleStyle,
),
const Divider(),
const SizedBox(height: 10), // Reduced padding
Text(
'Measured at ',
style: subHeadingStyle,
),
Text(
'Date: ${(selectedMeasurement?.timeMeasured.day ?? '-')}/${(selectedMeasurement?.timeMeasured.month ?? '-')}/${(selectedMeasurement?.timeMeasured.year ?? '-')}',
style: regTextStyle,
),
Text(
'Time: ${selectedMeasurement?.timeMeasured.hour}:00',
style: regTextStyle,
),
const SizedBox(height: contPadding),
Text(
'Measuring point: (${selectedMeasurement?.measurementID}, ${selectedMeasurement?.measurementID})',
style: regTextStyle,
),
],
),
),
),
),
const SizedBox(height: contPadding*2.5),
SizedBox(
width: screenWidth * boxWidth * 1.2,
child: const StatCharts(),
),
const SizedBox(height: contPadding*4),
],
),
],
);
},
);
}
}
// Saves all measurements to a file on the users mobile device
Future<void> _exportIceData() async {
final directory = await getExternalStorageDirectory();
final file = File('${directory?.path}/ice_data_$selectedLake.json');
// Convert JSON data to string
final jsonString = jsonEncode(selectedMarkerList);
// Write JSON data to file
await file.writeAsString(jsonString);
}
// Display a progress indicator while JSON data is being downloaded
void showProgressIndicator(BuildContext context) {
BuildContext? dialogContext;
showDialog(
context: context,
builder: (BuildContext context) {
dialogContext = context;
return WillPopScope(
onWillPop: () async => false, // Prevent dialog from being closed by user
child: const AlertDialog(
content: Column(
mainAxisSize: MainAxisSize.min,
children: [
CircularProgressIndicator(), // Progress indicator
SizedBox(height: 20),
Text('Exporting JSON data...'),
],
),
),
);
},
);
// Ensure that the progress indicator runs for at lest 1 second
Future.delayed(const Duration(seconds: 1), () {
try { // Download JSON data
_exportIceData();
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Downloaded ice data as JSON')),
);
} catch (e) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Error exporting JSON data: $e')),
);
} finally {
if (dialogContext != null) {
// Add 2 second delay before closing the dialog
Future.delayed(const Duration(seconds: 2), () {
Navigator.of(dialogContext!).pop();
Navigator.of(context).pop();
});
}
}
});
}