|
@@ -21,167 +21,162 @@ Object.assign( Font.prototype, {
|
|
|
|
|
|
generateShapes: function ( text, size, divisions ) {
|
|
|
|
|
|
- function createPaths( text ) {
|
|
|
-
|
|
|
- var chars = String( text ).split( '' );
|
|
|
- var scale = size / data.resolution;
|
|
|
- var line_height = ( data.boundingBox.yMax - data.boundingBox.yMin + data.underlineThickness ) * scale;
|
|
|
-
|
|
|
- var offsetX = 0, offsetY = 0;
|
|
|
+ if ( size === undefined ) size = 100;
|
|
|
+ if ( divisions === undefined ) divisions = 4;
|
|
|
|
|
|
- var paths = [];
|
|
|
+ var shapes = [];
|
|
|
+ var paths = createPaths( text, size, divisions, this.data );
|
|
|
|
|
|
- for ( var i = 0; i < chars.length; i ++ ) {
|
|
|
+ for ( var p = 0, pl = paths.length; p < pl; p ++ ) {
|
|
|
|
|
|
- var char = chars[ i ];
|
|
|
+ Array.prototype.push.apply( shapes, paths[ p ].toShapes() );
|
|
|
|
|
|
- if ( char === '\n' ) {
|
|
|
+ }
|
|
|
|
|
|
- offsetX = 0;
|
|
|
- offsetY -= line_height;
|
|
|
+ return shapes;
|
|
|
|
|
|
- } else {
|
|
|
+ }
|
|
|
|
|
|
- var ret = createPath( char, scale, offsetX, offsetY );
|
|
|
- offsetX += ret.offsetX;
|
|
|
- paths.push( ret.path );
|
|
|
+} );
|
|
|
|
|
|
- }
|
|
|
+function createPaths( text, size, divisions, data ) {
|
|
|
|
|
|
- }
|
|
|
+ var chars = String( text ).split( '' );
|
|
|
+ var scale = size / data.resolution;
|
|
|
+ var line_height = ( data.boundingBox.yMax - data.boundingBox.yMin + data.underlineThickness ) * scale;
|
|
|
|
|
|
- return paths;
|
|
|
+ var paths = [];
|
|
|
|
|
|
- }
|
|
|
+ var offsetX = 0, offsetY = 0;
|
|
|
|
|
|
- function createPath( c, scale, offsetX, offsetY ) {
|
|
|
+ for ( var i = 0; i < chars.length; i ++ ) {
|
|
|
|
|
|
- var glyph = data.glyphs[ c ] || data.glyphs[ '?' ];
|
|
|
+ var char = chars[ i ];
|
|
|
|
|
|
- if ( ! glyph ) return;
|
|
|
+ if ( char === '\n' ) {
|
|
|
|
|
|
- var path = new ShapePath();
|
|
|
+ offsetX = 0;
|
|
|
+ offsetY -= line_height;
|
|
|
|
|
|
- var pts = [];
|
|
|
- var x, y, cpx, cpy, cpx0, cpy0, cpx1, cpy1, cpx2, cpy2, laste;
|
|
|
+ } else {
|
|
|
|
|
|
- if ( glyph.o ) {
|
|
|
+ var ret = createPath( char, divisions, scale, offsetX, offsetY, data );
|
|
|
+ offsetX += ret.offsetX;
|
|
|
+ paths.push( ret.path );
|
|
|
|
|
|
- var outline = glyph._cachedOutline || ( glyph._cachedOutline = glyph.o.split( ' ' ) );
|
|
|
+ }
|
|
|
|
|
|
- for ( var i = 0, l = outline.length; i < l; ) {
|
|
|
+ }
|
|
|
|
|
|
- var action = outline[ i ++ ];
|
|
|
+ return paths;
|
|
|
|
|
|
- switch ( action ) {
|
|
|
+}
|
|
|
|
|
|
- case 'm': // moveTo
|
|
|
+function createPath( char, divisions, scale, offsetX, offsetY, data ) {
|
|
|
|
|
|
- x = outline[ i ++ ] * scale + offsetX;
|
|
|
- y = outline[ i ++ ] * scale + offsetY;
|
|
|
+ var glyph = data.glyphs[ char ] || data.glyphs[ '?' ];
|
|
|
|
|
|
- path.moveTo( x, y );
|
|
|
+ if ( ! glyph ) return;
|
|
|
|
|
|
- break;
|
|
|
+ var path = new ShapePath();
|
|
|
|
|
|
- case 'l': // lineTo
|
|
|
+ var pts = [];
|
|
|
+ var x, y, cpx, cpy, cpx0, cpy0, cpx1, cpy1, cpx2, cpy2, laste;
|
|
|
|
|
|
- x = outline[ i ++ ] * scale + offsetX;
|
|
|
- y = outline[ i ++ ] * scale + offsetY;
|
|
|
+ if ( glyph.o ) {
|
|
|
|
|
|
- path.lineTo( x, y );
|
|
|
+ var outline = glyph._cachedOutline || ( glyph._cachedOutline = glyph.o.split( ' ' ) );
|
|
|
|
|
|
- break;
|
|
|
+ for ( var i = 0, l = outline.length; i < l; ) {
|
|
|
|
|
|
- case 'q': // quadraticCurveTo
|
|
|
+ var action = outline[ i ++ ];
|
|
|
|
|
|
- cpx = outline[ i ++ ] * scale + offsetX;
|
|
|
- cpy = outline[ i ++ ] * scale + offsetY;
|
|
|
- cpx1 = outline[ i ++ ] * scale + offsetX;
|
|
|
- cpy1 = outline[ i ++ ] * scale + offsetY;
|
|
|
+ switch ( action ) {
|
|
|
|
|
|
- path.quadraticCurveTo( cpx1, cpy1, cpx, cpy );
|
|
|
+ case 'm': // moveTo
|
|
|
|
|
|
- laste = pts[ pts.length - 1 ];
|
|
|
+ x = outline[ i ++ ] * scale + offsetX;
|
|
|
+ y = outline[ i ++ ] * scale + offsetY;
|
|
|
|
|
|
- if ( laste ) {
|
|
|
+ path.moveTo( x, y );
|
|
|
|
|
|
- cpx0 = laste.x;
|
|
|
- cpy0 = laste.y;
|
|
|
+ break;
|
|
|
|
|
|
- for ( var i2 = 1; i2 <= divisions; i2 ++ ) {
|
|
|
+ case 'l': // lineTo
|
|
|
|
|
|
- var t = i2 / divisions;
|
|
|
- QuadraticBezier( t, cpx0, cpx1, cpx );
|
|
|
- QuadraticBezier( t, cpy0, cpy1, cpy );
|
|
|
+ x = outline[ i ++ ] * scale + offsetX;
|
|
|
+ y = outline[ i ++ ] * scale + offsetY;
|
|
|
|
|
|
- }
|
|
|
+ path.lineTo( x, y );
|
|
|
|
|
|
- }
|
|
|
+ break;
|
|
|
|
|
|
- break;
|
|
|
+ case 'q': // quadraticCurveTo
|
|
|
|
|
|
- case 'b': // bezierCurveTo
|
|
|
+ cpx = outline[ i ++ ] * scale + offsetX;
|
|
|
+ cpy = outline[ i ++ ] * scale + offsetY;
|
|
|
+ cpx1 = outline[ i ++ ] * scale + offsetX;
|
|
|
+ cpy1 = outline[ i ++ ] * scale + offsetY;
|
|
|
|
|
|
- cpx = outline[ i ++ ] * scale + offsetX;
|
|
|
- cpy = outline[ i ++ ] * scale + offsetY;
|
|
|
- cpx1 = outline[ i ++ ] * scale + offsetX;
|
|
|
- cpy1 = outline[ i ++ ] * scale + offsetY;
|
|
|
- cpx2 = outline[ i ++ ] * scale + offsetX;
|
|
|
- cpy2 = outline[ i ++ ] * scale + offsetY;
|
|
|
+ path.quadraticCurveTo( cpx1, cpy1, cpx, cpy );
|
|
|
|
|
|
- path.bezierCurveTo( cpx1, cpy1, cpx2, cpy2, cpx, cpy );
|
|
|
+ laste = pts[ pts.length - 1 ];
|
|
|
|
|
|
- laste = pts[ pts.length - 1 ];
|
|
|
+ if ( laste ) {
|
|
|
|
|
|
- if ( laste ) {
|
|
|
+ cpx0 = laste.x;
|
|
|
+ cpy0 = laste.y;
|
|
|
|
|
|
- cpx0 = laste.x;
|
|
|
- cpy0 = laste.y;
|
|
|
+ for ( var i2 = 1; i2 <= divisions; i2 ++ ) {
|
|
|
|
|
|
- for ( var i2 = 1; i2 <= divisions; i2 ++ ) {
|
|
|
+ var t = i2 / divisions;
|
|
|
+ QuadraticBezier( t, cpx0, cpx1, cpx );
|
|
|
+ QuadraticBezier( t, cpy0, cpy1, cpy );
|
|
|
|
|
|
- var t = i2 / divisions;
|
|
|
- CubicBezier( t, cpx0, cpx1, cpx2, cpx );
|
|
|
- CubicBezier( t, cpy0, cpy1, cpy2, cpy );
|
|
|
+ }
|
|
|
|
|
|
- }
|
|
|
+ }
|
|
|
|
|
|
- }
|
|
|
+ break;
|
|
|
|
|
|
- break;
|
|
|
+ case 'b': // bezierCurveTo
|
|
|
|
|
|
- }
|
|
|
+ cpx = outline[ i ++ ] * scale + offsetX;
|
|
|
+ cpy = outline[ i ++ ] * scale + offsetY;
|
|
|
+ cpx1 = outline[ i ++ ] * scale + offsetX;
|
|
|
+ cpy1 = outline[ i ++ ] * scale + offsetY;
|
|
|
+ cpx2 = outline[ i ++ ] * scale + offsetX;
|
|
|
+ cpy2 = outline[ i ++ ] * scale + offsetY;
|
|
|
|
|
|
- }
|
|
|
+ path.bezierCurveTo( cpx1, cpy1, cpx2, cpy2, cpx, cpy );
|
|
|
|
|
|
- }
|
|
|
+ laste = pts[ pts.length - 1 ];
|
|
|
|
|
|
- return { offsetX: glyph.ha * scale, path: path };
|
|
|
+ if ( laste ) {
|
|
|
|
|
|
- }
|
|
|
+ cpx0 = laste.x;
|
|
|
+ cpy0 = laste.y;
|
|
|
|
|
|
- //
|
|
|
+ for ( var i2 = 1; i2 <= divisions; i2 ++ ) {
|
|
|
|
|
|
- if ( size === undefined ) size = 100;
|
|
|
- if ( divisions === undefined ) divisions = 4;
|
|
|
+ var t = i2 / divisions;
|
|
|
+ CubicBezier( t, cpx0, cpx1, cpx2, cpx );
|
|
|
+ CubicBezier( t, cpy0, cpy1, cpy2, cpy );
|
|
|
|
|
|
- var data = this.data;
|
|
|
+ }
|
|
|
|
|
|
- var paths = createPaths( text );
|
|
|
- var shapes = [];
|
|
|
+ }
|
|
|
|
|
|
- for ( var p = 0, pl = paths.length; p < pl; p ++ ) {
|
|
|
+ break;
|
|
|
|
|
|
- Array.prototype.push.apply( shapes, paths[ p ].toShapes() );
|
|
|
+ }
|
|
|
|
|
|
}
|
|
|
|
|
|
- return shapes;
|
|
|
-
|
|
|
}
|
|
|
|
|
|
-} );
|
|
|
+ return { offsetX: glyph.ha * scale, path: path };
|
|
|
|
|
|
+}
|
|
|
|
|
|
export { Font };
|