Merge pull request #5 from clayschaad/imrove-image-loading

Imrove image loading

.github/copilot-instructions.md

@@ -3,8 +3,11 @@ MemoryGame is a Blazor WebAssembly application for people with dementia
 
 Always reference these instructions first and fallback to search or bash commands only when you encounter unexpected information that does not match the info here.
 
-Use dotnet version 10
+## General rules
-Always build and run test
+
+- Use dotnet version 10
+- Always build and run test
+- Update README.md automatically if a code change need to be addressed
 
 ## C# Coding Standards
 - Should use params collections (e.g., ```csharp

MemoryGame/Services/GameService.cs

@@ -46,25 +46,20 @@ public sealed class GameService
     {
         _availableWords = [];
         
-        var commonWords = new[]
+        var manifest = await _httpClient.GetStringAsync("manifest.txt");
-        {
+        var imageNames = manifest.Split('\n', StringSplitOptions.RemoveEmptyEntries | StringSplitOptions.TrimEntries);
-            "ball", "bed", "book", "car", "cat", "chair", "clock", "cup",
-            "dog", "door", "fork", "hat", "house", "knife", "phone",
-            "shoe", "spoon", "table", "tree", "window"
-        };
         
-        var loadTasks = commonWords.Select(async word =>
+        var loadTasks = imageNames.Select(async imageName =>
         {
-            var imagePath = $"images/{word}.svg";
+            var imagePath = $"images/{imageName}";
             try
             {
                 var response = await _httpClient.GetAsync(imagePath, HttpCompletionOption.ResponseHeadersRead);
                 if (response.IsSuccessStatusCode)
                 {
-                    var germanWord = ConvertToGermanWord(word);
                     return new GameWord
                     {
-                        Word = germanWord,
+                        Word = Path.GetFileNameWithoutExtension(imageName),
                         ImagePath = imagePath,
                         CorrectCount = 0,
                         IncorrectCount = 0
@@ -81,34 +76,6 @@ public sealed class GameService
         _availableWords = results.Where(w => w != null).Cast<GameWord>().ToList();
     }
     
-    private static string ConvertToGermanWord(string englishWord)
-    {
-        return englishWord.ToLower() switch
-        {
-            "fork" => "Gabel",
-            "knife" => "Messer",
-            "spoon" => "Löffel",
-            "door" => "Tür",
-            "window" => "Fenster",
-            "ball" => "Ball",
-            "house" => "Haus",
-            "tree" => "Baum",
-            "car" => "Auto",
-            "cat" => "Katze",
-            "dog" => "Hund",
-            "chair" => "Stuhl",
-            "table" => "Tisch",
-            "cup" => "Tasse",
-            "book" => "Buch",
-            "clock" => "Uhr",
-            "bed" => "Bett",
-            "phone" => "Telefon",
-            "shoe" => "Schuh",
-            "hat" => "Hut",
-            _ => char.ToUpper(englishWord[0]) + englishWord[1..].ToLower()
-        };
-    }
-    
     public GameSession CreateNewGame()
     {
         var rounds = new List<Round>();

MemoryGame/wwwroot/manifest.txt

@@ -0,0 +1,20 @@
+ball.svg
+bed.svg
+book.svg
+car.svg
+cat.svg
+chair.svg
+clock.svg
+cup.svg
+dog.svg
+door.svg
+fork.svg
+hat.svg
+house.svg
+knife.svg
+phone.svg
+shoe.svg
+spoon.svg
+table.svg
+tree.svg
+window.svg

README.md

@@ -133,28 +133,22 @@ MemoryGame/
 
 ## Adding New Words/Images
 
-The game automatically discovers images from the `wwwroot/images/` folder. To add new words and images:
+The game loads images listed in the `wwwroot/manifest.txt` file. To add new words and images:
 
-1. **Add your image**: Place an SVG image in `wwwroot/images/` with the English filename (e.g., `apple.svg`, `orange.svg`)
+1. **Add your image**: Place an SVG image in `wwwroot/images/` with the filename (e.g., `apple.svg`, `orange.svg`)
-2. **Add to discovery list**: Add the filename (without extension) to the `commonWords` array in `Services/GameService.cs`:
+2. **Update the manifest**: Add the filename (with extension) to `wwwroot/manifest.txt`:
-   ```csharp
-   var commonWords = new[]
-   {
-       "ball", "bed", "book", "car", "cat", "chair", "clock", "cup",
-       "dog", "door", "fork", "hat", "house", "knife", "phone",
-       "shoe", "spoon", "table", "tree", "window",
-       "apple", "orange"  // Add new words here
-   };
    ```
-3. **Add German translation** (optional): If you want a custom German translation, update the `ConvertToGermanWord` method in `Services/GameService.cs`:
+   ball.svg
-   ```csharp
+   bed.svg
-   "apple" => "Apfel",
+   book.svg
-   "orange" => "Orange",
+   apple.svg
+   orange.svg
    ```
-   
+   Each image filename should be on its own line in the manifest file.
-   If no translation is provided, the filename will be capitalized and used as-is.
 
-The game will automatically discover and load images that exist in the folder. No manifest file needed!
+3. **Image naming**: The word displayed in the game is derived from the filename without the extension (e.g., `apple.svg` becomes "Apple" in the game).
+
+The game uses efficient parallel loading to fetch all images listed in the manifest file at startup.
 
 ## Browser Compatibility