Cartographer User and Technical Documentation
Home
User Docs
Technical Docs
Home
User Docs
Technical Docs
  • User Documentation
    • Introduction
    • Cartographer App
    • User Interface
    • Actions
  • Technical Documentation
    • Components

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

Content Preview Measure

Displays a single measure preview within an mdiv, showing its label, number, multi-rest status, and zone status.


Overview

The ContentPreviewMeasure component:

  • Renders a preview for a single measure inside an mdiv.
  • Shows the measure label (if present) or number.
  • Indicates if the measure is a multi-rest.
  • Highlights if the measure has zones or is the first without zones.
  • Double-clicking the measure sets it as the current measure in the store.
  • Uses Vuex store for state management and actions.

Layout

  • Label/Number: Shows the measure label (bold) or number.
  • Multi-rest: Displays [N bars] if the measure is a multi-rest.
  • Zones: Shows an icon if no zones are available.
  • Highlight: Applies special background if this is the first measure without zones.

Props

NameTypeDescription
measureObjectThe measure object to display
mdivStringThe ID of the parent mdiv

Computed Properties

NameDescription
hasLabelTrue if the measure has a label
hasZonesTrue if the measure has any zones
hasMultiRestTrue if the measure is a multi-rest
firstMeasureWithoutZoneID of the first measure without a zone

Methods

NameDescription
dblclickMeasureSets the current mdiv and measure in the store on double-click

Example

<ContentPreviewMeasure :measure="measure" :mdiv="mdivId" />
Prev
ContentPreviewMdiv Component
Next
Content Preview Pane