Implemented image resizing on upload. Max image size can be configured in settings.

Author: JoeAucoin

Client/GIBS.Module.BusinessDirectory.Client.csproj

@@ -31,6 +31,9 @@
     <Reference Include="Oqtane.Shared">
       <HintPath>..\..\oqtane.framework-6.1.2-Source\Oqtane.Server\bin\Debug\net9.0\Oqtane.Shared.dll</HintPath>
     </Reference>
+    <Reference Include="SixLabors.ImageSharp">
+      <HintPath>..\..\oqtane.framework-6.1.2-Source\Oqtane.Server\bin\Debug\net9.0\SixLabors.ImageSharp.dll</HintPath>
+    </Reference>
   </ItemGroup>
 
   <PropertyGroup>

Client/Modules/GIBS.Module.BusinessDirectory/CompanyEdit.razor

@@ -303,6 +303,8 @@ else
     private string _returnurl = string.Empty;
     private string _imageUploadError;
     private int _folderId = 1;
+    private int _imageMaxWidth; // Set your max width here
+    private int _imageMaxHeight; // Set your max height here
 
     public override List<Resource> Resources => new List<Resource>()
     {
@@ -334,6 +336,15 @@ else
             _folderId = 1; // Default value or handle error
         }
 
+        if (!int.TryParse(SettingService.GetSetting(ModuleState.Settings, "ImageMaxWidth", "800"), out _imageMaxWidth))
+        {
+            _imageMaxWidth = 800;
+        }
+        if (!int.TryParse(SettingService.GetSetting(ModuleState.Settings, "ImageMaxHeight", "600"), out _imageMaxHeight))
+        {
+            _imageMaxHeight = 600;
+        }
+
 
         int moduleId = PageState.ModuleId /* get your ModuleId here */;
         ParentItems = BuildTree(await BusinessDirectoryService.GetBusinessDirectorysAsync(moduleId));
@@ -496,16 +507,59 @@ else
         }
     }
 
+    // private async void HandleFileUpload(int fileId)
+    // {
+    //     if (_company != null)
+    //     {
+    //         var uploadedFile = await FileService.GetFileAsync(fileId);
+    //         if (uploadedFile != null)
+    //         {
+
+    //             _company.ImageURL = uploadedFile.Url;
+               
+    //         }
+    //         else
+    //         {
+    //             _company.ImageURL = null;
+    //         }
+    //         StateHasChanged();
+    //     }
+    // }
+
     private async void HandleFileUpload(int fileId)
     {
         if (_company != null)
         {
             var uploadedFile = await FileService.GetFileAsync(fileId);
             if (uploadedFile != null)
             {
-
-                _company.ImageURL = uploadedFile.Url;
-               
+                // Check if the image exceeds the maximum dimensions from settings
+                if (uploadedFile.ImageWidth > _imageMaxWidth || uploadedFile.ImageHeight > _imageMaxHeight)
+                {
+                    try
+                    {
+                        var resizedFile = await BusinessCompanyService.ResizeImageAsync(uploadedFile.FileId, _imageMaxWidth, _imageMaxHeight, ModuleState.ModuleId);
+                        if (resizedFile != null)
+                        {
+                            _company.ImageURL = resizedFile.Url;
+                        }
+                        else
+                        {
+                            // Fallback to original image if resize fails
+                            _company.ImageURL = uploadedFile.Url;
+                            AddModuleMessage("Image resizing failed. Using original image.", MessageType.Warning);
+                        }
+                    }
+                    catch (Exception ex)
+                    {
+                        AddModuleMessage($"Error resizing image: {ex.Message}", MessageType.Error);
+                        _company.ImageURL = uploadedFile.Url; // Fallback to original image
+                    }
+                }
+                else
+                {
+                    _company.ImageURL = uploadedFile.Url;
+                }
             }
             else
             {

Client/Modules/GIBS.Module.BusinessDirectory/Settings.razor

@@ -30,6 +30,19 @@
         </div>
     </div>
 
+    <div class="row mb-1 align-items-center">
+        <Label Class="col-sm-3" For="imageMaxWidth" HelpText="The maximum width for uploaded images (in pixels). The image will be resized if it exceeds this value." ResourceKey="ImageMaxWidth">Max Image Width: </Label>
+        <div class="col-sm-9">
+            <input id="imageMaxWidth" type="number" class="form-control" @bind="@_imageMaxWidth" />
+        </div>
+    </div>
+    <div class="row mb-1 align-items-center">
+        <Label Class="col-sm-3" For="imageMaxHeight" HelpText="The maximum height for uploaded images (in pixels). The image will be resized if it exceeds this value." ResourceKey="ImageMaxHeight">Max Image Height: </Label>
+        <div class="col-sm-9">
+            <input id="imageMaxHeight" type="number" class="form-control" @bind="@_imageMaxHeight" />
+        </div>
+    </div>
+
 </div>
 
 @code {
@@ -42,6 +55,8 @@
 
     string _featuredCount;
     string _imageFolder;
+    string _imageMaxWidth;
+    string _imageMaxHeight;
 
     protected override async Task OnInitializedAsync()
     {
@@ -51,6 +66,8 @@
             _googleApiKey = SettingService.GetSetting(settings, "GoogleApiKey", "");
             _featuredCount = SettingService.GetSetting(settings, "FeaturedCount", "3");
             _imageFolder = SettingService.GetSetting(settings, "ImageFolder", "Root");
+            _imageMaxWidth = SettingService.GetSetting(settings, "ImageMaxWidth", "800");
+            _imageMaxHeight = SettingService.GetSetting(settings, "ImageMaxHeight", "600");
             _folders = await FolderService.GetFoldersAsync(PageState.Site.SiteId);
         }
         catch (Exception ex)
@@ -67,6 +84,8 @@
             SettingService.SetSetting(settings, "GoogleApiKey", _googleApiKey);
             SettingService.SetSetting(settings, "FeaturedCount", _featuredCount);
             SettingService.SetSetting(settings, "ImageFolder", _imageFolder);
+            SettingService.SetSetting(settings, "ImageMaxWidth", _imageMaxWidth);
+            SettingService.SetSetting(settings, "ImageMaxHeight", _imageMaxHeight);
             await SettingService.UpdateModuleSettingsAsync(settings, ModuleState.ModuleId);
         }
         catch (Exception ex)

Client/Services/BusinessCompanyService.cs

@@ -128,5 +128,25 @@ public async Task UpdateCompanyAttributesAsync(int companyId, int moduleId, List
                 return new List<Models.BusinessCompany>();
             }
         }
+
+        public async Task<Oqtane.Models.File> ResizeImageAsync(int fileId, int width, int height, int moduleId)
+        {
+            var request = new { FileId = fileId, Width = width, Height = height, ModuleId = moduleId };
+            var url = CreateAuthorizationPolicyUrl($"{Apiurl}/resize-image", EntityNames.Module, moduleId);
+
+            try
+            {
+                var response = await _httpClient.PostAsJsonAsync(url, request);
+                response.EnsureSuccessStatusCode();
+                return await response.Content.ReadFromJsonAsync<Oqtane.Models.File>();
+            }
+            catch (Exception ex)
+            {
+                // Log or handle exceptions as needed
+                Console.WriteLine($"Error resizing image: {ex.Message}");
+                return null;
+            }
+        }
+
     }
 }

