import 'dart:async';

import 'package:design/design.dart';
import 'package:flutter/rendering.dart';
import 'package:guru_widgets/button/guru_button.dart';
import 'package:guru_widgets/guru_widgets.dart';
import 'package:guru_widgets/image/adaptive_image.dart';
import 'package:guru_widgets/theme/guru_theme.dart';
import 'package:guru_utils/router/router.dart';


class ConsolePopup extends StatefulWidget {
  final VoidCallback? onClosed;

  const ConsolePopup(
      {super.key,
      this.onClosed});

  @override
  State<StatefulWidget> createState() => _ConsolePopupState();
}

class _ConsolePopupState extends State<ConsolePopup> {
  late GuruDialogContainerDesignSpec designSpec;
  late GuruDialogDesignSpec dialogSpec;
  late GuruThemeData guruTheme;

  @override
  void initState() {
    super.initState();
    designSpec = GuruDialogContainerDesignSpec.get();
    dialogSpec = designSpec.dialogSpec;
  }

  @override
  Widget build(BuildContext context) {
    final td = Directionality.of(context);
    guruTheme = GuruTheme.of(context);
    final closeIcon = guruTheme.iconScheme.closeIcon;
    const spacer = SizedSpacer(height: 8, width: 8);
    final stackItems = <Widget>[
    Positioned.directional(
      textDirection: td,
      top: dialogSpec.closeButtonMargin.top,
      start: dialogSpec.closeButtonMargin.start,
      child: TapWidget(
          inkWell: true,
          shape: const CircleBorder(),
          onTap: () {
            widget.onClosed!();
          },
          child: SizedBox(
            width: dialogSpec.closeButtonSize,
            height: dialogSpec.closeButtonSize,
            child: Center(
                child: (closeIcon != null)
                      ? Image.asset(closeIcon,
                          fit: BoxFit.contain,
                          width: dialogSpec.closeIconSize,
                          height: dialogSpec.closeIconSize)
                      : Icon(Icons.close, size: dialogSpec.closeIconSize))),
          )),
      Padding(
        padding: dialogSpec.contentPadding,
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            GuruButton(
              size: const Size(271, 48),
              action: "Paint Size",
              onPressed: () {
                debugPaintSizeEnabled = !debugPaintSizeEnabled;
              },
            ),
            spacer,
            GuruButton(
              size: const Size(271, 48),
              action: "Paint Baselines",
              onPressed: () {
                debugPaintBaselinesEnabled = !debugPaintBaselinesEnabled;
              },
            ),
            spacer,
            GuruButton(
              size: const Size(271, 48),
              action: "Paint Layer Borders",
              onPressed: () {
                debugPaintLayerBordersEnabled = !debugPaintLayerBordersEnabled;
              },
            ),
            spacer,
            GuruButton(
              size: const Size(271, 48),
              action: "Paint Pointers",
              onPressed: () {
                debugPaintPointersEnabled = !debugPaintPointersEnabled;
              },
            ),
          ],
        ),
      )
    ];

    return Stack(
      fit: StackFit.loose,
      alignment: Alignment.center,
      children: stackItems,
    );
  }
}