import 'package:flutter/material.dart';
import 'package:flutter_homescreen/layout_size_helper.dart';

// The Home page.
class HomePage extends StatelessWidget {
  final Function(int index) onSetNavigationIndex;

  const HomePage({Key? key, required this.onSetNavigationIndex})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    var sizeHelper = LayoutSizeHelper(context);
    return Container(
        decoration: BoxDecoration(
            gradient: LinearGradient(
                begin: Alignment.topRight,
                end: Alignment.bottomLeft,
                colors: [Colors.blueGrey.shade800, Colors.grey.shade900])),
        constraints: BoxConstraints.expand(),
        alignment: Alignment.center,
        child: Wrap(
          spacing: sizeHelper.largePadding,
          runSpacing: sizeHelper.largePadding,
          children: <Widget>[
            _HomePageEntry(
              label: "DASHBOARD",
              icon: Icons.drive_eta,
              onPressed: () {
                onSetNavigationIndex(1);
              },
            ),
            _HomePageEntry(
              label: "HVAC",
              icon: Icons.thermostat,
              onPressed: () {
                onSetNavigationIndex(2);
              },
            ),
            _HomePageEntry(
              label: "MEDIA",
              icon: Icons.music_note,
              onPressed: () {
                onSetNavigationIndex(3);
              },
            ),
          ],
        ));
  }
}

// Each one of the items on the Home page.
class _HomePageEntry extends StatelessWidget {
  final String label;
  final IconData icon;
  final Null Function() onPressed;

  const _HomePageEntry(
      {Key? key,
      required this.label,
      required this.icon,
      required this.onPressed})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    var sizeHelper = LayoutSizeHelper(context);
    return Padding(
        padding: const EdgeInsets.symmetric(vertical: 8.0),
        child: Column(
          children: [
            ElevatedButton(
              style: ElevatedButton.styleFrom(
                shape: CircleBorder(),
                padding: EdgeInsets.all(sizeHelper.largePadding),
                primary: Colors.lightBlue.shade800,
                side: BorderSide(
                    width: sizeHelper.defaultBorder,
                    color: Colors.lightBlue.shade200),
              ),
              onPressed: onPressed,
              child: Icon(
                icon,
                color: Colors.lightBlue.shade50,
                size: sizeHelper.largeIconSize,
              ),
            ),
            Padding(
              padding: EdgeInsets.all(sizeHelper.defaultPadding),
              child: Text(
                label,
                style: DefaultTextStyle.of(context).style.copyWith(
                      fontSize: sizeHelper.baseFontSize,
                      color: Colors.lightBlue.shade100,
                    ),
              ),
            ),
          ],
        ));
  }
}