Popular Content

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

  1. 2 points

    Cross origin problems with video

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

    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.
  3. 1 point
    GameDistribution had updated the developer guidelines. "Buttons, images, and texts sending users outside the game to other websites, social media platforms, and app stores, or pushing downloadable content, are by default not allowed, unless specific consent has been given under the terms of the partnership.". I think it's time to say goodbye to GameDistribution now. What's the alternative for GameDistribution?
  4. 1 point

    Draw big map pixel by pixel.

    Seems cool i will do my best and update u later :]
  5. 1 point

    Draw big map pixel by pixel.

    Okay, thank you :] it draws only visible chunks so its not that hard i guess! i made it kinda faster by using faster bilinear interpolation (calculate edge values and use this values to calculate other pixels values faster). im making rn a simple search algo that find rectangles with the same color and draw them instead of drawing it pixel by pixel :] im not sure you understand what i want exactly i want accelerate drawing the map by using webgl if possible bc drawing using fragementshader is pretty fast but it keep drawing it again and again every frame , i will maybe use fragementshader to draw chunks incase i add some animations like water level changing!
  6. 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
  7. 1 point

    physics library

    I meant that problem usually to set up physics lib for your game , its not hard to connect pixi to it
  8. 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.
  9. 1 point

    problem in sprite height

    thank you. with using loader my problem solved.
  10. 1 point

    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).
  11. 1 point

    pixi-layers clarification

    Ok I think I understand the intention now, thanks Ivan!
  12. 1 point

    pixi-layers clarification

    I'm confused as to why someone would create a group and layer rather than just a layer (which will create a default group if none is given). This part in the documentation I think explains it, but I don't get what's being said: Can someone clarify how this API was designed, or clarify when someone would need a Group to "move between stages?" I'm not exactly sure what this means. Thanks, Mike
  13. 1 point

    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.
  14. 1 point

    Device orientation

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

    Tint missed up in bobs

    Hi, just trying to bring some more light if it helps... Another solution I guess: var value = 0xff0000; var color = (value >> 16) + (value & 0xff00) + ((value & 0xff) << 16) Looks that this is what it's being applied in the sources... https://github.com/photonstorm/phaser/blob/v3.22.0/src/gameobjects/components/Tint.js
  16. 1 point

    PIXI Sound mp3 loop 'pause'

    using m4a instead is the workaround
  17. 1 point
    Well that's embarrassing, since the buttons I have are all at the bottom of the screen then drawing things at 200,200 (I thought it was abs pos) meant that they were completely off the canvas.
  18. 1 point
    Sky Alpha

    [Phaser 3] Bouncy Woods

    It's a very nice game, I already can see millions of people playing it.
  19. 1 point

    [Phaser 3] Bouncy Woods

    Fantastic! Polished, juicy and beautiful. Really liked a graphic style! 😍
  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

    Phaser OR Unity For HTML5 Games

    I translated the Phaser 3 example from the Buttons In Phaser 3 tutorial to TypeScript and placed it on Playground: https://plnkr.co/edit/HaC3iIB0eQG1vilq?preview
  22. 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.
  23. 1 point

    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... }
  24. 1 point
    Edit. Payment Complete Thanks.
  25. 1 point
    Hi, i want to be a html5 game publisher for my new app. I've contact with some of developers (famobi, gamepix etc) and most of them wrote me for payment i have to send them invoice. Does anyone know how will i send invoice? what i need for it? thanks
  26. 1 point
    Sorry for my late reply here, guys. Haruka, you have my e-mail please reach out to me directly. PJ I will reply to you in private.
  27. 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
  28. 1 point
    EDIT: Checked my account and they actually paid me the November earnings in January. So they are still paying actually. At least to some of us... I think they will pay the publishers as they are more dependent on them. If you are a developer, you are probably out of luck.
  29. 1 point

    topic pending approval

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

    Xbox One HTML5 Game Dev

    I've been having some fun playing around with Xbox One HTML5 game development the last few days. Is anyone else doing this? I thought I'd share what I've experienced so far. * Setting up my retail xbox as a dev kit was not too bad. Following the online docs rather than the on-xbox prompts worked better. I already had a windows developer account. * I've signed up for the Xbox Creators Program, but that hasn't mattered so far - I think it'll only matter if (A) I want to access more xbox-specific APIs, and (B) if I want to release a game in the Xbox store. * Making a universal windows app out of an existing HTML5 project was OK - The way I like to arrange things means I have to wrestle with VS2017 a bit to keep it from thinking it is in charge of my project from now on, but actually getting the game running is straightforward. I found this to be true with Win8/Win10 html5 development as well. * With Windows app development these days, HTML5 and Javascript are first-class citizens. I can do anything I've needed to do, including all the regular HTML5 stuff I'm used to (fancy canvas stuff, gamepadAPI, etc.) as well as system-specific things like user account info. * After setting up the project, the process of launching on Xbox One was a little fiddly and flaky, but it's working well now. My game runs, displays everything correctly... * The development setup is actually pretty slick. You can point a browser at your newly enabled dev kit and get performance charts, memory usage, screen captures, etc. (It's a little inconsistent and not always functional, but when it works, it's neat). * I followed some documented instructions for turning off (in code) overscan and scaling, which was not as easy as expected (some API object names have different upper/lower case than documented), and I can run at 1920x1080. * I'm running at 60fps normally, though I found some cpu-intensive calculations slowed the system down to 10fps at one point. Everything looks smooth, though I'm suspicious of a tiny little hitch in one evaluation I did that seemed like it might be a regular garbage collection issue I used to see in some other Xbox-related work I did a while back. * I'm doing all this work in a custom engine of mine, and most of my engine is working great on the Xbox, including a ton of custom canvas stuff, audio, gamepadAPI, some server interaction with POST calls, and pretty much everything I expected to work. It's very much like an Edge-hosted web page, with some extra APIs. I'd love to compare notes with anyone else doing this! Lots more info on various pages connected to this page: https://docs.microsoft.com/en-us/windows/uwp/xbox-apps/getting-started
  31. 1 point
    @KoolieTheKangaroo just use dark tint. https://github.com/gameofbombs/pixi-heaven
  32. 1 point

    Prevent game stopping on tab switch

    There’s nothing you can do. The browser halts Phaser, it doesn’t do it itself. You ought to pause the game fully if they switch tab and resume when they come back. If this is an IO game and you want it to not pause then you’ll have to work out for yourself how to pause and resume in a seamless way, because the browser is going to halt phaser regardless.
  33. 1 point

    Collider in group does not work

    Don't add the collider inside the socket function, or it will create a brand new collider ever time that function is called, which I'm pretty sure is not what you wanted. Instead, try and get it working without using a Socket connection at all - do the bombs work locally? If so, I think it's likely just a scope issue.
  34. 1 point

    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?
  35. 1 point

    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.
  36. 1 point

    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!