From 7c1eb58f03ac2b3c8e3679033eb33ac066c39b5b Mon Sep 17 00:00:00 2001 From: kpal Date: Thu, 22 Feb 2024 14:11:07 +0000 Subject: [PATCH 1/4] added alt binding to vector input for changing all values at once --- src/components/NumericInput/index.ts | 4 +++- src/components/VectorInput/index.ts | 20 ++++++++++++++++++-- 2 files changed, 21 insertions(+), 3 deletions(-) diff --git a/src/components/NumericInput/index.ts b/src/components/NumericInput/index.ts index c89065a8..2f894f59 100644 --- a/src/components/NumericInput/index.ts +++ b/src/components/NumericInput/index.ts @@ -157,7 +157,8 @@ class NumericInput extends InputElement { this._updatePosition(evt.movementX, evt.shiftKey); }; - protected _onSliderMouseDown = () => { + protected _onSliderMouseDown = (evt: MouseEvent) => { + this.emit('slider:mousedown', evt); this._sliderControl.dom.requestPointerLock(); this._sliderMovement = 0.0; this._sliderPrevValue = this.value; @@ -172,6 +173,7 @@ class NumericInput extends InputElement { }; protected _onSliderMouseUp = () => { + this.emit('slider:mouseup'); document.exitPointerLock(); if (!this._sliderUsed) return; this._sliderUsed = false; diff --git a/src/components/VectorInput/index.ts b/src/components/VectorInput/index.ts index 7a733bc1..36572769 100644 --- a/src/components/VectorInput/index.ts +++ b/src/components/VectorInput/index.ts @@ -43,6 +43,8 @@ class VectorInput extends Element implements IBindable, IFocusable, IPlaceholder protected _applyingChange = false; + protected _bindAllInputs = false; + constructor(args: Readonly = {}) { const elementArgs = { ...args }; // set binding after inputs have been created @@ -64,8 +66,14 @@ class VectorInput extends Element implements IBindable, IFocusable, IPlaceholder renderChanges: args.renderChanges, placeholder: args.placeholder ? (Array.isArray(args.placeholder) ? args.placeholder[i] : args.placeholder) : null }); + input.on('slider:mousedown', (evt: MouseEvent) => { + this._bindAllInputs = !!evt.altKey; + }); + input.on('slider:mouseup', () => { + this._bindAllInputs = false; + }); input.on('change', () => { - this._onInputChange(); + this._onInputChange(input); }); input.on('focus', () => { this.emit('focus'); @@ -90,7 +98,8 @@ class VectorInput extends Element implements IBindable, IFocusable, IPlaceholder } } - protected _onInputChange() { + + protected _onInputChange(input: NumericInput) { if (this._applyingChange) return; // check if any of our inputs have the MULTIPLE_VALUES class and if so inherit it for us as well @@ -102,6 +111,13 @@ class VectorInput extends Element implements IBindable, IFocusable, IPlaceholder this.class.remove(pcuiClass.MULTIPLE_VALUES); } + if (this._bindAllInputs) { + for (let i = 0; i < this._inputs.length; i++) { + if (this._inputs[i] === input) continue; + this._inputs[i].value = input.value; + } + } + this.emit('change', this.value); } From e02133649aaebad03a29112f0a3d3b6c1b118bbb Mon Sep 17 00:00:00 2001 From: kpal Date: Thu, 22 Feb 2024 15:27:04 +0000 Subject: [PATCH 2/4] modified bound input to use existing _updateValue function --- src/components/NumericInput/index.ts | 7 +++++-- src/components/VectorInput/index.ts | 22 ++++++++++++++++++---- 2 files changed, 23 insertions(+), 6 deletions(-) diff --git a/src/components/NumericInput/index.ts b/src/components/NumericInput/index.ts index 2f894f59..ac0d83ca 100644 --- a/src/components/NumericInput/index.ts +++ b/src/components/NumericInput/index.ts @@ -158,7 +158,6 @@ class NumericInput extends InputElement { }; protected _onSliderMouseDown = (evt: MouseEvent) => { - this.emit('slider:mousedown', evt); this._sliderControl.dom.requestPointerLock(); this._sliderMovement = 0.0; this._sliderPrevValue = this.value; @@ -170,10 +169,11 @@ class NumericInput extends InputElement { this.binding.historyCombine = true; this.binding.historyPostfix = `(${Date.now()})`; } + + this.emit('slider:mousedown', evt); }; protected _onSliderMouseUp = () => { - this.emit('slider:mouseup'); document.exitPointerLock(); if (!this._sliderUsed) return; this._sliderUsed = false; @@ -187,6 +187,9 @@ class NumericInput extends InputElement { this._historyPostfix = null; } this.focus(); + + this.emit('slider:mouseup'); + }; protected _onInputChange(evt: Event) { diff --git a/src/components/VectorInput/index.ts b/src/components/VectorInput/index.ts index 36572769..ec030c3e 100644 --- a/src/components/VectorInput/index.ts +++ b/src/components/VectorInput/index.ts @@ -68,9 +68,20 @@ class VectorInput extends Element implements IBindable, IFocusable, IPlaceholder }); input.on('slider:mousedown', (evt: MouseEvent) => { this._bindAllInputs = !!evt.altKey; + if (this._bindAllInputs) { + for (let i = 0; i < this._inputs.length; i++) { + if (this._inputs[i] === input) continue; + this._inputs[i].class.add(pcuiClass.FOCUS); + } + } }); input.on('slider:mouseup', () => { + this._onInputChange(input); this._bindAllInputs = false; + for (let i = 0; i < this._inputs.length; i++) { + if (this._inputs[i] === input) continue; + this._inputs[i].class.remove(pcuiClass.FOCUS); + } }); input.on('change', () => { this._onInputChange(input); @@ -112,13 +123,16 @@ class VectorInput extends Element implements IBindable, IFocusable, IPlaceholder } if (this._bindAllInputs) { - for (let i = 0; i < this._inputs.length; i++) { - if (this._inputs[i] === input) continue; - this._inputs[i].value = input.value; + const value = Array(this._inputs.length).fill(input.value); + const changed = this._updateValue(value); + + if (changed && this._binding) { + this._binding.setValue(value); } + } else { + this.emit('change', this.value); } - this.emit('change', this.value); } protected _updateValue(value: number[]) { From 063eefd5a309ee062f310c46c07aa4c91e8baabe Mon Sep 17 00:00:00 2001 From: kpal Date: Thu, 22 Feb 2024 16:01:04 +0000 Subject: [PATCH 3/4] fixed focusing highlighting bug --- src/components/VectorInput/index.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/VectorInput/index.ts b/src/components/VectorInput/index.ts index ec030c3e..c136027d 100644 --- a/src/components/VectorInput/index.ts +++ b/src/components/VectorInput/index.ts @@ -69,8 +69,8 @@ class VectorInput extends Element implements IBindable, IFocusable, IPlaceholder input.on('slider:mousedown', (evt: MouseEvent) => { this._bindAllInputs = !!evt.altKey; if (this._bindAllInputs) { + input.focus(); for (let i = 0; i < this._inputs.length; i++) { - if (this._inputs[i] === input) continue; this._inputs[i].class.add(pcuiClass.FOCUS); } } @@ -79,7 +79,6 @@ class VectorInput extends Element implements IBindable, IFocusable, IPlaceholder this._onInputChange(input); this._bindAllInputs = false; for (let i = 0; i < this._inputs.length; i++) { - if (this._inputs[i] === input) continue; this._inputs[i].class.remove(pcuiClass.FOCUS); } }); From 3f2c637bff693a965f01ba76003c6eee5f56aef9 Mon Sep 17 00:00:00 2001 From: kpal Date: Thu, 22 Feb 2024 16:10:24 +0000 Subject: [PATCH 4/4] removed extra space after event emit --- src/components/NumericInput/index.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/NumericInput/index.ts b/src/components/NumericInput/index.ts index ac0d83ca..49b1b91a 100644 --- a/src/components/NumericInput/index.ts +++ b/src/components/NumericInput/index.ts @@ -189,7 +189,6 @@ class NumericInput extends InputElement { this.focus(); this.emit('slider:mouseup'); - }; protected _onInputChange(evt: Event) {