Skip to content

Instantly share code, notes, and snippets.

@LCamel

LCamel/gist:1002650

Created June 1, 2011 16:08
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save LCamel/1002650 to your computer and use it in GitHub Desktop.
Save LCamel/1002650 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.html
<html>
<head>
<title>braille ruby</title>
</head>
<body>
<script>
function toBraille(c) {
// http://en.wikipedia.org/wiki/Braille_ASCII
var s = " A1B'K2L@CIF/MSP\"E3H9O6R^DJG>NTQ,*5<-U8V.%[$+X!&;:4\\0Z7(_?W]#Y)=";
var i = s.indexOf(c.toUpperCase());
if (i > 0) {
return "&#" + (0x2800 + i) + ";";
} else if (i == 0) {
return "_";
} else {
return "?";
}
}
function toDisplay(c) {
if (c == " ") {
return "&nbsp;";
} else {
return c;
}
}
function foo() {
var s = document.getElementById("text1").value;
var i;
var tmp = "";
for (i = 0; i < s.length; i++) {
tmp += toDisplay(s.charAt(i)) + "<rt>" + toBraille(s.charAt(i)) + "</rt>";
}
document.getElementById("text2").innerHTML = "<ruby>" + tmp + "</ruby>";
}
</script>
<input type="text" id="text1" value="This is a test"/>
<input type="button" onClick="foo()" value="Go!"/>
<!--
<ruby>
A<rt>a</rt>
B<rt>b</rt>
</ruby>
<style>
rt { background-color: AAAAAA; }
</style>
-->
<div id="text2" style="font-size: 48px"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment