starry / dist /test-font.html
k-l-lambda's picture
Initial deployment: frontend + omr-service + cluster-server + nginx proxy
6f1c297
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Emmentaler-26 Font Glyphs</title>
<style>
@font-face {
font-family: 'Emmentaler-26';
font-weight: normal;
font-style: normal;
src: url('/fonts/emmentaler-26.woff2') format('woff2'),
url('/fonts/emmentaler-26.woff') format('woff'),
url('/fonts/emmentaler-26.otf') format('opentype');
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #fafafa; }
.header {
position: sticky; top: 0; background: #fff; z-index: 10;
padding: 12px 20px; border-bottom: 1px solid #e8e8e8;
box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}
.header h1 { font-size: 22px; margin-bottom: 6px; }
.status { font-size: 13px; color: #666; margin-bottom: 6px; }
.status .ok { color: #52c41a; font-weight: bold; }
.status .fail { color: #f5222d; font-weight: bold; }
.controls { display: flex; gap: 16px; align-items: center; margin-bottom: 6px; flex-wrap: wrap; }
.controls input[type=text] { padding: 4px 8px; border: 1px solid #d9d9d9; border-radius: 4px; width: 200px; font-size: 13px; }
.controls label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #666; }
.toc { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; }
.toc a { color: #1890ff; text-decoration: none; }
.toc a:hover { text-decoration: underline; }
.content { padding: 20px; max-width: 1400px; margin: 0 auto; }
.category { margin-bottom: 28px; }
.category h2 { font-size: 16px; margin-bottom: 10px; padding-bottom: 4px; border-bottom: 2px solid #1890ff; }
.category h2 span { font-size: 13px; color: #999; font-weight: normal; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 6px; }
.cell {
border: 1px solid #e8e8e8; border-radius: 4px; padding: 6px;
text-align: center; background: #fff; transition: box-shadow 0.2s; cursor: default;
}
.cell:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.12); }
.glyph {
height: 56px; display: flex; align-items: center; justify-content: center;
font-family: 'Emmentaler-26'; color: #333;
border-bottom: 1px dashed #f0f0f0; margin-bottom: 4px; overflow: hidden;
}
.name { font-size: 10px; color: #333; word-break: break-all; line-height: 1.2; }
.code { font-size: 10px; color: #999; font-family: monospace; }
</style>
</head>
<body>
<div class="header">
<h1>Emmentaler-26 Font Glyphs</h1>
<div class="status" id="status">Loading font...</div>
<div class="controls">
<input type="text" id="filter" placeholder="Filter glyphs...">
<label>Size: <input type="range" id="size" min="20" max="80" value="40"> <span id="sizeVal">40</span>px</label>
</div>
<div class="toc" id="toc"></div>
</div>
<div class="content" id="content"></div>
<script>
const CATS={"rests":[["rests-0","E000"],["rests-1","E001"],["rests-0o","E002"],["rests-1o","E003"],["rests-M3","E004"],["rests-M2","E005"],["rests-M1","E006"],["rests-M1o","E007"],["rests-2","E008"],["rests-2classical","E009"],["rests-2z","E00A"],["rests-3","E00B"],["rests-4","E00C"],["rests-5","E00D"],["rests-6","E00E"],["rests-7","E00F"],["rests-8","E010"],["rests-9","E011"],["rests-10","E012"],["rests-M3neomensural","E144"],["rests-M2neomensural","E145"],["rests-M1neomensural","E146"],["rests-0neomensural","E147"],["rests-1neomensural","E148"],["rests-2neomensural","E149"],["rests-3neomensural","E14A"],["rests-4neomensural","E14B"],["rests-M3mensural","E14C"],["rests-M2mensural","E14D"],["rests-M1mensural","E14E"],["rests-0mensural","E14F"],["rests-1mensural","E150"],["rests-2mensural","E151"],["rests-3mensural","E152"],["rests-4mensural","E153"]],"accidentals":[["accidentals-sharp","E013"],["accidentals-sharp-arrowup","E014"],["accidentals-sharp-arrowdown","E015"],["accidentals-sharp-arrowboth","E016"],["accidentals-sharp-slashslash-stem","E017"],["accidentals-sharp-slashslashslash-stemstem","E018"],["accidentals-sharp-slashslashslash-stem","E019"],["accidentals-sharp-slash-stem","E01A"],["accidentals-sharp-slashslash-stemstemstem","E01B"],["accidentals-doublesharp","E01C"],["accidentals-natural","E01D"],["accidentals-natural-arrowup","E01E"],["accidentals-natural-arrowdown","E01F"],["accidentals-natural-arrowboth","E020"],["accidentals-flat","E021"],["accidentals-flat-arrowup","E022"],["accidentals-flat-arrowdown","E023"],["accidentals-flat-arrowboth","E024"],["accidentals-flat-slash","E025"],["accidentals-flat-slashslash","E026"],["accidentals-mirroredflat-flat","E027"],["accidentals-mirroredflat","E028"],["accidentals-mirroredflat-backslash","E029"],["accidentals-flatflat","E02A"],["accidentals-flatflat-slash","E02B"],["accidentals-rightparen","E02C"],["accidentals-leftparen","E02D"],["accidentals-medicaeaM1","E194"],["accidentals-vaticanaM1","E195"],["accidentals-vaticana0","E196"],["accidentals-mensural1","E197"],["accidentals-mensuralM1","E198"],["accidentals-hufnagelM1","E199"],["accidentals-kievan1","E19A"],["accidentals-kievanM1","E19B"]],"arrowheads":[["arrowheads-open-01","E02E"],["arrowheads-open-0M1","E02F"],["arrowheads-open-11","E030"],["arrowheads-open-1M1","E031"],["arrowheads-close-01","E032"],["arrowheads-close-0M1","E033"],["arrowheads-close-11","E034"],["arrowheads-close-1M1","E035"]],"dot":[["dot","E036"]],"scripts":[["scripts-ufermata","E037"],["scripts-dfermata","E038"],["scripts-uhenzeshortfermata","E039"],["scripts-dhenzeshortfermata","E03A"],["scripts-uhenzelongfermata","E03B"],["scripts-dhenzelongfermata","E03C"],["scripts-ushortfermata","E03D"],["scripts-dshortfermata","E03E"],["scripts-uveryshortfermata","E03F"],["scripts-dveryshortfermata","E040"],["scripts-ulongfermata","E041"],["scripts-dlongfermata","E042"],["scripts-uverylongfermata","E043"],["scripts-dverylongfermata","E044"],["scripts-thumb","E045"],["scripts-sforzato","E046"],["scripts-espr","E047"],["scripts-staccato","E048"],["scripts-ustaccatissimo","E049"],["scripts-dstaccatissimo","E04A"],["scripts-tenuto","E04B"],["scripts-uportato","E04C"],["scripts-dportato","E04D"],["scripts-umarcato","E04E"],["scripts-dmarcato","E04F"],["scripts-open","E050"],["scripts-halfopen","E051"],["scripts-halfopenvertical","E052"],["scripts-stopped","E053"],["scripts-upbow","E054"],["scripts-downbow","E055"],["scripts-reverseturn","E056"],["scripts-turn","E057"],["scripts-slashturn","E058"],["scripts-haydnturn","E059"],["scripts-trill","E05A"],["scripts-upedalheel","E05B"],["scripts-dpedalheel","E05C"],["scripts-upedaltoe","E05D"],["scripts-dpedaltoe","E05E"],["scripts-flageolet","E05F"],["scripts-segno","E060"],["scripts-varsegno","E061"],["scripts-coda","E062"],["scripts-varcoda","E063"],["scripts-rcomma","E064"],["scripts-lcomma","E065"],["scripts-rvarcomma","E066"],["scripts-lvarcomma","E067"],["scripts-arpeggio","E068"],["scripts-trill_element","E069"],["scripts-arpeggio-arrow-M1","E06A"],["scripts-arpeggio-arrow-1","E06B"],["scripts-trillelement","E06C"],["scripts-prall","E06D"],["scripts-mordent","E06E"],["scripts-prallprall","E06F"],["scripts-prallmordent","E070"],["scripts-upprall","E071"],["scripts-upmordent","E072"],["scripts-prallup","E073"],["scripts-downprall","E074"],["scripts-downmordent","E075"],["scripts-pralldown","E076"],["scripts-lineprall","E077"],["scripts-caesura-curved","E078"],["scripts-caesura-straight","E079"],["scripts-tickmark","E07A"],["scripts-snappizzicato","E07B"],["scripts-ictus","E1CA"],["scripts-uaccentus","E1CB"],["scripts-daccentus","E1CC"],["scripts-usemicirculus","E1CD"],["scripts-dsemicirculus","E1CE"],["scripts-circulus","E1CF"],["scripts-augmentum","E1D0"],["scripts-usignumcongruentiae","E1D1"],["scripts-dsignumcongruentiae","E1D2"],["scripts-barline-kievan","E1D3"]],"clefs":[["clefs-C","E07C"],["clefs-C_change","E07D"],["clefs-varC","E07E"],["clefs-varC_change","E07F"],["clefs-F","E080"],["clefs-F_change","E081"],["clefs-G","E082"],["clefs-G_change","E083"],["clefs-GG","E084"],["clefs-GG_change","E085"],["clefs-tenorG","E086"],["clefs-tenorG_change","E087"],["clefs-percussion","E088"],["clefs-percussion_change","E089"],["clefs-varpercussion","E08A"],["clefs-varpercussion_change","E08B"],["clefs-tab","E08C"],["clefs-tab_change","E08D"],["clefs-vaticana-do","E154"],["clefs-vaticana-do_change","E155"],["clefs-vaticana-fa","E156"],["clefs-vaticana-fa_change","E157"],["clefs-medicaea-do","E158"],["clefs-medicaea-do_change","E159"],["clefs-medicaea-fa","E15A"],["clefs-medicaea-fa_change","E15B"],["clefs-neomensural-c","E15C"],["clefs-neomensural-c_change","E15D"],["clefs-petrucci-c1","E15E"],["clefs-petrucci-c1_change","E15F"],["clefs-petrucci-c2","E160"],["clefs-petrucci-c2_change","E161"],["clefs-petrucci-c3","E162"],["clefs-petrucci-c3_change","E163"],["clefs-petrucci-c4","E164"],["clefs-petrucci-c4_change","E165"],["clefs-petrucci-c5","E166"],["clefs-petrucci-c5_change","E167"],["clefs-mensural-c","E168"],["clefs-mensural-c_change","E169"],["clefs-blackmensural-c","E16A"],["clefs-blackmensural-c_change","E16B"],["clefs-petrucci-f","E16C"],["clefs-petrucci-f_change","E16D"],["clefs-mensural-f","E16E"],["clefs-mensural-f_change","E16F"],["clefs-petrucci-g","E170"],["clefs-petrucci-g_change","E171"],["clefs-mensural-g","E172"],["clefs-mensural-g_change","E173"],["clefs-hufnagel-do","E174"],["clefs-hufnagel-do_change","E175"],["clefs-hufnagel-fa","E176"],["clefs-hufnagel-fa_change","E177"],["clefs-hufnagel-do-fa","E178"],["clefs-hufnagel-do-fa_change","E179"],["clefs-kievan-do","E17A"],["clefs-kievan-do_change","E17B"]],"timesig":[["timesig-C44","E08E"],["timesig-C22","E08F"],["timesig-mensural44","E1B4"],["timesig-mensural22","E1B5"],["timesig-mensural32","E1B6"],["timesig-mensural64","E1B7"],["timesig-mensural94","E1B8"],["timesig-mensural34","E1B9"],["timesig-mensural68","E1BA"],["timesig-mensural98","E1BB"],["timesig-mensural48","E1BC"],["timesig-mensural68alt","E1BD"],["timesig-mensural24","E1BE"],["timesig-neomensural44","E1BF"],["timesig-neomensural22","E1C0"],["timesig-neomensural32","E1C1"],["timesig-neomensural64","E1C2"],["timesig-neomensural94","E1C3"],["timesig-neomensural34","E1C4"],["timesig-neomensural68","E1C5"],["timesig-neomensural98","E1C6"],["timesig-neomensural48","E1C7"],["timesig-neomensural68alt","E1C8"],["timesig-neomensural24","E1C9"]],"pedal":[["pedal-star","E090"],["pedal-M","E091"],["pedal--","E092"],["pedal-P","E093"],["pedal-d","E094"],["pedal-e","E095"],["pedal-Ped","E096"]],"brackettips":[["brackettips-up","E097"],["brackettips-down","E098"]],"accordion":[["accordion-discant","E099"],["accordion-dot","E09A"],["accordion-freebass","E09B"],["accordion-stdbass","E09C"],["accordion-bayanbass","E09D"],["accordion-oldEE","E09E"],["accordion-push","E09F"],["accordion-pull","E0A0"]],"ties":[["ties-lyric-short","E0A1"],["ties-lyric-default","E0A2"]],"noteheads":[["noteheads-uM2","E0A3"],["noteheads-dM2","E0A4"],["noteheads-sM1","E0A5"],["noteheads-sM1double","E0A6"],["noteheads-s0","E0A7"],["noteheads-s1","E0A8"],["noteheads-s2","E0A9"],["noteheads-s0diamond","E0AA"],["noteheads-s1diamond","E0AB"],["noteheads-s2diamond","E0AC"],["noteheads-s0triangle","E0AD"],["noteheads-d1triangle","E0AE"],["noteheads-u1triangle","E0AF"],["noteheads-u2triangle","E0B0"],["noteheads-d2triangle","E0B1"],["noteheads-s0slash","E0B2"],["noteheads-s1slash","E0B3"],["noteheads-s2slash","E0B4"],["noteheads-s0cross","E0B5"],["noteheads-s1cross","E0B6"],["noteheads-s2cross","E0B7"],["noteheads-s2xcircle","E0B8"],["noteheads-s0do","E0B9"],["noteheads-d1do","E0BA"],["noteheads-u1do","E0BB"],["noteheads-d2do","E0BC"],["noteheads-u2do","E0BD"],["noteheads-s0doThin","E0BE"],["noteheads-d1doThin","E0BF"],["noteheads-u1doThin","E0C0"],["noteheads-d2doThin","E0C1"],["noteheads-u2doThin","E0C2"],["noteheads-s0re","E0C3"],["noteheads-u1re","E0C4"],["noteheads-d1re","E0C5"],["noteheads-u2re","E0C6"],["noteheads-d2re","E0C7"],["noteheads-s0reThin","E0C8"],["noteheads-u1reThin","E0C9"],["noteheads-d1reThin","E0CA"],["noteheads-u2reThin","E0CB"],["noteheads-d2reThin","E0CC"],["noteheads-s0mi","E0CD"],["noteheads-s1mi","E0CE"],["noteheads-s2mi","E0CF"],["noteheads-s0miMirror","E0D0"],["noteheads-s1miMirror","E0D1"],["noteheads-s2miMirror","E0D2"],["noteheads-s0miThin","E0D3"],["noteheads-s1miThin","E0D4"],["noteheads-s2miThin","E0D5"],["noteheads-u0fa","E0D6"],["noteheads-d0fa","E0D7"],["noteheads-u1fa","E0D8"],["noteheads-d1fa","E0D9"],["noteheads-u2fa","E0DA"],["noteheads-d2fa","E0DB"],["noteheads-u0faThin","E0DC"],["noteheads-d0faThin","E0DD"],["noteheads-u1faThin","E0DE"],["noteheads-d1faThin","E0DF"],["noteheads-u2faThin","E0E0"],["noteheads-d2faThin","E0E1"],["noteheads-s0sol","E0E2"],["noteheads-s1sol","E0E3"],["noteheads-s2sol","E0E4"],["noteheads-s0la","E0E5"],["noteheads-s1la","E0E6"],["noteheads-s2la","E0E7"],["noteheads-s0laThin","E0E8"],["noteheads-s1laThin","E0E9"],["noteheads-s2laThin","E0EA"],["noteheads-s0ti","E0EB"],["noteheads-u1ti","E0EC"],["noteheads-d1ti","E0ED"],["noteheads-u2ti","E0EE"],["noteheads-d2ti","E0EF"],["noteheads-s0tiThin","E0F0"],["noteheads-u1tiThin","E0F1"],["noteheads-d1tiThin","E0F2"],["noteheads-u2tiThin","E0F3"],["noteheads-d2tiThin","E0F4"],["noteheads-u0doFunk","E0F5"],["noteheads-d0doFunk","E0F6"],["noteheads-u1doFunk","E0F7"],["noteheads-d1doFunk","E0F8"],["noteheads-u2doFunk","E0F9"],["noteheads-d2doFunk","E0FA"],["noteheads-u0reFunk","E0FB"],["noteheads-d0reFunk","E0FC"],["noteheads-u1reFunk","E0FD"],["noteheads-d1reFunk","E0FE"],["noteheads-u2reFunk","E0FF"],["noteheads-d2reFunk","E100"],["noteheads-u0miFunk","E101"],["noteheads-d0miFunk","E102"],["noteheads-u1miFunk","E103"],["noteheads-d1miFunk","E104"],["noteheads-s2miFunk","E105"],["noteheads-u0faFunk","E106"],["noteheads-d0faFunk","E107"],["noteheads-u1faFunk","E108"],["noteheads-d1faFunk","E109"],["noteheads-u2faFunk","E10A"],["noteheads-d2faFunk","E10B"],["noteheads-s0solFunk","E10C"],["noteheads-s1solFunk","E10D"],["noteheads-s2solFunk","E10E"],["noteheads-s0laFunk","E10F"],["noteheads-s1laFunk","E110"],["noteheads-s2laFunk","E111"],["noteheads-u0tiFunk","E112"],["noteheads-d0tiFunk","E113"],["noteheads-u1tiFunk","E114"],["noteheads-d1tiFunk","E115"],["noteheads-u2tiFunk","E116"],["noteheads-d2tiFunk","E117"],["noteheads-s0doWalker","E118"],["noteheads-u1doWalker","E119"],["noteheads-d1doWalker","E11A"],["noteheads-u2doWalker","E11B"],["noteheads-d2doWalker","E11C"],["noteheads-s0reWalker","E11D"],["noteheads-u1reWalker","E11E"],["noteheads-d1reWalker","E11F"],["noteheads-u2reWalker","E120"],["noteheads-d2reWalker","E121"],["noteheads-s0miWalker","E122"],["noteheads-s1miWalker","E123"],["noteheads-s2miWalker","E124"],["noteheads-s0faWalker","E125"],["noteheads-u1faWalker","E126"],["noteheads-d1faWalker","E127"],["noteheads-u2faWalker","E128"],["noteheads-d2faWalker","E129"],["noteheads-s0laWalker","E12A"],["noteheads-s1laWalker","E12B"],["noteheads-s2laWalker","E12C"],["noteheads-s0tiWalker","E12D"],["noteheads-u1tiWalker","E12E"],["noteheads-d1tiWalker","E12F"],["noteheads-u2tiWalker","E130"],["noteheads-d2tiWalker","E131"],["noteheads-uM3neomensural","E1D6"],["noteheads-dM3neomensural","E1D7"],["noteheads-uM2neomensural","E1D8"],["noteheads-dM2neomensural","E1D9"],["noteheads-sM1neomensural","E1DA"],["noteheads-urM3neomensural","E1DB"],["noteheads-drM3neomensural","E1DC"],["noteheads-urM2neomensural","E1DD"],["noteheads-drM2neomensural","E1DE"],["noteheads-srM1neomensural","E1DF"],["noteheads-s0neomensural","E1E0"],["noteheads-s1neomensural","E1E1"],["noteheads-s2neomensural","E1E2"],["noteheads-s0harmonic","E1E3"],["noteheads-s2harmonic","E1E4"],["noteheads-uM3mensural","E1E5"],["noteheads-dM3mensural","E1E6"],["noteheads-sM3ligmensural","E1E7"],["noteheads-uM2mensural","E1E8"],["noteheads-dM2mensural","E1E9"],["noteheads-sM2ligmensural","E1EA"],["noteheads-sM1mensural","E1EB"],["noteheads-urM3mensural","E1EC"],["noteheads-drM3mensural","E1ED"],["noteheads-srM3ligmensural","E1EE"],["noteheads-urM2mensural","E1EF"],["noteheads-drM2mensural","E1F0"],["noteheads-srM2ligmensural","E1F1"],["noteheads-srM1mensural","E1F2"],["noteheads-uM3semimensural","E1F3"],["noteheads-dM3semimensural","E1F4"],["noteheads-sM3semiligmensural","E1F5"],["noteheads-uM2semimensural","E1F6"],["noteheads-dM2semimensural","E1F7"],["noteheads-sM2semiligmensural","E1F8"],["noteheads-sM1semimensural","E1F9"],["noteheads-urM3semimensural","E1FA"],["noteheads-drM3semimensural","E1FB"],["noteheads-srM3semiligmensural","E1FC"],["noteheads-urM2semimensural","E1FD"],["noteheads-drM2semimensural","E1FE"],["noteheads-srM2semiligmensural","E1FF"],["noteheads-srM1semimensural","E200"],["noteheads-uM3blackmensural","E201"],["noteheads-dM3blackmensural","E202"],["noteheads-sM3blackligmensural","E203"],["noteheads-uM2blackmensural","E204"],["noteheads-dM2blackmensural","E205"],["noteheads-sM2blackligmensural","E206"],["noteheads-sM1blackmensural","E207"],["noteheads-s0mensural","E208"],["noteheads-s1mensural","E209"],["noteheads-s2mensural","E20A"],["noteheads-s0blackmensural","E20B"],["noteheads-s0petrucci","E20C"],["noteheads-s1petrucci","E20D"],["noteheads-s2petrucci","E20E"],["noteheads-s0blackpetrucci","E20F"],["noteheads-s1blackpetrucci","E210"],["noteheads-s2blackpetrucci","E211"],["noteheads-svaticana-punctum","E212"],["noteheads-svaticana-punctum-cavum","E213"],["noteheads-svaticana-linea-punctum","E214"],["noteheads-svaticana-linea-punctum-cavum","E215"],["noteheads-svaticana-inclinatum","E216"],["noteheads-svaticana-lpes","E217"],["noteheads-svaticana-vlpes","E218"],["noteheads-svaticana-upes","E219"],["noteheads-svaticana-vupes","E21A"],["noteheads-svaticana-plica","E21B"],["noteheads-svaticana-vplica","E21C"],["noteheads-svaticana-epiphonus","E21D"],["noteheads-svaticana-vepiphonus","E21E"],["noteheads-svaticana-reverse-plica","E21F"],["noteheads-svaticana-reverse-vplica","E220"],["noteheads-svaticana-inner-cephalicus","E221"],["noteheads-svaticana-cephalicus","E222"],["noteheads-svaticana-quilisma","E223"],["noteheads-ssolesmes-incl-parvum","E224"],["noteheads-ssolesmes-auct-asc","E225"],["noteheads-ssolesmes-auct-desc","E226"],["noteheads-ssolesmes-incl-auctum","E227"],["noteheads-ssolesmes-stropha","E228"],["noteheads-ssolesmes-stropha-aucta","E229"],["noteheads-ssolesmes-oriscus","E22A"],["noteheads-smedicaea-inclinatum","E22B"],["noteheads-smedicaea-punctum","E22C"],["noteheads-smedicaea-rvirga","E22D"],["noteheads-smedicaea-virga","E22E"],["noteheads-shufnagel-punctum","E22F"],["noteheads-shufnagel-virga","E230"],["noteheads-shufnagel-lpes","E231"],["noteheads-sM2kievan","E232"],["noteheads-sM1kievan","E233"],["noteheads-s0kievan","E234"],["noteheads-d2kievan","E235"],["noteheads-u2kievan","E236"],["noteheads-s1kievan","E237"],["noteheads-sr1kievan","E238"],["noteheads-d3kievan","E239"],["noteheads-u3kievan","E23A"]],"flags":[["flags-u3","E132"],["flags-u4","E133"],["flags-u5","E134"],["flags-u6","E135"],["flags-u7","E136"],["flags-u8","E137"],["flags-u9","E138"],["flags-u10","E139"],["flags-d3","E13A"],["flags-d4","E13B"],["flags-d5","E13C"],["flags-d6","E13D"],["flags-d7","E13E"],["flags-d8","E13F"],["flags-d9","E140"],["flags-d10","E141"],["flags-ugrace","E142"],["flags-dgrace","E143"],["flags-mensuralu03","E19C"],["flags-mensuralu13","E19D"],["flags-mensuralu23","E19E"],["flags-mensurald03","E19F"],["flags-mensurald13","E1A0"],["flags-mensurald23","E1A1"],["flags-mensuralu04","E1A2"],["flags-mensuralu14","E1A3"],["flags-mensuralu24","E1A4"],["flags-mensurald04","E1A5"],["flags-mensurald14","E1A6"],["flags-mensurald24","E1A7"],["flags-mensuralu05","E1A8"],["flags-mensuralu15","E1A9"],["flags-mensuralu25","E1AA"],["flags-mensurald05","E1AB"],["flags-mensurald15","E1AC"],["flags-mensurald25","E1AD"],["flags-mensuralu06","E1AE"],["flags-mensuralu16","E1AF"],["flags-mensuralu26","E1B0"],["flags-mensurald06","E1B1"],["flags-mensurald16","E1B2"],["flags-mensurald26","E1B3"]],"custodes":[["custodes-hufnagel-u0","E17C"],["custodes-hufnagel-u1","E17D"],["custodes-hufnagel-u2","E17E"],["custodes-hufnagel-d0","E17F"],["custodes-hufnagel-d1","E180"],["custodes-hufnagel-d2","E181"],["custodes-medicaea-u0","E182"],["custodes-medicaea-u1","E183"],["custodes-medicaea-u2","E184"],["custodes-medicaea-d0","E185"],["custodes-medicaea-d1","E186"],["custodes-medicaea-d2","E187"],["custodes-vaticana-u0","E188"],["custodes-vaticana-u1","E189"],["custodes-vaticana-u2","E18A"],["custodes-vaticana-d0","E18B"],["custodes-vaticana-d1","E18C"],["custodes-vaticana-d2","E18D"],["custodes-mensural-u0","E18E"],["custodes-mensural-u1","E18F"],["custodes-mensural-u2","E190"],["custodes-mensural-d0","E191"],["custodes-mensural-d1","E192"],["custodes-mensural-d2","E193"]],"dots":[["dots-dotvaticana","E1D4"],["dots-dotkievan","E1D5"]]};
const LABELS={"rests":"Rests","accidentals":"Accidentals","arrowheads":"Arrowheads","dot":"Dot","scripts":"Scripts & Articulations","clefs":"Clefs","timesig":"Time Signatures","pedal":"Pedal","brackettips":"Bracket Tips","accordion":"Accordion","ties":"Ties","noteheads":"Noteheads","flags":"Flags","custodes":"Custodes","dots":"Dots"};
let fontSize = 40;
const filterEl = document.getElementById('filter');
const sizeEl = document.getElementById('size');
const sizeVal = document.getElementById('sizeVal');
const tocEl = document.getElementById('toc');
const contentEl = document.getElementById('content');
function render(filterText) {
const ft = (filterText || '').toLowerCase();
contentEl.innerHTML = '';
tocEl.innerHTML = '';
for (const [cat, items] of Object.entries(CATS)) {
const filtered = items.filter(([n, c]) => !ft || n.toLowerCase().includes(ft) || c.toLowerCase().includes(ft));
if (!filtered.length) continue;
const a = document.createElement('a');
a.href = '#cat-' + cat;
a.textContent = (LABELS[cat] || cat) + ' (' + filtered.length + ')';
tocEl.appendChild(a);
const div = document.createElement('div');
div.className = 'category';
div.id = 'cat-' + cat;
div.innerHTML = '<h2>' + (LABELS[cat] || cat) + ' <span>(' + filtered.length + ')</span></h2>';
const grid = document.createElement('div');
grid.className = 'grid';
for (const [name, code] of filtered) {
const ch = String.fromCodePoint(parseInt(code, 16));
const cell = document.createElement('div');
cell.className = 'cell';
cell.title = name + ' (U+' + code + ')';
cell.innerHTML = '<div class="glyph" style="font-size:' + fontSize + 'px">' + ch + '</div>'
+ '<div class="name">' + name + '</div>'
+ '<div class="code">U+' + code + '</div>';
grid.appendChild(cell);
}
div.appendChild(grid);
contentEl.appendChild(div);
}
}
filterEl.addEventListener('input', () => render(filterEl.value));
sizeEl.addEventListener('input', () => {
fontSize = +sizeEl.value;
sizeVal.textContent = fontSize;
document.querySelectorAll('.glyph').forEach(el => el.style.fontSize = fontSize + 'px');
});
document.fonts.ready.then(() => {
const ok = document.fonts.check('40px Emmentaler-26');
// Debug: list all font faces
const faces = [];
document.fonts.forEach(f => faces.push({family: f.family, status: f.status, src: f.src || ''}));
// Debug: canvas render test
const canvas = document.createElement('canvas');
canvas.width = 200; canvas.height = 200;
const ctx = canvas.getContext('2d');
const tests = [
['Emmentaler-26', 0xE082, 'Emmentaler U+E082 (G clef)'],
['Emmentaler-26', 0xE0A9, 'Emmentaler U+E0A9 (notehead)'],
['serif', 0x41, 'serif "A" (control)'],
];
const results = tests.map(([font, cp, label]) => {
ctx.clearRect(0, 0, 200, 200);
ctx.font = '40px ' + font;
ctx.fillStyle = 'black';
ctx.fillText(String.fromCodePoint(cp), 50, 100);
const data = ctx.getImageData(0, 0, 200, 200);
let pixels = 0;
for (let i = 3; i < data.data.length; i += 4) if (data.data[i] > 0) pixels++;
return label + ': ' + pixels + 'px';
});
// Test each font format individually
const formats = [
['ttf-woff2', '/fonts/emmentaler-26-ttf.woff2'],
['cff-woff2', '/fonts/emmentaler-26.woff2'],
['woff', '/fonts/emmentaler-26.woff'],
['otf', '/fonts/emmentaler-26.otf'],
];
const formatResults = [];
let chain = Promise.resolve();
formats.forEach(([label, url]) => {
chain = chain.then(() => {
const face = new FontFace('test-' + label, "url('" + url + "')");
return face.load().then(loaded => {
document.fonts.add(loaded);
ctx.clearRect(0, 0, 200, 200);
ctx.font = '40px test-' + label;
ctx.fillText(String.fromCodePoint(0xE082), 50, 100);
const data = ctx.getImageData(0, 0, 200, 200);
let px = 0;
for (let i = 3; i < data.data.length; i += 4) if (data.data[i] > 0) px++;
formatResults.push(label + ': ' + px + 'px' + (px > 0 ? ' OK' : ' BROKEN'));
}).catch(err => {
formatResults.push(label + ': LOAD ERROR ' + err.message);
});
});
});
chain.then(() => {
document.getElementById('status').innerHTML =
'Font check (CSS @font-face): <span class="' + (ok ? 'ok' : 'fail') + '">' + (ok ? 'true' : 'false') + '</span>'
+ '<br>FontFaces: ' + JSON.stringify(faces)
+ '<br>CSS canvas tests: ' + results.join(' | ')
+ '<br><b>Per-format tests:</b> ' + formatResults.join(' | ')
+ '<br>571 glyphs in 15 categories';
});
});
render('');
</script>
</body>
</html>