Added support for Stationary joystick Base...

[erichlof]

Hi @jeromeetienne and @Forzaferrarileo, I have successfully added support for a stationary joystick base. I designed this feature to be easily enabled as an option when you declare the new joystick object. Here's how it is used:

var joystick = new VirtualJoystick({ mouseSupport: true, stationaryBase: true, baseX: 200, baseY: 200 });

As you can see, all you have to do is set the new boolean flag 'stationaryBase' to 'true'. Then, you choose the x/y coordinates of your fixed base - in this example I chose 200 for x and 200 for y.

When you run the demo or game now, the joystick base will permanently be rendered at location 200,200 (which is the upper left-hand corner of your browser window). You can then move the stick relative to that fixed base.

A nice side-effect of adding this feature was the discovery that you can now click or touch once anywhere on the webpage and it will register that click/touch coordinate as an immediate movement of the stick. So, you can click once to the right of the base, then once to the left, then above, then below, whatever, and your game character will begin to move right, left, above , below to match each click/touch, instantaneously.

Of course you can, in the old way, hold down (touch and hold, or hold down mouse button and drag) to move the stick around - just like we do in the current version of virtualjoystick.js. Also, if you do not want a fixed base, simply leave out that option when declaring the joystick object and it behaves exactly like the virtualjoystick.js does now. So this is 'backward' compatible. It would not break any existing projects.

Here's a simple demo of the new feature: http://erichlof.github.io/BlogExamples/StationaryJoystickTest.html

Here is a link the updated virtualjoystick.js file -I called it virtualjoystick2.js :
https://github.com/erichlof/erichlof.github.io/blob/master/BlogExamples/js/virtualjoystick2.js

My code only added 7 lines to your existing code, and 0.3 kb of size.

I am a newbie at GitHub processes. How should I try to include this in your file, @jeromeetienne ? Should I make a pull request, or can you just as easily copy and paste my code as your new virtualjoystick.js ?

Please let me know how I should proceed. Thanks for all your awesome helpers Jerome! Looking forward to your future projects!

-Erich

[Forzaferrarileo]

Thank you very much!

[jeromeetienne]

@erichlof yep a pull request would be nice :)

[erichlof]

@jeromeetienne Thank you for merging. I hope users will now enjoy virtualjoystick.js even more! Thanks again Jerome for this awesome helper file!

@Forzaferrarileo Hey, no problem - you are welcome! Since this is my first contribution/pull request on GitHub, I learned a lot. And Jerome's wonderful design of his libraries helped make it easier for me to add my bits. Enjoy!