<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:RobobinApp.Views"  
             xmlns:viewModels="clr-namespace:RobobinApp.ViewModels"
             xmlns:drawable="clr-namespace:RobobinApp.Views"
             x:Class="RobobinApp.Views.MainPage_Android"
             Title="">

    <ContentPage.BindingContext>
        <viewModels:MainPageViewModel />
    </ContentPage.BindingContext>

    <ContentPage.Resources>
        <ResourceDictionary>
            <drawable:GraphicsDrawable x:Key="drawable" />
            <StyleSheet Source="/Resources/Styles/appstyle.css" />
        </ResourceDictionary>
    </ContentPage.Resources>

    <!-- Make the entire content scrollable -->
    <ScrollView>
        <VerticalStackLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">

            <!-- Top Frame -->
            <VerticalStackLayout StyleClass="sideFrame" 
                                 HorizontalOptions="FillAndExpand" 
                                 VerticalOptions="Start">
                <HorizontalStackLayout HorizontalOptions="Start" VerticalOptions="End">
                    <Button Text="Admin" Command="{Binding ConnectToRobobinCommand}"/>
                    <Button Text="Setup" Command="{Binding ConnectToRobobinCommand}"/>
                    <Button Text="Info" Command= "{Binding GoToHelpPage}"/>
                    <Picker Title="Select Graph" 
                      ItemsSource="{Binding GraphNames}"
                      SelectedIndexChanged="OnGraphSelected"
                      HorizontalOptions="Center" />
                </HorizontalStackLayout>

                <local:SideBox HeaderTitle="Queue:" />
                <local:SideBox HeaderTitle="Status:" />
            </VerticalStackLayout>

            <!-- Main Drawable Area with specific HeightRequest to ensure visibility -->
            <Frame StyleClass="mainFrame" 
                   HorizontalOptions="FillAndExpand" 
                   VerticalOptions="Center"
                   HeightRequest="400">
                <!-- Adjust this value as needed -->
                <GraphicsView x:Name="GraphicsView"
                              Drawable="{StaticResource drawable}">
                    <GraphicsView.GestureRecognizers>
                        <TapGestureRecognizer Tapped="OnGraphicsViewTapped" />
                    </GraphicsView.GestureRecognizers>
                </GraphicsView>
            </Frame>

            <!-- Bottom Frame -->
            <VerticalStackLayout StyleClass="sideFrame" 
                                 HorizontalOptions="FillAndExpand" 
                                 VerticalOptions="End">
         

                <local:SideBox HeaderTitle="Mode:" />
                <local:SideBox HeaderTitle="Admin:" />
            </VerticalStackLayout>

        </VerticalStackLayout>
    </ScrollView>
</ContentPage>