Log Message
Web Inspector: Color picker: can't enter decimal numbers for opacity https://bugs.webkit.org/show_bug.cgi?id=187026 <rdar://problem/41446500>
Reviewed by Brian Burg. After every "input" event, we update the `color` value of the `WI.ColorPicker` based on a generated string using the values of the various <input>. The issue with this approach is that adding a decimal point (e.g. "0.") would still be construed as 0, meaning that the color wouldn't change and would instead be reset back to it's old value. This patch adds an early return if the newly generated color has the same value as the current color, thereby meaning that the `color` wouldn't change when changing from "0" to "0.". * UserInterface/Views/ColorPicker.js: (WI.ColorPicker): (WI.ColorPicker.createColorInput): (WI.ColorPicker.prototype._handleColorInputInput):
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (235272 => 235273)
--- trunk/Source/WebInspectorUI/ChangeLog 2018-08-24 04:22:52 UTC (rev 235272)
+++ trunk/Source/WebInspectorUI/ChangeLog 2018-08-24 04:55:28 UTC (rev 235273)
@@ -1,3 +1,23 @@
+2018-08-23 Devin Rousso <[email protected]>
+
+ Web Inspector: Color picker: can't enter decimal numbers for opacity
+ https://bugs.webkit.org/show_bug.cgi?id=187026
+ <rdar://problem/41446500>
+
+ Reviewed by Brian Burg.
+
+ After every "input" event, we update the `color` value of the `WI.ColorPicker` based on a
+ generated string using the values of the various <input>. The issue with this approach is
+ that adding a decimal point (e.g. "0.") would still be construed as 0, meaning that the
+ color wouldn't change and would instead be reset back to it's old value. This patch adds an
+ early return if the newly generated color has the same value as the current color, thereby
+ meaning that the `color` wouldn't change when changing from "0" to "0.".
+
+ * UserInterface/Views/ColorPicker.js:
+ (WI.ColorPicker):
+ (WI.ColorPicker.createColorInput):
+ (WI.ColorPicker.prototype._handleColorInputInput):
+
2018-08-23 Simon Fraser <[email protected]>
Add support for dumping GC heap snapshots, and a viewer
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js (235272 => 235273)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js 2018-08-24 04:22:52 UTC (rev 235272)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js 2018-08-24 04:55:28 UTC (rev 235273)
@@ -44,7 +44,7 @@
let colorInputsContainerElement = document.createElement("div");
colorInputsContainerElement.classList.add("color-inputs");
- function createColorInput(label, {min: min = 0, max: max = 100, step: step = 1, units} = {}) {
+ let createColorInput = (label, {min, max, step, units} = {}) => {
let containerElement = colorInputsContainerElement.createChild("div");
containerElement.append(label);
@@ -51,9 +51,9 @@
let numberInputElement = containerElement.createChild("input");
numberInputElement.type = "number";
- numberInputElement.min = min;
- numberInputElement.max = max;
- numberInputElement.step = step;
+ numberInputElement.min = min || 0;
+ numberInputElement.max = max || 100;
+ numberInputElement.step = step || 1;
numberInputElement.addEventListener("input", this._handleColorInputInput.bind(this));
if (units && units.length)
@@ -60,16 +60,16 @@
containerElement.append(units);
return {containerElement, numberInputElement};
- }
+ };
this._colorInputs = new Map([
- ["R", createColorInput.call(this, "R", {max: 255})],
- ["G", createColorInput.call(this, "G", {max: 255})],
- ["B", createColorInput.call(this, "B", {max: 255})],
- ["H", createColorInput.call(this, "H", {max: 360})],
- ["S", createColorInput.call(this, "S", {units: "%"})],
- ["L", createColorInput.call(this, "L", {units: "%"})],
- ["A", createColorInput.call(this, "A"), {max: 1, step: 0.01}]
+ ["R", createColorInput("R", {max: 255})],
+ ["G", createColorInput("G", {max: 255})],
+ ["B", createColorInput("B", {max: 255})],
+ ["H", createColorInput("H", {max: 360})],
+ ["S", createColorInput("S", {units: "%"})],
+ ["L", createColorInput("L", {units: "%"})],
+ ["A", createColorInput("A", {max: 1, step: 0.01})]
]);
this._element = document.createElement("div");
@@ -324,7 +324,11 @@
return;
}
- this.color = WI.Color.fromString(colorString);
+ let newColor = WI.Color.fromString(colorString);
+ if (newColor.toString() === this._color.toString())
+ return;
+
+ this.color = newColor;
this._color.format = oldFormat;
this.dispatchEventToListeners(WI.ColorPicker.Event.ColorChanged, {color: this._color});
_______________________________________________ webkit-changes mailing list [email protected] https://lists.webkit.org/mailman/listinfo/webkit-changes
