import 'package:flutter/material.dart';
import 'package:teso/util/consts.dart';

import 'package:teso/Pages/PageWidgets/CoinPurchase/selector.dart';
import 'CoinsPurchase/GoldTransactions.dart';
import 'CoinsPurchase/SilverTransaction.dart';

class Coins extends StatefulWidget {
  final int initalPage;

  const Coins({Key key, @required this.initalPage}) : super(key: key);
  @override
  _CoinsState createState() => _CoinsState();
}

class _CoinsState extends State<Coins> {
  PageController _pageController;
  Color goldText = Colors.white;
  Color silverText = tesoBlue;
  List<Color> gold = [
    tesoBlue,
    tesoBlue,
  ];
  List<Color> silver = [
    Colors.white,
    Colors.white,
  ];

  void selectGold() {
    setState(() {
      gold = [
        tesoBlue,
        tesoBlue,
      ];
      silver = [
        Colors.white,
        Colors.white,
      ];
      goldText = Colors.white;
      silverText = tesoBlue;
    });
  }

  void selectSilver() {
    setState(() {
      silver = [
        tesoBlue,
        tesoBlue,
      ];
      gold = [
        Colors.white,
        Colors.white,
      ];
      silverText = Colors.white;
      goldText = tesoBlue;
    });
  }

  void selectedPage(int pages) {
    if (pages == 0) {
      selectGold();
      _pageController.jumpToPage(0);
    } else {
      selectSilver();
      _pageController.jumpToPage(1);
    }
  }

  @override
  void initState() {
    super.initState();
    _pageController =
        PageController(initialPage: widget.initalPage, keepPage: false);
    widget.initalPage == 0 ? selectGold() : selectSilver();
  }

  @override
  void dispose() {
    super.dispose();
    _pageController.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(
        child: Container(
          height: MediaQuery.of(context).size.width -
              (MediaQuery.of(context).size.width * 0.5),
          width: MediaQuery.of(context).size.width,
          decoration: BoxDecoration(
            gradient: LinearGradient(
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              colors: [tesoGold, tesoAsh, tesoBlue],
            ),
          ),
          child: Column(
            children: [
              AppBar(
                backgroundColor: Colors.transparent,
                leading: IconButton(
                  icon: Icon(
                    Icons.arrow_back_ios,
                    color: Colors.white,
                  ),
                  onPressed: () => Navigator.pop(context),
                ),
                title: Center(
                    child: Text(
                  "Teso Coins",
                  style: TextStyle(color: Colors.white),
                )),
              ),
              SizedBox(height: 20.0),
              Container(
                padding: EdgeInsets.all(5),
                width: MediaQuery.of(context).size.width -
                    (MediaQuery.of(context).size.width * 0.28),
                height: 52.5,
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.only(
                    topRight: Radius.circular(25),
                    topLeft: Radius.circular(25),
                    bottomLeft: Radius.circular(25),
                    bottomRight: Radius.circular(25),
                  ),
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    buildSelector(
                        context,
                        "Gold Coins",
                        MediaQuery.of(context).size.width -
                            (MediaQuery.of(context).size.width * 0.25),
                        gold,
                        () => selectedPage(0),
                        goldText),
                    buildSelector(
                        context,
                        "Silver Coins",
                        MediaQuery.of(context).size.width -
                            (MediaQuery.of(context).size.width * 0.25),
                        silver,
                        () => selectedPage(1),
                        silverText),
                  ],
                ),
              ),
            ],
          ),
        ),
        preferredSize: Size.fromHeight(
          MediaQuery.of(context).size.width -
              (MediaQuery.of(context).size.width * 0.5),
        ),
      ),
      body: PageView(
        controller: _pageController,
        onPageChanged: (int i) {
          selectedPage(i);
        },
        //physics: NeverScrollableScrollPhysics(),
        children: [
          GoldTransactions(),
          SilverTransaction(),
        ],
      ),
    );
  }
}