CueMode - Professional Developer Teleprompter

中文文档 | GitHub Pages

Transform VS Code into a professional teleprompter. Perfect for coding livestreams, technical presentations, educational videos, and professional content creation. Features instant theme switching, enhanced focus mode, auto-scroll control, and distraction-free reading experience.

🎯 What is CueMode?

CueMode is a next-generation teleprompter extension that transforms your VS Code editor into a professional teleprompter solution. Now featuring instant theme cycling, enhanced focus mode, expanded internationalization, and professional-grade functionality designed for developers, educators, and content creators.

✨ Version 2.3 Features:

• 📝 Selective Markdown Parsing - NEW! Intelligent markdown formatting for presentations with D-key toggle
• 📏 Line Height Adjustment - NEW! Professional line spacing control with L-key cycling (1.0, 1.2, 1.5, 1.8, 2.0)
• 🪞 M-Key Mirror Flip - Professional horizontal text mirroring for teleprompter hardware setups
• 📍 Smart Status Indicators - Visual feedback system with intelligent positioning to avoid UI conflicts
• 🎨 T-Key Theme Cycling - Instant theme switching across all 7 professional themes during presentations
• 🔍 Enhanced F-Key Focus Mode - Smart gradient blur algorithm with configurable focus lines (1-10) and opacity (0.1-0.8) for superior concentration
• ⚡ Enhanced Commands - Quick theme changes and text preprocessing
• 📱 Smart Notifications - Non-intrusive status bar feedback
• 🌐 Expanded Internationalization - Support for 6 languages: English, Chinese, German, French, Japanese, Korean
• 🛠️ TypeScript Architecture - Robust, maintainable codebase
• 🧪 Comprehensive Testing - 134 test cases ensuring reliability

Core Teleprompter Features:

• Auto-scrolling text - Smooth, controllable scroll speed for natural reading
• Large font display - Optimized for distance reading and camera work
• High contrast display - Clear visibility in any lighting condition
• Invisible controls - Minimal UI interference during recording/presentation
• Keyboard shortcuts - Professional teleprompter controls (start/stop, speed adjustment)

Simply select your script text or open your presentation notes, activate "Teleprompter Mode" from the command palette, and start presenting with confidence.

✨ Professional Teleprompter Features

CueMode provides professional teleprompter functionality for modern content creators:

📺 Professional Teleprompter Controls

• Auto-scroll functionality - Smooth, customizable scrolling speed
• Spacebar control - One-key start/stop scrolling
• Speed adjustment - Real-time speed control with +/- keys
• Direction switching - Reverse scrolling with R key
• Manual navigation - Precise positioning with arrow keys
• 🆕 T-Key theme cycling - Instant theme changes during presentations
• 🪞 Mirror flip mode - Horizontal text mirroring for professional teleprompter setups

🎨 Optimized Display

• Large fonts - Perfect for distance reading
• Centered layout - Natural eye movement for camera work
• High contrast themes - Clear visibility in any lighting condition
• Minimal interface - Hidden controls that don't interfere with recording

🎭 Professional Themes

• Classic - Traditional teleprompter black background with white text
• Inverted - White background with black text for bright environments
• Midnight Blue - Professional studio appearance
• Sunset - Warm, comfortable reading experience
• Forest - Eye-friendly for extended use
• Ocean - Calming blue for relaxed presentations
• Rose - Elegant theme for sophisticated content

⚙️ Teleprompter Settings

• Scroll speed - Fine-tune reading pace (0.1-5.0 range)
• Font size - Optimize for reading distance (12-72pt)
• Line height - Control text spacing comfort (1.0-3.0em)
• Content width - Set optimal reading width (400-1200px)
• Starting position - Position text for comfortable reading
• Padding - Adjust margins according to setup
• Focus mode - Enhanced concentration with gradient blur (NEW!)
• 🪞 Mirror flip - Horizontal text mirroring for professional teleprompter hardware setups

🚀 Perfect Teleprompter Use Cases

• YouTube Videos - Natural script reading while maintaining eye contact
• Live Streaming - Smooth delivery for coding tutorials and tech talks
• Video Tutorials - Professional presentation of prepared content
• Online Courses - Confident delivery of educational content
• Webinars - Professional speaking with script support
• Product Demos - Consistent messaging with teleprompter assistance
• Screen Recording - Professional video content
• Code Reviews - Focus on important details
• Presentations - Showcase your work
• Focused Development - Reduce distractions

🚀 Quick Start - Teleprompter Setup

Installation

1. Open VS Code
2. Go to Extensions (Ctrl+Shift+X / Cmd+Shift+X)
3. Search for "CueMode" or "teleprompter"
4. Click Install

Or install directly from VS Code Marketplace: CueMode - Professional Teleprompter

Basic Teleprompter Usage

