DevTools: Box-shadow editor initial implementation

third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js

Index: third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js b/third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js
index 86f9ab857020a1087ab8763a849465b34a8a33c3..61219a52b0a83beff0898d83540e459d636b99d9 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js
+++ b/third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js
@@ -1371,6 +1371,20 @@ function createCheckboxLabel(title, checked, subtitle)
 }
 
 /**
+ * @return {!Element}
+ * @param {number} min
+ * @param {number} max
+ */
+function createSliderLabel(min, max)
+{
+    var element = createElement("label", "dt-slider");
+    element.sliderElement.min = min;
+    element.sliderElement.max = max;
+    element.sliderElement.step = 1;
+    return element;
+}
+
+/**
  * @param {!Node} node
  * @param {string} cssFile
  * @suppressGlobalPropertiesCheck
@@ -1535,6 +1549,39 @@ WebInspector.appendStyle = function(node, cssFile)
         __proto__: HTMLLabelElement.prototype
     });
 
+    registerCustomElement("label", "dt-slider", {
+        /**
+         * @this {Element}
+         */
+        createdCallback: function()
+        {
+            var root = WebInspector.createShadowRootWithCoreStyles(this, "ui/slider.css");
+            this.sliderElement = createElementWithClass("input", "dt-range-input");
+            this.sliderElement.type = "range";
+            root.createChild("content");

[dgozman, 2016/08/24 19:18:31]

You only need content if you append children (e.g. label) to the slider.

[flandy, 2016/08/24 22:08:41]

Removed.

+            root.appendChild(this.sliderElement);
+        },
+
+        /**
+         * @param {number} amount
+         * @this {Element}
+         */
+        set value(amount)
+        {
+            this.sliderElement.value = amount;
+        },
+
+        /**
+         * @this {Element}
+         */
+        get value()
+        {
+            return this.sliderElement.value;
+        },
+
+        __proto__: HTMLLabelElement.prototype
+    });
+
     registerCustomElement("div", "dt-close-button", {
         /**
          * @this {Element}