From efaf725b4a507951640b284c3805752dd558fbc4 Mon Sep 17 00:00:00 2001 From: Alexis Paques Date: Thu, 5 Sep 2019 11:16:16 +0200 Subject: [PATCH 1/5] Fix a semi-colon instead of a coma --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index c441bc5..60ce971 100644 --- a/README.md +++ b/README.md @@ -155,7 +155,7 @@ The dom element in which all your joysticks will be injected. From cb19f2bc55fedcd6e18ca080fe95420179ed5cde Mon Sep 17 00:00:00 2001 From: Ilia Choly Date: Fri, 30 Aug 2019 11:13:55 -0400 Subject: [PATCH 2/5] feat: add unit vector representation to move event output --- README.md | 4 ++++ src/collection.js | 4 ++++ types/index.d.ts | 4 ++++ 3 files changed, 12 insertions(+) diff --git a/README.md b/README.md index 60ce971..4d4a0bd 100644 --- a/README.md +++ b/README.md @@ -526,6 +526,10 @@ Comes with data : radian: 1.5707963268, // angle in radian degree: 90 }, + vector: { // force unit vector + x: 0.508, + y: 3.110602869834277e-17 + }, raw: { // note: angle is the same, beyond the 50 pixel limit distance: 25.4, // distance which continues beyond the 50 pixel limit position: { // position of the finger/mouse in pixels, beyond joystick limits diff --git a/src/collection.js b/src/collection.js index 0097f5d..773de10 100644 --- a/src/collection.js +++ b/src/collection.js @@ -432,6 +432,10 @@ Collection.prototype.processOnMove = function (evt) { radian: rAngle, degree: angle }, + vector: { + x: xPosition / size, + y: - yPosition / size + }, raw: raw, instance: nipple, lockX: opts.lockX, diff --git a/types/index.d.ts b/types/index.d.ts index 577bde5..390bbba 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -159,6 +159,10 @@ export interface JoystickOutputData { x: string; y: string; }; + vector: { + x: number; + y: number; + }; raw: { distance: number; position: Position; From 4016682feb8604b4b91d39868db425ff4f893095 Mon Sep 17 00:00:00 2001 From: Alexis Paques Date: Fri, 6 Sep 2019 12:12:34 +0200 Subject: [PATCH 3/5] Add an options to use with dynamic pages --- README.md | 5 ++++- src/collection.js | 12 +++++++++++- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 4d4a0bd..75cc790 100644 --- a/README.md +++ b/README.md @@ -139,8 +139,9 @@ var options = { restOpacity: Number, // opacity when not 'dynamic' and rested lockX: Boolean, // only move on the X axis lockY: Boolean, // only move on the Y axis - catchDistance: Number // distance to recycle previous joystick in + catchDistance: Number, // distance to recycle previous joystick in // 'semi' mode + dynamic_page: Boolean, // Enable if the page has dynamically visible elements }; ``` @@ -252,6 +253,8 @@ Locks joystick's movement to the x (horizontal) axis ### `options.lockY` defaults to false Locks joystick's movement to the y (vertical) axis +### `options.dynamic_page` 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. ---- diff --git a/src/collection.js b/src/collection.js index 773de10..84816e6 100644 --- a/src/collection.js +++ b/src/collection.js @@ -33,7 +33,8 @@ function Collection (manager, options) { restJoystick: true, restOpacity: 0.5, lockX: false, - lockY: false + lockY: false, + dynamic_page: false }; self.config(options); @@ -377,6 +378,15 @@ Collection.prototype.processOnMove = function (evt) { return; } + if (opts.dynamic_page) { + var scroll = u.getScroll(); + pos = nipple.el.getBoundingClientRect(); + nipple.position = { + x: scroll.x + pos.left, + y: scroll.y + pos.top + }; + } + nipple.identifier = identifier; var size = nipple.options.size / 2; From 390c35699a4319917563dc81bc70b8c2bc5bd8d1 Mon Sep 17 00:00:00 2001 From: Alexis Paques Date: Fri, 13 Sep 2019 10:40:58 +0200 Subject: [PATCH 4/5] Rename dynamic_page to dynamicPage --- README.md | 4 ++-- src/collection.js | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 75cc790..5e3b114 100644 --- a/README.md +++ b/README.md @@ -141,7 +141,7 @@ var options = { lockY: Boolean, // only move on the Y axis catchDistance: Number, // distance to recycle previous joystick in // 'semi' mode - dynamic_page: Boolean, // Enable if the page has dynamically visible elements + dynamicPage: Boolean, // Enable if the page has dynamically visible elements }; ``` @@ -253,7 +253,7 @@ Locks joystick's movement to the x (horizontal) axis ### `options.lockY` defaults to false Locks joystick's movement to the y (vertical) axis -### `options.dynamic_page` defaults to true +### `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. ---- diff --git a/src/collection.js b/src/collection.js index 84816e6..95817c8 100644 --- a/src/collection.js +++ b/src/collection.js @@ -34,7 +34,7 @@ function Collection (manager, options) { restOpacity: 0.5, lockX: false, lockY: false, - dynamic_page: false + dynamicPage: false }; self.config(options); @@ -378,7 +378,7 @@ Collection.prototype.processOnMove = function (evt) { return; } - if (opts.dynamic_page) { + if (opts.dynamicPage) { var scroll = u.getScroll(); pos = nipple.el.getBoundingClientRect(); nipple.position = { From b78b7e5ad2c6d5ecdb127ff79ab95d51f5c56298 Mon Sep 17 00:00:00 2001 From: umeruma Date: Wed, 2 Oct 2019 11:46:42 +0900 Subject: [PATCH 5/5] fix: isPressed will return value expectedly on iOS13 fixes #122 --- src/utils.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/utils.js b/src/utils.js index dc863d5..abe28b2 100644 --- a/src/utils.js +++ b/src/utils.js @@ -33,6 +33,9 @@ export const degrees = (a) => { }; export const isPressed = (evt) => { + if (evt.type === 'pointerdown' || evt.type === 'pointermove') { + return true; + } if (isNaN(evt.buttons)) { return evt.pressure !== 0; }