EVENT_MARKER_TOOLTIPS_GUIDE.md 5.2 KB

Event Marker Hover Tooltips - Implementation Guide

🎯 New Feature Added

Mouse hover tooltips now appear when you hover over red event markers! Players can now see detailed information about events before deciding whether to approach them.

📋 What the Tooltips Show

Event Information

  • 📍 Event Name with type icon (⚔️ Combat, 💰 Trading, etc.)
  • 📖 Event Description - what the event is about
  • 🎭 Event Type - Combat, Trading, Discovery, Social, Hazard, Rest, Mystery
  • ⭐ Rarity Level - Common, Uncommon, Rare, etc.
  • 💡 Interaction Hint - "Move close to trigger this event"

Event Type Icons

  • ⚔️ Combat - Battle encounters
  • 💰 Trading - Merchant opportunities
  • 🔍 Discovery - Hidden treasures/resources
  • 💬 Social - NPC interactions
  • ⚠️ Hazard - Environmental dangers
  • 🏕️ Rest - Recovery opportunities
  • Mystery - Strange occurrences

🎮 How It Works

Player Experience

  1. Red markers appear within perception range as before
  2. Hover mouse over any red marker
  3. Tooltip appears after 0.5 second delay
  4. Move mouse away to hide tooltip
  5. Make informed decision whether to approach or avoid

Smart Tooltip Behavior

  • Delay: 0.5 seconds to avoid accidental popups
  • Single tooltip: Only one tooltip shows at a time
  • Screen bounds: Tooltips stay within screen boundaries
  • Auto-positioning: Tooltips reposition to avoid screen edges

🔧 Technical Implementation

New Components

  • EventMarkerTooltip.cs - Handles mouse detection and tooltip display
  • Auto-added to every event marker automatically
  • Canvas creation - Creates UI canvas if none exists

Integration

  • EventMarkerVisualizer - Enhanced to add tooltip components
  • Reflection-based - Safe component addition for compilation
  • No dependencies - Works with existing UI systems

⚙️ Customization Options

Tooltip Timing

[SerializeField] private float showDelay = 0.5f; // Hover delay before showing

Tooltip Positioning

[SerializeField] private Vector2 tooltipOffset = new Vector2(10f, 10f); // Offset from mouse

Visual Styling

  • Background: Dark semi-transparent (0.1, 0.1, 0.1, 0.9)
  • Title: White, bold, 16pt font
  • Description: Gray, regular, 12pt font
  • Max Width: 300px with word wrapping

🎯 Strategic Benefits

Informed Decision Making

  • Know before you go - See what you're getting into
  • Risk assessment - Evaluate danger vs reward
  • Resource planning - Prepare for specific event types

Enhanced Immersion

  • Realistic scouting - "Spotting" events feels more authentic
  • Environmental storytelling - Event descriptions add lore
  • Visual feedback - Icons quickly communicate event types

Improved UX

  • No guesswork - Clear information about opportunities
  • Better strategy - Plan routes around preferred/avoided events
  • Accessibility - Visual information supports decision-making

🧪 Testing the Feature

Basic Testing

  1. Start travel scene with perception system active
  2. Move around until red markers appear
  3. Hover mouse over red markers
  4. Verify tooltips appear with correct information
  5. Test tooltip positioning near screen edges

Event Type Testing

Create different event types to test tooltip content:

  • Combat events show ⚔️ and battle information
  • Trading events show 💰 and merchant details
  • Discovery events show 🔍 and treasure hints

Edge Case Testing

  • Hover near screen edges (tooltips should reposition)
  • Hover on multiple markers quickly (only one tooltip shows)
  • Move mouse rapidly (tooltips should hide properly)

🐛 Troubleshooting

Tooltips Not Appearing

  • Check that markers have colliders (auto-added by tooltip component)
  • Verify EventMarkerTooltip component is on marker objects
  • Check console for "EventMarkerTooltip component not found" message

Tooltips Appear Off-Screen

  • Check tooltip positioning logic in UpdateTooltipPosition
  • Verify screen resolution detection
  • Adjust tooltipOffset values if needed

Multiple Tooltips Showing

  • Check currentTooltipShowing static management
  • Verify OnMouseExit calls are working properly
  • Look for tooltip cleanup in OnDestroy

🚀 Future Enhancements

Visual Improvements

  • Custom tooltip prefabs for different event types
  • Animated tooltips with fade in/out effects
  • Rich text formatting with colors and styles

Content Enhancements

  • Reward previews - Show potential loot/XP
  • Risk indicators - Difficulty ratings
  • Contextual information - Team status relevance

Interaction Improvements

  • Click to approach - Direct interaction from tooltip
  • Keyboard shortcuts - Quick navigation to events
  • Bookmark events - Mark interesting events for later

✅ Implementation Complete

The hover tooltip system is now fully integrated with your spottable event system! Players can hover over red event markers to see detailed information, making informed decisions about which encounters to pursue. This enhances the strategic depth of the perception-based travel system while maintaining smooth gameplay flow.