Git: Up-in-the-Air – blob – Julian Fietkau

   1 import {
   2         FileLoader,
   3         Loader,
   4         ShapePath
   5 } from 'three';
   6
   7 class FontLoader extends Loader {
   8
   9         constructor( manager ) {
  10
  11                 super( manager );
  12
  13         }
  14
  15         load( url, onLoad, onProgress, onError ) {
  16
  17                 const scope = this;
  18
  19                 const loader = new FileLoader( this.manager );
  20                 loader.setPath( this.path );
  21                 loader.setRequestHeader( this.requestHeader );
  22                 loader.setWithCredentials( this.withCredentials );
  23                 loader.load( url, function ( text ) {
  24
  25                         const font = scope.parse( JSON.parse( text ) );
  26
  27                         if ( onLoad ) onLoad( font );
  28
  29                 }, onProgress, onError );
  30
  31         }
  32
  33         parse( json ) {
  34
  35                 return new Font( json );
  36
  37         }
  38
  39 }
  40
  41 //
  42
  43 class Font {
  44
  45         constructor( data ) {
  46
  47                 this.isFont = true;
  48
  49                 this.type = 'Font';
  50
  51                 this.data = data;
  52
  53         }
  54
  55         generateShapes( text, size = 100 ) {
  56
  57                 const shapes = [];
  58                 const paths = createPaths( text, size, this.data );
  59
  60                 for ( let p = 0, pl = paths.length; p < pl; p ++ ) {
  61
  62                         shapes.push( ...paths[ p ].toShapes() );
  63
  64                 }
  65
  66                 return shapes;
  67
  68         }
  69
  70 }
  71
  72 function createPaths( text, size, data ) {
  73
  74         const chars = Array.from( text );
  75         const scale = size / data.resolution;
  76         const line_height = ( data.boundingBox.yMax - data.boundingBox.yMin + data.underlineThickness ) * scale;
  77
  78         const paths = [];
  79
  80         let offsetX = 0, offsetY = 0;
  81
  82         for ( let i = 0; i < chars.length; i ++ ) {
  83
  84                 const char = chars[ i ];
  85
  86                 if ( char === '\n' ) {
  87
  88                         offsetX = 0;
  89                         offsetY -= line_height;
  90
  91                 } else {
  92
  93                         const ret = createPath( char, scale, offsetX, offsetY, data );
  94                         offsetX += ret.offsetX;
  95                         paths.push( ret.path );
  96
  97                 }
  98
  99         }
 100
 101         return paths;
 102
 103 }
 104
 105 function createPath( char, scale, offsetX, offsetY, data ) {
 106
 107         const glyph = data.glyphs[ char ] || data.glyphs[ '?' ];
 108
 109         if ( ! glyph ) {
 110
 111                 console.error( 'THREE.Font: character "' + char + '" does not exists in font family ' + data.familyName + '.' );
 112
 113                 return;
 114
 115         }
 116
 117         const path = new ShapePath();
 118
 119         let x, y, cpx, cpy, cpx1, cpy1, cpx2, cpy2;
 120
 121         if ( glyph.o ) {
 122
 123                 const outline = glyph._cachedOutline || ( glyph._cachedOutline = glyph.o.split( ' ' ) );
 124
 125                 for ( let i = 0, l = outline.length; i < l; ) {
 126
 127                         const action = outline[ i ++ ];
 128
 129                         switch ( action ) {
 130
 131                                 case 'm': // moveTo
 132
 133                                         x = outline[ i ++ ] * scale + offsetX;
 134                                         y = outline[ i ++ ] * scale + offsetY;
 135
 136                                         path.moveTo( x, y );
 137
 138                                         break;
 139
 140                                 case 'l': // lineTo
 141
 142                                         x = outline[ i ++ ] * scale + offsetX;
 143                                         y = outline[ i ++ ] * scale + offsetY;
 144
 145                                         path.lineTo( x, y );
 146
 147                                         break;
 148
 149                                 case 'q': // quadraticCurveTo
 150
 151                                         cpx = outline[ i ++ ] * scale + offsetX;
 152                                         cpy = outline[ i ++ ] * scale + offsetY;
 153                                         cpx1 = outline[ i ++ ] * scale + offsetX;
 154                                         cpy1 = outline[ i ++ ] * scale + offsetY;
 155
 156                                         path.quadraticCurveTo( cpx1, cpy1, cpx, cpy );
 157
 158                                         break;
 159
 160                                 case 'b': // bezierCurveTo
 161
 162                                         cpx = outline[ i ++ ] * scale + offsetX;
 163                                         cpy = outline[ i ++ ] * scale + offsetY;
 164                                         cpx1 = outline[ i ++ ] * scale + offsetX;
 165                                         cpy1 = outline[ i ++ ] * scale + offsetY;
 166                                         cpx2 = outline[ i ++ ] * scale + offsetX;
 167                                         cpy2 = outline[ i ++ ] * scale + offsetY;
 168
 169                                         path.bezierCurveTo( cpx1, cpy1, cpx2, cpy2, cpx, cpy );
 170
 171                                         break;
 172
 173                         }
 174
 175                 }
 176
 177         }
 178
 179         return { offsetX: glyph.ha * scale, path: path };
 180
 181 }
 182
 183 export { FontLoader, Font };