markupr 2.1.8

package/src/main/transcription/index.ts

@@ -0,0 +1,56 @@
+/**
+ * Transcription Module
+ *
+ * Transcription Tiers (post-process architecture):
+ * - Tier 1: Local Whisper (default, post-session batch)
+ * - Tier 2: Timer-only (fallback, no transcription)
+ *
+ * The TierManager tracks tier availability for the UI.
+ * App works WITHOUT any API keys using local Whisper.
+ */
+
+// ============================================================================
+// Primary API - TierManager (use this for transcription)
+// ============================================================================
+
+export { TierManager, tierManager } from './TierManager';
+
+// ============================================================================
+// Supporting Services
+// ============================================================================
+// Whisper (Tier 1)
+export { WhisperService, whisperService } from './WhisperService';
+
+// Model Management
+export { ModelDownloadManager, modelDownloadManager } from './ModelDownloadManager';
+
+// ============================================================================
+// Types
+// ============================================================================
+
+export type {
+  // Tier types
+  TranscriptionTier,
+  WhisperModel,
+  TierStatus,
+  TierQuality,
+  // Event types
+  TranscriptEvent,
+  PauseEvent,
+  WhisperTranscriptResult,
+  WhisperConfig,
+  // Model types
+  ModelInfo,
+  DownloadProgress,
+  DownloadResult,
+  // Callbacks
+  TranscriptCallback,
+  PauseCallback,
+  TierChangeCallback,
+  ErrorCallback,
+  ProgressCallback,
+  CompleteCallback,
+} from './types';
+
+// Re-export types from shared for convenience
+export type { TranscriptionSegment } from '../../shared/types';

package/src/main/transcription/types.ts

@@ -0,0 +1,135 @@
+/**
+ * Shared Types for Transcription Services
+ *
+ * Available tiers (post-process architecture):
+ * - Tier 1: Local Whisper (post-session batch transcription)
+ * - Tier 2: Timer-only (fallback, no transcription)
+ */
+
+// ============================================================================
+// Transcription Tier Types
+// ============================================================================
+
+/**
+ * Available transcription tiers in priority order
+ */
+export type TranscriptionTier = 'whisper' | 'timer-only';
+
+/**
+ * Whisper model sizes available for download
+ */
+export type WhisperModel = 'tiny' | 'base' | 'small' | 'medium' | 'large';
+
+/**
+ * Status of a transcription tier
+ */
+export interface TierStatus {
+  tier: TranscriptionTier;
+  available: boolean;
+  reason?: string;
+}
+
+/**
+ * Quality information for a tier
+ */
+export interface TierQuality {
+  accuracy: string;
+  latency: string;
+}
+
+// ============================================================================
+// Transcript Event Types
+// ============================================================================
+
+/**
+ * Unified transcript event from any tier
+ */
+export interface TranscriptEvent {
+  text: string;
+  isFinal: boolean;
+  confidence: number;
+  timestamp: number;
+  tier: TranscriptionTier;
+}
+
+/**
+ * Pause detection event (triggers screenshots)
+ */
+export interface PauseEvent {
+  timestamp: number;
+  tier: TranscriptionTier;
+}
+
+// ============================================================================
+// Whisper-Specific Types
+// ============================================================================
+
+/**
+ * Result from Whisper transcription
+ */
+export interface WhisperTranscriptResult {
+  text: string;
+  startTime: number;
+  endTime: number;
+  confidence: number;
+}
+
+/**
+ * Whisper service configuration
+ */
+export interface WhisperConfig {
+  modelPath: string;
+  language: string;
+  threads: number;
+  translateToEnglish: boolean;
+}
+
+// ============================================================================
+// Model Download Types
+// ============================================================================
+
+/**
+ * Information about a Whisper model
+ */
+export interface ModelInfo {
+  name: WhisperModel;
+  filename: string;
+  sizeBytes: number;
+  sizeMB: number;
+  ramRequired: string;
+  quality: string;
+  url: string;
+}
+
+/**
+ * Progress information during model download
+ */
+export interface DownloadProgress {
+  model: WhisperModel;
+  downloadedBytes: number;
+  totalBytes: number;
+  percent: number;
+  speedBps: number;
+  estimatedSecondsRemaining: number;
+}
+
+/**
+ * Result of a model download operation
+ */
+export interface DownloadResult {
+  success: boolean;
+  model: WhisperModel;
+  path: string;
+  error?: string;
+}
+
+// ============================================================================
+// Callback Types
+// ============================================================================
+
+export type TranscriptCallback = (event: TranscriptEvent) => void;
+export type PauseCallback = (event: PauseEvent) => void;
+export type TierChangeCallback = (oldTier: TranscriptionTier, newTier: TranscriptionTier, reason: string) => void;
+export type ErrorCallback = (error: Error, tier?: TranscriptionTier) => void;
+export type ProgressCallback = (progress: DownloadProgress) => void;
+export type CompleteCallback = (result: DownloadResult) => void;

