[smufl-discuss] web hack for examining SMuFL fonts

classic Classic list List threaded Threaded
1 message Options
Reply | Threaded
Open this post in threaded view
|

[smufl-discuss] web hack for examining SMuFL fonts

Joseph Berkovitz
Hi List,

Here's a useful little hacked-up webpage for showing ranges of Bravura code points relative to the left edge, font baseline and staff line spacings. I hope it's as useful for you as it is for me -- feel free to improve, modify, redistribute, anything but criticize :)

.            .       .    .  . ...Joe

Joe Berkovitz
President
Noteflight LLC

PS It would be nice if this list supported attachments.


===========================
<html>
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <script>

function applyCodepoint() {
  var cp1 = parseInt($('#codepointValueMin').val(), 16);
  var cp2 = parseInt($('#codepointValueMax').val(), 16) || cp1 + 15;
  var cpText = "";
  for (var i = cp1; i <= cp2; i++) {
    cpText += String.fromCharCode(i) + " ";
  }
  $('#codepointText').text(cpText);
 
  // Work around an SVG redisplay bug in Chrome
  $('#svg').hide();
  setTimeout(function() {
    $('#svg').show();
  }, 100);
  return false;
}

  </script>
</head>
<body onload="applyCodepoint()">
<div>
  <svg id="svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="width:100%;height:400px;stroke:#000000;fill:#000000;">
      <text id="codepointText" font-family="Bravura" font-size="100" font-style="normal" stroke="none"  x="100" y="200"></text>
      <line x1="0" y1="100" x2="2000" y2="100"/>
      <line x1="0" y1="125" x2="2000" y2="125"/>
      <line x1="0" y1="150" x2="2000" y2="150"/>
      <line x1="0" y1="175" x2="2000" y2="175"/>
      <line x1="0" y1="200" x2="2000" y2="200"/>
      <line x1="100" y1="0" x2="100" y2="400"/>
  </svg>
</div>
<form id="codepointForm" onsubmit="return applyCodepoint()">
Start: <input id="codepointValueMin" type="text" value="E060">
<br>
End: <input id="codepointValueMax" type="text">
<br>
<button>Render Codepoints</button>
</form>
</body>
</html>
================================
#############################################################
This message is sent to you because you are subscribed to
  the mailing list <[hidden email]>.
To unsubscribe, E-mail to: <[hidden email]>
To switch to the DIGEST mode, E-mail to <[hidden email]>
To switch to the INDEX mode, E-mail to <[hidden email]>
Send administrative queries to  <[hidden email]>