humdrum-tools / verovio-humdrum-viewer

Verovio Humdrum Viewer
http://verovio.humdrum.org
36 stars 9 forks source link

Preserve cautionary accidental information #890

Closed craigsapp closed 2 months ago

craigsapp commented 2 months ago

When converting from Humdrum-to-MEI in verovio, accidentals are automatically identified as cautionary. They are labeled with accid@func="caution". However this is not transferred to the final SVG image, so they cannot be highlighted in VHV in a manner similar to the option/alt-l (lowercase "L") for layer numbers.

Add @type="caution" in addition to @func="caution" when converting to MEI, which allows further pass-through to SVG as @class="caution" which can then be contrlled with CSS styling to highlight cautionary accidentals.

Related to issue https://github.com/bel28kent/Mysterium/issues/27

Example:

Screenshot 2024-04-09 at 10 34 03 AM
**kern
4c#
4d
4c#X
4d
=
1cn
==
*-

The first accidental is required to be visible, but the other two are identified as cautionary.

Click to view MEI conversion of above Humdrum data. ``` </titleStmt> <pubStmt> <unpub>This MEI file was created by Verovio's Humdrum converter. When published, this unpub element should be removed, and the enclosing pubStmt element should be properly filled out.</unpub> </pubStmt> </fileDesc> <encodingDesc> <appInfo> <application isodate="2024-04-09T10:36:08" version="4.2.0-dev-84f99b0-dirty"> <name>Verovio</name> <p>Transcoded from Humdrum</p> </application> </appInfo> </encodingDesc> <extMeta> <frames xmlns="http://www.humdrum.org/ns/humxml" /> </extMeta> </meiHead> <music decls="#work1_encoded"> <body> <mdiv xml:id="mwxwxnf"> <score xml:id="s1n0rqcu"> <scoreDef xml:id="s10hr1b4"> <staffGrp xml:id="s1df1f5h"> <staffDef xml:id="staffdef-L1F1" n="1" lines="5"> <clef xml:id="c1pfu8pa" shape="G" line="2" /> </staffDef> </staffGrp> </scoreDef> <section xml:id="section-L1F1"> <measure xml:id="measure-L1"> <staff xml:id="staff-L1F1" n="1"> <layer xml:id="layer-L1F1N1" n="1"> <note xml:id="note-L2F1" dur="4" oct="4" pname="c" accid="s" /> <note xml:id="note-L3F1" dur="4" oct="4" pname="d" accid.ges="n" /> <note xml:id="note-L4F1" dur="4" oct="4" pname="c"> <accid xml:id="accid-L4F1" accid="s" func="caution" /> </note> <note xml:id="note-L5F1" dur="4" oct="4" pname="d" accid.ges="n" /> </layer> </staff> </measure> <measure xml:id="measure-L6" right="end"> <staff xml:id="staff-L6F1N1" n="1"> <layer xml:id="layer-L6F1N1" n="1"> <note xml:id="note-L7F1" dur="1" oct="4" pname="c"> <accid xml:id="accid-L7F1" accid="n" func="caution" /> </note> </layer> </staff> </measure> </section> </score> </mdiv> </body> </music> </mei> ``` </details> <p>First accidental is not special, so encoded simply:</p> <pre><code class="language-xml"><note xml:id="note-L2F1" dur="4" oct="4" pname="c" accid="s" /></code></pre> <p>Second accidental:</p> <pre><code class="language-xml"><note xml:id="note-L4F1" dur="4" oct="4" pname="c"> <accid xml:id="accid-L4F1" accid="s" func="caution" /> </note></code></pre> <p>Third accidental (natural):</p> <pre><code class="language-xml"><note xml:id="note-L7F1" dur="1" oct="4" pname="c"> <accid xml:id="accid-L7F1" accid="n" func="caution" /> </note></code></pre> <p>Change to add <code>@type</code>:</p> <pre><code class="language-xml"><note xml:id="note-L7F1" dur="1" oct="4" pname="c"> <accid xml:id="accid-L7F1" accid="n" type="caution" func="caution" /> </note></code></pre> <p><code>@func</code> is not used for anything, so possibly remove it (and add back again if there is a use for it in MEI/verovio):</p> <pre><code class="language-xml"><note xml:id="note-L7F1" dur="1" oct="4" pname="c"> <accid xml:id="accid-L7F1" accid="n" type="caution" /> </note></code></pre> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/craigsapp"><img src="https://avatars.githubusercontent.com/u/3487289?v=4" />craigsapp</a> commented <strong> 2 months ago</strong> </div> <div class="markdown-body"> <p>Implemented in issue <a href="https://github.com/rism-digital/verovio/commit/89fd4579c6308d10323052735d383ca1e168a593">https://github.com/rism-digital/verovio/commit/89fd4579c6308d10323052735d383ca1e168a593</a></p> <p>Both <code>@func</code> and <code>@type</code> are given, with <code>@func</code> being a more formalized attribute, and <code>@type</code> being a user-specific element, which gets mapped to <code>@class</code> in the SVG output from verovio.</p> <details> <summary> Click to view MEI data for initial Humdrum example above. </summary> ```xml <?xml version="1.0" encoding="UTF-8"?> <?xml-model href="https://music-encoding.org/schema/5.0/mei-all.rng" type="application/xml" schematypens="http://relaxng.org/ns/structure/1.0"?> <?xml-model href="https://music-encoding.org/schema/5.0/mei-all.rng" type="application/xml" schematypens="http://purl.oclc.org/dsdl/schematron"?> <mei xmlns="http://www.music-encoding.org/ns/mei" meiversion="5.0"> <meiHead> <fileDesc> <titleStmt> <title /> </titleStmt> </fileDesc> <encodingDesc> <appInfo> <application isodate="2024-04-09T11:18:32" version="4.2.0-dev-d9a4739-dirty"> <name>Verovio</name> <p>Transcoded from Humdrum</p> </application> </appInfo> </encodingDesc> <extMeta> <frames xmlns="http://www.humdrum.org/ns/humxml" /> </extMeta> </meiHead> <music> <body> <mdiv xml:id="mr0psr1"> <score xml:id="s1b42xtr"> <scoreDef xml:id="s1aohov"> <staffGrp xml:id="s1k5efa"> <staffDef xml:id="staffdef-L1F1" n="1" lines="5"> <clef xml:id="csxo46u" shape="G" line="2" /> </staffDef> </staffGrp> </scoreDef> <section xml:id="section-L1F1"> <measure xml:id="measure-L1"> <staff xml:id="staff-L1F1" n="1"> <layer xml:id="layer-L1F1N1" n="1"> <note xml:id="note-L2F1" dur="4" oct="4" pname="c" accid="s" /> <note xml:id="note-L3F1" dur="4" oct="4" pname="d" accid.ges="n" /> <note xml:id="note-L4F1" dur="4" oct="4" pname="c"> <accid xml:id="accid-L4F1" type="caution" accid="s" func="caution" /> </note> <note xml:id="note-L5F1" dur="4" oct="4" pname="d" accid.ges="n" /> </layer> </staff> </measure> <measure xml:id="measure-L6" right="end"> <staff xml:id="staff-L6F1N1" n="1"> <layer xml:id="layer-L6F1N1" n="1"> <note xml:id="note-L7F1" dur="1" oct="4" pname="c"> <accid xml:id="accid-L7F1" type="caution" accid="n" func="caution" /> </note> </layer> </staff> </measure> </section> </score> </mdiv> </body> </music> </mei> ``` </details> <p>Last accidental is not convered to this:</p> <pre><code class="language-xml"><note xml:id="note-L7F1" dur="1" oct="4" pname="c"> <accid xml:id="accid-L7F1" type="caution" accid="n" func="caution" /> </note></code></pre> <p>Next implement CSS styling of cautionary accidentals in VHV.</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/craigsapp"><img src="https://avatars.githubusercontent.com/u/3487289?v=4" />craigsapp</a> commented <strong> 2 months ago</strong> </div> <div class="markdown-body"> <p>Commit <a href="https://github.com/humdrum-tools/verovio-humdrum-viewer/commit/e5e5433bc0e893ad9a2bd28559ecfb5c635cc4a7">https://github.com/humdrum-tools/verovio-humdrum-viewer/commit/e5e5433bc0e893ad9a2bd28559ecfb5c635cc4a7</a> implements a keyboard shortcut for toggling cautionary accidental highlighting:</p> <img width="1188" alt="Screenshot 2024-04-09 at 11 52 39 AM" src="https://github.com/humdrum-tools/verovio-humdrum-viewer/assets/3487289/7f6a4a42-cc83-438d-a6d9-4ae2b51196d2"> <p>Cautionary accidentals are highlighted in hot pink.</p> <p>Press alt-shift-X to toggle view of cautionary accidentals. (or option-shift-X on Macs).</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/craigsapp"><img src="https://avatars.githubusercontent.com/u/3487289?v=4" />craigsapp</a> commented <strong> 2 months ago</strong> </div> <div class="markdown-body"> <p>Add <code>X</code> as a URL styling option (for <code>k</code> CGI parameter).</p> <p>And of course add documentation on <a href="https://doc.verovio.humdrum.org">https://doc.verovio.humdrum.org</a></p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/craigsapp"><img src="https://avatars.githubusercontent.com/u/3487289?v=4" />craigsapp</a> commented <strong> 2 months ago</strong> </div> <div class="markdown-body"> <blockquote> <p>Add <code>X</code> as a URL styling option (for <code>k</code> CGI parameter).</p> </blockquote> <p>Done:</p> <p><a href="https://verovio.humdrum.org/?file=vivaldi/op01/vivaldi-op01n01m01.krn&k=X">https://verovio.humdrum.org/?file=vivaldi/op01/vivaldi-op01n01m01.krn&k=X</a></p> <img width="1159" alt="Screenshot 2024-04-10 at 7 03 54 PM" src="https://github.com/humdrum-tools/verovio-humdrum-viewer/assets/3487289/7442d581-2322-41dd-9f45-2fd8a20d8a23"> <p>(see pink flat in second measure)</p> </div> </div> <div class="page-bar-simple"> </div> <div class="footer"> <ul class="body"> <li>© <script> document.write(new Date().getFullYear()) </script> Githubissues.</li> <li>Githubissues is a development platform for aggregating issues.</li> </ul> </div> <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script> <script src="/githubissues/assets/js.js"></script> <script src="/githubissues/assets/markdown.js"></script> <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/highlight.min.js"></script> <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/languages/go.min.js"></script> <script> hljs.highlightAll(); </script> </body> </html>