OpenWebUI Context Menu

About

Create and use custom context menu items to query Open WebUI when browsing the web

# OpenWebUI Context Menu – Version 2.5

## Highlights

- **Custom Context Menu Items as Defaults** – The default "Explain" and "Research" context menu items have been removed and replaced with fully customizable custom context menu items. This provides users with complete control over these essential prompts.
- **Migration of Existing Defaults** – Existing users' "Explain" and "Research" prompts and their associated settings will be automatically migrated to new custom context menu items upon extension update or settings import, ensuring a seamless transition without loss of data.
- **Increased Custom Menu Limit** – The maximum number of custom context menu items has been increased to 10 to accommodate the new default custom items and provide more flexibility.
- **Automatic Settings Saving** – All settings, including custom context menu items, are now saved automatically as you make changes. The manual "Save Settings" button has been removed for a more seamless and intuitive user experience.
- **Debounced Saving** – To ensure optimal performance, a debouncing mechanism has been implemented. This means that changes are saved a moment after you stop typing, preventing excessive writes to the browser's storage.
- **Improved User Experience** – The new automatic saving feature eliminates the need to manually save changes, making the settings page more user-friendly and efficient.
- **Enhanced URL Detection with Source Selection & Dynamic Tooltips** – Fixed an issue where YouTube detection would incorrectly add `youtube.com/watch?v=true` to the query. Users can now explicitly choose the source for YouTube video ID and general URL detection (Selected Text Only, Page URL Only, or Prefer Selected Text) for all custom context menu items. Dynamic tooltips have been added next to each source selection dropdown, providing clear explanations that update based on the selected option. Only a single YouTube video ID or URL will be passed to Open WebUI, based on the selected preference.
- **Auto-Scrolling for New Menus** – When a new custom context menu item is added, the page now automatically scrolls to display the newly created item.

## Changes Made

### Options UI (options.html + options.js)

- **Removed Default Prompt UI** – The dedicated UI sections for "Prompt 1" (Explain) and "Prompt 2" (Research) have been removed from `options.html`.
- **Removed Manual Save Button** – The "Save Settings" button has been removed from the options page.
- **Implemented Automatic Saving** – A new `saveSettings` function has been added to automatically save all settings to the browser's storage.
- **Added Debouncing** – A `debounce` function has been implemented to prevent excessive storage writes, ensuring a smooth and responsive user experience.
- **Event Listeners** – Event listeners have been added to all input fields, text areas, and checkboxes to trigger the debounced save function when changes are made.
- **Simplified Custom Menu Creation** – The "Save Item" button for new custom context menu items has been removed, as they are now saved automatically.
- **Auto-Scroll on New Menu Add** – Implemented `Element.scrollIntoView()` to automatically scroll to a newly added custom context menu item.
- **Migration Logic** – Added logic in `options.js` to detect and convert old default "explain" and "research" prompts into new custom context menu items upon loading the options page or importing settings.
- **Increased Custom Menu Limit** – The maximum number of custom context menu items allowed has been increased to 10.

### Background Script (background.js)

- **Removed Default Context Menu Creation** – The code responsible for creating the hardcoded "openwebui-query" and "openwebui-research" context menu items has been removed.
- **Updated Storage Loading** – The `loadSettings` function no longer attempts to load `explainPrompt`, `researchPrompt`, `explainPromptTitle`, `researchPromptTitle`, or `querySettings` directly, as these are now handled via custom context menus.
- **Updated Storage Change Listener** – The `onChanged` listener now only reacts to changes in `customContextMenus`.
- **Refined Context Menu Click Handler** – The `onClicked` listener now exclusively processes custom context menu items, removing the conditional logic for default prompts.
- **Refined YouTube/Load URL Parameter Handling** – The `extractYouTubeVideoId` and `extractLoadUrl` functions in `background.js` have been updated to extract a *single* YouTube video ID or general URL based on the user's source preference (Selected Text Only, Page URL Only, or Prefer Selected Text). This ensures compatibility with Open WebUI, which only accepts a single `youtube` or `load-url` parameter. The logic now prioritizes the selected source and prevents incorrect `youtube=true` or `loadUrl=true` parameters from being appended.
- **Source Selection UI in Options** – Added dropdowns in the options page for all custom context menu items, allowing users to select their preferred source for YouTube and Load URL detection.
- **Dynamic Tooltips for Source Selection** – Implemented hover-activated info icons next to each source selection dropdown. These tooltips dynamically display a description of the currently selected option, providing clear guidance without visual clutter.

### User Experience

- **Seamless Saving** – All changes are now saved automatically in the background, eliminating the need for manual saving.
- **Instant Feedback** – A "Settings saved!" notification appears briefly to confirm that your changes have been saved.
- **Intuitive Workflow** – The settings page is now more intuitive and user-friendly, allowing you to make changes without worrying about saving them.
- **Full Customization** – Users now have full control over all context menu items, including the previously default "Explain" and "Research" prompts.

## Backward Compatibility

- **Automatic Migration** – Existing installations will automatically migrate their old default "Explain" and "Research" prompts to custom context menu items upon update.
- **Export/Import Compatibility** – Exported settings from previous versions can still be imported, and the migration logic will convert old default prompts within the imported file to custom context menu items.
- All other previous functionality continues to work as expected.

## Features:
### Version 2.5 (Current)
-**Automatic Saving**- Automatically saves changes now using Debouncing for less writes
- **Custom Context Menu Items** - Create up to 10 additional custom context menu items
- **Individual Settings per Item** - Each context menu item has its own prompt template and settings
- **Export/Import Settings** - Save and share your configuration with JSON files

## Usage
- Before using, head to the options and set up your Base URL and prompts, OR Try the Defaults!
- Defaults should automatically detect a working instance of Open WebUI on http://localhost:3000

### Context Menu Use
1. Select text you wish to query AI with
2. Right Click Text
3. Hover over OpenWebUI Context Menu
4. Choose your prompt

### Default Context Menu Items
- **Ask OpenWebUI (Prompt 1)** - Explain selected text using page context
- **Ask OpenWebUI (Prompt 2)** - Perform comprehensive research on selected text

### Custom Context Menu Items  
1. Open extension options via Extensions button or options menu, click the 3 dots, Click Extension options
2. Click "Add New Context Menu Item" 
3. Enter a name for your new menu item
4. Configure the prompt template and settings
5. Your custom menu will appear in the right-click context menu

### Settings Configuration
1. **Base URL** - Set your OpenWebUI instance address (default: http://localhost:3000)
2. **Prompt Templates** - Customize prompts 
3. **Parameters** - Configure models, tools, etc. for each action
4. **Feature Toggles** - Enable/disable features like web search, code interpreter

## Custom Context Menu Items Features

### Creating New Items
- Click Add New Context Menu Item, it will automatically scroll to your new menu
- Maximum of 10 custom context menu items allowed
- Each item has its own prompt template and settings
- All settings are saved with your configuration

### Managing Items
- Delete custom items using the delete button (default items cannot be deleted)
- Export/import all settings including custom context menus as JSON files