Obsidian Local Images Plus

repository·main·Indexed 20 days ago

https://github.com/sergei-korneev/obsidian-local-images-plus

A plugin for Obsidian (v0.16.4) that automates downloading and localizing media files—including images, audio, and PDFs—from external links, web content, Word/Open Office documents, or markdown embeds into a local vault. It features automatic processing upon pasting, manual localization commands for notes or the entire vault, and tools to remove orphaned attachments. The plugin supports customizable storage paths, image optimization, and base64 image saving.

Tokens
3.9K
Snippets
9
Records
19
Agent score
69%

What's inside obsidian-local-images-plus

  1. Install Obsidian Local Images Plus

    main

    To install the plugin, you can use one of two methods:

    1. Open Obsidian.
    2. Navigate to Settings > Community plugins.
    3. Search for Obsidian Local Images Plus and install it.

    Method 2: Manual Installation

    1. Download the latest version from GitHub or the GitHub page.
    2. Important: Remove the obsidian-local-images plugin first to avoid conflicts.
    3. Extract the downloaded archive into your vault's plugin folder (e.g., Myvault/.obsidian/plugins).
    4. Restart Obsidian.

    Updating

    Update the plugin directly from the Obsidian settings menu and restart Obsidian.

  2. Remove orphaned attachments from your vault

    main

    If you have unused attachment files in your vault, you can remove them using the following commands:

    • Remove all orphaned attachments (Plugin folder): Searches for and removes orphans in the folder next to the active note.
    • Remove all orphaned attachments (Obsidian folder): Searches for and removes all unused attachments for all your notes.

    Note: For the Obsidian folder command to work, you must have a root subfolder configured in your Obsidian settings.

  3. Use Obsidian Local Images Plus for content pasting and embedding

    main

    The plugin automatically handles media localization when you paste content or embed files.

    Automatic Processing

    You can enable Automatic processing in the plugin settings so that localization happens immediately upon pasting.

    Supported Actions

    • Copy/Paste: Copy web content or content from Word/Open Office documents and paste it into a note or Canvas. The plugin will download the media files to your local vault.
    • Markdown Embedding: You can insert remote files using standard markdown syntax. The plugin will download them to your attachments folder:
      • Web files: ![description](http://mysite/mypdf.pdf)
      • Local files: ![description](file:///mylinuxdisk/mysong.mp3)
    • Base64 Images: The plugin saves base64 embedded images to your vault.

    Manual Commands

    You can trigger localization manually via the Command Palette:

    • Localize attachments for the current note (plugin folder): Processes the active note and saves attachments in the folder configured in the plugin settings.
    • Localize attachments for the current note (Obsidian folder): Processes the active note and saves attachments in the folder configured in the Obsidian settings.
    • Localize attachments for all your notes (plugin folder): Processes all notes in your vault that match the Include parameter in the plugin settings.

    Warning: This plugin can modify all your notes at once. It is highly recommended to perform regular backups of your files.

  4. How the plugin manages image attachments

    main

    The plugin automates the process of downloading remote images and moving them into your local vault. It works through several mechanisms:

    Manual Processing

    Users can trigger localization for a single note or the entire vault using the commands mentioned above. This replaces remote URLs with local paths.

    Real-time Updates (Paste & Create)

    • On Paste: If realTimeUpdate is enabled in settings, the plugin intercepts editor-paste events. If it detects media links in the clipboard content, it enqueues the active page for processing.
    • On File Creation: When a new Markdown file is created, the plugin can automatically trigger the localization process for that file if processCreated is enabled.

    Automated Queue Processing

    Modified files are added to a modifiedQueue. A background interval (configured by realTimeUpdateInterval) periodically processes this queue to ensure that images are downloaded and links are updated without blocking the main UI thread.

  5. Remove orphaned attachments

    main

    The plugin can identify and delete files in your attachment folders that are no longer referenced by any Markdown notes or Obsidian Canvas files.

    Orphan Removal Modes

    1. Plugin Folder: Requires settings where saveAttE is set to a pattern ending in ${notename} and the path does not contain ${date}.
    2. Obsidian Folder: Scans the folder defined in your Obsidian attachment settings. It checks both Markdown links/embeds and Obsidian Canvas nodes (both file nodes and text nodes containing links).

    Safety and Deletion

    When orphans are found, the plugin opens a confirmation modal (ModalW1). Depending on your removeOrphansCompl setting:

    • If disabled: Files are moved to the Obsidian trash (or system trash if configured).
    • If enabled: Files are deleted completely.
  6. Configure Local Images Plus settings

    main

    The plugin is configured via the ISettings interface. These settings control how images are processed, where they are saved, and how the plugin interacts with your Obsidian vault.

    Key configuration categories include:

    • Processing Behavior: processCreated (process new files), processAll (process existing files), realTimeUpdate (enable/disable real-time monitoring), and filesizeLimit.
    • Storage & Paths: mediaRootDir (defines the destination directory, e.g., _resources/${notename}), saveAttE (where to save attachments), and pathInTags.
    • Image Optimization: ImgCompressionType (e.g., image/jpeg), JpegQuality (0-100), PngToJpeg, and PngToJpegLocal.
    • Filtering: ignoredExt (extensions to ignore), includeps (file types to include), and ExcludedFoldersList / ExcludedFoldersListRegexp for skipping specific directories.
    • Cleanup: removeMediaFolder and removeOrphansCompl.

    Default settings are provided in DEFAULT_SETTINGS to ensure a functional baseline.

    // Example of the shape of the settings object
    const settings: ISettings = {
      processCreated: true,
      ignoredExt: "cnt|php|htm|html",
      processAll: true,
      useCaptions: true,
      pathInTags: "fullDirPath",
      downUnknown: false,
      saveAttE: "obsFolder",
      realTimeUpdate: true,
      filesizeLimit: 0,
      tryCount: 2,
      realTimeUpdateInterval: 5,
      addNameOfFile: true,
      showNotifications: true,
      includeps: "md|canvas",
      includepattern: "(?<md>.*\\.md)|(?<canvas>.*\\.canvas)",
      mediaRootDir: "_resources/${notename}",
      disAddCom: false,
      useMD5ForNewAtt: true,
      removeMediaFolder: true,
      removeOrphansCompl: false,
      PngToJpeg: false,
      PngToJpegLocal: true,
      JpegQuality: 80,
      DoNotCreateObsFolder: false,
      DateFormat: "YYYY MM DD",
      ImgCompressionType: "image/jpeg",
      ExcludedFoldersList: "",
      ExcludedFoldersListRegexp: ""
    };
  7. Convert Blob to JPEG ArrayBuffer

    main

    The blobToJpegArrayBuffer(blob, imgQuality, imgType) function converts a web Blob into a JPEG ArrayBuffer. It uses an off-screen HTML5 Canvas to perform the conversion, allowing for quality adjustment.

    • blob: The source Blob object.
    • imgQuality: A number between 0 and 1 representing the compression quality.
    • imgType: The target MIME type (defaults to `
  8. Determine file extension from content or link

    main

    The getFileExt(content, link) function determines the file extension using a fallback hierarchy:

    1. Content Analysis: Uses file-type to inspect the ArrayBuffer. If the content is XML, it checks if it is an SVG.
    2. Link Analysis: If content analysis fails or is inconclusive, it falls back to the extension found in the provided link string.

    Returns the extension string (e.g., `

  9. Calculate relative or absolute image paths with getRDir

    main

    The getRDir function determines how the image link should be written in the Markdown file (Wiki-link vs. Markdown link) and how the path is structured based on the settings.pathInTags configuration.

    Supported pathInTags modes:

    • baseFileName: Uses only the file name (e.g., ![[image.png]]).
    • onlyRelative: Uses a relative path from the current note to the image (e.g., ![[../images/image.png]]).
    • fullDirPath: Uses the full path within the vault.
    • default: Uses the full filename provided.

    It returns an array containing [pathWiki, pathMd, parsedPathE], where parsedPathE contains metadata like the original link's basename and the encoded URI path.

    const [pathWiki, pathMd, parsedPathE] = await getRDir(noteFile, settings, fileName, link);