-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathfontcharmap.html
62 lines (62 loc) · 2.18 KB
/
fontcharmap.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<html>
<script>
var size=28;
function loadfont() {
var stl = document.getElementsByTagName('style')[0];
console.log(stl);
stl.innerHTML="@font-face { font-family: myFont; src: url("+document.getElementById('font').value+") format('"+document.getElementById('type').value+"'); }";
}
function selectthis(element) {
var doc = document, range, selection;
if (doc.body.createTextRange) {
range = document.body.createTextRange();
range.moveToElementText(element);
range.select();
} else if (window.getSelection) {
selection = window.getSelection();
range = document.createRange();
range.selectNodeContents(element);
selection.removeAllRanges();
selection.addRange(range);
}
document.execCommand('copy');
}
function gentable(s)
{
var txt="<table border='1' cellspacing='0' cellpadding='3'>",limit,x,y,i,l=document.location.href.match(/limit=([0-9]+)$/);
if(s!=undefined && s!=0) size+=s;
if(size<28) size=28;
if(l!=null && l[1]!=null) limit=parseInt(l[1]); else limit=1024;
if(limit<128 || limit>4096) limit=1024;
for(y=0;y<limit;y++) {
txt+="<tr>";
for(x=0;x<8;x++) {
i=y*8+x;
txt+="<td style='font-family: myFont;font-size:"+size+"px; cursor:pointer;' width='1' onclick='selectthis(this);'>&#"+i+";</td>";
txt+="<td style='cursor:pointer;' width='1'><span onclick='selectthis(this);'>&#"+i+";</span><br><span onclick='selectthis(this);'>&#x"+i.toString(16)+";</span></td>";
}
txt+="</tr>\n";
}
txt+="</table>";
document.getElementById('tbl').innerHTML=txt;
}
</script>
<style>
</style>
<body onload='gentable();'>
<h1>Web Font Character Map</h1>
<div style='padding:5px;'>
Webfont URL: <input type='text' id='font' onchange='loadfont();' size='80'>
Type: <select id='type'>
<option>woff</option>
<option>woff2</option>
<option>embedded-opentype</option>
<option>truetype</option>
<option>svg</option>
</select>
Size: <input type='button' value='+' onclick='gentable(2);' style='width:24px;'> <input type='button' value='-' onclick='gentable(-2);' style='width:24px;'>
</div>
<div id='tbl'>
</div>
</body>
</html>