file type corrections

Guide for file type corrections

Asset File Type Corrections

Problem

Asset files with .png extensions were actually JPEG files, causing Bevy's asset loader to fail with errors:
ERROR Failed to load asset 'logos/Guide_icon.png': Format error decoding Png: Invalid PNG signature.

Root Cause

The files were generated or converted as JPEGs but saved with .png extensions. The PNG decoder expects a specific file signature (89 50 4E 47 0D 0A 1A 0A) but found JFIF JPEG headers instead.

Detection

Use the file command to identify actual file types:
file assets/logos/*.png
Output:
assets/logos/Guide_icon.png: JPEG image data, JFIF standard 1.01
assets/logos/Money_icon.png: JPEG image data, JFIF standard 1.01
assets/logos/Quest_icon.png: JPEG image data, JFIF standard 1.01

Solution

Step 1: Rename Files

Rename files to match their actual format:
cd /path/to/loh-game
mv assets/logos/Guide_icon.png assets/logos/Guide_icon.jpg
mv assets/logos/Money_icon.png assets/logos/Money_icon.jpg
mv assets/logos/Quest_icon.png assets/logos/Quest_icon.jpg

Step 2: Update Asset References

Find all code references to the old filenames:
grep -r "logos/.*\.png" src/
Example output:
src/systems/ui/mod.rs:138:    ui_assets.quest_icon = asset_server.load("logos/Quest_icon.png");
src/systems/ui/mod.rs:139:    ui_assets.inventory_icon = asset_server.load("logos/Money_icon.png");
src/systems/ui/mod.rs:143:    ui_assets.settings_icon = asset_server.load("logos/Guide_icon.png");
Update each reference:
Before:
ui_assets.quest_icon = asset_server.load("logos/Quest_icon.png");
ui_assets.inventory_icon = asset_server.load("logos/Money_icon.png");
ui_assets.settings_icon = asset_server.load("logos/Guide_icon.png");
After:
ui_assets.quest_icon = asset_server.load("logos/Quest_icon.jpg");
ui_assets.inventory_icon = asset_server.load("logos/Money_icon.jpg");
ui_assets.settings_icon = asset_server.load("logos/Guide_icon.jpg");

Step 3: Verify

Run the game and check for asset loading errors:
cargo run --bin legends_client 2>&1 | grep "Failed to load asset"
If successful, the errors should be gone.

Prevention

For New Assets

  1. Verify file type before adding:
    file path/to/new_asset.png
  2. Use correct extensions:
    • PNG files: .png
    • JPEG files: .jpg or .jpeg
    • WebP files: .webp
  3. Convert if needed:
    # Convert JPEG to PNG
convert input.jpg output.png

# Convert PNG to JPEG
convert input.png output.jpg

Asset Pipeline Recommendations

  1. Standardize format: Choose one format (PNG or JPEG) for UI icons
  2. Automate validation: Add pre-commit hook to verify file extensions
  3. Document requirements: Specify required formats in asset guidelines

File Format Comparison

PNG

  • Pros: Lossless, supports transparency, better for UI elements
  • Cons: Larger file size
  • Use for: Icons, UI elements, sprites with transparency

JPEG

  • Pros: Smaller file size, good for photos
  • Cons: Lossy compression, no transparency support
  • Use for: Backgrounds, textures, photos

Recommendation for UI Icons

Use PNG for all UI icons to ensure:
  • Crisp edges and text
  • Transparency support
  • Consistent quality
If files are currently JPEG, consider converting them to PNG:
for file in assets/logos/*.jpg; do
    convert "$file" "${file%.jpg}.png"
done
Then update references accordingly.

Current Status

Files Renamed:
  • ✅ Guide_icon.png → Guide_icon.jpg
  • ✅ Money_icon.png → Money_icon.jpg
  • ✅ Quest_icon.png → Quest_icon.jpg
Code Updates Needed:
  • ⚠️ src/systems/ui/mod.rs (lines 138, 139, 143) - Still references .png extensions

Related Issues

  • Asset loading failures can also occur due to:
    • Corrupted files
    • Missing files
    • Incorrect asset paths
    • Unsupported formats
Always check Bevy logs for specific error messages to diagnose asset issues.