JavaHut's Particles (with CloudKid's pixi-particles) (3rd Plugin)

Discussion in 'JS Plugin Releases (RMMV)' started by JavaHut, Sep 5, 2016.

  1. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English


    Particles v1.12 (with CloudKid's pixi-particles)






    By: JavaHut
    Required RMMV Version: 1.3.1+







    Thanks To


    The pixi-particles script comes from CloudKid and is licensed under the MIT license. For more information visit their GitHub link:


    https://github.com/pixijs/pixi-particles


    Introduction


    This plugin allows particle generation within a map. Please refer to the installation and how to guides below to understand how to setup the plugin. There is also a really handy particle editor tool (made by CloudKid) listed below, where you can edit and create new particle data files for your generators.


    Video Demo

    The video demo showcases Explosion, Shockwave, Fire, Rain, Spark, Smoke, and Gas particle generators.






    Download


    Download the scripts here:


    http://www.mediafire.com/download/wu84nadao25b48m/JavaHut_Particles.js


    https://raw.githubusercontent.com/pixijs/pixi-particles/master/dist/pixi-particles.js


    NOTE: For the pixi-particles.js, you may have to right-click and choose Save Link As...


    Download the .json and .png particle files here:


    http://www.mediafire.com/download/qkqqwhg8ysrttgu/particleData.zip


    http://www.mediafire.com/download/b97x65r9dxad0xa/particleImg.zip


    Installation

    -The installation process for this plugin is a little more complex than your average plugin. After downloading the pixi-particles.js file, place it in your project's js/libs folder. Then edit your project's index.html file, and add this line after the pixi.js script tag:


    <script type="text/javascript" src="js/libs/pixi-particles.js"></script>


    -Alternatively, you can download the demo below and use its index.html file.


    -Extract the particleData.zip file into your project's data folder. Extract the particleImg.zip file into your project's img folder. If you choose a different particle data or image folder name, be sure to update the plugin Parameters. If you are confused about the installation process, download the demo below and look through the files and folders.



    How to Use

    -Download the JavaHut_Particles.js file and place it in your project's js/plugins folder. Follow the installation instructions above, add the plugin to the Plugin Manager in your project, and click the Help... button for more info. If you are unsure about a plugin Parameter, double-click the value and read the description.


    -For the demo, download the demo file and extract it to your RMMV Games folder, and open the Game.rpgproject file in RMMV.



    Demo


    Download the demo here:


    http://www.mediafire.com/download/t9xuuo9t7td4qzr/ParticlesDemo.zip


    Note: Do NOT use the JavaHut_Particles.js plugin file from the demo in your projects, as it may not be the most up to date version.


    Particle Editor Tool


    http://pixijs.github.io/pixi-particles-editor/


    Features


    - Create particle generators in your maps.


    - Connect generators to events using event IDs.


    - Generators will follow moving events.


    - Turn generators on and off with plugin commands from any event.


    Author's Notes

    -Please be sure to read the installation and FAQ notes carefully to fully understand how the plugin works and what files must be in place in order for it to work. And remember to visit the Particle Editor Tool link above to create or edit your particle generator data files.



    FAQ

    Files and Folders


    Q. My particle data file is valid, but the particleSet command causes an error, saying the data name is invalid. Why is that?


    A. Make sure you are also placing the names of your .json particle data files in the Particle Data plugin Parameter. They need to be pre-loaded before the map starts up.


    Q. I get an error saying that the image or data file is not found. What should I do?


    A. Check that your particle data and image folders are set up correctly and that the plugin Folder Parameters are set to the correct names. And remember that file and folder names are case sensitive and must be entered exactly as they appear in the project.


    Particles and Events


    Q. Is it possible to change which event a particle generator follows, even after it's turned on?


    A. Yes. Use the particleOn plugin command with the follow argument to adjust the following target. You can use an event's id number, 0 for following the player, -1 for following the mouse, or -2 for following the camera. Omit the follow argument to follow the event that holds the generator.


    Q. Why does my particle generator not center on the event?


    A. Each particle data file contains spawn coordinates that can adjust where the generator's origin is located. Most of the time you can set the x and y values to 24, which is half of the default tile size in RMMV, in order to center the generator on the event.


    Q. Why is the particle generator stuck in the top-left corner of the screen?


    A. If you used an invalid event id for the particleOn plugin command, the position of the generator will default to the top-left corner of the screen and not update its position.


    Q. Why is it when I set a particle's zOrder to be above the character, the particles display underneath the character?


    A. All the generators for a single event can only be in one zOrder location. If you set the first generator to be below on the zOrder, every generator on that same event will have the same zOrder applied. Use multiple events if different zOrders are needed.


    Other


    Q. I'm having a problem getting the particles to render where I want them to because of other plugins I have that add overlay layers. Is there anything I can do?


    A. Use the Below and/or Above Z Value plugin Parameters (or <belowZ> <aboveZ> notetags) to adjust exactly where the layers will render at. Usually, it's the Above Z Value that needs adjustment to get particles to render above certain overlay layers that may be interfering.


    Q. Why won't the particle generator turn back on when the player leaves the scene and comes back?


    A. Every map that turns on particle generators needs to have a call to the particleSet plugin command at the start of the map scene. This can be done with a parallel event that erases itself afterward. See the demo project for an example.



    Changelog

    -Version 1.12: Fixed a bug that prevented encrypted images from loading, and added particleImageLoad and particleImageUnload plugin commands for texture image cache.


    -Version 1.11: Fixed an issue that caused emitters to reset when loading the Menu screen, and cleaned up some code for the plugin and Generator class.


    -Version 1.10: Reworked the emitter object into a Generator class so that other scripts can create varying generators. The class is accessed through JavaHut.Particles.Generator


    -Version 1.04: Added x y width height to particleSet command for spritesheets.


    -Version 1.03: Fixed a bug that caused wrong positioning when omitting a value for the particleUpdate position property.


    -Version 1.02: Added particleUpdate plugin command to update particle emitter after it is set or turned on. Press the Help... button on the plugin to see the details on how to use the plugin commands.


    -Version 1.01: Added -2 for follow argument on particleOn plugin command to allow particle emitters to follow the camera. This is useful for weather effects, where the particles follow the map, but the emitter follows the camera.


    -Version 1.00: Plugin completed.



    Known Issues

    -None at this time



    Latest RMMV Version Tested


    1.3.1


    Bug Reporting


    Please submit any bugs you find in the plugin to this forum post. And, if you have a suggestion for a plugin feature, feel free to post it here. Thank you for your support, and happy gaming!


    Terms of Use & Disclaimer

    -The pixi-particles script is licensed under the MIT license, which means you can use it for commercial projects, as long as a copy of the license is contained within your project. The license is in the JavaHut_Particles.js file for your convenience, but you can refer to the link below for a copy of the license file:


    https://github.com/pixijs/pixi-particles/blob/master/LICENSE


    -This plugin may be used for commercial or non-commercial use, as long as the script file remains unaltered. Credit to JavaHut is optional.


    -JavaHut cannot be held responsible for any damages that may occur from using this plugin in your project. You agree to use this plugin with the acknowledgment that bugs may be present and cause issues within the project that contains it. Thank you for your understanding.



    Modules

    Installing Modules: To install a module, download the .js script file and place it in your project's js folder. Add the module to your Plugin Manager underneath the JavaHut_Particles plugin, then double-click the module and click the Help... button for more info.


    Battle Particles



    Spoiler





    Script:


    http://www.mediafire.com/download/ltrm645nta1drzm/JavaHut_Particles_Battle.js


    Demo:


    http://www.mediafire.com/download/jym4xcq06r66qn6/ParticlesBattleDemo.zip


    To setup an Animation for particle generators, see this image:


    http://imgur.com/iZtSUk7


    Video Demo:



    Spoiler
     
    Last edited by a moderator: Sep 21, 2016
    #1
    Hyouryuu-Na, Kvothe, lmd0013 and 9 others like this.
  2. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English
    Feel free to post your generator data or image files in this forum post. The Particle Editor Tool link in the post makes it really easy to edit/create generator data files for any type of particle generation you need. Thanks to all those who are willing to test my plugins in their projects and give feedback. Happy gaming!


    http://pixijs.github.io/pixi-particles-editor/
     
    #2
    Jonforum likes this.
  3. Archeia

    Archeia Level 99 Demi-fiend Staff Member Developer

    Messages:
    14,579
    Likes Received:
    14,274
    Location:
    Game Dev Salt Mines
    First Language:
    Filipino
    Primarily Uses:
    VNM
    AAa finally thank you!!  :rhappy:
     
    #3
  4. Jonforum

    Jonforum Veteran Veteran

    Messages:
    1,580
    Likes Received:
    1,360
    Location:
    Canada / Québec
    First Language:
    French
    Primarily Uses:
    RMMV
    performance better than the animation tool in rmmv?
     
    #4
  5. Archeia

    Archeia Level 99 Demi-fiend Staff Member Developer

    Messages:
    14,579
    Likes Received:
    14,274
    Location:
    Game Dev Salt Mines
    First Language:
    Filipino
    Primarily Uses:
    VNM
    Particle Engine is different from RMMV's animation tool. :)  


    While you can technically do battle effects and such in Particle Engine, Animation tool is alot more limited and certain uses only.
     
    #5
  6. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English
    #6
    Archeia likes this.
  7. hadecynn

    hadecynn Abyss of Oblivion Veteran

    Messages:
    316
    Likes Received:
    992
    Location:
    Palo Alto, California
    First Language:
    English
    Primarily Uses:
    RMMV
    As a battle animations artist, I am extremely interested in this. Two questions:


    1. Can this be adapted to generate skill animations within battles in real time? If so, how far away from that implementation are we at right now?


    2. Is it possible to simultaneously use different particles and emitters? I don't think I saw an option to do so in the CloudKit platform?


    Thanks!
     
    #7
  8. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English


    It would be a possibility to have a custom animation set to trigger a particle generator to turn on, but it would take me some time to figure all of that out. If you have any ideas on the best way to hook into the battle system to turn on a particle generator, please let me know.


    It is possible to simultaneously use different particles and emitters with the particleSet command. The demo file has an example on the first scene that uses multiple generators for an explosion. Check out the video I posted above for the Bang generator to see that in use. Let me know if you have any other questions. Thanks.
     
    #8
  9. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English


    The new version 1.04 now supports the ability to use spritesheets for particle textures. Here are some examples:


    particleSet 1 above Fire spritesheet 0 100


    That will set the Fire generator to event #1, using the spritesheet.png file for the image, but will only use the sprite at x=0 and y=100 within the spritesheet. See note below for how the width and height are determined.


    particleSet 1 above Fire spritesheet null null 300 200


    That will set the Fire generator, and since x and y are null, it uses the width and height arguments to allow the generator to randomly choose a sprite within the spritesheet for every new particle.


    Important: the width and height arguments are for the entire spritesheet since it has to determine how many sprites to choose from.


    Note: The Sprite Width and Sprite Height plugin Parameters are used to determine the width and height of each sprite within a spritesheet.
     
    Last edited by a moderator: Sep 8, 2016
    #9
  10. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English
    For anyone who is interested, version 1.10 supports the ability to alter the way particle emitters are handled through the new class JavaHut.Particles.Generator. View the lower part of the plugin script for the class properties and methods that can be overridden.
     
    #10
    Archeia likes this.
  11. takashi1kun

    takashi1kun spaghetti god code Veteran

    Messages:
    104
    Likes Received:
    38
    Location:
    spain
    First Language:
    Spain Spanish
    amazing, whit your plugin the possibilities expand to the next level
     
    #11
    Archeia likes this.
  12. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English


    Hey takashi1kun, thanks for the feedback. That effect you did in the video is awesome! Thanks for sharing.
     
    #12
  13. nio kasgami

    nio kasgami VampCat Veteran

    Messages:
    8,590
    Likes Received:
    2,340
    Location:
    Canada / Quebec
    First Language:
    French
    oh I was working on making a particles generator with the pixi-particles engine xD it's seem its got handled


    Although for make the particles not disapears from the maps you could technically append them to the Map_spriteset who registrer the dataMap info without getting destroyed :)
     
    #13
  14. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English


    Hey nio, thanks for the feedback. I will look into the spriteset option. Thanks!
     
    #14
    nio kasgami likes this.
  15. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English
    Please note that the new version 1.11 has had some major changes to the plugin. So, if you are using the plugin and have extended the code in some way, take this into consideration and update to the new version. If you have any issues, please let me know. Thanks.
     
    #15
  16. takashi1kun

    takashi1kun spaghetti god code Veteran

    Messages:
    104
    Likes Received:
    38
    Location:
    spain
    First Language:
    Spain Spanish
    amazing i can maker light whit particles Game_2016-09-18_23-43-45.png Game_2016-09-18_23-52-00.png
     
    #16
  17. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English


    Takashi1kun, that is really cool! Does the light have a shimmering effect? Can you post a video of the effect? Thanks for sharing!
     
    #17
    takashi1kun likes this.
  18. takashi1kun

    takashi1kun spaghetti god code Veteran

    Messages:
    104
    Likes Received:
    38
    Location:
    spain
    First Language:
    Spain Spanish
    View attachment 2016-09-19-0000-52.flv
     
    #18
  19. JavaHut

    JavaHut JavaHut Member

    Messages:
    21
    Likes Received:
    36
    Location:
    USA
    First Language:
    English


    Wow, you're really good at that stuff. Keep up the great work!
     
    #19
    takashi1kun likes this.
  20. takashi1kun

    takashi1kun spaghetti god code Veteran

    Messages:
    104
    Likes Received:
    38
    Location:
    spain
    First Language:
    Spain Spanish
    Is not really much, just a oversized rain efect, it uses the rain particle


    JSON:


    View attachment light.json
    Particle Image:
    rain.png
     
    #20
    Archeia likes this.

Share This Page