• Content count

  • Joined

  • Last visited

  1. Hey @samme; Just a question: here you're using Layer.resize alone; but have you ever used it in conjunction with the code you're using here? : I tried it and having the scale manager set as RESIZE makes the zoom code scale the whole of the game window inside the window.
  2. Load many videos efficiently

    Yes, Alex_h has the right answer, even outside phaser, you rarely have the server feed the video directly to the client, it's much easier to use a third party website like youtube or vimeo and tweak the embed settings to make it less "youtuby"( removing the logo, the differents icons that make it immediatly recognizable as youtube). The reason being, the folks over at youtube/vimeo/etc have specialised in their domain and they'll provide you with a much better service than you could hope to code, that, and letting their servers do the heavy lifting on the videos will free up a lot of your server's ressources. The museum might not be so happy that the videos are on youtube or on another "public" website though, you can make them private so that only people with the link or only embedded videos can be seen, but the video will still be made accessible.
  3. How is this JSON file created?

    The JSON file is likely containing information about the different frames that make the dragon animated. You don't have to use it, you could use phaser.sprite as well, there's probably more documentation and forums posts on using those than on creature. Just my 2 cents.
  4. Have a look at the Phaser.tileMapLayer and Phaser.tileMap documentation, there are methods for obtaining the coordinates and tiletypes of tiles. The next step will probably be using phaser.rectangle in coordination with the pointer to select groups of tiles.
  5. Tilemap "Zoom" Camera Issue

    Basically, if you have this set this.scale.scaleMode = Phaser.ScaleManager.RESIZE; then you you get scrolling bars on zoom, it resizes the game area. Something strange I noticed is that if you don't call a specific scalemode and use the zoom then resize the window, the game is suddenly very large and scroll bars appear. How do you handle responsiveness and resizing in your games @samme? Thanks
  6. The Phaser 3 Wishlist Thread :)

    Definitly agree with this, as someone that has been learning Javascript along with phase; the information is there, it's just spread everywhere between the forums, the git, and the examples ... etc, some of which are broken and outdated. And there's nothing on the best practices of phaser. Collecting all the info into one, easibly navigatable and well built wiki would be really gamechanger.
  7. Tilemap "Zoom" Camera Issue

    Hey @samme; I've managed to implement this fine but there's a few remaining issue that sprung up. Like the OP, this technique makes bars appear on the side of the rendered element when zoomed out, so I call resize on the tileMapLayers every time updateDimensions is called . The problem is that is too expensive as a call, seeing as the zoom feature is for an turnbased strategy game; the player is going to be zooming all the time, and I noticed It makes the display choppy when the tiles become small and phaser is rendering a lot of them: 120*120 ( 14400 tiles). Moving the camera around on the map becomes tedious and choppy. I'm wondering what I can do about that other than limiting the scale factor? The other issue is that I've got a HUD with buttons whose positions are relative to and height, so when I scale the renderer, so does the HUD, which isn't wanted. I'm not final on implementing the HUD with phaser and i'm wondering if I could get a plugin to do it for me, but that's not really what I had planned. Another thing is that this implementation seems to break the responsiveness I had going with this snippet resize: function (width, height) { // If the game container is resized this function will be called automatically. // You can use it to align sprites that should be fixed in place and other responsive display things. console.log('Resizing...') terrain.resize(, terrainPop.resize(, terrainCons.resize(, menuX =; menuY =; buttonGroup.x =; buttonGroup.y =; }, When the window resizes, it reverts back to the original renderer scale. Any idea on code that would keep the responsiveness? And for HUDs do you use a plugin? Thanks a lot for helping me out
  8. Tilemap "Zoom" Camera Issue

    Hey@samme, That's neat, and produces quality zooming without too much memory use compared to resizing the tilemaplayer each time. I've been trying to implement it on my end and all i'm getting is a scaling of the game window itself. It's been driving me mad, The tilemap doesn't scale, but the game bounds inside the browser are changing on the calling of the tween, and I can't figure out how it works in your example. Would you mind breaking it down a little more? like setting the scaling on a key maybe? Thanks, Bab
  9. Tilemap "Zoom" Camera Issue

    I'm still looking into this, the above code doesn't work, "this.renderer is not a function" How do you proceed for zooming @feudalwars?
  10. Tilemap "Zoom" Camera Issue

    So, how would you go about this? Put it in an update function linked to the zoom key event for example? Something like this? update: function () { if (this.input.keyboard.isDown(Phaser.Keyboard.Q)) { terrainScale += 0.05; this.renderer.resize(terrainScale,terrainScale) } else if (this.input.keyboard.isDown(Phaser.Keyboard.A)) { terrainScale -= 0.05; this.renderer.resize(terrainScale,terrainScale) } },
  11. Tilemap "Zoom" Camera Issue

    I've also been having this issue; the function .resize works perfectly well for resizing the browser window and having the content of the tileMapLayer adapt to it, but it doesn't work as it i'd like it too after the scaling that supposed to be a zoom, like the original commenter said. bars are appearing on the sides; this only happens on the zooming event; i'm wondering if this has something to do with cropRect, or the size of the tilemapLayer inside the element. I'm going to try going through this to find a viable; easy, snippet applicable to all code bases for doing this with the latest phaser
  12. Figured it out: add to your resize function tileMapLayer.resize(, To recapitulate: Code snippet to use in case you want a game that is : Fully Responsive Doesn't scale on resize, but instead shows more, or less, of the world. (RTS style) uses a tilemap and tilemap layers. resize: function (width, height) { // If the game container is resized this function will be called automatically. // You can use it to align sprites that should be fixed in place and other responsive display things. console.log('Resizing...') this.scale.scaleMode = Phaser.ScaleManager.RESIZE; // this is the scale manager mode designed specifically for this. this.scale.pageAlignVertically = true; this.scale.pageAlignHorizontally = true; tileMapLayer.resize(, tileMapLayer.resize(, },
  13. I've also noticed that If I call the create function again in resize; I get the wanted behavior; meaning the tilemap view resets just as I want it; but that not good for me, since it recreates a cache over the user's already done map. I would be very grateful for some help cause right now I've been going at this all day and I'm going crazy You can test it at this address:
  14. For reference, i'm looking for the same style of handling on window than this game has: Run Pixie Run by Goodboy Games They are rescaling the whole game when the windows is scaled vertically, but only show less of the game on horizontal resize; which is what I'd like for both my horizontal and vertical resize.
  15. Hello everyone; I'm currently making a part of my game, the level Editor, using phaser. I'm using tilemaps and tileMapLayers to fill the gameworld, and filling one of the layers with a default water sprite to show that. I'm creating the Tilemap larger than my game window can render, and using the camera and keyboard keys to move around in it. I've got a function that is called upon resize of the window, to resize my game.width, and game.height so as to have it always be at 100%, filling the browser window. But when I resize the window, the game gets resized, but not the rendered tilemap; tileMapLayer Some images to explain: This is a game instance created in a sized browser window, buttons.x and .y are given using coordinates relative the game x and Y This is the game after the window has been resized; as you can see; the game does resize; and even shows elements that were created out of the original bounds; but the tileMap isn't updating. I don't want it to stretch or scale the original represented world; I just want it to show MORE world. Like it's doing with the rest. Here is a gist to show the code used in the editor state: gist And this is the code I use in the resize function. resize: function (width, height) { // If the game container is resized this function will be called automatically. // You can use it to align sprites that should be fixed in place and other responsive display things. var height = window.innerHeight; var width = window.innerWidth; menuX = width menuY = height = window.innerWidth; = window.innerHeight; this.scale.scaleMode = Phaser.ScaleManager.RESIZE; this.scale.setShowAll() this.scale.setGameSize(window.innerHeight,window.innerWidth) this.scale.pageAlignHorizontally = true; this.scale.pageAlignVertically = true; console.log('resized.') =; =; }, I've tried altering tileMapLayer._mc.renderHeight because that's the only value that actually show the window height in terrainMapLayer but it doesnt change anything to the rendered view. I've looked into this thread, couldn't get it to work either. What's strange is that, the game.width is visibly altered on resize, but doesn't update the tilemap shown ... Those anyone know what setting I need to pass to get the tilemap/tilemapLayers to show more of themselves? Thanks