-
Notifications
You must be signed in to change notification settings - Fork 0
How to Use?
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:
-
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>
-
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')
}