Image Support in Flashcards

[DavidMiserak]

Issue: Image Support in Flashcards

Description

GoCard currently provides excellent support for text-based content including rich Markdown formatting and code syntax highlighting. However, many learning domains would benefit from visual content. This issue proposes adding support for displaying images directly within flashcards when using compatible terminals like kitty.

Background

The kitty terminal emulator supports inline image display using terminal graphics protocols. We can leverage this capability to enhance GoCard's visual learning experience while maintaining the file-based approach that makes GoCard unique.

User Story

As a visual learner using GoCard, I want to include images in my flashcards so that I can study content that requires visual references, such as anatomy diagrams, architecture designs, or technical illustrations.

Proposed Implementation

Markdown File Structure

Extend the existing Markdown support to recognize and process image references using standard Markdown syntax:

![Image description](path/to/image.jpg)

Storage Approach

• Images should be stored alongside Markdown files, maintaining the file-based philosophy
• Support relative paths to enable portable deck directories
• Consider supporting both local paths and web URLs for flexibility

Technical Components to Modify

1. internal/ui/markdown_renderer.go: Add image rendering capability
2. internal/ui/study_screen.go: Update viewport to accommodate images
3. internal/data/markdown_parser.go: Enhance to properly extract and process image references

Terminal Compatibility

• Primary support: kitty terminal protocol
• Fallback behavior: Display image paths/alt text in non-supporting terminals
• Configuration option to enable/disable image rendering

Acceptance Criteria

• Users can add image references to card questions and answers using standard Markdown syntax
• Images display properly in the question and answer views when using kitty terminal
• Appropriate fallback text is shown when using terminals without image support
• Images from both local paths and URLs are supported
• The application remains performant when loading cards with images
• Documentation is updated to explain image support capabilities and requirements

Technical Considerations

• Image sizing/scaling approach for various terminal dimensions
• Caching strategy to avoid reloading images repeatedly
• Error handling for missing or invalid images
• Ensure good UX when scrolling content that includes images

Out of Scope

• Image editing capabilities
• Image format conversion
• Image upload functionality