import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:hris_selfservice_mobile/Screens/ForgotPassword/forgotPassword_screen.dart';
import 'package:hris_selfservice_mobile/Screens/Login/background.dart';
import 'package:hris_selfservice_mobile/Screens/Home/home_screen.dart';
import 'inputWidget.dart';

class LoginView extends StatefulWidget {
  @override
  _LoginView createState() => _LoginView();
}

class _LoginView extends State<LoginView> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        resizeToAvoidBottomInset: false,
        backgroundColor: Colors.white,
        body: Stack(
          children: <Widget>[
            Background(),
            LoginScreen(),
          ],
        ));
  }
}

class LoginScreen extends StatelessWidget {
  const LoginScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: <Widget>[
          Padding(
            padding:
            EdgeInsets.only(top: MediaQuery.of(context).size.height / 2.45),
          ),
          Column(
            children: <Widget>[
              Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  Padding(
                    padding: EdgeInsets.only(top: 0),
                    child: Text(
                      "Login",
                      style: GoogleFonts.knewave(
                          color: Colors.blueAccent, fontSize: 25),
                    ),
                  ),
                ],
              ),
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  Padding(
                    padding: EdgeInsets.only(left: 40, bottom: 5, top: 20),
                    child: Text(
                      "Email",
                      style: TextStyle(fontSize: 16, color: Colors.black87),
                    ),
                  ),
                  Stack(
                    alignment: Alignment.bottomRight,
                    children: <Widget>[
                      InputWidgetEmail(20.0, 20.0),
                      Padding(
                        padding: EdgeInsets.only(right: 50),
                      ),
                    ],
                  ),
                ],
              ),
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  Padding(
                    padding: EdgeInsets.only(left: 40, bottom: 5),
                    child: Text(
                      "Password",
                      style: TextStyle(fontSize: 16, color: Colors.black87),
                    ),
                  ),
                  Stack(
                    alignment: Alignment.bottomRight,
                    children: <Widget>[
                      InputWidgetPassword(20.0, 20.0),
                      Padding(
                        padding: EdgeInsets.only(right: 15),
                        child: Row(
                          children: <Widget>[
                            Expanded(
                                child: Padding(
                                  padding: EdgeInsets.only(top: 0),
                                )),
                            InkWell(
                              child: Container(
                                padding: EdgeInsets.all(10),
                                decoration: ShapeDecoration(
                                  shape: CircleBorder(),
                                  gradient: LinearGradient(
                                      colors: Gradients2,
                                      begin: Alignment.topLeft,
                                      end: Alignment.bottomRight),
                                ),
                                child: ImageIcon(
                                  AssetImage("assets/images/ic_forward.png"),
                                  size: 40,
                                  color: Colors.white,
                                ),
                              ),
                              onTap: () {
                                Navigator.pushReplacement(context, MaterialPageRoute(builder: (context) => HomeView()));
                              },
                            )
                          ],
                        ),
                      ),
                    ],
                  ),
                ],
              ),
              Padding(
                padding: EdgeInsets.only(bottom: 10),
              ),
              InkWell(
                  child: roundedRectButton("Forgot Password?", Gradients1, false),
                  onTap: () {
                    Navigator.push(context, MaterialPageRoute(builder: (context) => ForgotPasswordView()));
                  })
            ],
          )
        ],
      ),
    );
  }
}

Widget roundedRectButton(
    String title, List<Color> gradient, bool isEndIconVisible) {
  return Builder(builder: (BuildContext mContext) {
    return Align(
      alignment: Alignment.centerLeft,
      child: Stack(
        children: <Widget>[
          Container(
            alignment: Alignment.centerRight,
            width: MediaQuery.of(mContext).size.width / 2.45,
            decoration: ShapeDecoration(
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.only(
                      topRight: Radius.circular(20.0),
                      bottomRight: Radius.circular(20.0))),
              gradient: LinearGradient(
                  colors: gradient,
                  begin: Alignment.topLeft,
                  end: Alignment.bottomRight),
            ),
            child: Text(title,
                style: TextStyle(
                    color: Colors.white,
                    fontSize: 15,
                    fontWeight: FontWeight.w500)),
            padding: EdgeInsets.all(10),
          ),
          Visibility(
            visible: isEndIconVisible,
            child: Padding(
                padding: EdgeInsets.only(right: 10),
                child: ImageIcon(
                  AssetImage("assets/images/ic_forward.png"),
                  size: 30,
                  color: Colors.white,
                )),
          ),
        ],
      ),
    );
  });
}

const List<Color> Gradients1 = [
  Color(0xFF0EDED2),
  Color(0xFF03A0FE),
  Colors.pink,
];

const List<Color> Gradients2 = [
  Color(0xFFFF9945),
  Color(0xFFFc6076),
];
