import 'package:flutter/material.dart';

import '../services/hover_color.dart';

/// Ekran oranı buton ızgarası: 31 buton `a:b` (a dikeyi, b yatayı böler;
/// hedef boyut `W/b × H/a`). Sol-üst hücre `H:W` etiketi — buton değil
/// (1:1 yok: title bar çift tık zaten tam ekran).
///
/// Yerleşim: 8 satır × 4 sütun; hücreler mevcut alanı kaplayacak şekilde
/// esner (pencere/sekme alanı büyüdükçe butonlar büyür).
class WindowSizeSelector extends StatelessWidget {
  final Future<Size?> Function() workArea;
  final void Function(int rows, int cols, Size work) onPick;

  const WindowSizeSelector({
    super.key,
    required this.workArea,
    required this.onPick,
  });

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        for (var b = 1; b <= 8; b++)
          Expanded(
            child: Row(
              children: [
                for (var a = 1; a <= 4; a++) Expanded(child: _cell(a, b)),
              ],
            ),
          ),
      ],
    );
  }

  /// Satır = `b` (1..8, yatay bölün); satır içinde `a` (1..4, dikey bölün).
  Widget _cell(int a, int b) {
    return Padding(
      padding: const EdgeInsets.only(right: 3, bottom: 3),
      child: a == 1 && b == 1
          ? _gridLabel('H:W')
          : _SizeCell(
              a: a,
              b: b,
              onTap: () async {
                final work = await workArea();
                if (work != null) onPick(a, b, work);
              },
            ),
    );
  }

  Widget _gridLabel(String text) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white10,
        borderRadius: BorderRadius.circular(4),
      ),
      alignment: Alignment.center,
      child: Text(
        text,
        style: const TextStyle(color: Colors.white54, fontSize: 11),
      ),
    );
  }
}

class _SizeCell extends StatefulWidget {
  final int a;
  final int b;
  final VoidCallback onTap;

  const _SizeCell({required this.a, required this.b, required this.onTap});

  @override
  State<_SizeCell> createState() => _SizeCellState();
}

class _SizeCellState extends State<_SizeCell> {
  bool _hover = false;

  @override
  Widget build(BuildContext context) {
    return MouseRegion(
      cursor: SystemMouseCursors.click,
      onEnter: (_) => setState(() => _hover = true),
      onExit: (_) => setState(() => _hover = false),
      child: GestureDetector(
        onTap: widget.onTap,
        child: ValueListenableBuilder<Color>(
          valueListenable: HoverColor.notifier,
          builder: (context, hover, _) => AnimatedContainer(
            duration: const Duration(milliseconds: 100),
            decoration: BoxDecoration(
              color: _hover ? hover.withValues(alpha: 0.4) : Colors.white10,
              borderRadius: BorderRadius.circular(4),
            ),
            alignment: Alignment.center,
            child: Text(
              '${widget.a}:${widget.b}',
              style: const TextStyle(color: Colors.white, fontSize: 12),
            ),
          ),
        ),
      ),
    );
  }
}