import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:rogapp/pages/index/index_controller.dart';
import 'package:rogapp/routes/app_pages.dart';

class LoginPage extends StatelessWidget {

  final IndexController indexController = Get.find<IndexController>();

  TextEditingController emailController = TextEditingController();
  TextEditingController passwordController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
        backgroundColor: Colors.white,
        appBar: AppBar(
          elevation: 0,
          brightness: Brightness.light,
          backgroundColor: Colors.white,
          leading:
          IconButton( onPressed: (){
            Navigator.pop(context);
          },icon:Icon(Icons.arrow_back_ios,size: 20,color: Colors.black,)),
        ),
      body: 
      indexController.currentUser.length == 0 ?
      Container(
        height: MediaQuery.of(context).size.height,
        width: double.infinity,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            Column(
              children: [
                Column(
                  children: [
                    Text ("ログイン", style: TextStyle(
                      fontSize: 30,
                      fontWeight: FontWeight.bold,
                    ),),
                    SizedBox(height: 20,),
                    Text("お帰りなさい ！資格情報を使用してログインします",style: TextStyle(
                      fontSize: 15,
                      color: Colors.grey[700],
                    ),),
                    SizedBox(height: 30,)
                  ],
                ),
                Padding(
                  padding: EdgeInsets.symmetric(
                    horizontal: 40
                  ),
                  child: Column(
                    children: [
                      makeInput(label: "Eメール", controller: emailController),
                      makeInput(label: "パスワード", controller: passwordController, obsureText: true),
                    ],
                  ),
                ),
                Padding(
                  padding: EdgeInsets.symmetric(horizontal: 40),
                  child: Container(
                    padding: EdgeInsets.only(top: 3,left: 3),
                    decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(40),
                        border: Border(
                            bottom: BorderSide(color: Colors.black),
                            top: BorderSide(color: Colors.black),
                            right: BorderSide(color: Colors.black),
                            left: BorderSide(color: Colors.black)
                        )
                    ),
                    child: Obx((() => 
                      indexController.is_loading == true ? MaterialButton(
                      minWidth: double.infinity,
                      height:60,
                      onPressed: (){
                        
                      },
                      color: Colors.grey[400],
                      shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(40)
                      ),
                      child: CircularProgressIndicator(),
                    ) :
                      MaterialButton(
                      minWidth: double.infinity,
                      height:60,
                      onPressed: (){
                        if(emailController.text.isEmpty || passwordController.text.isEmpty){
                          Get.snackbar(
                            "No values",
                            "Email and password required",
                            icon: Icon(Icons.assistant_photo_outlined, size: 40.0, color: Colors.blue),
                            snackPosition: SnackPosition.TOP,
                            duration: Duration(milliseconds: 800),
                            backgroundColor: Colors.yellow,
                            //icon:Image(image:AssetImage("assets/images/dora.png"))
                          );
                          return;
                        }
                        indexController.is_loading.value = true;
                        indexController.login(emailController.text, passwordController.text, context);
                      },
                      color: Colors.indigoAccent[400],
                      shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(40)
                      ),
                      child: Text("ログイン",style: TextStyle(
                        fontWeight: FontWeight.w600,fontSize: 16,color: Colors.white70
                      ),
                      ),
                    ) 
                    ),
                  ),
                )
                ),
                SizedBox(height: 20,),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Flexible(
                      child: Text("アカウントをお持ちではありませんか？", style: TextStyle(
                        overflow: TextOverflow.ellipsis,
                      ),),
                    ),
                    TextButton(
                      onPressed: (){
                        Get.toNamed(AppPages.REGISTER);
                      },
                      child: Text("サインアップ",style: TextStyle(
                        fontWeight: FontWeight.w600,
                        fontSize: 18
                      ),),
                    ),
                  ],
                )
              ],

            ),
          ],
        ),
      ):
      Container(
        child: TextButton(
          onPressed: (){
            indexController.currentUser.clear();
          },
          child: Text("Already Logged in, Click to logout"),
        ),
      )
      ,
    );
  }
}

Widget makeInput({label, required TextEditingController controller, obsureText = false}){
  return Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      Text(label,style:TextStyle(
        fontSize: 15,
        fontWeight: FontWeight.w400,
        color: Colors.black87
      ),),
      SizedBox(height: 5,),
      TextField(
        controller: controller,
        obscureText: obsureText,
        decoration: InputDecoration(
          contentPadding: EdgeInsets.symmetric(vertical: 0,horizontal: 10),
          enabledBorder: OutlineInputBorder(
            borderSide: BorderSide(
              color: (Colors.grey[400])!,
            ),
          ),
          border: OutlineInputBorder(
            borderSide: BorderSide(color: (Colors.grey[400])!
          ),
        ),
      ),
      ),
      SizedBox(height: 30.0,)
    ],
  );
}