| title | lang | page_language | author | creation_date | last_updated | ref | tags | keywords | summary | sidebar | permalink | ||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Edit modes and syntax highlighting |
en es |
en |
Craig Stuart Sapp |
19 Jun 2017 |
interface-edit_modes |
|
interface color colorize coloring syntax highlighting |
A Description of the two editing modes in VHV, and Humdrum syntax coloring. |
main_sidebar |
/interface/edit_modes/index.html |
Text editing in Verovio Humdrum Viewer uses the ace editor. There are two modes in which the contents can be edited: (1) the initial simple-text editor (2) a vi editor useful to people who know vi/vim. Switch between these two modes by pressing alt-v.
The Plain-text editing mode is indicated by a light background, closely matching the background color of the notation area of the page:
{% include image.html file="colorize-light.png" max-width="100%" alt="light-themed colorizing" caption="Light theme coloring for plain-text mode." %}
When editing Humdrum files, their contents will be colored by syntactic function:
<style> .light.colorlist tr, .light.colorlist td, .light tbody tr:nth-of-type(even), .light tbody tr:nth-of-type(odd), .light th, .light tr, .light td { background: #fdf6e3 !important; } .light td, .light th { color: black; } .colorlist td > div, .colorlist td { width: 80px; } </style>
|
|
{% include image.html file="colorize-dark.png" max-width="100%" alt="dark-themed colorizing" caption="Dark theme coloring for vi mode (alt-v)." %}
Syntax coloring in vi mode:
<style> .dark.colorlist tr, .dark.colorlist td, .dark tbody tr:nth-of-type(even), .dark tbody tr:nth-of-type(odd), .dark tr, .dark th, .dark td { background: #002b36 !important; } .dark td, .dark th { color: white; } table.colorlist tr td, table.colorlist td { hyphens: none; } </style>
|
|
Tabs cannot start a line, end a line, or occur more than once between tokens in the Humdrum syntax. Any of these invalid cases will be highlighted in red:
<style> table.double { width: 100%; border: none !important; max-width: 100%; } .double td { width: 50% !important; } .double tr, .double td, .double tbody tr:nth-of-type(odd) { background: none !important; } .double tbody tr td { border: none !important; } </style>|
{% include image.html file="taberror-light.png" max-width="100%" alt="dark-themed colorizing" caption="Tab errors in plain-text theme." %} |
{% include image.html file="taberror-dark.png" max-width="100%" alt="dark-themed colorizing" caption="Tab errors in vi theme." %} |
Generally tokens do not start or end with space characters, and multiple sub-tokens
are separated by a single space (in data formats such as **kern). When a token starts
or ends with a space, or there is more than one space between subtokens, the space will be highlighted
in blue. Usually this is a syntax error that should be fixed.
|
{% include image.html file="spacewarning-light.png" max-width="100%" alt="dark-themed colorizing" caption="Space warnings in plain-text theme." %} |
{% include image.html file="spacewarning-dark.png" max-width="100%" alt="dark-themed colorizing" caption="Space warnings in vi theme." %} |
Here are the Humdrum syntax parsing/highlighting files for the ace editor:
- mode-humdrum.js: syntax parsing file
- theme-humdrum_light.js light-colored highlighting theme
- theme-humdrum_dark.js dark-colored highlighting theme