import 'p2' ; import 'pixi' ; import 'phaser' ; import IGame from '../Fabrique/IGame' ; import LoaderHelper from '../Fabrique/LoaderHelper' ; import Menu from './Menu' ; import { Constants , Images , Atlases , Sounds } from '../Data' ; import SaveDataManager from '../Managers/SaveDataManager' ; export default class Boot extends Phaser . State { public static Name : string = 'boot' ; public name : string = Boot . Name ; public game : IGame ; private wasPaused : boolean ; constructor ( ) { super ( ) ; } /**
     * Init, this is where game and google analytics are set up.
     * Small tweaks such as limiting input pointers, disabling right click context menu are placed here
     */ public init ( ) { SaveDataManager . getInstance ( this . game ) ; this . game . analytics . game . setup ( GA_GAME_KEY , GA_SECRET_KEY , version , this . game . analytics . game . createUser ( ) ) ; let sessionTime = Date . now ( ) ; window . addEventListener ( 'beforeunload' , ( ) => { this . game . analytics . game . addEvent ( new GA . Events . SessionEnd ( ( Date . now ( ) - sessionTime ) / 1000 ) ) ; this . game . analytics . game . sendEvents ( ) ; } ) ; this . game . analytics . google . setup ( GOOGLE_ID , GOOGLE_APP_NAME , version ) ; this . game . input . maxPointers = 1 ; this . game . canvas . oncontextmenu = function ( e ) : void { e . preventDefault ( ) ; } ; let adProvider = phaserAdProvider ; this . game . ads . setAdProvider ( adProvider ) ; if ( window . hasOwnProperty ( 'fbrqSA' ) && ( window as any ) [ 'fbrqSA' ] === true ) { Fabrique . Utils . ASSET_LOCATION = 'assets/' ; } if ( this . game . device . desktop ) { this . scale . scaleMode = Phaser . ScaleManager . SHOW_ALL ; this . scale . pageAlignHorizontally = true ; this . game . scale . windowConstraints . bottom = 'visual' ; this . game . onBlur . add ( ( ) => { this . game . sound . mute = true ; } ) ; this . game . onFocus . add ( ( ) => { this . game . sound . mute = false ; } ) ; } else { this . scale . scaleMode = Phaser . ScaleManager . USER_SCALE ; this . scale . fullScreenScaleMode = Phaser . ScaleManager . USER_SCALE ; window . addEventListener ( 'resize' , ( ) => Boot . mobileResizeCallback ( this . game . scale ) ) ; this . game . scale . onSizeChange . add ( ( ) => { if ( Constants . LANDSCAPE_LOCKED ) { if ( this . game . width > this . game . height ) { this . handleCorrect ( ) ; } else { this . handleIncorrect ( ) ; } } else if ( Constants . PORTRAIT_LOCKED ) { if ( this . game . width < this . game . height ) { this . handleCorrect ( ) ; } else { this . handleIncorrect ( ) ; } } this . game . state . getCurrentState ( ) . resize ( ) ; } , this ) ; Boot . mobileResizeCallback ( this . game . scale ) ; if ( Fabrique . Utils . isOnDevice ( this . game ) ) { document . addEventListener ( 'pause' , ( ) => { this . game . sound . mute = true ; } ) ; document . addEventListener ( 'resume' , ( ) => { this . game . sound . mute = false ; } ) ; } else { this . stage . disableVisibilityChange = false ; this . game . onPause . add ( ( ) => { this . game . sound . mute = true ; } ) ; this . game . onResume . add ( ( ) => { this . game . sound . mute = false ; } ) ; } } } param manager public static mobileResizeCallback ( manager ) { let width = window . innerWidth ; let height = window . innerHeight ; Boot . setScaling ( manager . game ) ; let usedWidth = GAME_WIDTH * Constants . GAME_SCALE ; let usedHeight = GAME_HEIGHT * Constants . GAME_SCALE ; let scaleFactor = 1 ; if ( width > height ) { scaleFactor /= height / usedHeight ; } else { scaleFactor /= height / usedWidth ; } Constants . CALCULATED_WIDTH = Math . ceil ( width * scaleFactor ) ; Constants . CALCULATED_HEIGHT = Math . ceil ( height * scaleFactor ) ; manager . setGameSize ( Constants . CALCULATED_WIDTH , Constants . CALCULATED_HEIGHT ) ; manager . setUserScale ( 1 / scaleFactor , 1 / scaleFactor ) ; } returns { number } private static setScaling ( game ) { let width = window . innerWidth > window . innerHeight ? window . innerWidth : window . innerHeight ; width *= game . device . pixelRatio ; if ( width < 650 ) { Constants . GAME_SCALE = 0.5 ; } else if ( width > 1050 ) { Constants . GAME_SCALE = 1 ; } else { Constants . GAME_SCALE = 0.75 ; } } public preload ( ) { let scale = 'x' + Constants . GAME_SCALE + '/' ; Images . preloadList . forEach ( ( assetName ) => { this . game . load . image ( assetName , 'assets/images/' + scale + assetName + '.png' ) ; } ) ; Atlases . preloadList . forEach ( ( assetName ) => { this . game . load . atlas ( assetName , 'assets/atlases/' + scale + assetName + '.png' , 'assets/atlases/' + scale + assetName + '.json' ) ; } ) ; Sounds . preloadList . forEach ( ( assetName ) => { if ( this . game . device . iOS ) { this . game . load . audio ( assetName , [ 'assets/sounds/' + assetName + '.m4a' ] ) ; } else { this . game . load . audio ( assetName , [ 'assets/sounds/' + assetName + '.ogg' , 'assets/sounds/' + assetName + '.mp3' ] ) ; } } ) ; } /**
     * Load all the assets needed for the preloader before starting the game.
     * First load cachebuster before running Splash screen preloader.
     * The preloader will load all the assets while displaying portal specific splash screen.
     */ public create ( ) { LoaderHelper . hide ( ) ; this . game . state . start ( Fabrique . SplashScreen . Preloader . Name , true , false , { nextState : Menu . Name , showPlayButton : ( window . hasOwnProperty ( 'playBtn' ) ) ? ( window as any ) [ 'playBtn' ] : true , mobilePlayClickhandler : ( ) : void => { LoaderHelper . show ( ) ; this . game . ads . onContentPaused . addOnce ( ( ) : void => { LoaderHelper . hide ( ) ; this . game . analytics . google . sendScreenView ( 'advertisement' ) ; } ) ; this . game . ads . onContentResumed . addOnce ( ( ) : void => { LoaderHelper . hide ( ) ; this . game . state . start ( Menu . Name ) ; this . game . ads . onContentPaused . removeAll ( ) ; this . game . ads . onContentResumed . removeAll ( ) ; } ) ; this . game . ads . showAd ( ) ; } , preloadHandler : ( ) : void => { this . game . sound . muteOnPause = true ; ( < any > this . game . load ) . locale ( Constants . AVAILABLE_LANGUAGES ) ; let scale = 'x' + Constants . GAME_SCALE + '/' ; Images . list . forEach ( ( assetName ) => { this . game . load . image ( assetName , 'assets/images/' + scale + assetName + '.png' ) ; } ) ; Atlases . list . forEach ( ( assetName ) => { this . game . load . atlas ( assetName , 'assets/atlases/' + scale + assetName + '.png' , 'assets/atlases/' + scale + assetName + '.json' ) ; } ) ; Sounds . list . forEach ( ( assetName ) => { if ( this . game . device . iOS ) { this . game . load . audio ( assetName , [ 'assets/sound/' + assetName + '.m4a' ] ) ; } else { this . game . load . audio ( assetName , [ 'assets/sound/' + assetName + '.ogg' , 'assets/sound/' + assetName + '.mp3' ] ) ; } } ) ; Fabrique . Branding . preloadImages ( this . game ) ; if ( Fabrique . Branding . outGoingLinksAllowed ( this . game ) ) { Fabrique . MoreGames . Menu . preloadImages ( this . game ) ; } } } ) ; } /**
     * Hides rotate device image and shows game.
     */ private handleCorrect ( ) { if ( ! this . wasPaused ) { } document . getElementById ( 'orientation' ) . style . display = 'none' ; document . getElementById ( 'content' ) . style . display = 'block' ; } /**
     * Hides game and shows an image asking to rotate device.
     */ private handleIncorrect ( ) { if ( ! this . wasPaused ) { } document . getElementById ( 'orientation' ) . style . display = 'block' ; document . getElementById ( 'content' ) . style . display = 'none' ; } }