From b2543979ba0a5e02dd6dd3d0056dbb5bad6d97fe Mon Sep 17 00:00:00 2001 From: Dimitris - Rafail Katsampas Date: Sun, 7 Jul 2024 13:47:04 +0300 Subject: [PATCH 1/3] fix: Interactivity for sliders outside bounds --- src/SliderBase.ts | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) diff --git a/src/SliderBase.ts b/src/SliderBase.ts index 0c4c1f1..01ec9f6 100644 --- a/src/SliderBase.ts +++ b/src/SliderBase.ts @@ -167,8 +167,21 @@ export class SliderBase extends ProgressBar protected createSlider(sliderData: Container | string): Container { const slider = getView(sliderData); - - slider.eventMode = 'none'; + const onPointerDown = (event: FederatedPointerEvent) => + { + // This is needed to do proper calculations in update method calls + if (this.bg) + { + event.currentTarget = this.bg; + } + this.startUpdate(event); + }; + + slider.eventMode = 'static'; + slider.x = slider.width / 2; + slider.on('pointerdown', onPointerDown) + .on('pointerup', this.endUpdate, this) + .on('pointerupoutside', this.endUpdate, this); slider.x = slider.width / 2; const container = new Container(); @@ -191,9 +204,7 @@ export class SliderBase extends ProgressBar { this.dragging = 1; - const obj = event.currentTarget as DragObject; - - this.startX = obj.parent.worldTransform.applyInverse(event.global).x; + this.startX = this.bg.parent.worldTransform.applyInverse(event.global).x; this.startUpdateValue1 = this._value1; this.startUpdateValue2 = this._value2; From ece798dfdadf186147845f63c271e7b1a798c5f4 Mon Sep 17 00:00:00 2001 From: Dimitris - Rafail Katsampas Date: Sun, 7 Jul 2024 13:48:01 +0300 Subject: [PATCH 2/3] chore: Reverted unneeded change --- src/SliderBase.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/SliderBase.ts b/src/SliderBase.ts index 01ec9f6..6805125 100644 --- a/src/SliderBase.ts +++ b/src/SliderBase.ts @@ -204,7 +204,9 @@ export class SliderBase extends ProgressBar { this.dragging = 1; - this.startX = this.bg.parent.worldTransform.applyInverse(event.global).x; + const obj = event.currentTarget as DragObject; + + this.startX = obj.parent.worldTransform.applyInverse(event.global).x; this.startUpdateValue1 = this._value1; this.startUpdateValue2 = this._value2; From 5e23374f74e3b89e4740f2be9147ce49a87a1627 Mon Sep 17 00:00:00 2001 From: Dimitris - Rafail Katsampas Date: Sun, 7 Jul 2024 14:01:25 +0300 Subject: [PATCH 3/3] chore: Removed duplicate line --- src/SliderBase.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/SliderBase.ts b/src/SliderBase.ts index 6805125..63236a2 100644 --- a/src/SliderBase.ts +++ b/src/SliderBase.ts @@ -178,7 +178,6 @@ export class SliderBase extends ProgressBar }; slider.eventMode = 'static'; - slider.x = slider.width / 2; slider.on('pointerdown', onPointerDown) .on('pointerup', this.endUpdate, this) .on('pointerupoutside', this.endUpdate, this);