Introduction

When sending screenshots in DSH (DeepSeek Harness), you usually need to circle the key points first. Because pending images in the editor only support previewing, annotation often has to be done in another application, and then the file has to be reattached. This plugin moves that step directly into the editor.

Below is an introduction to the features, installation, and usage of the dsh-image-annotate plugin.

Overview

dsh-image-annotate is a DSH web plugin maintained by janewas under the MIT license. Its core feature is: click a pending image to open an annotation dialog. It supports pen, rectangle, arrow, and movable/resizable text box tools, and inserts the annotated PNG as a new attachment while keeping the original image unchanged.

The plugin does not reset DSH’s UI, takes up minimal space, and has no dependencies or configuration file.

Installation and Activation

Before installing, ensure that DSH version is 0.1.5-rc.1 or a compatible version.

Install it using the officially recommended GitHub method:

dsh plugin --profile web add github:janewas/dsh-image-annotate

The install command adds the plugin to the configuration file, and the plugin is mounted via its own cordis.patch.yml. Because the configuration list is read at startup, please restart dsh web after installing.

Core Features

The plugin mainly provides the following capabilities:

  1. Click interaction: Click the thumbnail of a pending image to open the annotation dialog instead of the original preview lightbox.
  2. Drawing tools: Provides four tools
    • Pen: Draw freely.
    • Rectangle: Drag to draw a border.
    • Arrow: Drag to draw an arrow.
    • Text: Drag to create a text box, or click to create a default-size box.
  3. Text box behavior:
    • Move and resize: When using the text tool, drag the box body to move it and drag the 8 handles to resize it. Text automatically reflows based on the box size (automatic line wrapping), and the box does not shrink to a size where the text can no longer be displayed.
    • Edit and delete: Double-click the text inside the box to modify it (clearing the text deletes the box), or select it and press Delete to delete it. Supports Ctrl/Cmd+Z to undo move, resize, text editing, or deletion.
    • Style: Supports three shapes—rectangle, rounded, and ellipse—and three fill modes—transparent, tinted, and solid—using the currently selected color.
  4. Style options: Provides 6 colors (red, yellow, green, blue, white, black) and 3 line widths (thin, medium, thick).
  5. Operation controls: Supports undo (button or Ctrl/Cmd+Z), clear, and close (Esc or clicking the background).
  6. Result output: After clicking “Insert into input box”, the annotated PNG is inserted as a new attachment, and the original image is retained.

Usage Steps

The operation flow is as follows:

  1. Add the image to the editor (drag-and-drop or use the paperclip).
  2. Click the image thumbnail to open the annotation editor. The image is displayed at full size.
  3. Select the tool, color, and line width. If using the text tool, drag to create a box and enter its content.
  4. Click “Insert into input box”. The annotated PNG appears at the end of the attachment bar, while the original image remains.

Tool Interaction Guide

Operation Type Interaction
Pen Drag to draw freehand lines
Rectangle Drag from one corner to another
Arrow Drag from tail to head
Text Drag to create a box, or click to create a default-size box
Move/resize text box With the text tool active, drag the box body to move it and drag handles to resize it
Edit/delete text box Double-click to enter text, then select and press Delete to remove it

Settings

Go to Settings → Image Annotation to configure the plugin. The settings are saved in the browser’s localStorage (key: dsh-image-annotate.settings.v1) and are only effective for the current browser and origin.

The main configuration items are:

Setting Default Effect
Enable click-to-edit on Master switch. When disabled, clicking the thumbnail restores default behavior.
Default tool pen Tool preselected when the dialog opens.
Default color red Starting color for pen, rectangles, arrows, and text.
Default line width medium Line width for pen, rectangles, and arrows.
Text box shape rounded Shape of newly created text boxes (rectangle/rounded/ellipse).
Text box tint tinted Fill mode (transparent/tinted/solid).
Insertion mode append Append mode keeps the original image; replace mode removes it.
Annotated image filename annotation Filename prefix for output, formatted as <prefix>-<suffix>.png.

Ecosystem Background

The philosophy of DeepSeek Harness is “everything is a plugin.” Community directories (such as skillhub.cn) collect various plugins, with no direct affiliation with DeepSeek or High-Flyer official. This article only introduces the plugin’s features and usage.