mattstyles

Moderators
  • Content count

    1,486
  • Joined

  • Last visited

  • Days Won

    13

Everything posted by mattstyles

  1. mattstyles

    Really Basic Setup question

    Ah, I see, without the specific protocol on the remote request it defaults to the protocol you were using, which was presumably 'file://', which, even if you had specified the protocol for the CDN wouldn't have worked anyway. Yeah, localhost has an http protocol so it would then route out to the internet. Good work solving it.
  2. mattstyles

    BabylonJS for ES6

    Modern browsers (and not so modern ones) are almost 100% compliant with the initial es6 specifications, http://kangax.github.io/compat-table/es6/, most are compliant with newer language features as well. Whether they are as performant as the transpiled es5-compliant code is far more shaky ground. Not sure what you mean here, ESLint is for checking certain syntaxes and structures in your source code and informing you of where you contravene a given ruleset. It doesn't do compilation or transpilation. Did you mean another tool? By efficient you should probably clarify that you mean it has a number of sugar methods that make code less verbose (not that verbosity is always a bad thing though). (almost) Everything from ES6 can be transpiled back to es5 so es6 doesn't support anything new, it just has a new syntax making some things a little nicer to write and less error-prone for the developer (the browser doesn't actually care and in many cases the old way is better optimised for the engine, if not for the developer writing it). (I think there are some odd things in the spec like tail call ops which are impossible to shim, but, everything else, including tricky stuff like generators and proxies, _can_ be shimmed, you'd probably never want to write code like that but transpilers can do it just fine).
  3. mattstyles

    canvas drawing to function converter

    This just sounds like you're describing vector graphics. Maybe a search for something like vector to canvas or just vector graphics would throw up some helpful stuff.
  4. mattstyles

    HTML 5 GAME DEVS reputation system

    Almost every app I use has this sort of thing, even with the ability to share your progress or 'compete' against others. Games nicked it from real life and now 'real life' apps have nicked it from games. A lot of the reward addiction stuff comes from gambling, but most comes from getting the best out of employees, particularly those that work in an intrinsically non-motivational environment (some jobs require a lot of 'grind', back in the day this would be done with fear and whips, nowadays we tend to use the carrot more than the stick). Most apps and games nowadays unfortunately use external motivators. These are things like 'play/use for an hour to get rewards' or 'play/use a certain amount of times in a day', they're external because the environment (the game) sets them and you, as a user, are just following along. They aren't particularly effective but they cheap and easy (usually) to implement. Some apps/games go a step further and use the human need for completion against users i.e. if you're on todo item 9 of 10 it'll tend to nag at you to get 9 and 10 finished and squared away. This todo list completion effect is still often implemented as external (win 2 battles today, post 3 times today, learn 3 words today etc etc) but slightly more involved as it uses the incomplete list effect to gain addiction. MMO's are rife for this sort of thing, they'll give you a couple of easy tasks to complete and then some more time-consuming ones when you're already 'invested' in completing that list. Many learning apps (such as language learning apps) do the exact same thing to great effect. Some of the best motivators are internal motivators. Sandbox games that truly are sandbox set out the rules of the world and let you go, they sometimes add reward tiers etc etc but, largely, you, as a user, set your own course of action. There are loads of superb examples in this field but it requires a whole heap more designing than many games go in to (particularly casual gaming, for good reason). Games/apps that leverage internal motivators are usually played by players for a long time (years is common) but its hard to set up world rules that allow for beginner and advanced players to get the same enjoyment, usually they have a steeper learning curve and 'deeper' gameplay. Some learning apps may leverage this type of motivator in some way. Business/lifestyle apps are pretty tricky to get into the internal motivator category as users will already come for a very specific reason, hence, the scope of the app is small and focussed (which is good) but it makes exploration and personal/group goal-setting difficult. Many business/lifestyle apps go down the Weight Watchers style route of group motivation i.e. they can be very aggressive about sharing with a group or competing so that human interaction (rather than app nagging) will keep you engaged and they will reward both the bragger and the supporter in any dynamic.
  5. mattstyles

    simple enemy gameobject in phaser 3

    You might want to look into javascript modules, or es6 modules, or commonJS modules. There are many different articles out there about JS modules. In some ways it ramps up the complexity as you'll need a build system of some sort (modern browsers do all understand es6 modules, but, well, its still tricky) but its easily the cleanest way of modularising a project and the benefits outweigh the costs if you're building anything non-trivial (it is a bit of a ramp up at first, or, at least, it can be, depending on your experience).
  6. mattstyles

    how to call a function as argument ?

    Nah, its not even a scope problem, whatever `myFunction` is in the original post, it wasn't a function. However, I do agree that you don't need to wrap the callback function again, but, you don't even need the `wait` function as it has just become a marginally slower alias. I'm assuming this is all simplified for the purposes of illustration though and that you're actually planning to do more with your wait function (like make it a little easier to cancel it, or extend it, or whatever). Functions in JS can be passed around as first-class citizens, which is an extremely useful language feature. function add (a, b) { return a + b } You can think of the `add` variable as a pointer to a block of code (rather than a pointer to a memory allocation), using newer syntax makes this even more obvious: const add = (a, b) => a + b Where you actually assign the anonymous (lambda) function to the constant variable (ha ha, that proper sounds odd!) `add`. Note: there are subtle differences between the two code snippets above, but you're extremely unlikely to need to worry about it, particularly for pure functions like the ones above. Either way you can pass the `add` function around, including using it as a parameter for other functions. Consider the following: const add = (a, b) => a + b const subtract = (a, b) => a - b const d2 = () => Math.random() < 0.5 const tweak2 = (a, b) => d2() ? add(a, b) : subtract(a, b) Calling the `tweak2` function has a 50/50 chance of either adding or subtracting those numbers, but, imagine we wanted to add other operations: const add = (a, b) => a + b const subtract = (a, b) => a - b const multiply = (a, b) => a * b const divide = (a, b) => a / b const d2 = () => Math.random() < 0.5 const tweak2addsubtract = (a, b) => d2() ? add(a, b) : subtract(a, b) const tweak2addmultiply = (a, b) => d2() ? add(a, b) : multiply(a, b) This is a pretty terse example but you can imagine how this is going to grow. Now imagine you end up changing some of the implementation, would be pretty error-prone. Imagine trying to test all combos, again, a little annoying. However, you could refactor this slightly and use another helper function: const add = (a, b) => a + b const subtract = (a, b) => a - b const multiply = (a, b) => a * b const divide = (a, b) => a / b const d2 = () => Math.random() < 0.5 const tweak2 = (fnA, fnB) => (a, b) => d2() ? fnA(a, b) : fnB(a, b) const addSubtract = tweak2(add, subtract) console.log(addSubtract(10, 2)) // 8 or 12 Now the tweak function can be 'pre-loaded' with functions it uses to operate, which we've passed through. If you're not comfortable with arrow functions then its a little confusing to follow as it uses closure and explicit return to work, but, have a look as this pattern can be generalised to be useful in a wide variety of situations. When you get really good you can do stuff like the following: const isNumber = _ => typeof _ === 'number' const add = (a, b) => a + b const total = compose( reduce(add, 0), filter(isNumber) ) total([1, 2, 'a', 3]) // 6 All functions used here a low-level pieces and trivial to test and re-compose. Unless you're comfortable with passing functions around it's probably a little tricky to see exactly what is going on (there are lots of good places to read up on it though) but you should be able to see that the `total` function can take an array, filter out only the numbers, and then add them all up.
  7. mattstyles

    One more question

    Very little, and nothing that could be construed as PII. Could literally be a single key/value pair in local storage: `consentAll: true`. You must then use that value in subsequent visits to the site to control behaviour (in your case this could be used to turn Admob on or off).
  8. mattstyles

    One more question

    This is an extremely glib statement. FB track users in a myriad of ways, all of which must now be exposed to users, that is extremely beneficial to users of any product. Whether it actually has an effect or not is not yet known, but most companies are tracking how users respond to their tracking preferences (which, in itself, is interesting). The point is that providers are now required to give end users more information about what their product does, this puts these issues in the minds of the end users, which is a good thing as many people are not tech savvy and have little understanding what the implications are for them. Most ignore it completely as they don't understand it, but the point is that many will now start questioning what these things mean for them and that is a wholly good thing. GDPR also covers things like the right to be forgotten (for free) and the subject access request (for free) as well as a host of other things. Whilst annoying for companies and developers most are already compliant with many of the regulations and its a great thing for users. I don't know how it impacts advertising but isn't tracking consent enough? So long as you explain why you are using cookies (or other persistence) and what you are tracking the advertising video bit becomes irrelevant no?
  9. mattstyles

    How do i have a WIlds.io mod ?

    Maybe try asking the author here Or give him a buzz on twitter
  10. mattstyles

    Cannot load new level automatically

    Simplest form of debugging is still throwing in console.logs to ensure that certain code blocks (or lines) are being executed. For example, try adding one in the `showMessageBox` handler where you increment the `currentLevel` variable, you might want one a little earlier too, perhaps at the start of the `endLevel` function to test that your conditionals work and that the code you _think_ is executing actually *is* executing. You can also log at the start of the `startCurrentLevel` function and check what the current level is. All of this can also be achieved by setting breakpoints and stepping through execution (check the docs for how to do this for your preferred browser, all of the modern ones have great tooling for doing this). Most browser let you set a breakpoint on a console log, or you can be heavy handed and place `debugger` in your code, which will trigger your editor to use that instruction as a breakpoint. Plain console logs will probably solve this problem for you (its worth learning how to use debugging tools at some point though).
  11. mattstyles

    When to use a database in a game

    I'm not really saying you do or do not need a database for this type of game, but, if that is all you're worried about then your game (and all of its state) will exist in memory on the server, so long as you can match up a player rejoining (i.e. ensure somehow that the joining player IS the one who just left) you can set their state appropriately, you don't need disk access for that (indeed, the fastest databases are in-memory, most will try to keep as much in memory as possible).
  12. mattstyles

    Convert dpi to pixels in HTML5 games

    dpi isn't a measure of size, so I'm not really sure what you need to do, but, getting the device's pixel density in a browser environment can be done using `window.devicePixelRatio` in all modern browsers. Does that help?
  13. If you're learning, then, yep, do it yourself. However, on the flip side (not you) I find it incredibly arrogant when I hear the advice 'a custom solution will always be best'. (open-source) Modules are often created by excellent developers, usually supplemented by other excellent contributors, tested by loads of other developers using it, subject to years of active development and improvements and solve specific problems with a laser focus. The only advantage a custom solution has is that modules/frameworks usually have to be flexible and generic enough to fulfil a number of use-cases, which compromises their design. 'Besting' all the advantages they bring, however, is no small task, even if your team has greater 'skill' than all those developers working on the off-the-shelf solution, it's potentially years worth of work and incremental improvements which aren't easy (or can be impossible) to replicate.
  14. Very similar to BBTan I've played on mobile (online link here https://www.crazygames.com/game/bbtan-online which is really poor, I just noticed your 99 balls is also on that site)
  15. mattstyles

    mmorpg advice?

    I think we need to be really careful with statements like this. Anything cpu bound and node (being JIT and dynamic) will struggle. Anything io-bound and node performs well. JS (and bare in mind I love JS) is easy to pick up but doesn't help in larger teams or as application complexity grows, and in no way is in 'safe' in the same way other languages are out of the box (C doesn't count here either!). Benchmarks are pretty fraught with danger as they often (despite best efforts) don't model actual use cases. http://attractivechaos.github.io/plb/ This one is incredibly favourable for V8 node (note you can use Chakra or other engines with node if you like) but does show the usual trend of C-like/Java-like/JS/Python/Ruby in terms of average perf (in no way is raw performance a sign of a language's usefulness for most use-cases). https://benchmarksgame-team.pages.debian.net/benchmarksgame/which-programs-are-fastest.html this comparison is much deeper (explore the site, very interesting stuff) but shows the same rough hierarchy as above: C/C-like/Rust Java/Go/Swift then Haskell/OCaml etc ---> there's quite a jump to the next langs JS PHP/Hack/Erlang Ruby/Perl/Python then Lua If you know anything about how these languages work this is no surprise, with the exception of JS which generally performs way better than expected (or, maybe should be expected as it has a monopoly over its execution environment which has seen extensive work i.e. V8, Chakra, SpiderMonkey etc). Note that the first two groupings above are fairly close, the next 3 are all fairly separated in terms of perf, big jumps between each group (the y scale isn't uniform in the graphs in the above link, there is a MASSIVE difference between say, Java and PHP, or, as mentioned here, between C and JS). Note also that TypeScript is an entry in the above linked graphs, this is odd as it has no runtime, there's probably a reason for this (and why its long-tailed) but it might be that JS engines can optimise better based on the transpilation of TS to JS in these test cases. Note also that poorly written C could very well be slower than expertly written Ruby (for example). nginx isn't node. its written in C as its core requirement is performance (and likely other reasons too). https://github.com/nginx/nginx Absolutely nothing will stop you building what you want with PHP. Personally I don't think its a natural fit, neither is Laravel (my knowledge here is limited), but, its a flexible and powerful language and if you're comfortable with it, you'll get it to do what you want. Certainly you'll do it quicker than learning a new language or new patterns/modules/libraries to use that language.
  16. mattstyles

    Really Basic Setup question

    @syntaxidermy You're loading Phaser from an external source, although I still have little idea why it doesn't work for you, the following is fine for me: I'm not using WAMP though, but a different server. It shouldn't make any odds though, but, in any case, you're not loading from the remote source for some reason, doesn't look related to your HTML though. You do get that EXACT error from file protocol though which won't access the internet. Are you absolutely sure you're hitting the WAMP server to grab the HTML file? Using `script src='./phaser.min.js'` should work from file though, not the `./` to make it a relative link.
  17. mattstyles

    mmorpg advice?

    Yeah, your thoughts are totally correct. Use any language you like on the back-end. You have to use JS on the front-end (or transpile to it) but on the server use whatever you're comfortable with. Most people here are really comfortable with JS so it makes sense to use the same tech across the stack, if you (or your team) are equally happy in other languages then use what you like. The only place where there is an advantage to use JS everywhere is for universal (or isomorphic) apps where having the exact same code run on client and server is advantageous, if this is a requirement then re-writing algorithms in 2 languages is a painful overhead. However, for your use-case this probably isn't a concern. JS is quite an attractive case when your logic doesn't require super-high efficiency (JS is interpreted so isn't the fastest) but any perf is IO-bound, which is usually the case when you're pinging lots of messages around. Many of tech open up separate threads for requests whilst JS is single-threaded and for very short lived connections the overhead of opening threads isn't worth the advantages so a language with a tight event loop (such as JS) sometimes actually comes out on top.
  18. mattstyles

    Organising Code

    There are linters to help with code style if you're really worried about conformity. There are also off-the-shelf linting rules (like Standard, or XO, etc etc etc). I wouldn't worry about it too much if I were you, consistency in your own code base is more important, linting does (of course) help enforce that, but I wouldn't worry too much. You might want to solve the 'all code in one file' problem though. None of the solutions are super easy though unfortunately. Just try googling, nothing is Pixi-specific, so just general JS googling will throw up plenty of hits, then start a discussion here about it.
  19. mattstyles

    Learning Paths

    A great question. The initial learning curve for creating any sort of application, particularly a game, is very steep, but, thankfully, there are loads and loads of information out there. Once you have the basics down you'll want to do more stuff, now the info out there gets a little thinner. Hopefully in step 1 you learnt how to find the information you need and how to read it and implement it, you'll need those skills in this 2nd step. During this 2nd step you have a lot more info inside you so you should have a better understanding of the problems you're facing and when you can't find a way to proceed you start needing more human intervention, so this means you need to be able to ask the right questions. Forums like this one, or using Stack Overflow, should be really helpful as they'll give you access to more experienced devs who, if you ask the right questions, will hopefully help you out. Other things you can do during this step: * Hopefully you have a job coding, this will be helpful because hopefully you're at a good company where you will have mentors. Doing something for 8-10 hours a day with guided help is pretty crucial. If this is a hobby then finding a real human to mentor and help you is harder. * Find a human to mentor and help you! See point 1! Use forums and other online sources like Stack Overflow to help. A real human you can have a coffee with is best, but, a human behind a keyboard is still very useful, even if its only via a forum or blog post. * Start finding some devs who are doing what you want to be doing and writing about it. Blog posts can be variable in quality so try to find a few devs who regularly write top-quality stuff (hopefully covering stuff you want to do) and follow them, ask them questions if you can. Twitter can be useful here as its usage is high amongst developers and devs are generally very shouty these days, put another way, blog posts can be very time-consuming to write properly so naturally the author will want to shout about it to get an audience, thankfully they're often very receptive to critique and questions, some are even paid to do so! Find them and follow them! * Write as much code as you can. Hack together games if that's your thing. Create scripts to help you do stuff, like firing up a local server or transforming a json file. Anything. Do it all. Write as much code as possible. Care little if things work perfectly, care a little more that with each app/script/game/thing you create your coding skill increases. After a while you'll get good enough that you'll really know when your code improves (at first you won't, and a little later on you might get the Fear about whether you're actually improving, don't worry about either of these states right now, just keep coding!). * Npm is a package manager for node primarily, but, is now fully utilised by many a front-end JS developer as well. These are all free and open-source modules, which means that most you can poke through the code. Do this. You have access to code that older developers could only dream of having access to. Reading code (particularly complex fully-formed code) is tricky, but its a crucial skill. Don't worry if you get lost at the moment, keep going. It will be an invaluable skill later on. * Many games posted here and elsewhere are open source and so you can have access to the source code, often via Github. Look through. Fully-fledged games are not easy to read the source code to without instruction, so, make sure you practise your code-reading skills by looking through smaller modules (i.e. via npm) and persevere, maybe you can find where an RPG game initialises objects or the map, work from there, maybe you can find where collision logic is in a side-scroller, at this stage just being able to follow through the source code will expose you to lots of different ways of doing things. * Maybe there is an open-source project you could contribute to, such as Phaser, Pixi, Babylon or the other projects that have a home on these boards? Small documentation amends are extremely welcome by most maintainers and will help you dip your toe in to the water before trying to dive in to fixing/improving the code. --- Good luck in improving your skills, sounds like you have already set out on the right path. Never stop asking questions, never stop learning. It's a long, but rewarding path. Don't take short-cuts. And always, always make sure you're enjoying it!
  20. mattstyles

    I need you.

    What does the `updateScore` function do? When do you call `textChange`? How I imagine something like this would work: * Game renders * User input, play the game * Game renders, this top bit is a loop * When the user does something, then somehow you update the score, maybe you call `updateScore`? * When the score has been updated you want to check if you should change the text, maybe by calling 'textChange`? * This checks the current score and calls `updateText` if necessary * As the game is on a loop, the game will render and the text on screen will have changed There are lots of ways to accomplish the above steps, but I imagine pretty much any way of doing it will do roughly those steps, probably in that order. I think that maybe you're not calling functions in the right place, or, more accurately, at the right time.
  21. mattstyles

    Game list of phaser games

    I heard a great story about a guy who ran regularly and always wore neoprene gloves, one day he sees a dog way up ahead drop a log on the pavement and watched the owner have a sly look around and just carry on walking, so, he scooped it up, tapped the owner on the shoulder "excuse me, you dropped this" and dropped the poo straight in her hands. Not sure if it helped her learn the error of her ways but amusing anyway! Nice work on the game, reminds me of BC's Quest for Tires! I played that a LOT back in the day!
  22. mattstyles

    Phaser 3 (ES6) Boilerplate with Parcel

    Nice. I've been using Parcel a little bit recently, very impressive. Not sure the Hot Module stuff will ever work properly with a canvas-based app, it probably could somehow.
  23. In theory dynamic resizing is actually easier with the DOM, canvas can scale easy enough but that usually isn't very helpful, i.e. even if its just a button you'll probably want the font size to be consistent even if the button changes size slightly over a range of different sizes (obviously at some point that breaks, but, again, its likely easier to deal with in DOM). Depends largely on how complex your UI is.
  24. Generally speaking HTML and CSS is pretty good for laying out UI's, far from perfect, but generally easier than a canvas alternative, particularly for dealing with different screen sizes. Having said that, take your specific use-case and skillset in mind. Are you already a dab hand at HTML/CSS and 'webby' style UI layouts? Does your game require complex UI elements? If yes to both then using HTML elements might be your best bet, maybe using a framework/library to help so you don't have to deal with the DOM too often. Are you new to HTML but comfortable with canvas rendering? Does your game just need a few UI elements? Does your game need every ounce of performance? If yes to these then maybe just using the canvas will be more comfortable for you, there are a couple of libs out there to help, some (I think) specifically for Phaser. Using HTML and CSS for layout stuff usually works out easier but bare in mind you will incur a bit of a perf hit from elements above (or even below probably) the canvas as the compositor and browser rendering functions will have to do a little more work than just pasting the canvas. Also bear in mind that DOM rendering libraries (such as Vue, Angular, React etc etc) are built more for ease of use than performance (perf is a concern, but frequently updating elements aren't a big one). If you think your game will struggle at all for performance then get your most complex 'scene' up and running, test it, then test whacking some DOM elements above it and test it again to see what the impact will be for you.
  25. mattstyles

    Alternative HTML5 Platform to Adobe Air?

    This is always tricky unless you're happy that each mini-game lives in the main code base. There's no issue with just loading the swf in to the DOM though, ditto for loading up an iframe pointing at your mini-game, although in both cases communicating between the mini-game and the main app will need working out. For iframes this isn't a major problem as there is a browser api for comms between host and iframe, for the swf object though...