import 'package:flutter/material.dart';
import 'package:flutter_rating_bar/flutter_rating_bar.dart';
import 'package:mensaapp/modules/fetchMenu.dart';
import 'package:mensaapp/modules/ratingEmote.dart';
import 'package:mensaapp/modules/ratingStars.dart';
import 'package:mensaapp/providers/essenProvider.dart';
import 'package:mensaapp/providers/languageProvider.dart';
import 'package:mensaapp/providers/pageProvider.dart';
import 'package:provider/provider.dart';

class PageEssen extends StatelessWidget {
  const PageEssen({super.key});

  @override
  Widget build(BuildContext context) {
    final FocusNode _focus = FocusNode();

    return Consumer<LanguageProvider>(builder: (context, languageProvider, child){
      return GestureDetector(
        onTap: () {
          _focus.unfocus();
        },
        child: Scaffold(
          body: Stack(
            children: [
              // Hintergrundbild
              Center(
                child: Container(
                  width: MediaQuery.of(context).size.width * 0.8,
                  height: MediaQuery.of(context).size.height,
                  decoration: BoxDecoration(
                    image: DecorationImage(
                      image: AssetImage("assets/backgrounds/Essen.jpg"),
                      fit: BoxFit.cover, // Deckt den gesamten Bildschirm ab
                      colorFilter: ColorFilter.mode(
                        Colors.white.withOpacity(0.6),
                        BlendMode.dstATop,
                      ),
                    ),
                  ),
                ),
              ),
              // Vordergrundinhalte

              Center(
                child: SingleChildScrollView(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Consumer<PageProvider>(
                        builder: (context, pageProvider, child) {
                          return Text(
                            pageProvider.selectedEssenName,
                            style: TextStyle(fontSize: 40, fontWeight: FontWeight.bold),
                            textAlign: TextAlign.center,
                          );
                        },
                      ),
                      const SizedBox(
                        height: 30,
                      ),
                      Container(
                        decoration: BoxDecoration(
                            color: Colors.white.withOpacity(0.9),
                            borderRadius: const BorderRadius.only(
                                topLeft: Radius.circular(80),
                                bottomRight: Radius.circular(80))),
                        height: 400,
                        width: 600,
                        padding: EdgeInsets.symmetric(horizontal: 20),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text(
                                  Provider.of<LanguageProvider>(context).languageData[Provider.of<LanguageProvider>(context).language]["pageEssen"]["question1"],
                                  style: TextStyle(fontSize: 35),
                                ),
                                Consumer<EssenProvider>(
                                  builder: (context, essenProvider, child) {
                                    return RatingStars(
                                      onRate: (value) {
                                        essenProvider.setRatingGeschmack(value);
                                      },
                                      initRating: essenProvider.ratingGeschmack,
                                    );
                                  },
                                )
                              ],
                            ),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Text(
                                  Provider.of<LanguageProvider>(context).languageData[Provider.of<LanguageProvider>(context).language]["pageEssen"]["question2"],
                                  style: TextStyle(fontSize: 35),
                                ),
                                Consumer<EssenProvider>(
                                  builder: (context, essenProvider, child) {
                                    return RatingStars(
                                      onRate: (value) {
                                        essenProvider.setRatingQuali(value);
                                      },
                                      initRating: essenProvider.ratingQuali,
                                    );
                                  },
                                )
                              ],
                            ),
                            const SizedBox(
                              height: 50,
                            ),
                            Consumer<EssenProvider>(
                              builder: (context, essenProvider, child) {
                                return TextFormField(
                                  initialValue: essenProvider.freiText,
                                  onChanged: (value) {
                                    essenProvider.setFreiText(value);
                                  },
                                  autofocus: false,
                                  maxLength: 500,
                                  maxLines: 4,
                                  focusNode: _focus,
                                  decoration: InputDecoration(
                                    labelText: Provider.of<LanguageProvider>(context).languageData[Provider.of<LanguageProvider>(context).language]["textfield"],
                                    labelStyle: const TextStyle(fontSize: 20),
                                    border: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(15),
                                    ),
                                  ),
                                  onFieldSubmitted: (value) {
                                    Navigator.pop(context);
                                  },
                                  style: TextStyle(fontSize: 20),
                                );
                              },
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      );
    });
  }
}