Add js line breaks to strings

When working with string values it might be necessary to add some js line breaks to the string at the end of a string, or at any point where needed in the string for that matter. In some cases these kinds of characters are added to the end of a string automatically when using something like the console log method in nodejs for example. When using console log a line break character is added to the end of the standard output each time it is called. If you do not want that to happen then there is using the write method of the stdout property of the process object. In client side javaScript there is of course the break element, but that will not work so well in all situations.

If you are not familiar with escape notation and strings in javaScript now might be the time to take a look at them for this reason as well as many others. Escape notation is a way to add any character into a string including characters that might be interpreted as a return, or a way to end a string in javaScript source code.

There is more then one text pattern for line breaks depending on the operating system you want the content to work with. However for the most part you can get away with just using one or the other, many well designed applications are familiar with the different patterns and will detect what the situation is and parse accordingly. However it still makes sense to be al least somewhat aware of what these patterns are, and which might be the best choice for a given situation.

In any case this will be a quick post on line breaks and javaScript strings in both a nodejs and client environment.

Read More

A simple nodejs powered RPG game

I have been wanting to get around to making a simple terminal based RPG style game with nodejs, and write about it as one of several nodejs example type posts. So I finally got around to doing just that. The basic idea that I had in mind was just a simple turn based terminal RPG game that uses ANSI escape codes to draw the state of the game board. Nothing special in terms of item drops, enemy types, spells, and even leveling up as I want to keep this one pretty simple.

No name for this as of yet, I am horrible with names anyway, for not I will just call it simple RPG game. In time this example might server as a starting point for other more interesting projects, so I will want to try to keep everything neat and clean if I can.

Read More

Canvas angle get the shortest direction between two angles

When working out canvas projects there might be a need to find the direction in which to go when given two angles. That is there is a current angle, and a target angle that I wish to get to from the current angle. With that said I often find myself in a situation in which I want to start stepping the current angle by a delta value that will get the current angle to the target angle.

There are many projects out on the open Internet that help with this, one such project is angle.js. The angle.js project has a whole bunch of methods that help with tasks that involve angles naturally. In that project there are methods that help with the task of getting the shortest direction and many other topics that have to do with angles. However in this post I will be going over some quick copy and past solutions for finding the quickest direction to a target angle from a starting angle one of which is based off of a method in angles.js.

Read More

nth root of a number in javaScript

Often I end up using Math.sqrt in projects whenever I need to get the square root of a number. However what if I want the nth root of a number? Such as the cubed root of a number, or any other degree beyond of that of just the number 2 that is what I am set with when using the Math sqrt method. I can not say that I end up having to use this kind of method that often, but still there does not seem to be a built in mMath object method for it.

Well in this post I will be going over a quick example of how to go about working out a basic nth root method with just plain old javaScript by itself.

Read More

Canvas drag and drop examples

In canvas drag and drop actions are part of many projects when working out a user interface for a project. There are ways of dragging whole elements when it comes to client side javaScript in general, but in this post I will be writing about dragging a display object in the canvas which is a little different from that as it just deals with canvas elements alone.

The process of making a canvas drag of sorts might involve first getting a canvas relative point in a pointer event such as mouse down or a touch start event when it comes to touch events. Then the nest step might be to use that to find out if a display object was clicked or not with some kind of collision detection method such as bounding box. If an object has been clicked then I could set a boolean value for that display object to true that would then used in the logic of a pointer move event. In the body of the pointer move event I would then set the position of the display object to the canvas relative point that is obtained within the event object of the move event. Finally there will be a pointer end event that just sets the boolean back to false leaving the dragged display object at its new location.

There is more to it then just start though, there are other talking points when it comes to snapping things to a grid or not, and creating user defined events for certain things that are a result of drag and drop. However the basics of getting started with canvas drag and drop is not so hard, and if things get to intense there is always just going with a framework such as phaser that has all this worked out well and much more. However in this post I am going to be witting about doing this sort of things and related topics with just plain old vanilla javaScript and canvas elements.

Read More