content: import 'package:flutter/material.dart';
  import 'package:mm_remote/dao/commandArgumentsDao.dart';
  import 'package:mm_remote/models/commandArguments.dart';
  import 'package:mm_remote/screens/addCommand.dart';
  import 'package:mm_remote/services/httpRest.dart';
  import 'package:mm_remote/shared/colors.dart';
  
  class CustomCommandsTab extends StatefulWidget {
    final String deviceName;
    final HttpRest _httpRest;
  
    CustomCommandsTab(this.deviceName, this._httpRest);
  
    @override
    _CustomCommandsTabState createState() => _CustomCommandsTabState();
  }
  
  class _CustomCommandsTabState extends State<CustomCommandsTab> {
    List<Widget> _customCommands = <Widget>[];
  
    @override
    void initState() {
      super.initState();
      final List<Widget> _customCommandsTemp = <Widget>[];
  
      getAllCommandArguments(this.widget.deviceName).forEach((command) {
        Card _newCommand = _createCommandCard(command.commandName,
            command.notification, command.payload, context, false);
        _customCommandsTemp.add(_newCommand);
      });
      setState(() {
        _customCommands = _customCommandsTemp;
      });
    }
  
    @override
    Widget build(BuildContext context) {
      var _deviceOrientation = MediaQuery
          .of(context)
          .orientation;
      return new Container(
        color: backgroundColor,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Expanded(
              child: GridView.count(
                crossAxisCount:
                _deviceOrientation == Orientation.portrait ? 1 : 2,
                padding: _deviceOrientation == Orientation.portrait
                    ? EdgeInsets.all(16.0)
                    : EdgeInsets.fromLTRB(8.0, 0.0, 8.0, 0.0),
                childAspectRatio: _deviceOrientation == Orientation.portrait
                    ? 8.0 / 2.0
                    : 8.0 / 2.25,
                children: _customCommands,
              ),
            ),
            Align(
                alignment:
                Alignment.lerp(Alignment.center, Alignment.centerRight, 0.85),
                child: Tooltip(
                  message: 'Create new custom-command',
                  child: FloatingActionButton(
                    child: Icon(
                      Icons.add,
                      color: accentColor,
                      size: 35,
                    ),
                    backgroundColor: secondaryColor,
                    //padding: EdgeInsets.fromLTRB(20.0, 13.0, 20.0, 13.0),
                    elevation: 5.0,
                    onPressed: () {
                      _navigateAndCreateCustomCommand(context);
                    },
                  ),
                )),
            SizedBox(height: 20),
          ],
        ),
      );
    }
  
    _navigateAndCreateCustomCommand(BuildContext context) async {
      final result = await Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => AddCommandPage()),
      );
      CommandArguments _commandArguments = result;
  
      Card _newCommand = _createCommandCard(
          _commandArguments.commandName,
          _commandArguments.notification,
          _commandArguments.payload,
          context,
          true);
      final List<Widget> _customCommandsTemp = <Widget>[];
      _customCommandsTemp.addAll(_customCommands);
      _customCommandsTemp.add(_newCommand);
  
      setState(() {
        _customCommands = _customCommandsTemp;
      });
    }
  
    void _deleteCommand(String commandName) {
      deleteCommandArguments(widget.deviceName, commandName);
  
      final List<Widget> _customCommandsTemp = <Widget>[];
      getAllCommandArguments(widget.deviceName).forEach((command) {
        Card _newCommand = _createCommandCard(command.commandName,
            command.notification, command.payload, context, false);
        _customCommandsTemp.add(_newCommand);
      });
  
      setState(() {
        _customCommands = _customCommandsTemp;
      });
    }
  
    Card _createCommandCard(String commandName, String notification,
        String payload, BuildContext context, bool persist) {
      if (persist) {
        persistCommandArguments(
            widget.deviceName, commandName, notification, payload);
      }
      return Card(
        clipBehavior: Clip.antiAlias,
        child: Padding(
          padding: EdgeInsets.fromLTRB(4.0, 4.0, 4.0, 4.0),
          child: new Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Flexible(
                fit: FlexFit.tight,
                child: TextButton(
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: <Widget>[
                      Text(
                        commandName,
                        softWrap: true,
                        overflow: TextOverflow.ellipsis,
                        maxLines: 2,
                        textScaleFactor: 1.1,
                        style: TextStyle(
                          color: accentColor,
                        ),
                      ),
                    ],
                  ),
                  onPressed: () {
                    this
                        .widget
                        ._httpRest
                        .executeCustomCommand(commandName, notification, payload);
                  },
                ),
              ),
              IconButton(
                icon: Icon(Icons.delete, size: 24.0),
                color: tertiaryColorMedium,
                tooltip: 'Delete command',
                onPressed: () {
                  _deleteCommand(commandName);
                },
              )
            ],
          ),
        ),
      );
    }
  }
  