Leaderboard


Popular Content

Showing content with the highest reputation since 05/01/20 in all areas

  1. 3 points
    coder2012

    Hangman - Pixijs and Effector

    Hi, I wanted to share a small game I made to try out Effector the state manager with Pixijs. hangman demo I wrote an article about it also Read more
  2. 2 points
    trsh

    Cross origin problems with video

    I needed to add: const myLuckyVideoElTmp = document.createElement('video'); myLuckyVideoElTmp.preload = "auto"; myLuckyVideoElTmp.setAttribute('crossorigin', 'anonymous'); Now it works
  3. 2 points
    Exca

    PIXI Sound mp3 loop 'pause'

    The mp3 looping problem is caused by the format. It can be mitigated by fiddling around the original sound source and compression: https://www.compuphase.com/mp3/mp3loops.htm I'd suggest using multiple formats and drop them based on browser support. Most of the audio libraries have alternateExtension -configuration (or something similar) to handle this. I usually go with ogg as first choice and then mp3 for those that dont support ogg.
  4. 2 points
    Zealot

    pixi-layers : PIXI is not defined

    @charlie_says thank you for your answer, even though it didn't work in my case, it putted me on the way to what @bubamara said, I had actually found the solution but a bad config in my webpack conf was compiling the code in the wrong location πŸ€¦β€β™‚οΈ So yes: simply providing PIXI through the webpack config is the way, thanks everyone for your help.
  5. 2 points
    wincent95

    Pixi.js Showcase

    I built this website that was projected on to a transparent touchscreen for an exhibition at Museum of Science and Technology in Stockholm, Sweden. It might be hard to see in the video but visitors are challenged with a range of ethical questions about technical and medical development at three of these stations. I mainly used Pixi for all the great filters like Pixelate and CRT. It really worked out great! The whole project took 1 month from the first line of code till the premiere. Just when the exhibition launched, the museum closed due to covid-19. Fortunately it’s going to be around for 3-5 years hyperhuman.mp4
  6. 2 points
    Laura

    Generate bitmap font

    If anyone faces the same issues, I have discovered the problem. In the fnt file: <font> <info face="testFont" size="72" bold="0" italic="0" charset="" unicode="" stretchH="100" smooth="1" aa="1" padding="0,0,0,0" spacing="0,0" outline="0"/> <common lineHeight="80" base="57" scaleW="361" scaleH="512" pages="1" packed="0"/> <pages> <page id="0" file="testFont.png"/> </pages> ... On line 2, face="testFont" must match the name from line 5 (file = "testFont.png") Apparently, this undefined size error is a facade for anything that might be wrong with the font file.
  7. 2 points
    Never mind, this can be handled by @expo/browser-polyfill
  8. 2 points
    supertommy

    Graphically debugging physics

    You'll want to set debug to true in your game config for arcade physics: const config = { type: Phaser.AUTO, physics: { default: 'arcade', arcade: { debug: true } } // other settings... }
  9. 2 points
    You can also use an external 2d canvas for a bit more of drawing api. You could even use p5js to draw that, then use that canvas as a source for basetexture.
  10. 2 points
    Colbydude

    Pixel Perfect Fonts?

    Hey all, So I'm wanting using a web font in my Phaser project, but I'm noticing that when using the font in-game, it's automatically applying some sort of smoothing? When rendering straight onto the page outside of the game, the font comes out perfectly crisp when using "-webkit-font-smoothing: none;" See the attachment. I took a look into the Text game object and I'm seeing a "resolution" member, though doing "textObject.resolution = <number>;" doesn't seem to have any effect. Not sure if I need to run an update once I do that though. Do have other options available? Secondly, how do I go about setting the global/default font so that every text object will use the font I specify?
  11. 1 point
    ZeRo000s

    Draw big map pixel by pixel.

    Seems cool i will do my best and update u later :]
  12. 1 point
    ParticleContainer with sprites can survive this. For statics you can also put everything in several graphics instead of 10000. For real static small images you can use pixi-tilemap. I recommend to go through https://webglfundamentals.org/ if you want to understand canvas capacities No, we dont have pixi version of it yet
  13. 1 point
    The<canvas> element is a container for graphics. SVG gives better performance with smaller number of objects or larger surface. Canvas gives better performance with smaller surface or larger number of objects. SVG is vector based and composed of shapes Example of SVG Tags: <!DOCTYPE html> <html> <head> <style> #svgelem { position: relative; left: 50%; -webkit-transform: translateX(-20%); -ms-transform: translateX(-20%); transform: translateX(-20%); } </style> <title>HTML5 SVG</title> </head> <body> <h2 align = "center">HTML5 SVG Circle</h2> <svg id = "svgelem" height = "200" xmlns = "http://www.w3.org/2000/svg"> <circle id = "bluecircle" cx = "60" cy="60" r = "50" fill = "blue" /> </svg> </body> </html> Example of Canvas: <!DOCTYPE html> <html> <head> <title>HTML5 Canvas Tag</title> </head> <body> <canvas id = "newCanvas" width = "200" height = "100" style = "border:1px solid #000000;"></canvas> <script> var c = document.getElementById('newCanvas'); var ctx = c.getContext('2d'); ctx.fillStyle = '#7cce2b'; ctx.fillRect(0,0,300,100); </script>https://hackr.io/blog/best-html5-interview-questions </body> </html> Difference between them: SVG HTML Canvas SVG has better scalability. So it can be printed with high quality at any resolution Canvas has poor scalability. Hence it is not suitable for printing on higher resolution SVG gives better performance with smaller number of objects or larger surface. Canvas gives better performance with smaller surface or larger number of objects. SVG can be modified through script and CSS Canvas can be modified through script only SVG is vector based and composed of shapes. Canvas is raster based and composed of pixel. For more information you can check it out Here.
  14. 1 point
    mircha

    problem in sprite height

    thank you. with using loader my problem solved.
  15. 1 point
    b10b

    Phaser OR Unity For HTML5 Games

    I've been using Haxe professionally since 2008 - it's typically my preference, I'm a little biased? Even if using Phaser or Unity I'd still use Haxe. To ask whether games coded in Haxe work smoothly may reveal a misunderstanding of what Haxe is. Haxe is a language and transcompiler, it targets many platforms and embraces many libraries - it can be used in a multitude of different ways. I especially like Haxe's macro functionality which can set it apart from other transcompilers (e.g. Typescript). In ~2010-~2015 Haxe had a semi-unique proposition for people moving away from Flash (in particular a library called NME and then OpenFL which provides a substitute Flash API for Haxe's none-SWF targets). But the Haxe landscape was and is so much more than that with many dedicated games frameworks ... just as a modern web-game is so much more than a port of a retro Flash-game. I don't apologise for not providing a more specific guide on how to make a game with Haxe. How someone chooses to use Haxe is down to them (it really is a broad purpose platform so must be unopinionated).
  16. 1 point
    lasertown

    pixi-layers clarification

    Ok I think I understand the intention now, thanks Ivan!
  17. 1 point
    ivan.popelyshev

    pixi-layers clarification

    Thank you for that question! Usually people dont notice that its kind of optional feature. Its possible to do everything with just a layer, but you might encounter structural problems. Group is global, you can use it even without any reference to application/stage/whatever. Instead of "element.zIndex=2" you type "element.parentGroup=group2" , group can be used as that number in zIndex, regardless of layer creation.
  18. 1 point
    Alien

    Device orientation

    Thank you so much, Olivier, you are fast! I'll test that ASAP and will let you know how it goes.
  19. 1 point
    qdrj

    [Phaser 3] Bouncy Woods

    Sup my dudes, My latest game Bouncy Woods was released just yesterday on Poki - https://poki.com/en/g/bouncy-woods It was developed with Phaser 3 and MatterJS. Matter was pain in ass to deal with because I really needed "bullet" like bodies for this game and Matter doesn't support it. So sometimes you can notice "tunneling" issue - when balls go through blocks. If you have any feedback or questions regarding the game - please let me know. Gameplay video
  20. 1 point
    Hi, what you can do is use the variable as context without ES6 arrows, something like... var myText = this.add.text( ... ).on("pointerover", function() { this.setTint() }, myText)
  21. 1 point
    ivan.popelyshev

    How to get coords in Filter

    For fullscreen filters pixi uses same coords, so "cont.filterArea = app.screen" seems to solve the problem. Any other sizes, ( whatever container bounds are) temporary textures have pow2 sizes, different from what you pass in u_lightmap - you have to convert "input coords" to "pixel coords" and then to your u_lightmap coords, probably passing dimensions of the lightmap through uniforms. If you want more info on coords, you have to go through https://github.com/pixijs/pixi.js/wiki/v5-Creating-filters . Welcome to the forums!
  22. 1 point
    Exca

    Sprite sheet maximum size

    Anything below or equal to MAX * MAX is quaranteed to work (almost always, unless something is wrong with the gpu/driver). Going over either of those (even if decreasing another) might work or might not work. From the khronos specifciation: "The value gives a rough estimate of the largest texture that the GL can handle. The value must be at least 64. "
  23. 1 point
    8Observer8

    I want to make a leader board

    For example, like this: https://plnkr.co/edit/CJ9iGJr4mkysO5t0?preview <!doctype html> <html> <body> <input id="nameField" value="Enter your name..."> <button id="okButton" onclick="okButton_OnClick()">Ok</button> <script> function okButton_OnClick() { var nameField = document.getElementById("nameField"); var name = nameField.value; console.log(name); } </script> </body> </html>
  24. 1 point
    Thanks, I'll look down Observer route.
  25. 1 point
    Previous thread: Solution: "That is the problem out of scope of pixijs. https://github.com/bramstein/fontfaceobserver/"
  26. 1 point
    Hello and Welcome to the forums! Yes, its that complicated. You didnt mention WebGL objects which are not treated by regular GC, that makes everything even more difficult My usual approach is just let it flow, profile and take memory heap regularly to ensure you are not leaking anything. One rule - dont create new objects every frame, unless its capped by amortization: if you know you will create 100 objects per second, but you want to create 50 of them in this frame - its fine.
  27. 1 point
    khleug35

    I want to make a leader board

    Hello , Are you planning to add online leaderboard or offline leaderboard??? about offline You can try localStorage to save the score. https://www.panda2.io/docs/api/Storage https://www.panda2.io/examples#storage-get about online, you need to use server side programming languages if your game export to mobile device, you can integration Google play services hope can help
  28. 1 point
    Dr Popet

    Canjump - One Button platformer

    I just love one button games, nice game!
  29. 1 point
    enpu

    Splash Screen Removal?

    Look at the Loader class. There is lots of attributes, that you can modify to change the loader appearance: http://panda2.io/docs/api/Loader Also there is tutorial on how to create custom loader: http://panda2.io/tutorials/loader
  30. 1 point
    It is possible to do it. I've found that the Tilemap class has the `createDynamicLayer` method which allows to make a layer from multiple image tilesets. I've successfully implemented it in one of the projects.
  31. 1 point
    did you take a look in some sample projet on codeSandbox? Just in case, sometime people forget search here before. https://codesandbox.io/s/app-architecture-3-t6cfv https://codesandbox.io/s/92qj013rvr?file=/src/index.js https://codesandbox.io/s/km262qnqr7 https://codesandbox.io/s/youthful-hertz-jzl912w7k9
  32. 1 point
    @ivan.popelyshev This is my code for rotation, it might not be the best way to do it but it works. /** * rotate single tile * @param data - Tile Data Id ((Taken from JSON) */ private checkTileRotation(data:number):number { let rotation = 0; if (data & Env.FLIPPED_DIAGONALLY_FLAG) rotation += 4; if (data & Env.FLIPPED_VERTICALLY_FLAG && data & Env.FLIPPED_HORIZONTALLY_FLAG) rotation += 4; else { if (data & Env.FLIPPED_VERTICALLY_FLAG) rotation -= 2; if (data & Env.FLIPPED_HORIZONTALLY_FLAG) rotation += 2; } return rotation; } // In LOOP (drawing) // now remove last 3 bits data &= ~(Env.FLIPPED_HORIZONTALLY_FLAG | Env.FLIPPED_VERTICALLY_FLAG | Env.FLIPPED_DIAGONALLY_FLAG); export enum Environments { // Flags for map -> Tiles (Rotation) FLIPPED_HORIZONTALLY_FLAG = 0x80000000, FLIPPED_VERTICALLY_FLAG = 0x40000000, FLIPPED_DIAGONALLY_FLAG = 0x20000000,
  33. 1 point
    ivan.popelyshev

    Why is this not allowed?

    Good. This technique is used not only in canvas rendering, it will help you in other places too - two big copies flip-flopping data.
  34. 1 point
    @ivan.popelyshev Well, I found plugin Tiled for pixijs, when i already did it by myself πŸ˜„ I also checked viewport plugin but id like to build my own, actually for my game i do not need anything complex. Viewport in 2D is just about pivoting and positioning of the main scene which is actually view. For 3D projection or 2.5d it is much harder. It is not very hard to make own viewport for 2d projection with full support. But there is lot of super cool plugins that i will definitely use like Pixi-Tilemap which is superfast and cool. I'm using it with tiled editor
  35. 1 point
    ivan.popelyshev

    Why is this not allowed?

    you wrote two lines , one makes something that is rendered, second renders. just pass different textures there one tick you'll do texture1->texture2 the second texture2->texture1
  36. 1 point
    ivan.popelyshev

    Why is this not allowed?

    use two renderTextures, one of them is active. re-render one to second. I use that in pixi-layers: https://github.com/pixijs/pixi-layers/blob/master/src/Layer.ts#L68 , however my particular implementation somehow fails in v5, i didnt investigate yet If you learn how to do it with two textures and changing sprite texture every time - you can go even further and try to make a fake texture that points to one or another, here's the trick from the same file: if (group.useDoubleBuffer) { renderer.texture.unbind(rt); this.currentBufferIndex = 1 - this.currentBufferIndex; let buffer = db[this.currentBufferIndex]; (rt.baseTexture as any)._glTextures = (buffer.baseTexture as any)._glTextures; (rt.baseTexture as any).framebuffer = (buffer.baseTexture as any).framebuffer; } anyway, its not possible without two renderTextures. PixiJS does have flip-flopping only in FilterSystem and its not usable outside
  37. 1 point
    ivan.popelyshev

    Why is this not allowed?

    input = output in your case, cant use renderTexture in sprite that is being in the same renderTexture. Its WebGL restriction. use another renderTexture.
  38. 1 point
    Ye, that's why i recommend people to use "screen" (i added that property). Handling resolution is always trouble. Btw, I recommend to look in "pivot" prop too, usually its how i do it: camera.position.set(screen.width/2, screen.height/2); camera.pivot.set(lookAt.x, lookAt.y); camera.scale.set(...); basicaly, you are pinning "lookAt" local coords to position on screen, which is half of screen. It works regardless of scale or rotation, you have guarantee that position in global is pinned to local pivot.
  39. 1 point
    updateCurvePrint(cable, offset) { const curvePrint = [ 0, 0, 0, -90, 0 + offset, -200, // example offset 0, -320, 0, -400 // texture width 400, height 27 ], curve = new Bezier(curvePrint), this.curvePoints = curve.getLUT(30); } createCable() { this.rope = new PIXI.SimpleRope(this.cableTexture, this.curvePoints); } Okay, thanks. But I think this task is very often, so maybe my solution will be helpful for other peoples. I used bezier-js https://pomax.github.io/bezierjs/ to create curves. When curve created, we can get each point of curve and apply to rope. First and last point in curvePrint should be fitted to texture sizes. After that we just create Rope once and call updateCurvePrint each frame, if we want update curve. The rope working with it well enough
  40. 1 point
    Mike Montoya

    Layering a Masked Blur

    Thanks you so much, Ivan! This is extremely helpful! Thank you for all your hard work, so that the rest of us can make cool stuff! I greatly look forward to all your improvements and enhancements - it is much appreciated! πŸ™‚
  41. 1 point
    On both questions: those are questions for author of https://github.com/englercj/resource-loader/tree/release/3.x , @xerver resource-loader is an kind of independent lib, and every time I do any advanced operations with it - I look in the sources (in pixi case 3.x branch), because its really easy to look through it than to ask question of why it was done this way. If you ever made your own loader - it could look like that. Things like parentResource, how load event is emitter are not possible to memorize, its pure experience stuff. The best way to solve issue fast is to go through issues in pixi with that filter: https://github.com/pixijs/pixi.js/issues?q=is%3Aissue+loader+ Pixi is not a black box - you can place breakpoints in certain places, look in sources, add watches, e.t.c. and in loader case its al. The most difficult loader middleware is spine - https://github.com/pixijs/pixi-spine/blob/master/src/loaders.ts , and even with docs that were made by people with experience https://github.com/pixijs/pixi-spine/tree/master/examples - every time something goes wrong and you have to debug it. I dont believe its a fault of resource-loader itself, its just the whole topic of how to load stuff and parse it isn't theoretical, its pure practice and debug.
  42. 1 point
    use pixi-legacy (npm pixi.js-legacy, vanilla pixi-legacy.js file) , it has generateCanvasTexture() - that will be AA-ed in canvas2d
  43. 1 point
    Dr Popet

    Test your Might

    Based on the bonus game of Mortal Kombat 1 I made this little game. I just start learning HTML5 and Javascript and this is the 2nd game I made after I learn about variables. http://c1ic.mx/TYM/ I hope you like it
  44. 1 point
    Potato King

    [Open-Source 2D MMO] Kaetram

    Kaetram Kaetram is an open-source game-engine created to aid those interested in entering the game development realm. The codebase is simple, clean, and intuitive. This project is intended to be used as a learning tool. The original idea is based on Little Workshop's demo game – BrowserQuest (BQ). This game uses original BQ assets as well as custom-made ones. The entire code-base has been written from scratch, using more modern approaches. GitHub Repo – https://github.com/Veradictus/Kaetram-Open Live Version – https://kaetram.com Join us on Discord – https://discord.gg/MmbGAaw Patreon – https://www.patreon.com/kaetram Features BQ was intended as an experiment to showcase HTML5 capabilities, since then, technology has only served to advance. Kaetram contains a lot of ideas and features that builds on top of its predecesor, a couple are: Multiplayer using Socket.IO Enhanced rendering engine (includes dynamic lighting, overlays, animated tiles) Region system (client receives only necessary data and saves it) Questing and achievements system. Plugin-based combat system (for bosses/special enemies). Supports RESTful API. Discord server integration. Cross-server private messaging and interactions. And much more Regions The region system sends data to the client according to the map data of the server. The collisions are checked both server-side and client-side to avoid cheating. The region system makes use of dynamic tiles, which are unlocked according to a player's progress. Furthermore, there is integrated support for instancing, where we can use a section of the map (or clone it) and reuse it for certain groups of players. The instancing is perfect for activities such as minigames, where we will want to run multiple instances in parallel. Tilemap Kaetram is built with modularity in mind, as such, the client supports multiple tileset parsing. The tilemap can easily be constructed using Tiled Map Editor. Using our map parsing tool you can easily export your creation to both the client and the server. Kaetram Hub There is also support for a hub server. This can help connect servers across one another, allowing players to interact with their friends across them in a variety of ways (private messaging and guilds). Furthermore, the hub serves as a gateway for determining what server to place players in. If a server is full, it simply returns another server that has room for the player.
  45. 1 point
    Find https://www.amazon.com/JavaScript-Definitive-Guide-Activate-Guides/dp/0596805527, there are many pirated versions in internets. Learning Pixi+JS at the same time is hard, because PixiJS team focused on clear internal code, not on clear advancement for people without pre-knowledge. To read that code you need some experience with JS, and to advance faster you have to use chrome devtools like professional who already debugged a few projects and has experience with finding strange JS-related bugs. If you need inputs or physics, or something else that pixi doesnt have from default package - i suggest to move to Phaser. You can always move back to pixi when you have more experience and know which things you need
  46. 1 point
    I can't talk about Unity because I don't know it, but AFAIK it currently doesn't generates pure HTML5 code. One needs a plugin to run it on browsers. @Roth You'd better off picking a javascript framework. In this case i highly recommend Phaser.js .js. It is the best 2D framework hands down. If you intend to generate games for MS Windows, MacOS, Linux, Android and iOS, there are tools that allow you generate binaries for these platform from your javascript code. Other frameworks I'd recommend that generates HTML5/javascript framework are cocos2d-x (I'm talking specifically about its tool named Cocos Creator). For the above mentioned frameworks its required you understand how to program in javascript. If you don't know / don't want to learn it, you have other options. Gideros mobile: - its programming language is Lua. Lua is a very easy programming language. It resembles python (but it is easier). Also, lua is the fasted script language. Under the hood Gideros engine is written in C++. You write your game once in Lua and export it to MS Windows, MacOS, Linux, Android, iPhone and to WEB. For WEB, the code generated is WASM instead of JavaScript. It has the advantage of make it harder to retrieve your source code than those written in plain JavaScript. Also Gideros allow minification, compression and encryption of both assets and source code. Its an extra layer of protection that will make reverse engendering harder. I'm learning it since November 2019 and I'm loving it. I highly recommend it. Cocos2d-x also allow you to develop in C++ and Lua. You can export code to Android, iPhone and to WEB (the code generated in this case is in javascript). I'm not sure if it exports to consoles (but I think so). Openfl is a wonderful framework. You will code using Haxe programming language. Think of Haxe as ActionScript 3 on steroids. Openfl exports to MS Windows, MacOS, Linux, Android, iPhone, WEB and consoles. There are a lot of frameworks I didn't talked about. You can search for them on Google. I highly recommend Gideros for those that don't want to code in JavaScript and Phaser for those that want to use it. But in the end, you should study a bit of each framework that you think is nice, make some projects with it and then make an educated decision on which to use. Now that I talked a bit about which tools to use, let's talk about some options on how to make money with game development. 1. Develop games as a freelancer. You can sign-up yourself in sites like upwork, and freelancer and take jobs to make custom games as well as convert games made in Flash to HTML5. Drawbacks: 1.1 you must have a good experience making games in order to delivery what was requested. Otherwise you won't be paid. 1.2 you won't have any rights of games delivered. 1.3 Once a game is delivered you have to look for the next job. 2. You can sell exclusive licenses of your own games. You decide which game you want to do (based on your experience, on your personal taste, on what you think market is demanding, or even by asking directly to probably clients). You have to get in touch with sites like Y8 and deal with them directly. Drawbacks: 2.1 you may develop a game market is not interested in. 2.2 you have invest your time developing a game that may not be sold. 2.3 you have to invest your money buying assets (images, sounds...) 2.4 you have to digg for contacts of clients and sometimes its harder to get them. Sometimes they don't deal with an independent developer. They acquire their games directly from a partner. 2.5 it's a time consuming task to deal with many possible clients. 2.6 the process, from contacting a prospect until get contracts signed and receive the money may take months. 2.7 Your game must be well made, attractive and have a great playability in order to attract attention of your prospectors. The more amateur the game looks, the less it will be worth. Even with all this drawbacks, it's one of the best way to make money. 3. You can sell non-exclusive licenses of your own game. It's very similar to selling exclusive licenses. The differences are that in exclusive licenses the value paid by client is higher but you can sell the game just once and that in non-exclusive licenses, value paid is lower but you can the game many times. Usually you would earn more selling non-exclusive licenses. A very important think you must bear in mind if you want make a living selling non-exclusive licenses: NEVER, EVER sell non-exclusive licenses to game distribution services like famobi, game distribution, gamonetize, and others like them. They will distribute your game to all portals that use their services to get games and you will never be able to sell another non-exclusive licenses of that game. No one will pay for something they can have for free. You were warned! 3 - Monetize your games with ads. It basically works this way: you submit your game to a game distribution service like famobi, gamonetize and game distribution after adding their Ad SDKs. Read what I wrote here: I'm sure that there are other ways to monetize, but those are the ones on the top of my head.
  47. 1 point
    SET001

    topic pending approval

    Guys, who is moderating jobs-hiring-and-freelance ? I posted a topic 20 hours ago and it is still "pending approval".
  48. 1 point
    Exca

    Replacing sprite with one solid color?

    Here you go: var sprite = new PIXI.Sprite(PIXI.Texture.WHITE); sprite.tint = 0xff0000; //Change with the color wanted sprite.width = 100; sprite.height = 100; maincontainer.addChild(sprite); Or if it's something that currently exists you could change the sprites .texture to PIXI.Texture.WHITE and tint it. [Edit]. If you need to have sprite change between normal display and completely tinted then just keep the normal texture stored somewhere and set it back to texture after tinting part is done.
  49. 1 point
    stay

    Xbox One HTML5 Game Dev

    Good to hear! Also note that having a debugger attached at all will have a surprising impact on frame rate on the Xbox One as well. If you ever worry about measuring frame rate, definitely test without the debugger attached. For mouse cursor stuff: navigator.gamepadInputEmulation = "gamepad"; is correct, and doesn't have any dependencies that I know of. I just set it directly, just like that, when my project first starts up (in my init code). (Actually, I set that value to "keyboard" for complicated reasons: It seems the B button by default suspends the app and goes back to the Xbox One Home screen, which is not what I wanted, but seemed to be committed to by the UWP host before I found out about the press through the gamepad API. If I set gamepadInputEmulation to "keyboard", then I also get keyboard events on gamepad button presses, which I can preventDefault() on, in order to suppress that. And the gamepadAPI still works in keyboard mode.) I also turn off scaling and overscan as they propose in the docs ( https://docs.microsoft.com/en-us/windows/uwp/xbox-apps/disable-scaling and https://docs.microsoft.com/en-us/windows/uwp/xbox-apps/turn-off-overscan ) though notice that sometimes the docs don't give you real JavaScript and you have to fix the case. For instance, that second one is really: var overscanDisabled = Windows.UI.ViewManagement.ApplicationView.getForCurrentView().setDesiredBoundsMode(Windows.UI.ViewManagement.ApplicationViewBoundsMode.useCoreWindow); Good luck!
  50. 1 point
    feudalwars

    Creating a mini map in Phaser?

    It's the game world width/height divided by 100 (game.world.width / 100); I should note that my techniques for rendering a mini map have since evolved from the time of my post. I no longer render the entire terrain layer to the map every x number of milliseconds. I do that for units (anything that moves), but for the terrain, I have a simple render texture the exact size of the mini map and render the tiles (transformed to fit the scaled position and resolution/scale of the mini map) whenever a tile changes. However, for the purposes of most simple games, my old technique should do fine.