• Content count

  • Joined

  • Last visited

  • Days Won


tips4design last won the day on August 27 2015

tips4design had the most liked content!

About tips4design

  • Rank
    Advanced Member

Contact Methods

  • Website URL
  • Twitter

Profile Information

  • Gender
    Not Telling

Recent Profile Visitors

1,696 profile views
  1. Best Typescript/Phaser IDE?

    If he uses TypeScript he automatically gets intellisense, no need for another extension.
  2. Best Typescript/Phaser IDE?

    Currently Visual Studio Code is the best IDE for TypeScript by far (it's made by Microsoft, so is Typescript so it comes with default Typescript support). This is a no brainer, go with VSCode and you won't regret it. Get it here:
  3. 500 HTML5 games in 4 years.

    Congratulations, this is really amazing, your productivity is incredible. That being said, I think that for the end-consumer it would be better to have fewer better, more polished games than having hundreds of mediocre games to choose from. I don't condemn what you are doing, it's a great business tactic and you will make many players happy, but I think players would be even happier to also be able to play very polished HTML5 games.
  4. Pixi, create app again after destroy?

    Nevermind, the issue is that the old canvas is still there, so the new canvas is added below it.
  5. Pixi, create app again after destroy?

    I have to destroy a PIXI app and create it later on the same page, but it doesn't seem to work. No error is thrown but it simply doesn't show anything after the restart. Here is the edited basic example ( ): var app; function create() { app = new PIXI.Application(800, 600, {backgroundColor : 0x1099bb}); document.body.appendChild(app.view); // create a new Sprite from an image path var bunny = PIXI.Sprite.fromImage('required/assets/basics/bunny.png') // center the sprite's anchor point bunny.anchor.set(0.5); // move the sprite to the center of the screen bunny.x = app.renderer.width / 2; bunny.y = app.renderer.height / 2; app.stage.addChild(bunny); // Listen for animate update app.ticker.add(function(delta) { // just for fun, let's rotate mr rabbit a little // delta is 1 if running at 100% performance // creates frame-independent tranformation bunny.rotation += 0.1 * delta; }); console.log(PIXI); } create(); setTimeout(() => { app.destroy(); setTimeout(create, 200); }, 1000);
  6. Mask out parts of an image?

    Thanks for your message. I have actually managed to make it work! So, I don't even use a renderTexture, I just add the cut-out sprite with blendMode set to 20 and that's all. One hack I had to make, is that normally the PIXI.Container does not use blend modes unless you add a filter to it. So I added a VoidFilter to the container and the blending mode worked.
  7. Mask out parts of an image?

    Pretty cool, thanks! Is the order preserved? So you add blood, you add transparent texture (that erases blood) and now all the blood sprites that are added on top are not affected by the transparent texture? So, does the blendmoded sprite only affect sprites behind it? And, last question: what if the shape sprites are moving or changing? Do I have to re-render each time to a RenderTexture?
  8. Mask out parts of an image?

    I have a layer (displayobject) with multiple sprites inside. I want to add a circular explosion that would remove the parts of the object they overlap. So, after adding the explosion circle the current display object should. Attached is a picture of what I want to achieve. I know that I could use a black & white mask, where everything is white and the explosion is black so it's masked, but this means creating a new bitmap as large as the entire canvas just to draw a tiny cutout and this would have to be done for each explosion. Also, new sprites might be added after the explosion occurred, so the new items shouldn't be masked by old explosions. The issue is that the background is a texture, not a solid color. If it was only a color I could have simply added a new circle with the background color over the shapes and it will look like a cutout. I think a WebGL solution such as using shaders might be used. Question 1: Can we add a mask in PIXI that says: "hey, keep everything from the original image EXCEPT for the pixels of this mask" ? Question 2: Do you have a better idea of how to create an explosion that removes parts of sprites that already exist and allow for new sprites to be placed over the explosion? What's the most efficient way to implement this? PS: The sprites are actually meshes, I tried converting them to bitmap using .cacheAsBitmap on the mesh, but it seems to be buggy (the quality drastically drops and the entire mesh is actually displaced by several pixels when it is cached as a bitmap).
  9. Phaser and larger-scale games?

    I don't think the game engine is the limit of how complex a game can be. You can create really complex (2D) games with nice graphics in Phaser/JavaScript which if implemented well could be even better than the same game implemented in Unity. So, to answer your question, for sure you can create games with Phaser with hours/gigabytes of content and nice graphics.
  10. Phaser CE examples collection — contributions welcome

    Nice, but why CoffeScript?
  11. Game works better in Canvas than in WebGL

    If I remember correctly, the problem was using system fonts for debugging instead of bitmap fonts. If you don't use a bitmap font each character will have to be re-drawn from the font file each frame.
  12. sceen shot

    What do you mean by screenshot? Like using the Print Screen button on your keyboard?
  13. Head or Body and why

    Are you sure you included main.js after phaser.js in the case when you included both in the body?
  14. HTML5 Gaming Console features question

    What do you mean by gaming console?
  15. Node.js + Redis Server

    What type of game is it? At what frame-rate does it run? How many players are in a game?