Implement enhancement #4

Classes/Gpx11SerializerAsync.cs

@@ -1,3 +1,4 @@
+using System;
 using System.IO;
 using System.Threading.Tasks;
 using System.Xml.Serialization;
@@ -18,5 +19,13 @@ public static async Task<GpxFile> DeserializeAsync(Stream stream)
             GpxFile gpxFile = (GpxFile)xmlSerializer.Deserialize(stringReader);
             return gpxFile;
         }
+
+        public static async Task<string> SerializeAsync(GpxFile file)
+        {
+            using MemoryStream memoryStream = new();
+            XmlSerializer xmlSerializer = new XmlSerializer(typeof(GpxFile));
+            xmlSerializer.Serialize(memoryStream, file);
+            return await Task.FromResult(Convert.ToBase64String(memoryStream.ToArray()));
+        }
     }
 }

Classes/ConvertTask.cs → Classes/GpxToItineraryConvertTask.cs

@@ -1,11 +1,15 @@
 using Geo.Gps.Serialization.Xml.Gpx.Gpx11;
 using GPXRide.Enums;
+using GPXRide.Interfaces;
+using Microsoft.AspNetCore.Components.Forms;
 
 namespace GPXRide.Classes
 {
-    public class ConvertTask
+    public class GpxToItineraryConvertTask : IConvertTask
     {
         public int? Id { get; init; }
+        public IBrowserFile InputFile { get; init; }
+        public FileSourceType FileSourceType { get; init; }
         public GpxFile OriginalGpxFile { get; set; }
         public string FileName { get; init; }
         public ItineraryFile ConvertedItineraryFile { get; set; }

Classes/TripToGpxConvertTask.cs

@@ -0,0 +1,18 @@
+using Geo.Gps.Serialization.Xml.Gpx.Gpx11;
+using GPXRide.Enums;
+using GPXRide.Interfaces;
+using Microsoft.AspNetCore.Components.Forms;
+
+namespace GPXRide.Classes
+{
+    public class TripToGpxConvertTask: IConvertTask
+    {
+        public int? Id { get; init; }
+        public IBrowserFile InputFile { get; init; }
+        public FileSourceType FileSourceType { get; init; }
+        public Trip OriginalTripFile { get; set; }
+        public string FileName { get; init; }
+        public GpxFile ConvertedGpxFile { get; set; }
+        public ConvertState State { get; set; } = ConvertState.None;
+    }
+}

Enums/FileSourceType.cs

@@ -0,0 +1,7 @@
+namespace GPXRide.Enums;
+
+public enum FileSourceType
+{
+    Gpx,
+    MVTrip
+}

GPXRide.csproj

@@ -24,4 +24,12 @@
     <ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
   </ItemGroup>
 
+  <ItemGroup>
+    <Folder Include="Properties\" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <None Remove="Properties\launchSettings.json" />
+  </ItemGroup>
+
 </Project>

Interfaces/IConvertTask.cs

@@ -0,0 +1,14 @@
+using GPXRide.Enums;
+using Microsoft.AspNetCore.Components.Forms;
+
+namespace GPXRide.Interfaces;
+
+public interface IConvertTask
+{
+    public int? Id { get; init; }
+
+    public IBrowserFile InputFile { get; init; }
+    public FileSourceType FileSourceType { get; init; }
+    public string FileName { get; init; }
+    public ConvertState State { get; set; }
+}

Pages/Index.razor

@@ -2,30 +2,127 @@
 @using Geo.Gps.Serialization.Xml.Gpx.Gpx11
 @using GPXRide.Classes
 @using GPXRide.Enums
+@using GPXRide.Interfaces
 @inject ISnackbar Snackbar
 @inject IJSRuntime Js
 
 <MudContainer MaxWidth="MaxWidth.Medium" Class="mt-8">
 
     <MudStack AlignItems="AlignItems.Center" Spacing="4">
 
-        <MudFileUpload T="IReadOnlyList<IBrowserFile>" FilesChanged="UploadFiles" Accept=".gpx">
-            <ActivatorContent>
-                <MudButton HtmlTag="label"
-                           Variant="Variant.Filled"
-                           Color="Color.Primary"
-                           StartIcon="@Icons.Material.Filled.CloudUpload">
-                    Upload & Convert GPX Files
-                </MudButton>
-            </ActivatorContent>
-        </MudFileUpload>
+        <MudButtonGroup Color="Color.Primary" Variant="Variant.Outlined">
+
+            <MudFileUpload T="IReadOnlyList<IBrowserFile>" FilesChanged="UploadFiles" Accept=".gpx">
+                <ActivatorContent>
+                    <MudButton HtmlTag="label"
+                               Variant="Variant.Filled"
+                               Color="Color.Primary"
+                               StartIcon="@Icons.Material.Filled.CloudUpload">
+                        Upload & Convert GPX Files
+                    </MudButton>
+                </ActivatorContent>
+            </MudFileUpload>
 
+            <MudFileUpload T="IReadOnlyList<IBrowserFile>" FilesChanged="UploadFiles" Accept=".mvtrip">
+                <ActivatorContent>
+                    <MudButton HtmlTag="label"
+                               Variant="Variant.Filled"
+                               Color="Color.Primary"
+                               StartIcon="@Icons.Material.Filled.CloudUpload">
+                        Upload & Convert MVTrip Files
+                    </MudButton>
+                </ActivatorContent>
+            </MudFileUpload>
+
+        </MudButtonGroup>
+
         <MudDivider Class="my-6" />
 
         <MudGrid>
 
-            @foreach (ConvertTask task in _convertTasks)
+            @foreach (IConvertTask convertTask in _convertTasks.Where(x => x.FileSourceType == FileSourceType.MVTrip))
+            {
+                TripToGpxConvertTask task = (TripToGpxConvertTask)convertTask;
+                <MudItem xs="16" sm="6">
+                    <MudCard Style="position:relative;">
+                        @if (task.OriginalTripFile is null)
+                        {
+                            <MudCardHeader>
+                                <CardHeaderContent>
+                                    <MudSkeleton Width="300px" />
+                                </CardHeaderContent>
+                            </MudCardHeader>
+                            <MudSkeleton SkeletonType="SkeletonType.Rectangle" Height="250px" />
+                            <MudCardContent>
+                                <MudSkeleton Animation="Animation.Wave" />
+                            </MudCardContent>
+                            <MudCardActions>
+                                <MudSkeleton SkeletonType="SkeletonType.Circle" Height="30px" Width="30px" Class="ml-2 mb-2" />
+                                <MudSkeleton SkeletonType="SkeletonType.Circle" Height="30px" Width="30px" Class="ml-3 mb-2" />
+                            </MudCardActions>
+                            <MudOverlay Visible="@(task.OriginalTripFile is null)" DarkBackground="true" Absolute="true">
+                                <MudProgressCircular Color="Color.Secondary" Indeterminate="true" />
+                            </MudOverlay>
+                        }
+                        else
+                        {
+                            <MudCardHeader>
+                                <CardHeaderContent>
+                                    <MudText Typo="Typo.h5">@task.OriginalTripFile.Title</MudText>
+                                </CardHeaderContent>
+                                <CardHeaderActions>
+                                    <MudIconButton Icon="@Icons.Material.Filled.Close" Color="Color.Default" OnClick="@(() => DisposeConvertTask(task))" />
+                                </CardHeaderActions>
+                            </MudCardHeader>
+                            <MudCardContent>
+                                <MudGrid>
+                                    <MudItem xs="6">
+                                        <MudField AdornmentIcon="@Icons.Material.Outlined.Speed" Adornment="Adornment.Start" Variant="Variant.Text">@Math.Round(task.OriginalTripFile.AvgSpeedKmh,2) km/h</MudField>
+                                        <MudField AdornmentIcon="@Icons.Material.Outlined.TextRotationAngledown" Adornment="Adornment.Start" Variant="Variant.Text">@task.OriginalTripFile.MaxRollAngle °</MudField>
+                                        <MudField AdornmentIcon="@Icons.Material.Outlined.MultilineChart" Adornment="Adornment.Start" Variant="Variant.Text">@task.OriginalTripFile.MaxThrottle %</MudField>
+
+                                    </MudItem>
+                                    <MudItem xs="6">
+                                        <MudField AdornmentIcon="@Icons.Material.Outlined.SocialDistance" Adornment="Adornment.Start" Variant="Variant.Text">@(task.OriginalTripFile.TotalDistanceInMeters/ 1000 ) Km</MudField>
+                                        <MudField AdornmentIcon="@Icons.Material.Outlined.Timer" Adornment="Adornment.Start" Variant="Variant.Text">@Math.Round(TimeSpan.FromSeconds(task.OriginalTripFile.TotalTimeInSeconds).TotalMinutes,2) Minutes</MudField>
+                                        <MudField AdornmentIcon="@Icons.Material.Outlined.Badge" Adornment="Adornment.Start" Variant="Variant.Text">@task.OriginalTripFile.BikeModel</MudField>
+                                    </MudItem>
+                                </MudGrid>
+                            </MudCardContent>
+                             <MudCardActions>
+
+                                @switch (task.State)
+                                {
+                                    case ConvertState.Working:
+                                        <MudChip T="string" Class="mr-2" Icon="@Icons.Material.Filled.HourglassBottom" Color="Color.Info">Converting...</MudChip>
+                                        <MudProgressCircular Color="Color.Primary" Size="Size.Small" Indeterminate="true" />
+                                        break;
+                                    case ConvertState.Completed:
+                                        <MudChip T="string" Icon="@Icons.Material.Filled.Check" Color="Color.Success">Conversion successful</MudChip>
+                                        <MudIconButton @onclick=@(async () => await BlazorDownloadFileService.DownloadFile($"{task.OriginalTripFile.Title}.gpx",(await Gpx11SerializerAsync.SerializeAsync(task.ConvertedGpxFile)),"application/octet-stream")) Icon="@Icons.Material.Filled.FileDownload" Color="Color.Primary" aria-label="Download" />
+                                        @if (_webShareSupported)
+                                        {
+                                            <MudIconButton @onclick="() => ShareGpxFile(task)" Icon="@Icons.Material.Filled.Share" aria-label="Share" Color="Color.Info" />
+                                        }
+                                        break;
+                                    case ConvertState.Error:
+                                        <MudChip T="string" Icon="@Icons.Material.Filled.Warning" Color="Color.Error">Conversion failed</MudChip>
+                                        <MudIconButton @onclick="() => ConvertToGpx(task)" Icon="@Icons.Material.Filled.Refresh" aria-label="Retry" Color="Color.Info" />
+                                        break;
+                                    default:
+                                        <MudButton @onclick="() => ConvertToGpx(task)" Variant="Variant.Text" Color="Color.Primary" EndIcon="@Icons.Material.Filled.Send">Convert to Gpx</MudButton>
+                                        break;
+                                }
+
+                            </MudCardActions>
+                        }
+                    </MudCard>
+                </MudItem>
+            }
+
+            @foreach (IConvertTask convertTask in _convertTasks.Where(x => x.FileSourceType == FileSourceType.Gpx))
             {
+                GpxToItineraryConvertTask task = (GpxToItineraryConvertTask)convertTask;
                 GpxFile gpxFile = task.OriginalGpxFile;
                 task.ConvertOptions.RouteName = string.IsNullOrWhiteSpace(task.ConvertOptions.RouteName) ? task.FileName : task.ConvertOptions.RouteName;