import 'dart:async';

import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';

class ConectandoPage extends StatefulWidget {
  @override
  _ConectandoPageState createState() => _ConectandoPageState();
}

class _ConectandoPageState extends State<ConectandoPage> {
  late Timer _timer;
  int _start = 3;

  void _startTimer(){
    const oneSec = Duration(
      seconds: 1,
    );

    _timer = Timer.periodic(
      oneSec,
      (timer){
        if(_start == 0){
          setState((){
            _start = 3;
          });
        }else if(_start == 2){
          setState((){
            _start--;
          });
        }else{
          setState(() => _start--);
        }
      },
    );
  }

  @override
  void dispose() {
    super.dispose();
    _timer.cancel();
  }

  @override
  void initState() {
    super.initState();
    _startTimer();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            const CircularProgressIndicator(),
            const SizedBox(height: 8.0),
            AnimatedCrossFade(
              firstChild: Text(
                "Conectando con el servidor de S&P...",
                textAlign: TextAlign.center,
                style: GoogleFonts.robotoSlab(
                  fontWeight: FontWeight.bold,
                  color: const Color(0xFFB40404),
                  fontSize: 16.0,
                ),
              ),
              secondChild: Text(
                "Conectando con el servidor de S&P...",
                textAlign: TextAlign.center,
                style: GoogleFonts.robotoSlab(
                  fontWeight: FontWeight.bold,
                  color: const Color(0x55B40404),
                  fontSize: 16.0,
                ),
              ),
              duration: const Duration(
                seconds: 2,
              ),
              crossFadeState: _start > 0 && _start <= 2 ? CrossFadeState.showFirst : CrossFadeState.showSecond,
            ),
          ],
        ),
      ),
    );
  }
}

