import { LoaderEvent , Vector3D , ColorTransform , AssetLibrary , URLRequest , RequestAnimationFrame } from "@awayjs/core" ; import { BitmapImage2D } from "@awayjs/stage" ; import { Graphics , ElementsType , ParticleAnimator , ParticleAnimationSet , ParticleProperties , ParticlePropertiesMode , ParticleBillboardNode , ParticleBezierCurveNode , ParticleInitialColorNode , ParticlePositionNode , ParticleGraphicsHelper } from "@awayjs/graphics" ; import { Scene , Camera , Sprite , HoverController , PrimitivePlanePrefab , DisplayObjectContainer } from "@awayjs/scene" ; import { PointLight , StaticLightPicker , MethodMaterial } from "@awayjs/materials" ; import { View } from "@awayjs/view" ; class Intermediate_ParticleExplosions { private static PARTICLE_SIZE : number = 2 ; private static NUM_ANIMATORS : number = 4 ; private _scene : Scene ; private _camera : Camera ; private _view : View ; private _root : DisplayObjectContainer ; private _cameraController : HoverController ; private _greenLight : PointLight ; private _blueLight : PointLight ; private _lightPicker : StaticLightPicker ; private _chromeBitmapImage2D : BitmapImage2D ; private _firefoxBitmapImage2D : BitmapImage2D ; private _ieBitmapImage2D : BitmapImage2D ; private _safariBitmapImage2D : BitmapImage2D ; private _colorValues : Array < Vector3D > = new Array < Vector3D > ( ) ; private _colorPoints : Array < Vector3D > = new Array < Vector3D > ( ) ; private _colorChromeSeparation : number ; private _colorFirefoxSeparation : number ; private _colorSafariSeparation : number ; private _colorMaterial : MethodMaterial ; private _colorGraphics : Graphics ; private _colorAnimationSet : ParticleAnimationSet ; private _colorParticleSprite : Sprite ; private _colorAnimators : Array < ParticleAnimator > ; private _timer : RequestAnimationFrame ; private _time : number = 0 ; private _angle : number = 0 ; private _move : Boolean = false ; private _lastPanAngle : number ; private _lastTiltAngle : number ; private _lastMouseX : number ; private _lastMouseY : number ; /**
     * Constructor
     */ constructor ( ) { this . init ( ) ; } /**
     * Global initialise function
     */ private init ( ) { this . initEngine ( ) ; this . initLights ( ) ; this . initMaterials ( ) ; this . initListeners ( ) ; } /**
     * Initialise the engine
     */ private initEngine ( ) { this . _camera = new Camera ( ) ; this . _scene = new Scene ( null , this . _camera ) ; this . _view = this . _scene . view ; this . _root = this . _scene . root ; this . _cameraController = new HoverController ( this . _camera , null , 225 , 10 , 1000 ) ; } /**
     * Initialise the lights
     */ private initLights ( ) { this . _greenLight = new PointLight ( ) ; this . _greenLight . color = 0x00FF00 ; this . _greenLight . ambient = 1 ; this . _greenLight . fallOff = 600 ; this . _greenLight . radius = 100 ; this . _greenLight . specular = 2 ; this . _blueLight = new PointLight ( ) ; this . _blueLight . color = 0x0000FF ; this . _blueLight . fallOff = 600 ; this . _blueLight . radius = 100 ; this . _blueLight . specular = 2 ; this . _lightPicker = new StaticLightPicker ( [ this . _greenLight , this . _blueLight ] ) ; } /**
     * Initialise the materials
     */ private initMaterials ( ) { this . _colorMaterial = new MethodMaterial ( 0xFFFFFF ) ; this . _colorMaterial . bothSides = true ; this . _colorMaterial . lightPicker = this . _lightPicker ; } /**
     * Initialise the particles
     */ private initParticles ( ) { var i ; var j ; var point ; var rgb ; var color ; for ( i = 0 ; i < this . _chromeBitmapImage2D . width ; i ++ ) { for ( j = 0 ; j < this . _chromeBitmapImage2D . height ; j ++ ) { point = new Vector3D ( Intermediate_ParticleExplosions . PARTICLE_SIZE * ( i - this . _chromeBitmapImage2D . width / 2 - 100 ) , Intermediate_ParticleExplosions . PARTICLE_SIZE * ( - j + this . _chromeBitmapImage2D . height / 2 ) ) ; color = this . _chromeBitmapImage2D . getPixel32 ( i , j ) ; if ( ( ( color >> 24 ) & 0xff ) > 0xb0 ) { this . _colorValues . push ( new Vector3D ( ( ( color & 0xff0000 ) >> 16 ) / 255 , ( ( color & 0xff00 ) >> 8 ) / 255 , ( color & 0xff ) / 255 ) ) ; this . _colorPoints . push ( point ) ; } } } this . _colorChromeSeparation = this . _colorPoints . length ; for ( i = 0 ; i < this . _firefoxBitmapImage2D . width ; i ++ ) { for ( j = 0 ; j < this . _firefoxBitmapImage2D . height ; j ++ ) { point = new Vector3D ( Intermediate_ParticleExplosions . PARTICLE_SIZE * ( i - this . _firefoxBitmapImage2D . width / 2 + 100 ) , Intermediate_ParticleExplosions . PARTICLE_SIZE * ( - j + this . _firefoxBitmapImage2D . height / 2 ) ) ; color = this . _firefoxBitmapImage2D . getPixel32 ( i , j ) ; if ( ( ( color >> 24 ) & 0xff ) > 0xb0 ) { this . _colorValues . push ( new Vector3D ( ( ( color & 0xff0000 ) >> 16 ) / 255 , ( ( color & 0xff00 ) >> 8 ) / 255 , ( color & 0xff ) / 255 ) ) ; this . _colorPoints . push ( point ) ; } } } this . _colorFirefoxSeparation = this . _colorPoints . length ; for ( i = 0 ; i < this . _safariBitmapImage2D . width ; i ++ ) { for ( j = 0 ; j < this . _safariBitmapImage2D . height ; j ++ ) { point = new Vector3D ( Intermediate_ParticleExplosions . PARTICLE_SIZE * ( i - this . _safariBitmapImage2D . width / 2 ) , Intermediate_ParticleExplosions . PARTICLE_SIZE * ( - j + this . _safariBitmapImage2D . height / 2 ) , - Intermediate_ParticleExplosions . PARTICLE_SIZE * 100 ) ; color = this . _safariBitmapImage2D . getPixel32 ( i , j ) ; if ( ( ( color >> 24 ) & 0xff ) > 0xb0 ) { this . _colorValues . push ( new Vector3D ( ( ( color & 0xff0000 ) >> 16 ) / 255 , ( ( color & 0xff00 ) >> 8 ) / 255 , ( color & 0xff ) / 255 ) ) ; this . _colorPoints . push ( point ) ; } } } this . _colorSafariSeparation = this . _colorPoints . length ; for ( i = 0 ; i < this . _ieBitmapImage2D . width ; i ++ ) { for ( j = 0 ; j < this . _ieBitmapImage2D . height ; j ++ ) { point = new Vector3D ( Intermediate_ParticleExplosions . PARTICLE_SIZE * ( i - this . _ieBitmapImage2D . width / 2 ) , Intermediate_ParticleExplosions . PARTICLE_SIZE * ( - j + this . _ieBitmapImage2D . height / 2 ) , Intermediate_ParticleExplosions . PARTICLE_SIZE * 100 ) ; color = this . _ieBitmapImage2D . getPixel32 ( i , j ) ; if ( ( ( color >> 24 ) & 0xff ) > 0xb0 ) { this . _colorValues . push ( new Vector3D ( ( ( color & 0xff0000 ) >> 16 ) / 255 , ( ( color & 0xff00 ) >> 8 ) / 255 , ( color & 0xff ) / 255 ) ) ; this . _colorPoints . push ( point ) ; } } } this . _colorAnimationSet = new ParticleAnimationSet ( ) ; this . _colorAnimationSet . addAnimation ( new ParticleBillboardNode ( ) ) ; this . _colorAnimationSet . addAnimation ( new ParticleBezierCurveNode ( ParticlePropertiesMode . LOCAL_STATIC ) ) ; this . _colorAnimationSet . addAnimation ( new ParticlePositionNode ( ParticlePropertiesMode . LOCAL_STATIC ) ) ; this . _colorAnimationSet . addAnimation ( new ParticleInitialColorNode ( ParticlePropertiesMode . LOCAL_STATIC , true , false , new ColorTransform ( 0 , 1 , 0 , 1 ) ) ) ; this . _colorAnimationSet . initParticleFunc = this . iniColorParticleFunc ; this . _colorAnimationSet . initParticleScope = this ; } /**
     * Initialise the scene objects
     */ private initObjects ( ) { var plane = < Sprite > ( new PrimitivePlanePrefab ( null , ElementsType . TRIANGLE , Intermediate_ParticleExplosions . PARTICLE_SIZE , Intermediate_ParticleExplosions . PARTICLE_SIZE , 1 , 1 , false ) ) . getNewObject ( ) ; var colorGraphicsSet = new Array < Graphics > ( ) ; var len = this . _colorPoints . length ; for ( i = 0 ; i < len ; i ++ ) colorGraphicsSet . push ( plane . graphics ) ; this . _colorParticleSprite = new Sprite ( null , this . _colorMaterial ) ; ParticleGraphicsHelper . generateGraphics ( this . _colorParticleSprite . graphics , colorGraphicsSet ) ; this . _colorAnimators = new Array < ParticleAnimator > ( Intermediate_ParticleExplosions . NUM_ANIMATORS ) ; var i = 0 ; for ( i = 0 ; i < Intermediate_ParticleExplosions . NUM_ANIMATORS ; i ++ ) { this . _colorParticleSprite = < Sprite > this . _colorParticleSprite . clone ( ) ; this . _colorParticleSprite . rotationY = 45 * ( i - 1 ) ; this . _root . addChild ( this . _colorParticleSprite ) ; this . _colorAnimators [ i ] = new ParticleAnimator ( this . _colorAnimationSet ) ; this . _colorParticleSprite . animator = this . _colorAnimators [ i ] ; this . _root . addChild ( this . _colorParticleSprite ) ; } } /**
     * Initialise the listeners
     */ private initListeners ( ) { window . onresize = ( event ) => this . onResize ( event ) ; document . onmousedown = ( event ) => this . onMouseDown ( event ) ; document . onmouseup = ( event ) => this . onMouseUp ( event ) ; document . onmousemove = ( event ) => this . onMouseMove ( 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/firefox.png" ) ) ; AssetLibrary . load ( new URLRequest ( "assets/chrome.png" ) ) ; AssetLibrary . load ( new URLRequest ( "assets/safari.png" ) ) ; AssetLibrary . load ( new URLRequest ( "assets/ie.png" ) ) ; } /**
     * Initialiser for particle properties
     */ private iniColorParticleFunc ( properties ) { properties . startTime = 0 ; properties . duration = 1 ; var degree1 = Math . random ( ) * Math . PI * 2 ; var degree2 = Math . random ( ) * Math . PI * 2 ; var r = 500 ; if ( properties . index < this . _colorChromeSeparation ) properties [ ParticleBezierCurveNode . BEZIER_END_VECTOR3D ] = new Vector3D ( 300 * Intermediate_ParticleExplosions . PARTICLE_SIZE , 0 , 0 ) ; else if ( properties . index < this . _colorFirefoxSeparation ) properties [ ParticleBezierCurveNode . BEZIER_END_VECTOR3D ] = new Vector3D ( - 300 * Intermediate_ParticleExplosions . PARTICLE_SIZE , 0 , 0 ) ; else if ( properties . index < this . _colorSafariSeparation ) properties [ ParticleBezierCurveNode . BEZIER_END_VECTOR3D ] = new Vector3D ( 0 , 0 , 300 * Intermediate_ParticleExplosions . PARTICLE_SIZE ) ; else properties [ ParticleBezierCurveNode . BEZIER_END_VECTOR3D ] = new Vector3D ( 0 , 0 , - 300 * Intermediate_ParticleExplosions . PARTICLE_SIZE ) ; var rgb = this . _colorValues [ properties . index ] ; properties [ ParticleInitialColorNode . COLOR_INITIAL_COLORTRANSFORM ] = new ColorTransform ( rgb . x , rgb . y , rgb . z , 1 ) ; properties [ ParticleBezierCurveNode . BEZIER_CONTROL_VECTOR3D ] = new Vector3D ( r * Math . sin ( degree1 ) * Math . cos ( degree2 ) , r * Math . cos ( degree1 ) * Math . cos ( degree2 ) , r * Math . sin ( degree2 ) ) ; properties [ ParticlePositionNode . POSITION_VECTOR3D ] = this . _colorPoints [ properties . index ] ; } /**
     * Navigation and render loop
     */ private onEnterFrame ( dt ) { this . _time += dt ; this . _cameraController . panAngle += 0.2 ; var i ; var time ; if ( this . _colorAnimators ) { for ( i = 0 ; i < this . _colorAnimators . length ; i ++ ) { time = 1000 * ( Math . sin ( this . _time / 5000 + Math . PI * i / 4 ) + 1 ) ; this . _colorAnimators [ i ] . update ( time ) ; } } this . _angle += Math . PI / 180 ; this . _greenLight . x = Math . sin ( this . _angle ) * 600 ; this . _greenLight . z = Math . cos ( this . _angle ) * 600 ; this . _blueLight . x = Math . sin ( this . _angle + Math . PI ) * 600 ; this . _blueLight . z = Math . cos ( this . _angle + Math . PI ) * 600 ; this . _scene . render ( ) ; } /**
     * Listener function for resource complete event on asset library
     */ private onResourceComplete ( event ) { switch ( event . url ) { case "assets/firefox.png" : this . _firefoxBitmapImage2D = < BitmapImage2D > event . assets [ 0 ] ; break ; case "assets/chrome.png" : this . _chromeBitmapImage2D = < BitmapImage2D > event . assets [ 0 ] ; break ; case "assets/ie.png" : this . _ieBitmapImage2D = < BitmapImage2D > event . assets [ 0 ] ; break ; case "assets/safari.png" : this . _safariBitmapImage2D = < BitmapImage2D > event . assets [ 0 ] ; break ; } if ( this . _firefoxBitmapImage2D != null && this . _chromeBitmapImage2D != null && this . _safariBitmapImage2D != null && this . _ieBitmapImage2D != null ) { this . initParticles ( ) ; this . initObjects ( ) ; } } /**
     * Mouse down listener for navigation
     */ private onMouseDown ( event ) { this . _lastPanAngle = this . _cameraController . panAngle ; this . _lastTiltAngle = this . _cameraController . tiltAngle ; this . _lastMouseX = event . clientX ; this . _lastMouseY = event . clientY ; this . _move = true ; } /**
     * Mouse up listener for navigation
     */ private onMouseUp ( event ) { this . _move = false ; } /**
     * Mouse move listener for mouseLock
     */ private onMouseMove ( event ) { if ( this . _move ) { this . _cameraController . panAngle = 0.3 * ( event . clientX - this . _lastMouseX ) + this . _lastPanAngle ; this . _cameraController . tiltAngle = 0.3 * ( event . clientY - this . _lastMouseY ) + this . _lastTiltAngle ; } } /**
     * window listener for resize events
     */ private onResize ( event = null ) { this . _view . y = 0 ; this . _view . x = 0 ; this . _view . width = window . innerWidth ; this . _view . height = window . innerHeight ; } } window . onload = function ( ) { new Intermediate_ParticleExplosions ( ) ; } ;