Message APINPM Package/docs/guides/revision

Revision Guide

NPM SDK guide for a safe Compare and Align workspace: two source documents, visible operation states, interactive point alignment, confirmed results, and saved comparison output.

Scope And Prerequisites

This guide is for the NPM SDK. Mount the viewer and wait for Canvas readiness before enabling revision actions. The background and overlay must both be reachable by Canvas and must be different source strings.

Workspace Design

Follow the reference Compare and Align workspace: keep Compare, Align, and Save in a persistent ribbon; keep source URLs, DPI, colors, and output name in a collapsible sidebar; reserve the Canvas viewport for the drawing and temporary progress or point-picking instruction.

  • Disable Compare and Align while Canvas is processing or waiting for interactive alignment points.
  • Show a status badge in the ribbon and repeat the current message in a persistent footer or live region.
  • Show result metadata only after a result payload confirms a completed comparison or alignment.
  • Enable Save only after the confirmed result state.
  • On small screens, collapse the sidebar rather than covering the Canvas workspace.

Implementation Order

Treat the workflow as an event-driven state machine. Compare, align, and save return void; a button click requests work but does not prove completion.

  • 1Mount the viewer and subscribe to compare events before enabling actions.
  • 2Validate distinct background and overlay sources, a positive DPI, display colors, and an optional output name.
  • 3Choose direct Compare only when the two sources already share coordinates.
  • 4Choose interactive Align when documents are offset, rotated, cropped, scanned, or produced from different layouts.
  • 5Wait for NPM events to show point selection, completion, failure, or save confirmation.
  • 6Destroy the viewer and unsubscribe listeners during route cleanup.

Read The NPM Event State

Register viewer.compare.on("progressStart", handleProgressStart), viewer.compare.on("progressEnd", handleProgressEnd), viewer.compare.on("comparisonComplete", handleComplete), viewer.compare.on("comparisonError", handleError), and viewer.compare.on("compareSaveComplete", handleSaved) before a command.

  • progressStart: lock revision actions and show the Canvas progress message.
  • progressEnd: end the processing indicator only when the current flow has not moved into point selection.
  • comparisonComplete with a result: store the result metadata, unlock actions, and enable Save.
  • comparisonError: unlock Compare and Align, show the documented error message, and retain inputs for correction.
  • compareSaveComplete: show saved confirmation; do not report success immediately after viewer.compare.save({ outputName }).

Compare Documents

Use direct compare only when the drawings share their coordinate system. Send all selected display values with the request and wait for a result payload before displaying comparison metadata.

typescript
viewer.compare.compare({
  backgroundUrl,
  overlayUrl,
  outputName,
  dpi,
  backgroundColor,
  overlayColor,
  equalColor,
});
Compare Documents

Align Drawings

For the reference workflow, omit alignArray and let the operator choose matching points in Canvas. Alignment has an important intermediate state that direct compare does not have.

  • 1Call viewer.compare.align({ backgroundUrl, overlayUrl, outputName, dpi, backgroundColor, overlayColor, equalColor }) without alignArray.
  • 2When comparisonComplete has no result payload, show “Pick matching points in Canvas” and keep the ribbon locked.
  • 3When the later comparisonComplete has a result payload, show the confirmed metadata and enable Save.
  • 4Use alignArray only when the host already has point objects. NPM validates an array of no more than two plain objects; Canvas defines the point-object shape.

Recovery And Verification

There is no documented NPM cancel command for the Compare and Align flow. Do not invent one: clearly show the active point-picking state, recover through the documented error event, and clean up subscriptions when the route is left.

  • A duplicate source pair is blocked before Compare or Align is sent.
  • Compare remains pending until comparisonComplete has a result or comparisonError arrives.
  • Interactive Align remains pending after its first empty completion event and completes only after its later result event.
  • Save remains disabled until a confirmed result and reports success only through compareSaveComplete.
  • Route cleanup removes event subscriptions, destroys the viewer, and discards stale pending state.