<?xml version="1.0" encoding="utf-8" ?>
<views:BasePage x:Class="Italia.DiciottoApp.Views.VoucherPage"
                xmlns="http://xamarin.com/schemas/2014/forms"
                xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                xmlns:views="clr-namespace:Italia.DiciottoApp.Views"
                xmlns:vm="clr-namespace:Italia.DiciottoApp.ViewModels"
                xmlns:conv="clr-namespace:Italia.DiciottoApp.Converters"
                xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core" 
                ios:Page.UseSafeArea="true"
                BackgroundColor="{StaticResource AppBkgndColor}"
                ControlTemplate="{StaticResource AppHeaderTemplate}" >

    <views:BasePage.BindingContext>
        <vm:VoucherViewModel />
    </views:BasePage.BindingContext>

    <views:BasePage.Resources>
        <conv:DoubleToItCurrency x:Key="DoubleToItCurrency" />
    </views:BasePage.Resources>

    <views:BasePage.Content>
        <ScrollView>
            <Grid x:Name="ContentGrid" BackgroundColor="{StaticResource ContentBkgndColor}"
                  VerticalOptions="FillAndExpand"
                  HorizontalOptions="FillAndExpand"
                  RowSpacing="0" ColumnSpacing="0" >

                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>

                <!-- Shop image-->
                <Image Grid.Row="0"
                       IsVisible="{Binding Voucher.HasShop}"
                       WidthRequest="{Binding Width, Source={x:Reference ContentGrid}}"
                       HeightRequest="88"
                       Aspect="AspectFill"
                       Source="{Binding ShopBkgndImageSource}" />

                <!-- Shop info -->
                <StackLayout Grid.Row="0" Padding="24,0" Spacing="0"
                             VerticalOptions="Center"
                             IsVisible="{Binding Voucher.HasShop}" >

                    <Label Margin="0"
                           HorizontalOptions="Start"
                           Style="{StaticResource BoldLabelStyle}"
                           TextColor="White" FontSize="32" MaxLines="1" LineBreakMode="TailTruncation" 
                           Text="{Binding Voucher.Shop.Title}" />

                    <StackLayout Padding="0" Spacing="0"
                                 Orientation="Horizontal"
                                 IsVisible="{Binding Voucher.HasShop}">

                        <Image HorizontalOptions="Start" VerticalOptions="Center"
                               Source="{Binding ShopKindImageSource}"/>

                        <Label Margin="11,0,0,0"
                               HorizontalOptions="Start"
                               VerticalOptions="Center"
                               Style="{StaticResource BoldItalicLabelStyle}"
                               TextColor="White" FontSize="14"
                               Text="{Binding ShopAddress}" />
                    </StackLayout>
                </StackLayout>

                <!--Voucher content-->
                <StackLayout Grid.Row="1" Padding="0" Spacing="0">

                    <!-- Voucher Status -->
                    <Label Margin="16,14"
                       VerticalOptions="Center"
                       HorizontalOptions="Center"
                       Style="{StaticResource BoldLabelStyle}"
                       FontSize="14" TextColor="{Binding VoucherStatusTextColor}"
                       Text="{Binding VoucherStatus}" />

                    <BoxView HeightRequest="1" BackgroundColor="#FFEFEFEF" />

                    <!-- Categoria -->
                    <StackLayout Padding="0" Spacing="0" Orientation="Horizontal">

                        <Image Margin="23,0,0,0"
                               Source="{Binding Voucher.Category.BlackImageSource}"
                               HeightRequest="22" WidthRequest="22"
                               VerticalOptions="Center"/>

                        <Label Margin="28,10,16,10"
                               HorizontalOptions="StartAndExpand" VerticalOptions="Center"
                               Style="{StaticResource RegularLabelStyle}"
                               TextColor="#FF30383D" FontSize="16"
                               Text="{Binding Voucher.Category.Titolo}" />

                        <Label Margin="0,0,16,0"
                               WidthRequest="60"
                               LineBreakMode="NoWrap"
                               HorizontalTextAlignment="End"
                               HorizontalOptions="End" VerticalOptions="Center"
                               Style="{StaticResource RegularLabelStyle}"
                               TextColor="#FFAAAAAA" FontSize="12"
                               Text="Categoria" />
                    </StackLayout>

                    <!-- Prodotto -->
                    <StackLayout  Padding="0" Spacing="0" Orientation="Horizontal">

                        <Image Margin="23,0,0,0"
                           Source="{Binding Voucher.Product.BlackImageSource}"
                           HeightRequest="22" WidthRequest="22"
                           VerticalOptions="Center"/>

                        <Label Margin="28,4,16,4"
                           HorizontalOptions="StartAndExpand" VerticalOptions="Center"
                           Style="{StaticResource RegularLabelStyle}"
                           TextColor="#FF30383D" FontSize="16"
                           Text="{Binding Voucher.Product.Titolo}" />

                        <Label Margin="0,0,16,0"
                           HorizontalOptions="End" VerticalOptions="Center"
                           Style="{StaticResource RegularLabelStyle}"
                           TextColor="#FFAAAAAA" FontSize="12"
                           Text="Prodotto" />
                    </StackLayout>

                    <!-- Valore -->
                    <StackLayout Padding="0" Spacing="0" Orientation="Horizontal">

                        <Image Margin="23,0,0,0"
                           Source="euro_black"
                           HeightRequest="22" WidthRequest="22"
                           VerticalOptions="Center"/>

                        <Grid Margin="28,8,24,8"
                              HorizontalOptions="StartAndExpand" VerticalOptions="Center" >

                            <Label HorizontalOptions="StartAndExpand" VerticalOptions="Center"
                                   Style="{StaticResource BoldLabelStyle}"
                                   TextColor="#FF30383D" FontSize="28"
                                   Text="{Binding VoucherValue, Converter={StaticResource DoubleToItCurrency}}" />

                            <BoxView HeightRequest="1"
                                     BackgroundColor="#FF30383D"
                                     VerticalOptions="Center"
                                     IsVisible="{Binding Voucher.Spent}"/>
                        </Grid>

                        <Label Margin="0,0,16,0"
                           HorizontalOptions="End" VerticalOptions="Center"
                           Style="{StaticResource RegularLabelStyle}"
                           TextColor="#FFAAAAAA" FontSize="12"
                           Text="Valore" />
                    </StackLayout>

                    <!-- Codice -->
                    <StackLayout Padding="0" Spacing="0" Orientation="Horizontal">

                        <Image Margin="23,0,0,0"
                           Source="qrcode_black"
                           HeightRequest="22" WidthRequest="22"
                           VerticalOptions="Center"/>

                        <Label Margin="28,0,24,0"
                               HorizontalOptions="StartAndExpand" VerticalOptions="Center"
                               Style="{StaticResource BoldLabelStyle}"
                               TextColor="#FF30383D" FontSize="24"
                               Text="{Binding Voucher.Codice}" >
                            <Label.GestureRecognizers>
                                <TapGestureRecognizer Tapped="OnVoucherCodeTapped" />
                            </Label.GestureRecognizers>
                        </Label>

                        <Label Margin="0,14,16,10"
                           HorizontalOptions="End" VerticalOptions="Center"
                           Style="{StaticResource RegularLabelStyle}"
                           TextColor="#FFAAAAAA" FontSize="12"
                           Text="Codice" />
                    </StackLayout>

                    <!-- Buono non utilizzato -->
                    <StackLayout Padding="0" Spacing="0"
                                 IsVisible="{Binding VoucherNotSpent}">

                        <!-- Bottone: Usa il buono sul sito -->
                        <BoxView HeightRequest="1" BackgroundColor="#FFEFEFEF"
                                 IsVisible="{Binding UseVoucherOnlineButtonIsVisible}" />

                        <Frame CornerRadius="5" Padding="1"
                               HasShadow="False"
                               Margin="16,16" HeightRequest="40"
                               BackgroundColor="{StaticResource AppBkgndColor}"
                               IsVisible="{Binding UseVoucherOnlineButtonIsVisible}">

                            <Frame.GestureRecognizers>
                                <TapGestureRecognizer Tapped="OnUseVoucherOnShopOnlineButtonTapped" />
                            </Frame.GestureRecognizers>

                            <StackLayout Grid.Row="1" Padding="0" Spacing="8"
                                         Orientation="Horizontal"
                                         HorizontalOptions="Center"
                                         Margin="0,0,0,0">

                                <Image Source="link_white"  VerticalOptions="Center" />

                                <Label VerticalOptions="Center"
                                       Style="{StaticResource BoldLabelStyle}" 
                                       FontSize="16"
                                       TextColor="White"  
                                       Text="USA IL BUONO SUL SITO"/>
                            </StackLayout>
                        </Frame>

                        <!-- Bottone: percorso per il negozio -->
                        <BoxView HeightRequest="1" BackgroundColor="#FFEFEFEF"
                                 IsVisible="{Binding ShopRouteButtonIsVisible}" />

                        <Frame CornerRadius="5" Padding="1"
                               HasShadow="False"
                               Margin="16,16" HeightRequest="40"
                               BackgroundColor="{StaticResource AppBkgndColor}"
                               IsVisible="{Binding ShopRouteButtonIsVisible}">

                            <Frame.GestureRecognizers>
                                <TapGestureRecognizer Tapped="OnRouteToShopButtonTapped" />
                            </Frame.GestureRecognizers>

                            <StackLayout Grid.Row="1" Padding="0" Spacing="8"
                                         Orientation="Horizontal"
                                         HorizontalOptions="Center" >

                                <Image Source="route_white" VerticalOptions="Center" />

                                <Label VerticalOptions="Center"
                                       Style="{StaticResource BoldLabelStyle}" 
                                       FontSize="16"
                                       TextColor="White"
                                       Text="PERCORSO PER IL NEGOZIO"/>
                            </StackLayout>
                        </Frame>

                        <!-- QRcode e barcode -->
                        <BoxView HeightRequest="1" BackgroundColor="#FFEFEFEF"
                                 IsVisible="{Binding QRcodeContentIsVisible}" />

                        <Image x:Name="BarcodeImage1"  HorizontalOptions="Center"
                               IsVisible="{Binding QRcodeContentIsVisible}"
                               WidthRequest="300"
                               HeightRequest="100"
                               Margin="10"/>

                        <Image x:Name="QrCodeImage1"  HorizontalOptions="Center"
                               IsVisible="{Binding QRcodeContentIsVisible}"
                               WidthRequest="200"
                               HeightRequest="200"
                               Margin="10"/>

                        <!-- Bottone: trova un negozio -->
                        <BoxView HeightRequest="1" BackgroundColor="#FFEFEFEF" 
                                 IsVisible="{Binding Voucher.HasShop, Converter={StaticResource NegativeConverter}}" />
                        
                        <Frame CornerRadius="5" Padding="1"
                               HasShadow="False"
                               Margin="16,16" HeightRequest="40"
                               BackgroundColor="{StaticResource AppBkgndColor}"
                               IsVisible="{Binding Voucher.HasShop, Converter={StaticResource NegativeConverter}}">

                            <Frame.GestureRecognizers>
                                <TapGestureRecognizer Tapped="OnFindShopButtonTapped" />
                            </Frame.GestureRecognizers>

                            <StackLayout Grid.Row="1" Padding="0" Spacing="8"
                                         Orientation="Horizontal"
                                         HorizontalOptions="Center" >

                                <Image Source="location_white" VerticalOptions="Center" />

                                <Label VerticalOptions="Center"
                                       Style="{StaticResource BoldLabelStyle}" 
                                       FontSize="16"
                                       TextColor="White"
                                       Text="TROVA UN NEGOZIO"/>
                            </StackLayout>
                        </Frame>

                        <!-- Intestatario -->
                        <BoxView HeightRequest="1" BackgroundColor="#FFEFEFEF" />

                        <Label Margin="16,10,16,0"
                               VerticalOptions="Start" 
                               HorizontalOptions="Center"
                               Style="{StaticResource RegularLabelStyle}"
                               TextColor="#FFAAAAAA" FontSize="14"
                               Text="Questo buono non è cedibile e appartiene a te." />

                        <StackLayout Padding="0" Spacing="0" Orientation="Horizontal">

                            <Image Margin="23,0,0,0"
                               Source="Voucher_owner_black"
                               HeightRequest="22" WidthRequest="22"
                               VerticalOptions="Center"/>

                            <Label Margin="28,8,24,8"
                               HorizontalOptions="StartAndExpand" VerticalOptions="Center"
                               Style="{StaticResource BoldLabelStyle}"
                               TextColor="#FF30383D" FontSize="16"
                               Text="{Binding VoucherOwner}" />

                            <Label Margin="0,0,16,0"
                               HorizontalOptions="End" VerticalOptions="Center"
                               Style="{StaticResource RegularLabelStyle}"
                               TextColor="#FFAAAAAA" FontSize="12"
                               Text="Intestatario" />
                        </StackLayout>

                        <!-- Trova un altro negozio -->
                        <BoxView HeightRequest="1" BackgroundColor="#FFEFEFEF"
                                 IsVisible="{Binding Voucher.HasShop}" />

                        <Label Margin="16,10,16,0"
                               VerticalOptions="Start" 
                               HorizontalOptions="Center"
                               Style="{StaticResource RegularLabelStyle}"
                               TextColor="#FFAAAAAA" FontSize="14"
                               Text="Il buono potrà essere speso anche in altri negozi."
                               IsVisible="{Binding Voucher.HasShop}" />

                        <!-- Bottone: trova un altro negozio -->
                        <Frame CornerRadius="5" Padding="1"
                               HasShadow="False"
                               Margin="16,16" HeightRequest="40"
                               BackgroundColor="{StaticResource AppBkgndColor}"
                               IsVisible="{Binding Voucher.HasShop}">

                            <Frame.GestureRecognizers>
                                <TapGestureRecognizer Tapped="OnFindShopButtonTapped" />
                            </Frame.GestureRecognizers>

                            <StackLayout Grid.Row="1" Padding="0" Spacing="8"
                                         Orientation="Horizontal"
                                         HorizontalOptions="Center" >

                                <Image Source="location_white" VerticalOptions="Center" />

                                <Label VerticalOptions="Center"
                                       Style="{StaticResource BoldLabelStyle}" 
                                       FontSize="16"
                                       TextColor="White"
                                       Text="TROVA UN ALTRO NEGOZIO"/>
                            </StackLayout>
                        </Frame>

                        <!-- Delete Voucher message -->
                        <BoxView HeightRequest="1" BackgroundColor="#FFEFEFEF" />

                        <Label Margin="16,10,16,0"
                               VerticalOptions="Center" 
                               HorizontalOptions="Center"
                               Style="{StaticResource RegularLabelStyle}"
                               TextColor="#FFAAAAAA" FontSize="14"
                               Text="Puoi annullare in ogni momento questo buono e riversare l'intero suo valore nel tuo credito." />

                        <!-- CreateVoucherActionInProgress Message -->
                        <Label Margin="16,10,16,0"
                               VerticalOptions="Center" 
                               HorizontalOptions="Center"
                               Style="{StaticResource RegularLabelStyle}"
                               TextColor="Red" FontSize="14"
                               Text="Cancellazione buono in corso..." 
                               IsVisible="{Binding DeleteVoucherActionInProgressTextIsVisible}"/>
                        
                        <!-- Delete button -->
                        <Frame CornerRadius="5" Padding="1"
                               HasShadow="False"
                               Margin="16,16" HeightRequest="40"
                               BackgroundColor="#FFD1021C"
                               IsVisible="{Binding DeleteVoucherButtonIsVisible}" >

                            <Frame.GestureRecognizers>
                                <TapGestureRecognizer Tapped="OnDeleteVoucherButtonTapped" />
                            </Frame.GestureRecognizers>

                            <StackLayout Padding="0" Spacing="8"
                                         Orientation="Horizontal"
                                         HorizontalOptions="Center" >

                                <Image Source="bin_white" VerticalOptions="Center" />

                                <Label VerticalOptions="Center"
                                       Style="{StaticResource BoldLabelStyle}" 
                                       FontSize="16"
                                       TextColor="White"
                                       Text="ANNULLA QUESTO BUONO"/>
                            </StackLayout>
                        </Frame>

                    </StackLayout>

                    <!-- Buono già utilizzato -->
                    <StackLayout Padding="0" Spacing="0"
                                 IsVisible="{Binding VoucherSpent}">

                        <!-- QRcode e barcode -->
                        <BoxView HeightRequest="1" BackgroundColor="#FFEFEFEF"
                                 IsVisible="{Binding QRcodeContentIsVisible}" />

                        <Image x:Name="BarcodeImage2"  HorizontalOptions="Center"
                               IsVisible="{Binding QRcodeContentIsVisible}"
                               WidthRequest="200"
                               HeightRequest="100"
                               Margin="10"/>

                        <Image x:Name="QrCodeImage2"  HorizontalOptions="Center"
                               IsVisible="{Binding QRcodeContentIsVisible}"
                               WidthRequest="200"
                               HeightRequest="200"
                               Margin="10"/>

                        <!-- Bottone: dettagli del negozio -->
                        <!--<Frame CornerRadius="5" Padding="1"
                               HasShadow="False"
                               Margin="16,16" HeightRequest="40"
                               BackgroundColor="{StaticResource AppBkgndColor}">

                            <Frame.GestureRecognizers>
                                <TapGestureRecognizer Tapped="OnShopDetailButtonTapped" />
                            </Frame.GestureRecognizers>

                            <StackLayout Grid.Row="1" Padding="0" Spacing="8"
                                         Orientation="Horizontal"
                                         HorizontalOptions="Center" >

                                <Image Source="location_white" VerticalOptions="Center" />

                                <Label VerticalOptions="Center"
                                       Style="{StaticResource BoldLabelStyle}" 
                                       FontSize="16"
                                       TextColor="White"
                                       Text="DETTAGLI DEL NEGOZIO"/>
                            </StackLayout>
                        </Frame>-->
                        
                    </StackLayout>
                </StackLayout>
            </Grid>
        </ScrollView>
    </views:BasePage.Content>
</views:BasePage>