package com.example.bricklog.view;

import javafx.geometry.Insets;
import javafx.scene.control.Label;
import javafx.scene.control.ListView;
import javafx.scene.control.ToggleButton;
import javafx.scene.control.ToggleGroup;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;

public class GalleryLayout extends BorderPane {
    private final GridPane gridView;
    private final ListView<String> listView;
    private boolean isGridView;

    public GalleryLayout() {
        // Create a ToggleGroup for the layout options
        ToggleGroup toggleGroup = new ToggleGroup();

        // Create toggle buttons for layout options
        ToggleButton gridButton = new ToggleButton("Grid");
        ToggleButton listButton = new ToggleButton("List");
        
        gridButton.setToggleGroup(toggleGroup);
        listButton.setToggleGroup(toggleGroup);
        
        // Set the default selected button
        gridButton.setSelected(true);
        isGridView = true;

        HBox toggleBox = new HBox(gridButton, listButton);
        toggleBox.setSpacing(10);
        toggleBox.setPadding(new Insets(10));
        this.setTop(toggleBox);

        // Create both views
        gridView = createGridView();
        listView = createListView();

        // Start with the grid view
        isGridView = true;
        this.setCenter(gridView);

    // Add listener to the toggle group to switch layouts
    toggleGroup.selectedToggleProperty().addListener((observable, oldValue, newValue) -> {
        if (newValue == gridButton) {
            isGridView = true;  // Update the variable
            toggleLayout(isGridView);  // Use the variable
        } else if (newValue == listButton) {
            isGridView = false;  // Update the variable
            toggleLayout(isGridView);  // Use the variable
        }
    });
    }

    private GridPane createGridView() {
        GridPane grid = new GridPane();
        grid.setPadding(new Insets(10));
        grid.setHgap(10);
        grid.setVgap(10);

        // Example data - replace with your actual data retrieval logic
        String[] buildTypes = {"Kitset", "MoC", "Kitset", "MoC"};
        String[] imageUrls = {
            "path/to/image1.jpg", 
            "path/to/image2.jpg", 
            "path/to/image3.jpg",
            "path/to/image4.jpg"
        };

        for (int i = 0; i < buildTypes.length; i++) {
            VBox vbox = new VBox();
            ImageView imageView = new ImageView(new Image(imageUrls[i]));
            imageView.setFitWidth(150);
            imageView.setFitHeight(150);
            imageView.setPreserveRatio(true);

            vbox.getChildren().addAll(imageView, new Label(buildTypes[i]));
            grid.add(vbox, i % 3, i / 3); // Adjust to layout items in a grid
        }
        return grid;
    }

    private ListView<String> createListView() {
        ListView<String> list = new ListView<>();
        
        // Example data - replace with your actual data retrieval logic
        String[] details = {
            "Build 1: Builder Name, 100 Pieces, 20x30x10 cm, Kitset",
            "Build 2: Builder Name, 150 Pieces, 25x35x15 cm, MoC",
            // Add more entries as needed...
        };

        list.getItems().addAll(details);
        return list;
    }

// Method to toggle layout and print the current state
private void toggleLayout(boolean isGrid) {
    if (isGrid) {
        System.out.println("Current layout: Grid View");
        this.setCenter(gridView);
    } else {
        System.out.println("Current layout: List View");
        this.setCenter(listView);
    }
}
}