1. Prepare script - Create or open a text file with your presentation content
2. Select script text (optional - if none selected, entire file will be used)
3. Activate teleprompter - Use Ctrl+Shift+P (Cmd+Shift+P on Mac) and search for "Teleprompter Mode"
4. Start reading - Press spacebar to begin auto-scrolling
5. Control during presentation:
   • Spacebar: Start/pause auto-scrolling
   • T Key: Enhanced! Instant theme switching across all 7 themes
   • F Key: New! Toggle enhanced focus mode with gradient blur
   • D Key: NEW! Toggle selective markdown parsing for formatted content
   • M Key: New! Toggle mirror flip mode
   • +/-: Real-time reading speed adjustment
   • R Key: Reverse scrolling direction
   • Arrow keys: Manual navigation

Professional Teleprompter Shortcuts

🎯 Main Controls:

• Spacebar - Start/pause auto-scrolling (primary control)
• T Key - Enhanced! Instant theme cycling through all 7 professional themes
• F Key - New! Toggle enhanced focus mode with smart gradient blur
• D Key - NEW! Toggle selective markdown parsing for formatted presentations
• M Key - New! Toggle mirror flip mode for teleprompter hardware
• +/- - Increase/decrease scrolling speed in real-time
• R Key - Toggle scrolling direction (up/down)

📱 Navigation:

• Arrow keys - Manual navigation
• Page Up/Down - Quick manual scrolling
• Home/End - Jump to start/end

⚙️ Advanced Controls:

• Ctrl+Shift+T (Cmd+Shift+T on Mac) - New! Open theme selection menu
• Ctrl+Shift+R (Cmd+Shift+R on Mac) - New! Remove leading spaces from text
• Ctrl+Shift+M (Cmd+Shift+M on Mac) - New! Toggle mirror flip mode
• Ctrl+Shift+D (Cmd+Shift+D on Mac) - NEW! Toggle selective markdown parsing mode
• H Key - Show/hide help panel
• Esc Key - Exit teleprompter mode

📝 Selective Markdown Parsing NEW!

CueMode now features intelligent markdown parsing that enhances your presentation content while maintaining optimal teleprompter readability.

🎯 What is Selective Markdown Parsing?

Selective markdown parsing transforms your markdown content into beautifully formatted, teleprompter-optimized text while preserving the natural flow needed for smooth reading during presentations.

Key Benefits:

• Enhanced readability - Clean, formatted content without distracting syntax
• Professional appearance - Tables, lists, and headers properly styled
• Maintained flow - Optimized for natural reading rhythm
• Instant toggling - Switch between raw and parsed modes seamlessly

🚀 How to Use Markdown Mode

1. Prepare markdown content - Create or open a .md file with your presentation content
2. Activate teleprompter - Use Ctrl+Shift+P and search for "Teleprompter Mode"
3. Toggle markdown parsing - Press D key in webview OR use Ctrl+Shift+D command
4. Present with confidence - Enjoy clean, formatted content optimized for reading

⌨️ Markdown Mode Controls

🎯 Toggle Markdown Parsing:

• D Key (in webview) - Instant toggle between raw and parsed markdown
• Ctrl+Shift+D (Cmd+Shift+D on Mac) - Toggle from VS Code or webview

📱 Visual Feedback:

• Status indicator - Shows current parsing mode (Raw/Parsed)
• Smart positioning - Status avoids conflicts with other UI elements
• Theme integration - Status styling matches your selected theme

🎨 Supported Markdown Elements

📝 Text Formatting:

• Headers (H1-H6) - Properly sized and styled for hierarchy
• Bold/Italic - Emphasized text maintains readability
• Code spans - Inline code with syntax highlighting
• Links - Clean link presentation for references

📋 Structured Content:

• Tables - Professional table layouts with proper spacing
• Lists - Bulleted and numbered lists with clean formatting
• Task lists - Interactive checkboxes for presentation checklists
• Blockquotes - Styled quotes for emphasis

💻 Code Content:

• Code blocks - Syntax-highlighted code with proper spacing
• Language support - Automatic detection and highlighting
• Preserved formatting - Maintains indentation and structure

🎯 Teleprompter-Optimized:

• Smart spacing - Optimal line heights for comfortable reading
• Theme integration - All 7 themes support markdown styling
• Performance optimized - < 50ms parsing for smooth experience
• Focus mode compatible - Works seamlessly with enhanced focus mode

📊 Markdown Configuration

Default Settings:

• Markdown parsing: Disabled by default (preserves existing workflow)
• Easy activation: Toggle with D key or Ctrl+Shift+D
• Persistent mode: Setting saved across sessions
• Performance: Optimized parsing with < 50ms processing time

Customization:

• Theme integration - Markdown styles adapt to your selected theme
• Font scaling - Markdown elements scale with your teleprompter font size
• Focus compatibility - Works with all focus mode settings

🎬 Perfect for Presentations

