import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:xiao_pet_tracker/app_router/app_router.dart';
import 'package:xiao_pet_tracker/xiao_connector/cubit/xiao_connector_cubit.dart';

class CaptureView extends StatefulWidget {
  const CaptureView({super.key});

  @override
  State<CaptureView> createState() => _CaptureViewState();
}

class _CaptureViewState extends State<CaptureView> {
  late TextEditingController _controller;
  bool _isTextFieldFocused = false;

  @override
  void initState() {
    super.initState();
    _controller = TextEditingController();
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    // final count = context.select((XiaoConnectorCubit cubit) => cubit.state);
    final lastCapturePoint = context
        .select((XiaoConnectorCubit cubit) => cubit.state.lastCapturedPoint);
    return Scaffold(
      appBar: AppBar(
        title: const Text('Live Feed'),
      ),
      body: SingleChildScrollView(
        child: Center(
          child: Column(
            children: [
              const SizedBox(
                height: 8,
              ),
              ElevatedButton(
                onPressed: () {
                  context.read<XiaoConnectorCubit>().stopCapturing();
                },
                child: const Text('Close Live Feed'),
              ),
              const SizedBox(
                height: 12,
              ),
              const Text(
                'Last Captured Point',
                style: TextStyle(fontWeight: FontWeight.bold),
              ),
              const Divider(
                indent: 80,
                endIndent: 80,
              ),
              const Text(
                'Received Time',
                style: TextStyle(fontWeight: FontWeight.bold),
              ),
              Text(
                '${DateTime.fromMillisecondsSinceEpoch(
                  lastCapturePoint?.millisecondsSinceEpochReceived ?? 0,
                )}',
              ),
              const Text(
                'Send Time',
                style: TextStyle(fontWeight: FontWeight.bold),
              ),
              const Text('(time the controller send the data)'),
              Text(
                '${DateTime.fromMillisecondsSinceEpoch(
                  lastCapturePoint?.millisecondsSinceEpochSend ?? 0,
                )}',
              ),
              const SizedBox(
                height: 12,
              ),
              ElevatedButton(
                onPressed: () {
                  // context.read<XiaoConnectorCubit>().startCapturing(
                  //       captureType: 'test',
                  //     );
                  final timeToSend = DateTime.now().millisecondsSinceEpoch;
                  context.read<XiaoConnectorCubit>().setTime(timeToSend);
                },
                child: const Text('Send new Timestamp'),
              ),
              const SizedBox(
                height: 12,
              ),
              const Divider(
                indent: 80,
                endIndent: 80,
              ),
              Text('Acceleration X: ${lastCapturePoint?.accelerationX}'),
              Text('Acceleration Y: ${lastCapturePoint?.accelerationY}'),
              Text('Acceleration Z: ${lastCapturePoint?.accelerationZ}'),
              const Divider(
                indent: 80,
                endIndent: 80,
              ),
              Text('Rotation X: ${lastCapturePoint?.rotationX}'),
              Text('Rotation Y: ${lastCapturePoint?.rotationY}'),
              Text('Rotation Z: ${lastCapturePoint?.rotationZ}'),
              const SizedBox(
                height: 16,
              ),
              Padding(
                padding: const EdgeInsets.only(left: 32, right: 32, top: 16),
                child: FocusScope(
                  child: Focus(
                    onFocusChange: (focus) {
                      _isTextFieldFocused = focus;
                      setState(() {});
                    },
                    child: TextField(
                      controller: _controller,
                      decoration: const InputDecoration(
                        label: Text('Capture Name'),
                      ),
                    ),
                  ),
                ),
              ),
              const SizedBox(
                height: 16,
              )
            ],
          ),
        ),
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
      floatingActionButton: _isTextFieldFocused
          ? null
          : FloatingActionButton.large(
              child: context.read<XiaoConnectorCubit>().isRecording
                  ? const Stack(
                      children: [
                        Align(
                          child: Icon(Icons.pause),
                        ),
                        Align(
                          child: SizedBox.expand(
                            child: Padding(
                              padding: EdgeInsets.all(12),
                              child: CircularProgressIndicator(),
                            ),
                          ),
                        ),
                      ],
                    )
                  : const Icon(Icons.play_arrow),
              onPressed: () {
                if (_controller.value.text == '') {
                  showDialog(
                    context: context,
                    builder: (BuildContext context) {
                      return AlertDialog(
                        title: const Text(
                          'Please enter Capture Name',
                        ),
                        content: const Text(
                          'You need to enter a capture name before you can start capturing data.',
                        ),
                        actions: <Widget>[
                          TextButton(
                            onPressed: () {
                              Navigator.of(context).pop();
                            },
                            child: const Text(
                              'Ok',
                            ),
                          ),
                        ],
                      );
                    },
                  );
                } else {
                  context.read<XiaoConnectorCubit>().toggleRecording(
                        captureType: _controller.value.text,
                      );
                }
              },
            ),
    );
  }
}