Cartographer App User and Technical Documentation
Home
User Docs
Technical Docs
Home
User Docs
Technical Docs
  • User Documentation
    • Introduction
    • Getting Started
    • User Interface
    • Actions
  • Technical Documentation
    • GitHub Authentication
    • Components

      • AppFooter Component
      • AppHeader Component
      • AppSidebar Component
      • ContentPreviewMdiv Component
      • Content Preview Measure
      • Content Preview Pane
      • ImageMismatchModal Component
      • ImageSelection Modal
      • LoadGitModal Component
      • LoadIIIFModal Component
      • LoadLocalImage Component
      • LoadXMLModal Component
      • MainMenu Component
      • MeasureModal Component
      • MdivModal Component
      • OsdComponent Component
      • PageImportModal Component
      • PagesListEntry Component
      • PagesModal Component
      • Vuex Store (src/store/index.js)
    • Store
      • Vuex Store (src/store/index.js)
    • Tools
      • IIIF Tools (src/tools/iiif.js)
      • MEI Mapping Tools (src/tools/meiMappings.js)

AppSidebar Component

Provides the application sidebar with editing controls, autodetection tools, and page navigation.


Overview

The AppSidebar component offers:

  • Sidebar controls for editing and navigation
  • Buttons for selection, drawing, adding, and deleting zones
  • Undo and redo controls for reverting or reapplying changes
  • Autodetection tools for measures/zones
  • Page navigation controls, including an editable current-page input

Layout

  • Top: Mode buttons (select, draw, undo, redo, add zone, delete)
  • Middle: Autodetection tools (e.g., autodetect measures)
  • Bottom: Page navigation — an editable current-page input, the total page count, and previous/next arrows. Typing a page number and pressing Enter jumps to that page (there is no "Go" button).

Props

None


Data

NameTypeDescription
inputPageStringUser input for the current page (jump target)

Computed Properties

NameDescription
isReadyWhether the app is ready for user actions
multiZoneWhether multi-zone mode is active
currentPageCurrent page number (1-based)
maxPageMaximum page number
prevAvailableWhether the previous page is available
nextAvailableWhether the next page is available
modeCurrent sidebar mode (selection, drawing, etc.)
measuresMeasures on the current page (from the store)
canUndoWhether there is a previous state that can be undone
canRedoWhether there is an undone state that can be redone

Methods

NameDescription
jumpToPageJumps to the page entered in the input (triggered on Enter)
showPrevPageNavigates to the previous page
showNextPageNavigates to the next page
autoDetectAutomatically detects zones on the current page
autoDetectAllAutomatically detects zones on all pages
activateModeActivates a specific mode (selection, drawing, etc.)
undoChangesDispatches the undo action to revert the last change
redoChangesDispatches the redo action to reapply an undone change

Watchers

Watched PropertyDescription
currentPageUpdates inputPage when the page changes

Example

<AppSidebar />
Prev
AppHeader Component
Next
ContentPreviewMdiv Component