1
1
var Glyph = {
2
+ glyphs : [ ] ,
2
3
ratio : null ,
3
4
head : null ,
4
5
os2 : null ,
5
- hmtx : null ,
6
-
7
- midValue : function ( a , b ) {
8
- return a + ( b - a ) / 2 ;
9
- } ,
6
+ hmtx : null ,
7
+ width : null ,
8
+ height : null ,
9
+ scale : 1.0 ,
10
10
11
11
splitPath : function ( path ) {
12
12
return path . match ( / ( [ a - z ] ) | ( - ? \d + (?: \. \d + ) ? ) / ig) ;
@@ -60,7 +60,6 @@ var Glyph = {
60
60
return ;
61
61
}
62
62
63
-
64
63
var contour , path , transform ;
65
64
66
65
for ( var ci = 0 , cl = contours . length ; ci < cl ; ci ++ ) {
@@ -88,14 +87,16 @@ var Glyph = {
88
87
var element = canvas [ 0 ] ;
89
88
var ctx = element . getContext ( "2d" ) ;
90
89
var ratio = Glyph . ratio ;
91
- Glyph . width = element . width ;
92
- Glyph . height = element . height ;
93
-
94
- ctx . lineWidth = ratio ;
90
+ var width = Glyph . width * Glyph . scale ;
91
+ var height = Glyph . height * Glyph . scale ;
92
+ ctx . clearRect ( 0 , 0 , width , height ) ;
93
+
94
+ ctx . lineWidth = ratio / Glyph . scale ;
95
95
96
96
// Invert axis
97
- ctx . translate ( 0 , Glyph . height ) ;
97
+ ctx . translate ( 0 , height ) ;
98
98
ctx . scale ( 1 / ratio , - ( 1 / ratio ) ) ;
99
+ ctx . scale ( Glyph . scale , Glyph . scale ) ;
99
100
100
101
ctx . translate ( 0 , - Glyph . head . yMin ) ;
101
102
@@ -114,7 +115,7 @@ var Glyph = {
114
115
var s = ratio * 3 ;
115
116
116
117
ctx . strokeStyle = "rgba(0,0,0,0.5)" ;
117
- ctx . lineWidth = ratio * 1.5 ;
118
+ ctx . lineWidth = ( ratio * 1.5 ) / Glyph . scale ;
118
119
119
120
// origin
120
121
ctx . beginPath ( ) ;
@@ -151,5 +152,24 @@ var Glyph = {
151
152
//ctx.globalCompositeOperation = "xor";
152
153
153
154
Glyph . drawSVGContours ( ctx , shape . SVGContours ) ;
155
+ } ,
156
+ drawAll : function ( ) {
157
+ $ . each ( Glyph . glyphs , function ( i , g ) {
158
+ Glyph . draw ( $ ( '#glyph-' + g [ 0 ] ) , g [ 1 ] , g [ 0 ] ) ;
159
+ } ) ;
160
+ } ,
161
+ resize : function ( value ) {
162
+ Glyph . scale = value / 100 ;
163
+
164
+ $ . each ( document . getElementsByTagName ( 'canvas' ) , function ( i , canvas ) {
165
+ canvas . height = Glyph . height * Glyph . scale ;
166
+ canvas . width = Glyph . width * Glyph . scale ;
167
+ } ) ;
168
+
169
+ Glyph . drawAll ( ) ;
154
170
}
155
- } ;
171
+ } ;
172
+
173
+ $ ( function ( ) {
174
+ Glyph . drawAll ( ) ;
175
+ } ) ;
0 commit comments