feat: Add option to display joystick before touch in semi/static mode

This feature brings new customizations for semi and static mode. In static mode,
you can now choose to hide joystick before touch event. In semi mode, you can
display joystick before touch event, only if position option has been overridden.
This constraint has been implemented to maintain previous behavior.

README.md

@@ -30,6 +30,7 @@
   * [`options.restJoystick` defaults to true](#optionsrestjoystick-defaults-to-true)
   * [`options.restOpacity` defaults to 0.5](#optionsrestopacity-defaults-to-05)
   * [`options.catchDistance` defaults to 200](#optionscatchdistance-defaults-to-200)
+  * [`options.displayBeforeTouch` defaults to true](#optionsdisplaybeforetouch-defaults-to-true)
 - [API](#api)
   * [NippleJS instance (manager)](#nipplejs-instance-manager)
     + [`manager.on(type, handler)`](#managerontype-handler)
@@ -142,7 +143,8 @@ var options = {
     lockY: Boolean,                 // only move on the Y axis
     catchDistance: Number,          // distance to recycle previous joystick in
                                     // 'semi' mode
-    dynamicPage: Boolean,          // Enable if the page has dynamically visible elements
+    dynamicPage: Boolean,           // Enable if the page has dynamically visible elements
+    displayBeforeTouch: Boolean     // Enable joystick display before any touch event
 };
 ```
 
@@ -257,6 +259,9 @@ Locks joystick's movement to the y (vertical) axis
 ### `options.dynamicPage` defaults to true
 Enable if the page has dynamically visible elements such as for Vue, React, Angular or simply some CSS hiding or showing some DOM.
 
+### `options.displayBeforeTouch` defaults to true
+Enable joystick display before any touch event. In `semi` mode, make sure `position` option has been overridden. 
+
 ----
 
 ## API

src/collection.js

@@ -34,7 +34,8 @@ function Collection (manager, options) {
         restOpacity: 0.5,
         lockX: false,
         lockY: false,
-        dynamicPage: false
+        dynamicPage: false,
+        displayBeforeTouch: true,
     };
 
     self.config(options);
@@ -101,7 +102,9 @@ Collection.prototype.begin = function () {
 
     // We place our static nipple
     // if needed.
-    if (opts.mode === 'static') {
+    var isModeReadyForDisplay = opts.mode === 'static' ||
+        opts.mode === 'semi' && opts.position !== self.defaults.position;
+    if (opts.displayBeforeTouch === true && isModeReadyForDisplay === true) {
         var nipple = self.createNipple(
             opts.position,
             self.manager.getIdentifier()