package/src/main/windows/PopoverManager.ts

@@ -0,0 +1,284 @@
+/**
+ * PopoverManager - NSPopover-like window for menu bar apps
+ *
+ * Creates a frameless window that:
+ * - Appears anchored below the tray icon
+ * - Closes when clicking outside (blur)
+ * - Has no shadow (draws its own)
+ * - Uses vibrancy on macOS
+ * - Supports different sizes per state
+ */
+
+import { BrowserWindow, screen, Tray, app } from 'electron';
+import { join } from 'path';
+
+/**
+ * Popover sizes for different application states
+ */
+export const POPOVER_SIZES = {
+  idle: { width: 460, height: 680 },
+  recording: { width: 316, height: 90 },
+  processing: { width: 320, height: 140 },
+  complete: { width: 460, height: 720 },
+  settings: { width: 400, height: 520 },
+  error: { width: 440, height: 620 },
+} as const;
+
+export type PopoverState = keyof typeof POPOVER_SIZES;
+
+export interface PopoverConfig {
+  width: number;
+  height: number;
+  tray: Tray;
+}
+
+/**
+ * PopoverManager class - Manages the menu bar popover window
+ */
+export class PopoverManager {
+  private window: BrowserWindow | null = null;
+  private tray: Tray | null = null;
+  private config: PopoverConfig;
+  private keepVisibleOnBlur = false;
+  private currentState: PopoverState = 'idle';
+
+  constructor(config: PopoverConfig) {
+    this.config = config;
+    this.tray = config.tray;
+  }
+
+  /**
+   * Create the popover window with proper configuration
+   */
+  create(): BrowserWindow {
+    const preloadPath = join(app.getAppPath(), 'dist', 'preload', 'index.mjs');
+
+    this.window = new BrowserWindow({
+      width: this.config.width,
+      height: this.config.height,
+      show: false,
+      frame: false,
+      fullscreenable: false,
+      resizable: false,
+      movable: false,
+      minimizable: false,
+      maximizable: false,
+      closable: true,
+      alwaysOnTop: true,
+      skipTaskbar: true,
+
+      // macOS-specific vibrancy for native feel
+      ...(process.platform === 'darwin' && {
+        vibrancy: 'popover',
+        visualEffectState: 'active',
+        transparent: true,
+        backgroundColor: '#00000000',
+      }),
+
+      // Windows/Linux fallback with transparency
+      ...(process.platform !== 'darwin' && {
+        transparent: true,
+        backgroundColor: '#00000000',
+      }),
+
+      webPreferences: {
+        preload: preloadPath,
+        nodeIntegration: false,
+        contextIsolation: true,
+        sandbox: false,
+      },
+    });
+
+    // Hide on blur (clicking outside the popover)
+    this.window.on('blur', () => {
+      if (this.keepVisibleOnBlur) {
+        return;
+      }
+      this.hide();
+    });
+
+    // Prevent window from showing in Mission Control on macOS
+    if (process.platform === 'darwin') {
+      this.window.setVisibleOnAllWorkspaces(true, { visibleOnFullScreen: true });
+    }
+
+    console.log('[PopoverManager] Popover window created');
+
+    return this.window;
+  }
+
+  /**
+   * Show the popover anchored to the tray icon
+   */
+  show(): void {
+    if (!this.window || !this.tray) return;
+
+    const position = this.calculatePosition();
+    this.window.setPosition(position.x, position.y, false);
+    this.window.show();
+    this.window.focus();
+
+    console.log('[PopoverManager] Popover shown at', position);
+  }
+
+  /**
+   * Hide the popover
+   */
+  hide(): void {
+    if (!this.window) return;
+    this.window.hide();
+    console.log('[PopoverManager] Popover hidden');
+  }
+
+  /**
+   * Toggle popover visibility
+   */
+  toggle(): void {
+    if (!this.window) return;
+
+    if (this.window.isVisible()) {
+      this.hide();
+    } else {
+      this.show();
+    }
+  }
+
+  /**
+   * Calculate position to anchor below tray icon
+   * Handles multi-monitor setups and taskbar positions
+   */
+  private calculatePosition(): { x: number; y: number } {
+    if (!this.tray || !this.window) {
+      return { x: 0, y: 0 };
+    }
+
+    const trayBounds = this.tray.getBounds();
+    const windowBounds = this.window.getBounds();
+    const isHudState = this.currentState === 'recording' || this.currentState === 'processing';
+
+    if (isHudState) {
+      const cursorDisplay = screen.getDisplayNearestPoint(screen.getCursorScreenPoint());
+      const workArea = cursorDisplay.workArea;
+      const x = Math.round(workArea.x + (workArea.width - windowBounds.width) / 2);
+      const y = Math.round(workArea.y + 8);
+      return { x, y };
+    }
+
+    const display = screen.getDisplayMatching(trayBounds);
+
+    // Center horizontally under tray icon
+    let x = Math.round(trayBounds.x + (trayBounds.width / 2) - (windowBounds.width / 2));
+
+    // Position below tray (macOS menu bar is at top)
+    let y: number;
+    if (process.platform === 'darwin') {
+      // macOS: position below menu bar with small gap
+      y = trayBounds.y + trayBounds.height + 4;
+    } else {
+      // Windows/Linux: detect taskbar position
+      const taskbarOnTop = trayBounds.y < display.workArea.y + 50;
+      if (taskbarOnTop) {
+        // Taskbar at top - position below it
+        y = trayBounds.y + trayBounds.height + 4;
+      } else {
+        // Taskbar at bottom - position above it
+        y = trayBounds.y - windowBounds.height - 4;
+      }
+    }
+
+    // Ensure window stays on screen (respects work area boundaries)
+    const { workArea } = display;
+    x = Math.max(workArea.x, Math.min(x, workArea.x + workArea.width - windowBounds.width));
+    y = Math.max(workArea.y, Math.min(y, workArea.y + workArea.height - windowBounds.height));
+
+    return { x, y };
+  }
+
+  /**
+   * Get the BrowserWindow for loading content
+   */
+  getWindow(): BrowserWindow | null {
+    return this.window;
+  }
+
+  /**
+   * Check if popover is visible
+   */
+  isVisible(): boolean {
+    return this.window?.isVisible() ?? false;
+  }
+
+  /**
+   * Resize the popover for different states
+   * Re-anchors to tray if visible
+   */
+  resize(width: number, height: number): void {
+    if (!this.window) return;
+
+    this.window.setSize(width, height, true);
+
+    // Reposition to stay anchored to tray
+    if (this.window.isVisible()) {
+      const position = this.calculatePosition();
+      this.window.setPosition(position.x, position.y, false);
+    }
+
+    console.log(`[PopoverManager] Resized to ${width}x${height}`);
+  }
+
+  /**
+   * Resize to a predefined state size
+   */
+  resizeToState(state: PopoverState): void {
+    this.currentState = state;
+    this.applyStateAppearance(state);
+    const size = POPOVER_SIZES[state];
+    this.resize(size.width, size.height);
+  }
+
+  /**
+   * Keep popover visible while app focus changes.
+   * Useful during active recording when users switch to other apps.
+   */
+  setKeepVisibleOnBlur(enabled: boolean): void {
+    this.keepVisibleOnBlur = enabled;
+  }
+
+  /**
+   * Update the tray reference (if tray is recreated)
+   */
+  setTray(tray: Tray): void {
+    this.tray = tray;
+  }
+
+  /**
+   * Clean up resources
+   */
+  destroy(): void {
+    if (this.window) {
+      this.window.destroy();
+      this.window = null;
+    }
+    this.tray = null;
+    console.log('[PopoverManager] Destroyed');
+  }
+
+  private applyStateAppearance(state: PopoverState): void {
+    if (!this.window || process.platform !== 'darwin') {
+      return;
+    }
+
+    const isHudState = state === 'recording' || state === 'processing';
+    try {
+      // During compact HUD states, disable popover vibrancy + shadow so only
+      // the overlay chip itself is visible (no boundary rectangle).
+      this.window.setVibrancy(isHudState ? null : 'popover');
+      this.window.setBackgroundColor('#00000000');
+      if (typeof this.window.setHasShadow === 'function') {
+        this.window.setHasShadow(!isHudState);
+      }
+    } catch (error) {
+      console.warn('[PopoverManager] Failed to apply state appearance:', error);
+    }
+  }
+}