📊 PowerPoint Viewer for VS Code
Directly Preview PowerPoint (.pptx) Presentations Inside VS Code with Continuous Vertical Scrolling & High-Fidelity Rendering.
Overview •
Features •
Code Architecture •
System Flow •
Structure •
Quick Start •
License
📌 Overview
A custom editor extension (LoNebula9.powerpoint-viewer) for VS Code that enables direct in-editor previewing of PowerPoint presentations (.pptx). Renders all slides as continuous vertical-scrolling high-resolution images, featuring zoom controls (50% to 200%), slide navigation, and automatic temporary file cleanup.
✨ Features (Key Outcomes & Capabilities)
| Icon |
Feature |
Outcome & Real Proof |
| 📜 |
Continuous Vertical Scrolling |
Scroll through all presentation slides seamlessly like a document without clicking next/previous |
| 🎯 |
High-Fidelity Rendering Engine |
Faithfully renders complex PowerPoint typography, smart shapes, and formatting via LibreOffice |
| 🔍 |
Interactive Zoom Controls |
Adjust magnification from 50% to 200% with real-time responsive scaling |
| 🧹 |
Automated Cache Cleanup |
Cleans temporary slide image caches automatically upon editor close |
🔬 Code Architecture & Implementation
🔬 Code Implementation (src/)
previewProvider.ts: Implements vscode.CustomReadonlyEditorProvider registered to powerpoint-viewer.preview, hosting the interactive Webview.converter.ts: Orchestrates background headless LibreOffice rendering (soffice --headless --convert-to pdf followed by PDF page extraction) to render high-resolution slide PNGs.- Webview UI (
getHtmlForWebview): Continuous vertical slide column with zoom controls, current slide indicator, and theme-adaptive styling.
- Resource Management:
cleanupAllTempFiles() automatically purges extracted slide caches on editor disposal.
📊 System Flow
graph LR
PPTX[📊 PowerPoint .pptx File] --> Provider[⚙️ PowerPointPreviewProvider]
Provider --> Converter[🔄 Headless Conversion Pipeline]
Converter --> SlideImages[🖼️ High-Res Slide PNGs]
SlideImages --> Webview[💻 VS Code Custom Webview Editor]
Webview --> Scroll[📜 Continuous Vertical Presentation View]
classDef primary fill:#d97706,stroke:#b45309,stroke-width:2px,color:#fff;
classDef accent fill:#3b82f6,stroke:#2563eb,stroke-width:2px,color:#fff;
class Provider,Converter primary;
class SlideImages,Webview,Scroll accent;
📁 Project Structure
powerpoint_viewer_extension/
├── 📁 assets/ # Marketplace PNG hero banners
│ └── 🎨 hero.png
├── 📁 src/
│ ├── 📄 previewProvider.ts # CustomReadonlyEditorProvider & Webview UI
│ ├── 📄 converter.ts # LibreOffice headless conversion pipeline
│ └── 📄 extension.ts # Extension activation & registration
├── 📄 package.json # Extension manifest & custom editor schema
└── 📄 README.md # Documentation
🚀 Quick Start
# Install from Marketplace:
ext install LoNebula9.powerpoint-viewer
# Or build locally:
npm install
npm run compile
Released under the MIT License. Crafted with precision by LoNebula
