lodash from pairs method and vanilla javaScript options

In lodash there is the from pairs array method that can create a new object where each key is the value of the first element of a nested array in an array of arrays, and the value is the second element of an array nested in an array. It is the inversion of the lodash to pairs method that does the opposite of this by creating such an array of arrays from an object.

Although that might sound like a mouthful if you take a moment to look at some quick code examples you will find that this is not something that is all that hard. In addition this is one of many lodash methods where doing the same with plain old vanilla javaScript is pretty quick and easy. So lets look at some code examples for the lodash from pairs method as well as some plain old vanilla javaScript code examples that do the same thing.

Read More

Basic idle game canvas example

There is a lot that I like about idle or incremental games as there is the artistic side of game development, and then there is the business side of things. When it comes to the artistic side maybe game development is about some kind of expression, making some kind of statement, or just simply having fun. However with the artistic side of game development aside there is also the business side of the endeavor, and when it comes to the business side all that really matters is if a game can make you money or not. Sp then when it comes to the business side of game development a game does not have to be some kind of ground breaking statement, emotional expression, or anything profound, it just needs to make money.

When it comes to the business side of game development I have found that a game does not only not need to be some kind of emotional expression, or some grand original idea that no one has really tough of before, no not at all in fact it does not even need to be fun or interesting actually oddly enough. With the business side of game development a game just needs to be addictive, people need to just start playing it and get hooked. So I thought I would make another canvas example post that is a basic idle game. Nothing fancy with this one, just a bland, unbranded idle game starting point that is noting to write home about, but might still prove to be slightly addictive.

This canvas example makes use of a custom trailered utility library that has a method that creates a button layout, which is one way that I go about making menus in a canvas project. I wrote a post in which I get into this button layout method in detail, but will be covering it here also just not in detail.

The game module has an upgrade system that I worked out that is worth writing a thing or two about so I will be getting into that a little here also. In any case this post should serve as a good starting point for making a basic idle game with the canvas element and javaScript so lets get to it.

Read More

Node path parse method and the compoents of a path

In the node path core build in module of node js there is the path parse method. This is a method that can be used to parse a path string into an object with properties for each of the parts of a typical file system path. Properties of a path like the dir to a file as well as the filename and file extension.

There is also a user space npm package called path-parse that aims to be a so called ponyfill of this native nodejs path module method. However I do not see much of a need for such a package as this is something that was introduced a long time ago and seems to work just fine.

Read More

Getting the number of days between two javaScript dates.

This will be a quick post on getting the number of days between two javaScript dates. This is a task that seems to creep up now and then so I thought I would work out a short post on this one to help remind me that this is not something that is as hard as it might seem.

Like most things like this it is important to look at more than one solution, so I will be taking a look at two main solutions for this sort of thing, one example is very simple, and another is a little more complex. Some times it is called for to use a more complex solution for something actually, but so far it would seem that the simple solution for this does in fact work okay. The reason why is because as far as I can tell both solutions will yield the same result when tested with a few examples.

Beyond that I might expand this post a little with additional examples that might prove to be relevant to the general topic. However for the most part there might only be so much to write about when it comes to this specific kind of thing when it comes to programing with javaScript.

Read More

Pointer manager mouse and touch canvas example

This is a canvas example that makes use of what I am calling a pointer manager. Maybe there are other names for such a thing but until I am aware of a better name that is what I am going to call it. This pointer manager of sorts will be something that is used just for pointer objects in general that is the result of input from a mouse, touchscreen, or any other means that can be used to create such objects. It is not however a comprehensive input controller that takes input from any additional input such as a keyboard, game pad, and so forth. I have another canvas example that aims to be everything when it comes to input that I wrote a post on, so that post might be worth checking out also. However what I work out here might be part of what might considered a full comprehensive input controller that would handle all things input related.

Many popular frameworks such as phaser will come with an input controller, when it comes to using such a framework it is just a means of becoming familiar with how to go about using that input controller. However in this post I will be writing about a vanilla javaScript solution for this topic when it comes to web development. Still when it comes to working out a real project it might be best to use a well development and supported framework such as what is worked out for PIXI when it comes to an interaction manager. However if you do what to take the time to make your own abstraction for this, then maybe what is written here will be a helpful starting point for you.

Anyway say you want to make a canvas project that will work well with both mouse and touch events. So in other words you do not want to do anything with multi touch on touch devices, or even if you do bother with an array of touch objects that is something that you want to have off to the side sort of speak. It is still a good idea to want all events for both mouse and touch events to be mapped to certain events that are the same. However in order to do so a bit of parsing, adjusting values, and other things need to be preformed before calling some uniform handers that are to be called for both mouse and touch events.

So this will be a post on such a project that does what I just described, if you want to have multi touch support then it is still important to make additional functionality to support other means of control. Things might be different when it comes to making a mobile app, but this is a web application you are making after all. When I look at my site statistics most of my visitors are on desktop, but I still want things to work well on both desktop and mobile.

Read More