📺 Content Types:

• Technical presentations - Code examples with syntax highlighting
• Documentation reviews - Formatted docs for clear presentation
• Tutorial scripts - Step-by-step guides with proper formatting
• Meeting notes - Structured content for professional meetings
• Educational content - Well-formatted educational materials

🚀 Professional Benefits:

• Consistent formatting - Professional appearance across all content
• Reduced preparation time - Use existing markdown files directly
• Enhanced credibility - Clean, well-formatted content for better delivery
• Flexible workflow - Toggle between raw and formatted views instantly

⚙️ Teleprompter Configuration

Accessing Settings

1. Open VS Code settings (Ctrl+, / Cmd+,)
2. Search for "cuemode"
3. Adjust teleprompter settings as needed

Key Settings

• Color Theme - Choose from 7 professional themes
• Font Size - Adjust for reading distance (recommended 24-48pt)
• Scroll Speed - Set comfortable reading pace (recommended 0.1-0.3)
• Max Width - Control text line length (recommended 800-1200px)
• Starting Position - Position content on screen (recommended 30-50%)
• Focus Mode - Enable enhanced concentration mode (NEW!)
• Focus Opacity - Adjust blur intensity (0.1-0.8, default 0.3)
• Focus Line Count - Set focus area size (1-10 lines, default 3)
• Markdown Parsing - NEW! Enable selective markdown formatting (default: disabled)

🎯 Professional Usage Tips

📺 Video Recording Setup

1. Choose high-contrast themes (Classic or Inverted) for best readability
2. Increase font size (32-48pt) for distance reading
3. Adjust scroll speed to match your natural speaking pace
4. Use T key for seamless theme switching during recording
5. Enable focus mode with F key for enhanced concentration on current content

🎤 Live Streaming Tips

1. Practice shortcuts, especially spacebar, T key, and F key for focus mode
2. Prepare content by removing leading spaces for clean display
3. Use H key for quick help access (if you forget shortcuts)
4. Test themes and focus mode under your lighting setup for best visibility
5. Customize focus settings to match your reading preferences

📚 Educational Content

1. Break complex code into manageable chunks
2. Use slower scroll speeds for detailed explanations
3. Leverage manual navigation (arrow keys) to highlight specific sections
4. Prepare backup themes for different content types
5. Use focus mode to highlight key concepts during explanations

🆕 New Features Explained

🔍 Enhanced F-Key Focus Mode

In teleprompter mode, simply press F key to toggle enhanced focus mode on/off:

• Smart Gradient Blur: Advanced algorithm provides smooth reading experience with buffer zones
• Configurable Focus Area: Adjust focus lines (1-10 lines, default 3)
• Adjustable Opacity: Set blur opacity (0.1-0.8, default 0.3)
• Visual Focus Indicator: Beautiful styling shows current active reading area
• Real-time Updates: Settings take effect immediately without restart

🎨 T-Key Theme Cycling

In teleprompter mode, simply press T key to cycle through all themes:

• Classic → Inverted → Midnight Blue → Sunset → Forest → Ocean → Rose → Classic...
• Status bar shows current theme name
• Settings auto-save

⚡ Enhanced Commands

• Ctrl+Shift+T: Open theme selection menu (with preview)
• Ctrl+Shift+R: Smart removal of leading spaces and indentation
• Ctrl+Shift+M: Toggle mirror flip mode for teleprompter hardware

📱 Smart Notifications

• All notifications now appear in status bar
• Auto-disappear after 2-3 seconds
• Won't interrupt your workflow

🌐 Expanded Internationalization

• Support for 6 languages: English, Chinese, German, French, Japanese, Korean
• Professional teleprompter terminology localization
• Automatic language detection from VS Code environment

🤝 Contributing

We welcome contributions! Please see our Contributing Guide for details.

For development setup, refer to DEVELOPMENT.md.

📝 License

This project is licensed under the MIT License.

🤝 Contributing

We warmly welcome your contributions! Whether reporting bugs, suggesting new features, improving documentation, or submitting code, all contributions are valuable support for the project.

For detailed information, please check:

• Contributing Guide (English)
• 贡献指南 (中文)
• Development Guide (English)
• 开发指南 (中文)

🔗 Links

• VS Code Marketplace: CueMode
• GitHub Repository: hddevteam/cuemode
• Project Documentation: GitHub Pages
• 中文文档: README.zh-CN.md
• Development Guide: DEVELOPMENT.md
• Roadmap: ROADMAP.md
• Issue Reports: GitHub Issues

🌟 Support the Project

If CueMode has helped your content creation, please consider:

• ⭐ Starring us on GitHub
• 📝 Leaving a review on VS Code Marketplace
• 🐛 Reporting issues or suggesting features
• 🤝 Contributing code or documentation

---

Make your presentations more professional, make your content shine! 🎬✨