From 5d8d3f1f2f7fdcb128af17bc7ba09ae084b716bf Mon Sep 17 00:00:00 2001
From: klappstuhl24 <t.kleipsties@web.de>
Date: Mon, 13 Nov 2023 14:59:10 +0100
Subject: [PATCH] Buttons zum Bilder switchen und Dialog.refresh

---
 KIKunstKirstenKlöckner/Pages/Gallery.razor | 43 +++++++++++++++++-----
 1 file changed, 33 insertions(+), 10 deletions(-)

diff --git a/KIKunstKirstenKlöckner/Pages/Gallery.razor b/KIKunstKirstenKlöckner/Pages/Gallery.razor
index dd01c44..0bb7830 100644
--- a/KIKunstKirstenKlöckner/Pages/Gallery.razor
+++ b/KIKunstKirstenKlöckner/Pages/Gallery.razor
@@ -33,40 +33,63 @@
 </RadzenDataList>
 
 @code {
-    IEnumerable<BildInfoModel>? _bildInfos;
+    List<BildInfoModel>? _bildInfos;
 
     protected override async Task OnInitializedAsync()
     {
-        _bildInfos = await BildInfoData.GetAllBildInfosAsync();
+        _bildInfos = (await BildInfoData.GetAllBildInfosAsync()).ToList();
 
         await base.OnInitializedAsync();
     }
-    
+
     async Task ShowImageDialog(BildInfoModel bildInfo)
     {
         WunschInfoModel wunschInfo = await WunschInfoData.GetWunschInfoAsync(bildInfo.WunschId);
 
+        int listIndex = _bildInfos.IndexOf(_bildInfos.First(info => info.Id == bildInfo.Id));
+
         List<BildInfoModel> bilderVomWunsch = _bildInfos!.Where(info => info.WunschId == wunschInfo.Id).ToList();
 
+        void ButtonLeft()
+        {
+            listIndex = (listIndex != 0) ? listIndex - 1 : 0;
+            bildInfo = _bildInfos[listIndex];
+            DialogService.Refresh();
+        }
+
+        void ButtonRight()
+        {
+            listIndex = (listIndex != _bildInfos.Count - 1) ? listIndex + 1 : _bildInfos.Count - 1;
+            bildInfo = _bildInfos[listIndex];
+            DialogService.Refresh();
+        }
+
+
         var result = await DialogService.OpenAsync(wunschInfo.Wunsch, ds =>
-            @<div>
+        @<div>
                 <RadzenStack Orientation="Orientation.Horizontal" Wrap="FlexWrap.Wrap">
                     <RadzenStack Orientation="Orientation.Horizontal">
-                        <RadzenStack Orientation="Orientation.Vertical">
-                            <RadzenImage Style="width: 400px; height: 400px;" Path="@bildInfo.Dateiname" />
-                        </RadzenStack>
-                        <RadzenText Text="@wunschInfo.BildBeschreibung"/>
+                        <RadzenButton Click="ButtonLeft" Disabled="(listIndex == 0)" Style="border-radius: 0%"> </RadzenButton>
+                        <div>
+                            <RadzenStack Orientation="Orientation.Vertical">
+                                <RadzenImage Style="width: 400px; height: 400px;" Path="@bildInfo.Dateiname" />
+                            </RadzenStack>
+                            <RadzenText Text="@wunschInfo.BildBeschreibung" />
+                        </div>
+                        <RadzenButton Click="ButtonRight" Disabled="(listIndex == _bildInfos.Count - 1)" Style="border-radius: 0%"> </RadzenButton>
                     </RadzenStack>
                     @foreach (var bild in bilderVomWunsch)
                     {
                         <RadzenImage class="small-image" Path="@bild.Dateiname" 
-                                     Click="async () => { bildInfo = bild; DialogService.Close(); await ShowImageDialog(bild); }" />
+                                     Click="() => { bildInfo = bild; DialogService.Refresh(); }" />
                     }
                 </RadzenStack>
-            </div>, 
+            </div>
+    , 
             new DialogOptions() { CloseDialogOnOverlayClick = true, Width = "50%" });
     }
 
+
     [Inject]
     private IWebHostEnvironment _environment { get; set; }
 }