import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
import 'package:sliding_up_panel/sliding_up_panel.dart';
import 'package:fast_network_navigation/modules/navigation.dart';

class MapPage extends StatefulWidget {
  @override
  _MapPageState createState() => _MapPageState();
}

class _MapPageState extends State<MapPage> {

  @override
  Widget build(BuildContext context) {
    final ThemeData theme = Theme.of(context);
    return SlidingUpPanel(
        renderPanelSheet: false,
        panel: _floatingPanel(theme),
        collapsed: _floatingCollapsed(theme),
        body: FlutterMap(
          options: MapOptions(
            initialZoom: 11,
          ),
          children: [
            openStreetMapTileLayer,
          ],
        ),
    );
  }

  Widget _floatingCollapsed(ThemeData theme){
    return Container(
      decoration: BoxDecoration(
        color: theme.canvasColor,
        borderRadius: BorderRadius.only(topLeft: Radius.circular(24.0), topRight: Radius.circular(24.0)),
      ),
      
      child: Greeting(theme)
    );
  }

  Widget _floatingPanel(ThemeData theme){
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.all(Radius.circular(24.0)),
        boxShadow: [
          BoxShadow(
            blurRadius: 20.0,
            color: theme.shadowColor,
          ),
        ]
      ),
      child: Center(
        child: Padding(
        padding: EdgeInsets.all(8.0),
        child: SingleChildScrollView(
          child: Column(
            children: <Widget>[
              Greeting(theme),
              Text("Got a lot to do today! Here is a rundown:"),
              singleDestination(context, "Location 1", "some description", "Further information"),
              singleDestination(context, "Location 2", "some description", "Further information"),
              singleDestination(context, "Location 3", "some description", "Further information"),
              singleDestination(context, "Location 4", "some description", "Further information"),
              singleDestination(context, "Location 5", "some description", "Further information"),
              singleDestination(context, "Location 6", "some description", "Further information"),
              singleDestination(context, "Location 7", "some description", "Further information"),
              singleDestination(context, "Location 8", "some description", "Further information"),
            ],
          ),
        ),
      ),
    ),
    );
  }

  Widget Greeting (ThemeData theme) {
    return Center(
        child: Text(
          "Explore Kview",
          style: TextStyle(color: theme.primaryColor, fontSize: 24.0, fontWeight: FontWeight.bold),
        ),
      );
  }
}

TileLayer get openStreetMapTileLayer => TileLayer(
  urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
  userAgentPackageName: 'flutter_map',
);

// Add a pin to the map