Mobile

A mobile-optimized UX enhancement plugin for Obsidian that provides a floating action button (FAB) and context-aware toolbars.

Ask me for mobile friendly features

Gestures

Gestures are the heart of this plugin. You can create completely custom gestures to trigger any command in Obsidian.

1. Draw a gesture: Drag the Floating Action Button (FAB) to draw a shape.
2. Assign a command: When you release the FAB, if the gesture is not recognized, you will be prompted to assign a command to it.
3. Execute: Next time you draw the same shape, the assigned command will be executed.

Gestures are matched based on the shape, so you can draw them at any size or speed.

Features

Customizable Floating Action Button (FAB)

• Tap: Executes a primary command (default: Create new note).
• Long-press: Executes a secondary command (default: Open command palette).
• Gestures: Drag the button to draw shapes and trigger any command.
• Smart positioning: Anchors to the active editor leaf, ensuring it doesn't overlap navigation elements.

Context-Aware Toolbars

Dynamic toolbars that adapt based on your cursor position and selection:

Toolbar Features

• Two-section settings: Define toolbars in a library, then bind them to contexts.
• Auto-concatenation: Multiple toolbars bound to the same context are automatically merged.
• Icon support: Use Lucide icons with custom override capability.
• Horizontal scrolling: Scrolls when too many buttons to fit.
• Editor focus preservation: Keyboard stays open when using toolbar buttons.
• Contextual command availability: Toolbar buttons automatically hide when commands are unavailable based on current context.
• Smart layout: Toolbar automatically expands to full width when FAB is hidden, otherwise maintains 86px right padding to prevent overlap.
• Swipe-to-expand: Smooth gesture to expand toolbar and show multiple rows of commands (swipe up 30px).

Tablet Mode

• Force Tablet UI: Toggle to force the tablet interface on mobile phones.
• Keep in tablet mode: Command to toggle this mode.

Mobile Search

A dedicated search view optimized for mobile devices:

• Sticky search input: Always visible at the top of the results.
• Infinite scrolling: Efficiently loads results as you scroll (10 initial, 50 per batch).
• File previews: Shows a preview of the file content with caching for performance.
• Date display: Shows file modification date at the bottom corner of each preview (relative time for recent files).
• File context menu: Long-press/right-click on a result card for quick actions (open in new tab, open to the right, delete, copy file path).
• Smart keyboard handling: Automatically dismisses the keyboard when scrolling results.
• Auto-focus: Automatically focuses the search input when the sidebar opens.
• Smart focus: Automatically regains focus when scrolling back to the top of the results list.
• Performance optimizations: File list updates only when drawer is open or focused, with smart file system event listeners (create, delete, rename, modify) to reduce battery usage.
• Reliable results: Race condition fixed to prevent empty search results on initial open or when reopening with text.
• Selection mode: Long-press/right-click on any result card to enter selection mode for bulk operations
  • Selection command bar: Cancel button, dynamic Select All/Deselect All toggle, selection counter, and three-dot menu for bulk actions
  • Visual indicators: Selected cards show accent-colored border, checkmark badge, and highlighted background
  • Plugin extensibility: Triggers files-menu event for multiple files and file-menu for single file, allowing plugins to add custom actions
  • Smart interactions: Tap cards to toggle selection, long-press shows menu with appropriate actions based on selection count
  • Dynamic Select All button: Button text changes to "Deselect all" when all files are selected, providing clear feedback
  • Auto-exit: Selection mode automatically exits when no files are selected
  • Lazy-load support: Selected files show proper UI even when rendered later during scrolling
• Open Tabs: Option to display your currently open tabs for quick navigation.
• Folder selection mode: Press Backspace on an empty search input to toggle between file and folder selection modes. Exiting folder mode with backspace clears the current folder filter.

Tabs View

A dedicated view to manage your open tabs:

• List view: Displays a list of all open tabs for quick navigation.
• Enhanced UI: Tabs display icons matching their content and include a close button (X) for quick closing.
• Quick access: Use the "Open tabs" command to instantly open the view.

Sidebar Navigation

• Swipe Past Side Split: Switch between sidebar tabs (e.g., File Explorer, Search, Backlinks) by swiping from the edge of the screen when the sidebar is open.
• Visual Feedback: Shows an overlay with icons and titles for available sidebar tabs.

Tab gestures

Enhance your tab management in the mobile tab switcher:

• Swipe right: Close a tab instantly.
  Note: Start the swipe from the middle of the tab for reliable detection.
• Drag and drop: Reorder tabs by dragging one tab onto another.
  Note: Start dragging from the middle of the tab (not the edges) to avoid missed drags.

Installation

Brat

1. Install BRAT from the Community Plugins in Obsidian.
2. Open the command palette and run BRAT: Add a beta plugin for testing.
3. Enter the URL of this repository: https://github.com/TheJusticeMan/obsidian-mobile-plugin.
4. Click Add Plugin.
5. Enable the plugin in Settings → Community Plugins.

Configuration

Settings

Toolbar Library

Create reusable toolbars with custom command sets:

1. Click Add Toolbar.
2. Give it a name (e.g., "Formatting").
3. Add commands by their ID (e.g., editor:toggle-bold).
4. Optionally set custom icons for each command.

Context Bindings

Bind toolbars to editing contexts:

1. Click Add Binding.
2. Select a context type (Selection, List, Table, etc.).
3. Select a toolbar from your library.
4. Multiple bindings to the same context are auto-concatenated.

Commands

General Commands

Editor Navigation Commands

Precise cursor movement commands for mobile editing:

Selection Commands

Selection Expand

Expand your selection to word boundaries:

Selection Contract

Shrink your selection:

Smart Selection

Intelligent text selection commands:

Progressive Selection

Single command for incremental selection expansion:

Development

Prerequisites

• Node.js v16 or higher
• npm

Setup

# Clone the repository
git clone https://github.com/TheJusticeMan/obsidian-mobile-plugin.git

# Install dependencies
npm install

# Build for development (watch mode)
npm run dev

# Build for production
npm run build

Project Structure

src/
├── main.ts                     # Plugin entry point
├── settings.ts                 # Settings tab and interfaces
├── components/
│   └── SortableList.ts         # Reusable drag-and-drop list component
├── features/
│   ├── cursor-commands.ts      # Cursor & selection commands
│   ├── fab.ts                  # Floating Action Button manager (moved)
│   ├── sidebar-swipe.ts        # Swipe Past Side Split / sidebar navigation
│   ├── tab-gestures.ts         # Tab gestures and tab switcher logic
│   ├── tablet-mode.ts          # Keep-in-tablet-mode helpers
│   └── toolbar.ts              # Context-aware toolbar logic
├── utils/
│   ├── gesture-handler.ts      # Gesture recognition and handling
│   └── InsertMultipleAttachments.ts # Bulk-attachment helper
└── views/
    ├── SearchLeaf.ts           # Mobile search view
    └── TabsLeaf.ts             # Tabs view and tab management

License

MIT

Author

Justice Vellacott

Support

If you encounter any issues or have feature requests, please open an issue on GitHub.