Server/Controllers/BusinessCompanyController.cs

@@ -5,13 +5,17 @@
 using Microsoft.AspNetCore.Http;
 using Microsoft.AspNetCore.Mvc;
 using Oqtane.Controllers;
+using Oqtane.Enums;
 using Oqtane.Infrastructure;
+using Oqtane.Repository;
+using Oqtane.Services;
+using Oqtane.Shared;
+using SixLabors.ImageSharp;
+using System;
 using System.Collections.Generic;
 using System.IO;
 using System.Threading.Tasks;
-using System;
-using Oqtane.Shared;
-using Oqtane.Enums;
+
 
 namespace GIBS.Module.BusinessDirectory.Server.Controllers
 {
@@ -20,25 +24,30 @@ public class BusinessCompanyController : ModuleControllerBase
     {
         private readonly IBusinessCompanyRepository _businessCompanyRepository;
         private readonly IWebHostEnvironment _env;
-   //     private readonly IFolderRepository _folders;
+        private readonly IFileRepository _files;
+        private readonly IImageService _imageService;
 
         public BusinessCompanyController(
             IBusinessCompanyRepository businessCompanyRepository,
             ILogManager logger,
             IHttpContextAccessor accessor,
-            IWebHostEnvironment env
+            IWebHostEnvironment env,
+            IFileRepository files,
+            IImageService imageService
         ) : base(logger, accessor)
         {
             _businessCompanyRepository = businessCompanyRepository;
             _env = env;
+            _files = files;
+            _imageService = imageService;
         }
 
         // GET: api/BusinessCompany?moduleid=x
         [HttpGet]
         [Authorize(Policy = PolicyNames.ViewModule)]
         public async Task<IEnumerable<BusinessCompany>> Get(string moduleid)
         {
-           
+
             int moduleId;
             if (int.TryParse(moduleid, out moduleId) && IsAuthorizedEntityId(EntityNames.Module, moduleId))
             {
@@ -157,6 +166,74 @@ public async Task<IActionResult> UploadImage([FromForm] IFormFile file)
             return Ok(imageUrl);
         }
 
+        [HttpPost("resize-image")]
+        [Authorize(Policy = PolicyNames.EditModule)]
+        public async Task<ActionResult<Oqtane.Models.File>> ResizeImage([FromBody] ResizeRequest request)
+        {
+            var file = _files.GetFile(request.FileId);
+            if (file == null || !IsAuthorizedEntityId(EntityNames.Module, request.ModuleId))
+            {
+                _logger.Log(LogLevel.Error, this, LogFunction.Security, "Unauthorized Image Resize Attempt for FileId {FileId}", request.FileId);
+                return Forbid();
+            }
+
+            string originalFilePath = null;
+            string tempFilePath = null;
+
+            try
+            {
+                originalFilePath = _files.GetFilePath(file);
+                if (System.IO.File.Exists(originalFilePath))
+                {
+                    // 1. Create a temporary path for the resized image
+                    tempFilePath = Path.ChangeExtension(originalFilePath, ".tmp" + Path.GetExtension(originalFilePath));
+
+                    // 2. Use the IImageService to create the resized image at the temporary path
+                    var resizedImagePath = _imageService.CreateImage(originalFilePath, request.Width, request.Height, "medium", "center", "white", "", file.Extension, tempFilePath);
+
+                    if (string.IsNullOrEmpty(resizedImagePath) || !System.IO.File.Exists(resizedImagePath))
+                    {
+                        throw new Exception("Image resizing failed during temporary file creation.");
+                    }
+
+                    // 3. Update file metadata
+                    var fileInfo = new FileInfo(resizedImagePath);
+                    using (var image = await Image.LoadAsync(resizedImagePath))
+                    {
+                        file.ImageWidth = image.Width;
+                        file.ImageHeight = image.Height;
+                    }
+                    file.Size = (int)fileInfo.Length;
+
+                    // 4. The file is now resized and metadata is updated, but we need to replace the original file
+                    // At this point, all handles to the original file should be closed.
+                    System.IO.File.Delete(originalFilePath);
+                    System.IO.File.Move(resizedImagePath, originalFilePath);
+
+                    _files.UpdateFile(file);
+
+                    _logger.Log(LogLevel.Information, this, LogFunction.Update, "Image Resized Successfully {FileId}", request.FileId);
+                    return Ok(file);
+                }
+                else
+                {
+                    _logger.Log(LogLevel.Error, this, LogFunction.Read, "File Not Found For Resizing {FileId}", request.FileId);
+                    return NotFound();
+                }
+            }
+            catch (Exception ex)
+            {
+                // Clean up temporary file if it exists
+                if (!string.IsNullOrEmpty(tempFilePath) && System.IO.File.Exists(tempFilePath))
+                {
+                    System.IO.File.Delete(tempFilePath);
+                }
+
+                _logger.Log(LogLevel.Error, this, LogFunction.Update, ex, "Error Resizing Image {FileId}", request.FileId);
+                return StatusCode(500, "An error occurred while resizing the image.");
+            }
+        }
+
         [HttpPost("upload")]
         public async Task<IActionResult> UploadFile([FromForm] string folder, [FromForm] IFormFile file)
         {
@@ -282,5 +359,13 @@ public class UpdateCompanyAttributesRequest
             public int ModuleId { get; set; }
             public List<int> AttributeIds { get; set; }
         }
+
+        public class ResizeRequest
+        {
+            public int FileId { get; set; }
+            public int Width { get; set; }
+            public int Height { get; set; }
+            public int ModuleId { get; set; }
+        }
     }
 }

Server/GIBS.Module.BusinessDirectory.Server.csproj

@@ -36,5 +36,8 @@
     <Reference Include="Oqtane.Shared">
       <HintPath>..\..\oqtane.framework-6.1.2-Source\Oqtane.Server\bin\Debug\net9.0\Oqtane.Shared.dll</HintPath>
     </Reference>
+    <Reference Include="SixLabors.ImageSharp">
+      <HintPath>..\..\oqtane.framework-6.1.2-Source\Oqtane.Server\bin\Debug\net9.0\SixLabors.ImageSharp.dll</HintPath>
+    </Reference>
   </ItemGroup>
 </Project>

Server/Services/BusinessCompanyService.cs

@@ -150,5 +150,11 @@ public async Task UpdateCompanyAttributesAsync(int companyId, int moduleId, List
         {
             return await _businessCompanyRepository.GetCompanyAttributesAsync(companyId, moduleId);
         }
+
+        public Task<Oqtane.Models.File> ResizeImageAsync(int fileId, int width, int height, int moduleId)
+        {
+            // This is handled by the controller, so no implementation is needed here.
+            throw new NotImplementedException();
+        }
     }
 }

Shared/Interfaces/IBusinessCompanyService.cs

@@ -26,5 +26,6 @@ public interface IBusinessCompanyService
         Task UpdateCompanyAttributesAsync(int companyId, int moduleId, List<int> attributeIds);
 
         Task<List<Models.BusinessCompany>> GetCompanyAttributesAsync(int companyId, int moduleId);
+        Task<Oqtane.Models.File> ResizeImageAsync(int fileId, int width, int height, int moduleId);
     }
 }