package com.example.computers.view;

import com.vaadin.flow.component.Component;
import com.vaadin.flow.component.applayout.AppLayout;
import com.vaadin.flow.component.applayout.DrawerToggle;
import com.vaadin.flow.component.html.*;
import com.vaadin.flow.component.icon.Icon;
import com.vaadin.flow.component.icon.VaadinIcon;
import com.vaadin.flow.component.orderedlayout.FlexComponent;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.router.Route;
import com.vaadin.flow.router.RouterLink;


public class MainView extends AppLayout {

    public MainView() {
        createHeader();
        createDrawer();
    }

    private void createHeader() {
        DrawerToggle toggle = new DrawerToggle();
        toggle.getStyle().set("color", "white");

        RouterLink homeLink = new RouterLink(DashboardView.class);
        H1 title = new H1("Учет вычислительных машин");
        title.getStyle()
                .set("font-size", "1.2em")
                .set("margin", "0")
                .set("color", "white");
        homeLink.add(title);
        homeLink.getStyle()
                .set("text-decoration", "none")
                .set("color", "white");

        HorizontalLayout header = new HorizontalLayout(toggle, homeLink);
        header.setWidthFull();
        header.setDefaultVerticalComponentAlignment(FlexComponent.Alignment.CENTER);
        header.expand(homeLink);
        header.getStyle()
                .set("background", "linear-gradient(90deg, #1565C0, #1E88E5)")
                .set("padding", "0 16px")
                .set("box-shadow", "0 2px 6px rgba(0,0,0,0.3)");

        addToNavbar(header);
    }

    private void createDrawer() {
        VerticalLayout menu = new VerticalLayout();
        menu.setPadding(false);
        menu.setSpacing(false);
        menu.getStyle()
                .set("background", "#F5F7FA")
                .set("height", "100%");

        Div menuTitle = new Div(new Span("МЕНЮ"));
        menuTitle.getStyle()
                .set("padding", "16px 20px 8px")
                .set("font-size", "0.75em")
                .set("font-weight", "700")
                .set("color", "#90A4AE")
                .set("letter-spacing", "1px");

        menu.add(
                menuTitle,
                createLink("Компьютеры",    ComputerView.class,     VaadinIcon.DESKTOP),
                createLink("Производители", ManufacturerView.class, VaadinIcon.FACTORY),
                createLink("Локации",       LocationView.class,     VaadinIcon.OFFICE),
                createLink("Комплектующие", ComponentView.class,    VaadinIcon.COG),
                createLink("Ремонты",       RepairView.class,       VaadinIcon.TOOLS)
        );

        addToDrawer(menu);
    }

    private Component createLink(String text,
                                 Class<? extends Component> navigationTarget,
                                 VaadinIcon icon) {
        Icon linkIcon = icon.create();
        linkIcon.getStyle()
                .set("width", "18px")
                .set("height", "18px")
                .set("color", "#1E88E5")
                .set("margin-right", "10px")
                .set("flex-shrink", "0");

        Span label = new Span(text);
        label.getStyle().set("font-size", "0.95em");

        RouterLink link = new RouterLink(navigationTarget);
        link.add(linkIcon, label);
        link.getStyle()
                .set("display", "flex")
                .set("align-items", "center")
                .set("padding", "10px 20px")
                .set("text-decoration", "none")
                .set("color", "#263238")
                .set("border-radius", "8px")
                .set("margin", "2px 8px")
                .set("transition", "background 0.2s");

        link.getElement().executeJs(
                "this.addEventListener('mouseover', () => this.style.background='#E3F2FD');" +
                        "this.addEventListener('mouseout', () => this.style.background='transparent');"
        );

        return link;
    }
}