• Content Count

  • Joined

  • Last visited

Everything posted by lukaMis

  1. Tweens and physics do not mix particularly well. If you use physics system you should move your objects with physics forces not tweens. If you need physics just for collisions u can use overlap instead and move objects with tweens.
  2. You are starting P2JS physics system and than checking for collide with arcade physics system. You can only have one system active in Phaser.
  3. Yes. You get images in your code from file-names of images in atlas not coordinates.
  4. Give them images correct file names before you pack them in atlas (blue.png, red.png, green.png) then you can reference them with that names. // (x, y, atlas_key, name_of_image_in_atlas) this.mySprite =, 0, 'atlas_key', 'name_of_image_in_atlas');
  5. lukaMis

    where to start? good luck, and have fun.
  6. I use Prepros. It has checkbox that you check for transpiling to es5.
  7. This time i made demo in english. link: This game is part of our html5 powered textbook for seventh grade of primary school. It is a serious game as it uses game-like mechanic to teach chemistry. It is made with html5, css3, jquery... no Phaser here. Goal is to find all the hidden words by clicking on letters. (Do dragging, we support touch and mouse enabled devices.). Can you find them all? Texts are supplied via json, that means i can just load different words or different language or different subjects (physics, biology, ...)
  8. = true; Can that be set in like Boot state or it needs to be in main game state?
  9. lukaMis

    GUI - Html or Canvas

    It depends how much gui you have. A few buttons are easier wth phaser alone. If you plan dropdown menus and off-canvas navigation than css3 is your friend. Here is example that has gui in html&css3 and phaser for animation render. (Spoiler that is mine): There are no problems with mixing dom and canvas... Just structure you code appropriately. Phaser and jquery have very different ideas about code organization.
  10. I was not thinking global globals like old school but one global object to namespace everything. Like this var MyGame = MyGame || {}; = new; MyGame.triggerUi =function () { // do UI magic here } ; Atm I structure stuff like this. As I am Always looking for better options that is the reason I started this topic.
  11. Interlocking would be great, i agree. Our designer has chosen wrong gears i guess. Gears of different sizes rotate with different speeds. That is all there is to it. This is part of our html5 powered textbook and serves as simulation/aide/presentation for teacher when he/she explains this stuff to pupils. This is finished and in use.
  12. Where ever you set the x and y of a sprite. Just do this: mySprite.x = Math.round(value): mySprite.y = Math.round(value): or mySprite =, Math.round(value), 'key');
  13. You can just not tween rotation in some tweens or if you must you can save and pass it in tween: var _angle = this.mySprite.angle; this.mySprite.moveTween = { x: some_value, y: some_value, rotation: _angle }, 1000, Phaser.Easing.Sinusoidal.InOut, true); or you can save it as property of your sprite and tween it this.mySprite.myNewAngle = 90; this.mySprite.moveTween = { x: some_value, y: some_value, rotation: this.mySprite.myNewAngle }, 1000, Phaser.Easing.Sinusoidal.InOut, true);
  14. When you use atlas there is an additional argument you need to pass to add sprite function: // (x, y, atlas_key, name_of_image_in_atlas) this.mySprite =, 0, 'atlas_key', 'name_of_image_in_atlas');
  15. I am sorry it is not in english. (It is translation ready via i18n.js but we only have slovenian texts so far). link: Goal is to rotate gray gear in the direction of its arrow using other gears and / or strap. Blue gear is starting point but you can not put strap directly on the two gears. There need to be some in between. You need to place gear from the left close enough to a rotating one so it will start rotating to... You have different size of gears (they rotate with different speed), strap icon and clear area icon. It is simple.... It is made with Phaser. This is part of our html5 powered textbook for fifth grade of primary school.
  16. How can path be predefined and dynamic? Mybe write what are you trying to do and post whole code sample.
  17. Isn't using game engine for an online ad an overkill? Phaser alone is over 700kb.
  18. Anyone doing ui in html over phaser canvas? If so how do you connect ui elements and methods in phaser states? Do you use one main global object?
  19. I use it mainly for let in for loops over var and fat arrow anonymous functions as they now what value of this should be so there is no need for shenanigans of type var self = this before set function.
  20. Sublime text 3 Prepros Source tree Phaser, create.js, jquery, tweenmax, snap.js, ... Sass Texture packer
  21. If you are unwilling to set up yor own local server you can use code editor that has one build in. Brackets comes to mind. Or you can use develompent app on steroids called Prepros.
  22. I am sorry it is not in english.(It is translation ready via i18n.js but we only have slovenian texts so far). link: Well technically not a game but simulation. Point is to show that An atom is the smallest unit of matter that has the properties of an element. It is composed of a dense core called the nucleus and a series of outer shells occupied by orbiting electrons. The nucleus, composed of protons and neutrons, is at the center of an atom. In menu on the left user select what atom he or she wants to see. Under options there are several things to enable,/disable. Top bar displays selected atoms properties. This simulation is part of our html5 powered textbook for seventh grade of primary school. Background animation is powered with Phaser, menu is in DOM using css3 goodies. @rich Phaser is so fun to work with. I do not miss Flash at all. Tnx man
  23. Looks really nice. Is this trailer music or ingame music also?