Skip to content

How to Use?

Naveed ur Rehman edited this page Feb 5, 2021 · 1 revision

Welcome to the PhaserAssetsLoader wiki!

The PhaserAssetsLoader is a php script that deep scan the given assets folder and generates a js function that loads the following assets:

  • Images (png, jpg and jpeg)
  • Spritesheets (please name your files as: filename@wxhxcount e.g. dude@50x60x3 which means that there are 3 images in the sprite, each 50px by 60px)
  • Audios (mp3, also scans and load ogg if they exist)
  • Bitmap fonts (the fnt file should be accompanied by the png file)
  • HTML files (htm, html)

Since this is a mainly a php script, so make sure that you have php server up and running before using it. The Built-in webserver can serve the purpose: https://www.php.net/manual/en/features.commandline.webserver.php

To run the sever, use: php -S localhost:8000

And then browse the PhaserAssetsLoader.php file: http://localhost:8000/PhaserAssetsLoader.php?folder=[name of the folder having all assets e.g. ?folder=assets]

There are two methods for loading the script file in HTML:

  1. Dynamically: Link the PhaserAssetsLoader.php in the src of <script>. Make sure that the production server can run php files. Example: <script src="PhaserAssetsLoader.php?folder=assets"></script>

  2. Statically: The PhaserAssetsLoader.php generates a static js file that can be linked as well. Suitable for the production servers that does not have php. Example: <script src="assets.js"></script>

Finally, call the function inside the preload of some starting scenes. Eample: ... preload() { PhaserAssetsLoader_assets(this);... }

Example of function code generated by PhaserAssetsLoader.php:

/*This file has been generated by Phaser Assets Loader*/

function PhaserAssetsLoader_assets(obj) {

/* Loading Images */ obj.load.image('imgcircle1', 'assets/images/circle1.png') obj.load.image('imgcircle2', 'assets/images/more/circle2.png')

/* Loading Sprite Sheets */ obj.load.spritesheet('spteyes', 'assets/spritesheets/eyes@10x10x9.png',{ frameWidth: 10, frameHeight: 10, endFrame: 9 })

/* Loading Audio */ obj.load.audio('audhorn', ['assets/audio/horn.mp3'])

/* Loading Fonts */ obj.load.bitmapFont('fntninja', 'assets/fonts/ninja.png', 'assets/fonts/ninja.fnt')

/* Loading HTML */ obj.load.html('htmfrmName', 'assets/htmls/frmName.html')

}

Clone this wiki locally