dwn/features.html at master

 <!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Features - DWN Documentation</title>
     <link rel="stylesheet" href="css/style.css">
 </head>
 <body>
     <button class="mobile-menu-btn">Menu</button>
     <div class="layout">
         <aside class="sidebar">
             <div class="sidebar-header">
                 <h1>DWN</h1>
                 <span class="version">v2.0.0</span>
             </div>
             <div class="search-box">
                 <input type="text" class="search-input" placeholder="Search docs...">
             </div>
             <nav class="sidebar-nav">
                 <div class="nav-section">
                     <div class="nav-section-title">Getting Started</div>
                     <a href="index.html" class="nav-link">Introduction</a>
                     <a href="installation.html" class="nav-link">Installation</a>
                     <a href="quickstart.html" class="nav-link">Quick Start</a>
                 </div>
                 <div class="nav-section">
                     <div class="nav-section-title">User Guide</div>
                     <a href="features.html" class="nav-link active">Features</a>
                     <a href="shortcuts.html" class="nav-link">Keyboard Shortcuts</a>
                     <a href="configuration.html" class="nav-link">Configuration</a>
                     <a href="layouts.html" class="nav-link">Layouts</a>
                     <a href="ai-features.html" class="nav-link">AI Integration</a>
                 </div>
                 <div class="nav-section">
                     <div class="nav-section-title">API Reference</div>
                     <a href="api-overview.html" class="nav-link">API Overview</a>
                     <a href="api-reference.html" class="nav-link">API Reference</a>
                     <a href="api-examples.html" class="nav-link">API Examples</a>
                 </div>
                 <div class="nav-section">
                     <div class="nav-section-title">Advanced</div>
                     <a href="architecture.html" class="nav-link">Architecture</a>
                     <a href="abstraction-layer.html" class="nav-link">Abstraction Layer</a>
                     <a href="plugin-development.html" class="nav-link">Plugin Development</a>
                     <a href="building.html" class="nav-link">Building from Source</a>
                 </div>
             </nav>
         </aside>
         <main class="main-content">
             <div class="content">
                 <div class="page-header">
                     <h1>Features</h1>
                     <p class="lead">Comprehensive overview of DWN capabilities</p>
                 </div>
                 <div class="toc">
                     <div class="toc-title">On this page</div>
                     <ul class="toc-list">
                         <li><a href="#window-management">Window Management</a></li>
                         <li><a href="#window-rules">Window Rules</a></li>
                         <li><a href="#window-marks">Window Marks</a></li>
                         <li><a href="#workspaces">Virtual Workspaces</a></li>
                         <li><a href="#layouts">Layout System</a></li>
                         <li><a href="#panels">Panels & System Tray</a></li>
                         <li><a href="#notifications">Notifications</a></li>
                         <li><a href="#screenshot-ocr">Screenshot & OCR</a></li>
                         <li><a href="#ai">AI Integration</a></li>
                         <li><a href="#api">WebSocket API</a></li>
                     </ul>
                 </div>
                 <h2 id="window-management">Window Management</h2>
                 <p>DWN provides comprehensive window management with both manual and automatic control.</p>
                 <h3>Window States</h3>
                 <ul>
                     <li><strong>Normal</strong> - Standard window state, subject to layout rules</li>
                     <li><strong>Floating</strong> - Exempt from tiling, freely movable and resizable</li>
                     <li><strong>Maximized</strong> - Fills usable area with decorations</li>
                     <li><strong>Fullscreen</strong> - Fills entire screen, no decorations or panels</li>
                     <li><strong>Minimized</strong> - Hidden from view, accessible via taskbar</li>
                 </ul>
                 <h3>Window Snapping</h3>
                 <p>Snap windows to screen edges with <code>Super+Arrow</code> keys. Snapping is composable:</p>
                 <ul>
                     <li><code>Super+Left</code> - Left half (press twice for full width)</li>
                     <li><code>Super+Right</code> - Right half</li>
                     <li><code>Super+Up</code> - Top half</li>
                     <li><code>Super+Down</code> - Bottom half</li>
                     <li>Combine for quarter-screen: <code>Super+Left</code> then <code>Super+Up</code></li>
                 </ul>
                 <h3>Focus Modes</h3>
                 <div class="table-container">
                     <table>
                         <thead>
                             <tr>
                                 <th>Mode</th>
                                 <th>Description</th>
                             </tr>
                         </thead>
                         <tbody>
                             <tr>
                                 <td><code>click</code></td>
                                 <td>Focus window on mouse click (default)</td>
                             </tr>
                             <tr>
                                 <td><code>follow</code></td>
                                 <td>Focus follows mouse pointer with configurable delay</td>
                             </tr>
                         </tbody>
                     </table>
                 </div>
                 <h3>Alt-Tab Window Cycling</h3>
                 <p>DWN maintains a Most Recently Used (MRU) stack per workspace. <code>Alt+Tab</code> cycles through windows in order of recent use, not visual order.</p>
                 <h3>Keyboard Window Control</h3>
                 <p>Move and resize floating windows without leaving the keyboard:</p>
                 <ul>
                     <li><code>Super+Alt+Arrow</code> - Move window by 20 pixels</li>
                     <li><code>Super+Ctrl+Arrow</code> - Resize window by 20 pixels</li>
                 </ul>
                 <h2 id="window-rules">Window Rules</h2>
                 <p>Automatically apply settings to windows based on their class or title. Rules are matched using glob patterns with case-insensitive matching.</p>
                 <h3>Matching Criteria</h3>
                 <ul>
                     <li><strong>Class Pattern</strong> - Match by WM_CLASS (e.g., <code>Firefox</code>, <code>*terminal*</code>)</li>
                     <li><strong>Title Pattern</strong> - Match by window title (e.g., <code>*Calculator*</code>)</li>
                     <li><strong>Combined</strong> - Match both class and title simultaneously</li>
                 </ul>
                 <h3>Available Actions</h3>
                 <div class="table-container">
                     <table>
                         <thead>
                             <tr>
                                 <th>Property</th>
                                 <th>Description</th>
                             </tr>
                         </thead>
                         <tbody>
                             <tr>
                                 <td><code>workspace</code></td>
                                 <td>Move window to specific workspace (1-9)</td>
                             </tr>
                             <tr>
                                 <td><code>floating</code></td>
                                 <td>Set floating state (true/false)</td>
                             </tr>
                             <tr>
                                 <td><code>sticky</code></td>
                                 <td>Make window visible on all workspaces</td>
                             </tr>
                             <tr>
                                 <td><code>fullscreen</code></td>
                                 <td>Start window in fullscreen mode</td>
                             </tr>
                             <tr>
                                 <td><code>width</code>, <code>height</code></td>
                                 <td>Set initial window size</td>
                             </tr>
                             <tr>
                                 <td><code>x</code>, <code>y</code></td>
                                 <td>Set initial window position</td>
                             </tr>
                         </tbody>
                     </table>
                 </div>
                 <p>See <a href="configuration.html#rules">Configuration</a> for rule syntax.</p>
                 <h2 id="window-marks">Window Marks</h2>
                 <p>Mark windows with letters (a-z) for instant navigation, inspired by Vim marks.</p>
                 <div class="feature-grid">
                     <div class="feature-card">
                         <div class="feature-title">Set Mark</div>
                         <div class="feature-desc">Press <code>Super+M</code> then <code>a-z</code> to mark the focused window.</div>
                     </div>
                     <div class="feature-card">
                         <div class="feature-title">Jump to Mark</div>
                         <div class="feature-desc">Press <code>Super+'</code> then <code>a-z</code> to instantly focus the marked window.</div>
                     </div>
                     <div class="feature-card">
                         <div class="feature-title">Cross-Workspace</div>
                         <div class="feature-desc">Marks work across workspaces, automatically switching if needed.</div>
                     </div>
                     <div class="feature-card">
                         <div class="feature-title">26 Slots</div>
                         <div class="feature-desc">Use any letter a-z for marks. Reassigning overwrites the previous mark.</div>
                     </div>
                 </div>
                 <h2 id="workspaces">Virtual Workspaces</h2>
                 <p>DWN provides 9 virtual workspaces for organizing your windows.</p>
                 <div class="feature-grid">
                     <div class="feature-card">
                         <div class="feature-title">Independent Layouts</div>
                         <div class="feature-desc">Each workspace maintains its own layout mode, master ratio, and master count.</div>
                     </div>
                     <div class="feature-card">
                         <div class="feature-title">Quick Switching</div>
                         <div class="feature-desc">Switch with F1-F9, or Ctrl+Alt+Left/Right for sequential navigation.</div>
                     </div>
                     <div class="feature-card">
                         <div class="feature-title">Window Movement</div>
                         <div class="feature-desc">Move windows between workspaces with Shift+F1-F9.</div>
                     </div>
                     <div class="feature-card">
                         <div class="feature-title">Workspace Indicator</div>
                         <div class="feature-desc">Panel shows which workspaces have windows and current workspace.</div>
                     </div>
                 </div>
                 <h2 id="layouts">Layout System</h2>
                 <p>Six layout modes available per workspace:</p>
                 <h3>Tiling Layout</h3>
                 <p>Master-stack tiling with configurable ratios. The first window(s) occupy the master area, others stack on the side.</p>
                 <ul>
                     <li><code>Super+H/L</code> - Adjust master area size</li>
                     <li><code>Super+I/D</code> - Adjust master window count</li>
                     <li>Default master ratio: 55%</li>
                 </ul>
                 <h3>Floating Layout</h3>
                 <p>Traditional floating window management. Drag title bars to move, drag edges to resize.</p>
                 <h3>Monocle Layout</h3>
                 <p>All windows fullscreen and stacked. Use Alt-Tab to switch between them. Ideal for focused work.</p>
                 <h3>Centered Master Layout</h3>
                 <p>The master window is centered on screen with stack windows divided on left and right sides. Great for wide monitors.</p>
                 <h3>Columns Layout</h3>
                 <p>All windows arranged in equal-width vertical columns. Each window takes full height.</p>
                 <h3>Fibonacci Layout</h3>
                 <p>Windows arranged in a spiral pattern using recursive splitting. Creates a visually interesting and space-efficient arrangement.</p>
                 <h3>Grid Layout</h3>
                 <p>Windows arranged in an automatically-calculated grid pattern. Perfect for comparing multiple documents or monitoring many terminals simultaneously.</p>
                 <h3>Plugin System</h3>
                 <p>DWN v2.0 supports custom layout plugins. Create your own window arrangements using the Layout Plugin API. Both built-in and dynamically loaded plugins are supported.</p>
                 <p>See <a href="layouts.html">Layouts</a> and <a href="plugin-development.html">Plugin Development</a> for detailed documentation.</p>
                 <h2 id="panels">Panels & System Tray</h2>
                 <h3>Top Panel</h3>
                 <p>Contains workspace indicators, taskbar, layout indicator, and system tray.</p>
                 <h3>Bottom Panel</h3>
                 <p>Contains clock and news ticker (when configured).</p>
                 <h3>System Tray</h3>
                 <p>Full XEmbed protocol support for external application icons plus built-in widgets:</p>
                 <ul>
                     <li><strong>Battery</strong> - Percentage display with charging indicator</li>
                     <li><strong>Volume</strong> - Click for slider, scroll to adjust, right-click to mute</li>
                     <li><strong>WiFi</strong> - SSID display, click for network list</li>
                     <li><strong>External Icons</strong> - nm-applet, blueman, Telegram, etc.</li>
                 </ul>
                 <h2 id="notifications">Notifications</h2>
                 <p>DWN includes a built-in D-Bus notification daemon implementing the freedesktop.org specification.</p>
                 <ul>
                     <li>Automatic service registration on startup</li>
                     <li>Configurable colors and timeout</li>
                     <li>Stacking notification display</li>
                     <li>Urgency level support (low, normal, critical)</li>
                 </ul>
                 <p>No external notification daemon required.</p>
                 <h2 id="screenshot-ocr">Screenshot & OCR</h2>
                 <p>Built-in screenshot capture and OCR text extraction, accessible via the WebSocket API.</p>
                 <h3>Screenshot Modes</h3>
                 <div class="table-container">
                     <table>
                         <thead>
                             <tr>
                                 <th>Mode</th>
                                 <th>Description</th>
                             </tr>
                         </thead>
                         <tbody>
                             <tr>
                                 <td><code>fullscreen</code></td>
                                 <td>Capture entire screen</td>
                             </tr>
                             <tr>
                                 <td><code>window</code></td>
                                 <td>Capture specific window by ID</td>
                             </tr>
                             <tr>
                                 <td><code>active</code></td>
                                 <td>Capture currently focused window</td>
                             </tr>
                             <tr>
                                 <td><code>area</code></td>
                                 <td>Capture arbitrary rectangle</td>
                             </tr>
                         </tbody>
                     </table>
                 </div>
                 <h3>OCR Text Extraction</h3>
                 <p>Extract text from screenshots using Tesseract OCR engine:</p>
                 <ul>
                     <li>Multi-language support (English by default)</li>
                     <li>Confidence score reporting</li>
                     <li>Useful for automation and accessibility</li>
                 </ul>
                 <p>See <a href="api-reference.html">API Reference</a> for usage details.</p>
                 <h2 id="ai">AI Integration</h2>
                 <p>Optional AI features powered by OpenRouter API:</p>
                 <h3>AI Command Palette</h3>
                 <p>Natural language command input (<code>Super+Shift+A</code>). Ask the AI to:</p>
                 <ul>
                     <li>Launch applications ("open firefox")</li>
                     <li>Answer questions</li>
                     <li>Get system information</li>
                 </ul>
                 <h3>AI Context Analysis</h3>
                 <p>Press <code>Super+A</code> to see AI analysis of your current task based on open windows.</p>
                 <h3>Exa Semantic Search</h3>
                 <p>Web search with semantic understanding (<code>Super+Shift+E</code>). Find documentation, tutorials, and resources.</p>
                 <p>See <a href="ai-features.html">AI Integration</a> for setup instructions.</p>
                 <h2 id="api">WebSocket API</h2>
                 <p>Full programmatic control via JSON WebSocket API on configurable port (default 8777).</p>
                 <h3>Capabilities</h3>
                 <ul>
                     <li>Window management (list, focus, move, resize, close)</li>
                     <li>Workspace control (switch, move windows)</li>
                     <li>Layout management (mode, master ratio)</li>
                     <li>Keyboard simulation (key presses, typing)</li>
                     <li>Mouse simulation (move, click, drag)</li>
                     <li>Screenshot capture and OCR</li>
                     <li>System queries (windows, workspaces, monitors)</li>
                 </ul>
                 <h3>Use Cases</h3>
                 <ul>
                     <li>Test automation</li>
                     <li>Custom hotkey scripts</li>
                     <li>Remote desktop control</li>
                     <li>Accessibility tools</li>
                     <li>Integration with other applications</li>
                 </ul>
                 <p>See <a href="api-overview.html">API Overview</a> for getting started.</p>
                 <h2>Abstraction Layer (v2.0)</h2>
                 <p>DWN v2.0 introduces a comprehensive abstraction layer enabling backend portability and plugin extensibility:</p>
                 <ul>
                     <li><strong>Backend Interface</strong> - 80+ operation vtable for X11/Wayland portability</li>
                     <li><strong>Type Safety</strong> - Strongly typed handles replacing void* casts</li>
                     <li><strong>Memory Safety</strong> - Safe string and container abstractions</li>
                     <li><strong>Plugin API</strong> - Extensible architecture for layouts and widgets</li>
                     <li><strong>100% Compatible</strong> - Existing code works unchanged</li>
                 </ul>
                 <p>See <a href="abstraction-layer.html">Abstraction Layer</a> for technical details.</p>
                 <h2>Protocol Compliance</h2>
                 <p>DWN implements standard X11 protocols for compatibility:</p>
                 <ul>
                     <li><strong>EWMH</strong> - Extended Window Manager Hints</li>
                     <li><strong>ICCCM</strong> - Inter-Client Communication Conventions</li>
                     <li><strong>XEmbed</strong> - System tray embedding protocol</li>
                     <li><strong>Xinerama</strong> - Multi-monitor support</li>
                 </ul>
                 <footer>
                     <p>DWN Window Manager - retoor &lt;retoor@molodetz.nl&gt;</p>
                 </footer>
             </div>
         </main>
     </div>
     <script src="js/main.js"></script>
 </body>
 </html>