import { LoaderEvent , Vector3D , AssetLibrary , IAsset , URLRequest , RequestAnimationFrame , CoordinateSystem , PerspectiveProjection } from "@awayjs/core" ; import { BitmapImage2D } from "@awayjs/stage" ; import { ElementsType , Graphics , TextureAtlas , GradientFillStyle , Shape } from "@awayjs/graphics" ; import { BasicMaterial , MethodMaterial , ImageTexture2D } from "@awayjs/materials" ; import { Sprite , Font , FNTGenerator , PrimitivePlanePrefab , TesselatedFontTable , TextField , TextFormat , TextFieldType , Scene , MouseManager , SceneGraphPartition , DisplayObjectContainer , TextFieldAutoSize } from "@awayjs/scene" ; import { View } from "@awayjs/view" ; import { DefaultRenderer } from "@awayjs/renderer" ; import { Parsers , FontParser } from "@awayjs/parsers" ; import { PickGroup } from '@awayjs/view' ; class Basic_GenerateFNT { private static _colorMaterials : any = { } ; private static _textureMaterials : any = { } ; private static _useTextureAtlasForColors : boolean = true ; private _scene : Scene ; private _planeMaterial : BasicMaterial ; private _tf : TextField ; private _timer : RequestAnimationFrame ; private _fntRenderer : FNTGenerator ; /**
     * Constructor
     */ constructor ( ) { Graphics . get_material_for_color = function ( color , alpha = 1 ) : any { if ( color == 0 ) { color = 0x000001 ; } var texObj = { } ; if ( Basic_GenerateFNT . _useTextureAtlasForColors ) { texObj = TextureAtlas . getTextureForColor ( color , alpha ) ; if ( Basic_GenerateFNT . _colorMaterials [ texObj . bitmap . id ] ) { texObj . material = Basic_GenerateFNT . _colorMaterials [ texObj . bitmap . id ] ; return texObj ; } var newmat = new MethodMaterial ( texObj . bitmap ) ; newmat . alphaBlending = true ; newmat . useColorTransform = true ; newmat . bothSides = true ; Basic_GenerateFNT . _colorMaterials [ texObj . bitmap . id ] = newmat ; texObj . material = newmat ; return texObj ; } var colorstr = color + "_" + Math . round ( alpha * 100 ) . toString ( ) ; if ( Basic_GenerateFNT . _colorMaterials [ colorstr ] ) { texObj . material = Basic_GenerateFNT . _colorMaterials [ colorstr ] ; return texObj ; } var newmat = new MethodMaterial ( color , alpha ) ; newmat . alphaBlending = true ; newmat . useColorTransform = true ; newmat . bothSides = true ; texObj . material = newmat ; Basic_GenerateFNT . _colorMaterials [ colorstr ] = newmat ; return texObj ; } ; Graphics . get_material_for_gradient = function ( gradient ) : any { var texObj = TextureAtlas . getTextureForGradient ( gradient ) ; var lookupId = texObj . bitmap . id + gradient . type ; if ( Basic_GenerateFNT . _textureMaterials [ lookupId ] ) { texObj . material = Basic_GenerateFNT . _textureMaterials [ lookupId ] ; return texObj ; } var newmat = new MethodMaterial ( texObj . bitmap ) ; newmat . useColorTransform = true ; newmat . alphaBlending = true ; newmat . bothSides = true ; Basic_GenerateFNT . _textureMaterials [ lookupId ] = newmat ; texObj . material = newmat ; return texObj ; } ; Parsers . enableAllBundled ( ) ; this . _scene = new Scene ( new SceneGraphPartition ( new DisplayObjectContainer ( ) ) ) ; this . _scene . renderer . renderableSorter = null ; this . _scene . view . projection . scale = 1 ; this . _scene . view . projection . coordinateSystem = CoordinateSystem . RIGHT_HANDED ; this . _scene . view . backgroundColor = 0xcccccc ; this . _fntRenderer = new FNTGenerator ( this . _scene . renderer . stage ) ; window . onwheel = ( event ) => this . onMouseWheel ( event ) ; window . onresize = ( event ) => this . onResize ( event ) ; window . addEventListener ( "keydown" , ( event ) => this . onKeyDown ( event ) ) ; this . onResize ( ) ; this . _timer = new RequestAnimationFrame ( this . onEnterFrame , this ) ; this . _timer . start ( ) ; AssetLibrary . addEventListener ( LoaderEvent . LOAD_COMPLETE , ( event ) => this . onResourceComplete ( event ) ) ; AssetLibrary . load ( new URLRequest ( "assets/georgia.ttf" ) , null , null , new FontParser ( true ) ) ; } /**
     * render loop
     */ private onEnterFrame ( dt ) { this . _scene . render ( ) ; } private showGeneratedBitmaps ( bitmaps , pixelRatio ) { for ( var b = 0 ; b < bitmaps . length ; b ++ ) { var htmlWrapper = document . createElement ( "div" ) ; var bitmap = bitmaps [ b ] ; var htmlImage = document . createElement ( "canvas" ) ; htmlImage . width = bitmap . width ; htmlImage . height = bitmap . height ; htmlImage . style . transform = "scaleY(-1)" ; htmlImage . style . width = bitmap . width / pixelRatio + "px" ; htmlImage . style . height = bitmap . height / pixelRatio + "px" ; var context = htmlImage . getContext ( "2d" ) ; var imageData = context . getImageData ( 0 , 0 , bitmap . width , bitmap . height ) ; imageData . data . set ( bitmap . data ) ; context . putImageData ( imageData , 0 , 0 ) ; htmlWrapper . appendChild ( htmlImage ) ; document . body . appendChild ( htmlWrapper ) ; for ( var m = 0 ; m < bitmap . mipLevels . length ; m ++ ) { var bitmap2 = bitmap . mipLevels [ m ] ; var htmlImage2 = document . createElement ( "canvas" ) ; htmlImage2 . width = bitmap2 . width ; htmlImage2 . height = bitmap2 . height ; htmlImage2 . style . transform = "scaleY(-1)" ; htmlImage2 . style . width = bitmap . mipLevels [ m ] . width / pixelRatio + "px" ; htmlImage2 . style . height = bitmap . mipLevels [ m ] . height / pixelRatio + "px" ; var context2 = htmlImage2 . getContext ( "2d" ) ; var imageData2 = context2 . getImageData ( 0 , 0 , bitmap2 . width , bitmap2 . height ) ; imageData2 . data . set ( bitmap2 . data ) ; context2 . putImageData ( imageData2 , 0 , 0 ) ; htmlWrapper . appendChild ( htmlImage2 ) ; } } } /**
     * Listener function for resource complete event on asset library
     */ private onResourceComplete ( event ) { var assets = event . assets ; var length = assets . length ; for ( var c = 0 ; c < length ; c ++ ) { var asset = assets [ c ] ; console . log ( asset . name , event . url ) ; if ( asset . isAsset ( Font ) ) { var bitmaps = this . _fntRenderer . generate ( < Font > asset , 2048 , 128 , 5 ) ; var textFormat = new TextFormat ( ) ; textFormat . font = < Font > asset ; textFormat . color = 0xff0000 ; textFormat . size = 40 ; var textfield = new TextField ( ) ; textfield . textFormat = textFormat ; textfield . background = true ; textfield . border = true ; textfield . borderColor = 0xff0000 ; textfield . multiline = true ; textfield . selectable = true ; textfield . type = TextFieldType . INPUT ; textfield . autoSize = TextFieldAutoSize . RIGHT ; for ( var i = 0 ; i < 300 ; i ++ ) { var tf = textfield . clone ( ) ; var tfclone = textFormat . clone ( ) ; tfclone . size = Math . round ( 10 + Math . random ( ) * 100 ) ; tf . textFormat = tfclone ; tf . x = ( Math . random ( ) - 0.5 ) * 1000 * window . innerWidth / window . innerHeight ; tf . y = ( Math . random ( ) - 0.5 ) * 1000 ; tf . text = "12345\n67890" ; this . _scene . root . addChild ( tf ) ; } } } } private onKeyDown ( event = null ) { if ( event . key == "Tab" ) { this . _scene . mouseManager . focusNextTab ( ) ; } } /**
     * stage listener for resize events
     */ private onResize ( event = null ) { this . _scene . view . y = 0 ; this . _scene . view . x = 0 ; this . _scene . view . width = window . innerWidth ; this . _scene . view . height = window . innerHeight ; } /**
     * Mouse wheel listener for navigation
     */ private onMouseWheel ( event ) { event . preventDefault ( ) ; if ( event . ctrlKey ) { this . _scene . camera . z -= event . deltaY ; if ( this . _scene . camera . z > - 100 ) this . _scene . camera . z = - 100 ; else if ( this . _scene . camera . z < - 2000 ) this . _scene . camera . z = - 2000 ; } else { this . _scene . camera . x += event . deltaX ; this . _scene . camera . y += event . deltaY ; } } } window . onload = function ( ) { new Basic_GenerateFNT ( ) ; } ;