using UnityEngine;
using UnityEngine.UIElements;
using System.Collections;
using System.Collections.Generic;

namespace UI
{
    public class MainMenuController : MonoBehaviour
    {
        private VisualElement _logoContainer;
        private VisualElement _logo;
        private VisualElement _ribbon;
        private VisualElement _logoPlaceholder;
        private bool _isActive = false;

        public float transitionDuration = 0.5f;

        private void OnEnable()
        {
            var root = GetComponent<UIDocument>().rootVisualElement;

            _logoContainer = root.Q<VisualElement>("beat-logo-container");
            _logo = root.Q<VisualElement>("beat-logo");
            _ribbon = root.Q<VisualElement>("menu-ribbon");
            _logoPlaceholder = root.Q<VisualElement>("logo-placeholder");

            _logoContainer.RegisterCallback<ClickEvent>(OnLogoClicked);

            // Routing
            root.Q<Button>("btn-create")?.RegisterCallback<ClickEvent>(ev => UIManager.Instance.ShowScreen("Lobby"));
            root.Q<Button>("btn-join")?.RegisterCallback<ClickEvent>(ev => UIManager.Instance.ShowScreen("Lobby"));
            root.Q<Button>("btn-settings")?.RegisterCallback<ClickEvent>(ev => UIManager.Instance.ToggleSettings());
            root.Q<Button>("btn-profile")?.RegisterCallback<ClickEvent>(ev => UIManager.Instance.ShowScreen("Profile"));
            root.Q<Button>("btn-exit")?.RegisterCallback<ClickEvent>(ev => Application.Quit());
        }

        private void OnLogoClicked(ClickEvent evt)
        {
            if (!_isActive) {
                StartCoroutine(TransitionToActive());
            } else {
                UIManager.Instance.ShowScreen("Lobby");
            }
        }

        private IEnumerator TransitionToActive()
        {
            _isActive = true;
            
            // 1. Show Ribbon (initially invisible)
            _ribbon.style.display = DisplayStyle.Flex;
            _ribbon.style.opacity = 0;

            // 2. Animate Logo to Ribbon
            _logoContainer.style.transitionProperty = new List<StylePropertyName> { "scale", "translate", "opacity" };
            _logoContainer.style.transitionDuration = new List<TimeValue> { new TimeValue(transitionDuration, TimeUnit.Second) };
            
            yield return null; // Wait for layout update

            // Tính toán khoảng cách di chuyển (Nếu cần thiết, ở đây dùng scale đơn giản)
            _logoContainer.style.scale = new Scale(new Vector3(0.4f, 0.4f, 1f));
            
            _ribbon.style.transitionProperty = new List<StylePropertyName> { "opacity" };
            _ribbon.style.transitionDuration = new List<TimeValue> { new TimeValue(transitionDuration, TimeUnit.Second) };
            _ribbon.style.opacity = 1;

            yield return new WaitForSeconds(transitionDuration);
        }
    }
}