The step arrows are actually clickable, they were missing multi-diff behavior before this change. < = >

This commit is contained in:
Thijs Wenker 2019-04-18 19:05:40 +02:00
parent dc9f8895f8
commit 386d392144
2 changed files with 46 additions and 30 deletions

View file

@ -21,7 +21,7 @@ function DraggableNumber(min, max, step, decimals, dragStart, dragEnd) {
this.initialMouseEvent = null; this.initialMouseEvent = null;
this.lastMouseEvent = null; this.lastMouseEvent = null;
this.valueChangeFunction = null; this.valueChangeFunction = null;
this.multiDiffDragFunction = null; this.multiDiffStepFunction = null;
this.initialize(); this.initialize();
} }
@ -75,8 +75,8 @@ DraggableNumber.prototype = {
let dragDelta = event.clientX - this.lastMouseEvent.clientX; let dragDelta = event.clientX - this.lastMouseEvent.clientX;
if (dragDelta !== 0) { if (dragDelta !== 0) {
if (this.multiDiffModeEnabled) { if (this.multiDiffModeEnabled) {
if (this.multiDiffDragFunction) { if (this.multiDiffStepFunction) {
this.multiDiffDragFunction(dragDelta * this.step); this.multiDiffStepFunction(dragDelta * this.step);
} }
} else { } else {
if (dragDelta > 0) { if (dragDelta > 0) {
@ -108,20 +108,32 @@ DraggableNumber.prototype = {
stepUp: function() { stepUp: function() {
if (!this.isDisabled()) { if (!this.isDisabled()) {
this.elInput.value = parseFloat(this.elInput.value) + this.step; if (this.multiDiffModeEnabled) {
this.inputChange(); if (this.multiDiffStepFunction) {
if (this.valueChangeFunction) { this.multiDiffStepFunction(this.step, true);
this.valueChangeFunction(); }
} else {
this.elInput.value = parseFloat(this.elInput.value) + this.step;
this.inputChange();
if (this.valueChangeFunction) {
this.valueChangeFunction();
}
} }
} }
}, },
stepDown: function() { stepDown: function() {
if (!this.isDisabled()) { if (!this.isDisabled()) {
this.elInput.value = parseFloat(this.elInput.value) - this.step; if (this.multiDiffModeEnabled) {
this.inputChange(); if (this.multiDiffStepFunction) {
if (this.valueChangeFunction) { this.multiDiffStepFunction(-this.step, true);
this.valueChangeFunction(); }
} else {
this.elInput.value = parseFloat(this.elInput.value) - this.step;
this.inputChange();
if (this.valueChangeFunction) {
this.valueChangeFunction();
}
} }
} }
}, },
@ -158,8 +170,8 @@ DraggableNumber.prototype = {
this.elInput.addEventListener("change", this.valueChangeFunction); this.elInput.addEventListener("change", this.valueChangeFunction);
}, },
setMultiDiffDragFunction: function(multiDiffDragFunction) { setMultiDiffStepFunction: function (multiDiffStepFunction) {
this.multiDiffDragFunction = multiDiffDragFunction; this.multiDiffStepFunction = multiDiffStepFunction;
}, },
inputChange: function() { inputChange: function() {

View file

@ -2353,21 +2353,25 @@ function updateNumberMinMax(property) {
/** /**
* *
* @param {object} property - property update on drag * @param {object} property - property update on step
* @param {string} [propertyComponent] - propertyComponent to update on drag (e.g. enter 'x' to just update position.x) * @param {string} [propertyComponent] - propertyComponent to update on step (e.g. enter 'x' to just update position.x)
* @returns {Function} * @returns {Function}
*/ */
function createMultiDiffDragFunction(property, propertyComponent) { function createMultiDiffStepFunction(property, propertyComponent) {
return function(dragDelta) { return function(step, shouldAddToUndoHistory) {
if (shouldAddToUndoHistory === undefined) {
shouldAddToUndoHistory = false;
}
let propertyMultiValue = getMultiplePropertyValue(property.name); let propertyMultiValue = getMultiplePropertyValue(property.name);
if (!propertyMultiValue.isMultiDiffValue) { if (!propertyMultiValue.isMultiDiffValue) {
console.log("setMultiDiffDragFunction is only supposed to be called in MultiDiff mode."); console.log("setMultiDiffStepFunction is only supposed to be called in MultiDiff mode.");
return; return;
} }
let multiplier = property.data.multiplier !== undefined ? property.data.multiplier : 1; let multiplier = property.data.multiplier !== undefined ? property.data.multiplier : 1;
let applyDelta = dragDelta * multiplier; let applyDelta = step * multiplier;
if (selectedEntityIDs.size !== propertyMultiValue.values.length) { if (selectedEntityIDs.size !== propertyMultiValue.values.length) {
console.log("selectedEntityIDs and propertyMultiValue got out of sync."); console.log("selectedEntityIDs and propertyMultiValue got out of sync.");
@ -2396,7 +2400,7 @@ function createMultiDiffDragFunction(property, propertyComponent) {
mergeDeep(currentSelections[i].properties, propertiesUpdate); mergeDeep(currentSelections[i].properties, propertiesUpdate);
} }
updateMultiDiffProperties(updateObjects, true); updateMultiDiffProperties(updateObjects, !shouldAddToUndoHistory);
} }
} }
@ -2419,7 +2423,7 @@ function createNumberDraggableProperty(property, elProperty) {
let valueChangeFunction = createEmitNumberPropertyUpdateFunction(property); let valueChangeFunction = createEmitNumberPropertyUpdateFunction(property);
elDraggableNumber.setValueChangeFunction(valueChangeFunction); elDraggableNumber.setValueChangeFunction(valueChangeFunction);
elDraggableNumber.setMultiDiffDragFunction(createMultiDiffDragFunction(property)); elDraggableNumber.setMultiDiffStepFunction(createMultiDiffStepFunction(property));
elDraggableNumber.elInput.setAttribute("id", elementID); elDraggableNumber.elInput.setAttribute("id", elementID);
elProperty.appendChild(elDraggableNumber.elDiv); elProperty.appendChild(elDraggableNumber.elDiv);
@ -2465,10 +2469,10 @@ function createRectProperty(property, elProperty) {
elNumberWidth.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'width')); elNumberWidth.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'width'));
elNumberHeight.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'height')); elNumberHeight.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'height'));
elNumberX.setMultiDiffDragFunction(createMultiDiffDragFunction(property, 'x')); elNumberX.setMultiDiffStepFunction(createMultiDiffStepFunction(property, 'x'));
elNumberY.setMultiDiffDragFunction(createMultiDiffDragFunction(property, 'y')); elNumberY.setMultiDiffStepFunction(createMultiDiffStepFunction(property, 'y'));
elNumberX.setMultiDiffDragFunction(createMultiDiffDragFunction(property, 'width')); elNumberX.setMultiDiffStepFunction(createMultiDiffStepFunction(property, 'width'));
elNumberY.setMultiDiffDragFunction(createMultiDiffDragFunction(property, 'height')); elNumberY.setMultiDiffStepFunction(createMultiDiffStepFunction(property, 'height'));
let elResult = []; let elResult = [];
elResult[RECT_ELEMENTS.X_NUMBER] = elNumberX; elResult[RECT_ELEMENTS.X_NUMBER] = elNumberX;
@ -2503,9 +2507,9 @@ function createVec3Property(property, elProperty) {
elNumberY.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'y')); elNumberY.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'y'));
elNumberZ.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'z')); elNumberZ.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'z'));
elNumberX.setMultiDiffDragFunction(createMultiDiffDragFunction(property, 'x')); elNumberX.setMultiDiffStepFunction(createMultiDiffStepFunction(property, 'x'));
elNumberY.setMultiDiffDragFunction(createMultiDiffDragFunction(property, 'y')); elNumberY.setMultiDiffStepFunction(createMultiDiffStepFunction(property, 'y'));
elNumberZ.setMultiDiffDragFunction(createMultiDiffDragFunction(property, 'z')); elNumberZ.setMultiDiffStepFunction(createMultiDiffStepFunction(property, 'z'));
let elResult = []; let elResult = [];
elResult[VECTOR_ELEMENTS.X_NUMBER] = elNumberX; elResult[VECTOR_ELEMENTS.X_NUMBER] = elNumberX;
@ -2532,8 +2536,8 @@ function createVec2Property(property, elProperty) {
elNumberX.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'x')); elNumberX.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'x'));
elNumberY.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'y')); elNumberY.setValueChangeFunction(createEmitNumberPropertyComponentUpdateFunction(property, 'y'));
elNumberX.setMultiDiffDragFunction(createMultiDiffDragFunction(property, 'x')); elNumberX.setMultiDiffStepFunction(createMultiDiffStepFunction(property, 'x'));
elNumberY.setMultiDiffDragFunction(createMultiDiffDragFunction(property, 'y')); elNumberY.setMultiDiffStepFunction(createMultiDiffStepFunction(property, 'y'));
let elResult = []; let elResult = [];
elResult[VECTOR_ELEMENTS.X_NUMBER] = elNumberX; elResult[VECTOR_ELEMENTS.X_NUMBER] = elNumberX;