import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:photobooth_mobile_app/modules/camera/camera_screen.dart';

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

  @override
  _FrameSelectionScreenState createState() => _FrameSelectionScreenState();
}

class _FrameSelectionScreenState extends State<FrameSelectionScreen> {
  String? selectedFrameAsset;

  final frames = [
    {
      'asset': 'assets/images/nurtech_twibbon.png',
      'sample': 'assets/images/nurtech_sample.png',
      'label': 'Nurtech School',
    },
    {
      'asset': 'assets/images/nuruliman_twibbon.png',
      'sample': 'assets/images/nuruliman_sample.png',
      'label': 'Nurul Iman',
    },
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Pilih Frame')),
      body: Padding(
        padding: EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Expanded(
              child: Column(
                children: frames.map((f) {
                  final asset = f['asset']!;
                  final sample = f['sample']!;
                  final label = f['label']!;
                  final isSelected = selectedFrameAsset == asset;
                  return Expanded(
                    child: GestureDetector(
                      onTap: () => setState(() => selectedFrameAsset = asset),
                      child: AnimatedContainer(
                        duration: Duration(milliseconds: 200),
                        margin: EdgeInsets.all(8),
                        padding: EdgeInsets.all(8),
                        decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(12),
                          boxShadow: [
                            BoxShadow(color: Colors.black12, blurRadius: 6),
                          ],
                          border: isSelected
                              ? Border.all(color: Colors.deepOrange, width: 2)
                              : null,
                        ),
                        child: Column(
                          children: [
                            Expanded(
                              child: Image.asset(sample, fit: BoxFit.contain),
                            ),
                            SizedBox(height: 8),
                            Text(label, textAlign: TextAlign.center),
                          ],
                        ),
                      ),
                    ),
                  );
                }).toList(),
              ),
            ),
            SizedBox(height: 12),
            ElevatedButton(
              onPressed: selectedFrameAsset == null
                  ? null
                  : () => Navigator.push(
                      context,
                      CupertinoPageRoute(
                        builder: (_) => CameraCaptureScreen(
                          frameAsset: selectedFrameAsset!,
                        ),
                      ),
                    ),
              child: Padding(
                padding: EdgeInsets.symmetric(horizontal: 20, vertical: 12),
                child: Text('Lanjutkan', style: TextStyle(fontSize: 16)),
              ),
            ),
            SizedBox(height: 12),
          ],
        ),
      ),
    );
  }
}