diff options
Diffstat (limited to 'Source/WebInspectorUI/UserInterface/ColorPicker.js')
-rw-r--r-- | Source/WebInspectorUI/UserInterface/ColorPicker.js | 144 |
1 files changed, 0 insertions, 144 deletions
diff --git a/Source/WebInspectorUI/UserInterface/ColorPicker.js b/Source/WebInspectorUI/UserInterface/ColorPicker.js deleted file mode 100644 index fc8059cff..000000000 --- a/Source/WebInspectorUI/UserInterface/ColorPicker.js +++ /dev/null @@ -1,144 +0,0 @@ -/* - * Copyright (C) 2013 Apple Inc. All rights reserved. - * - * Redistribution and use in source and binary forms, with or without - * modification, are permitted provided that the following conditions - * are met: - * 1. Redistributions of source code must retain the above copyright - * notice, this list of conditions and the following disclaimer. - * 2. Redistributions in binary form must reproduce the above copyright - * notice, this list of conditions and the following disclaimer in the - * documentation and/or other materials provided with the distribution. - * - * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS'' - * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, - * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR - * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS - * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR - * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF - * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS - * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN - * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) - * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF - * THE POSSIBILITY OF SUCH DAMAGE. - */ - -WebInspector.ColorPicker = function() -{ - WebInspector.Object.call(this); - - this._colorWheel = new WebInspector.ColorWheel(); - this._colorWheel.delegate = this; - this._colorWheel.dimension = 200; - - this._brightnessSlider = new WebInspector.Slider(); - this._brightnessSlider.delegate = this; - this._brightnessSlider.element.classList.add("brightness"); - - this._opacitySlider = new WebInspector.Slider(); - this._opacitySlider.delegate = this; - this._opacitySlider.element.classList.add("opacity"); - - this._element = document.createElement("div"); - this._element.className = "color-picker"; - - this._element.appendChild(this._colorWheel.element); - this._element.appendChild(this._brightnessSlider.element); - this._element.appendChild(this._opacitySlider.element); - - this._opacityPattern = 'url("data:image/svg+xml;base64,' + btoa('<svg xmlns="http://www.w3.org/2000/svg" width="6" height="6" fill="rgb(204, 204, 204)"><rect width="3" height="3" /><rect x="3" y="3" width="3" height="3"/></svg>') + '")'; - - this._color = "white"; -}; - -WebInspector.ColorPicker.Event = { - ColorChanged: "css-color-picker-color-changed" -}; - -WebInspector.ColorPicker.prototype = { - contructor: WebInspector.ColorPicker, - __proto__: WebInspector.Object.prototype, - - // Public - - get element() - { - return this._element; - }, - - set brightness(brightness) - { - if (brightness === this._brightness) - return; - - this._colorWheel.brightness = brightness; - - this._updateColor(); - this._updateSliders(this._colorWheel.rawColor, this._colorWheel.tintedColor); - }, - - set opacity(opacity) - { - if (opacity === this._opacity) - return; - - this._opacity = opacity; - this._updateColor(); - }, - - get color() - { - return this._color; - }, - - set color(color) - { - this._dontUpdateColor = true; - - this._colorFormat = color.format; - - this._colorWheel.tintedColor = color; - this._brightnessSlider.value = this._colorWheel.brightness; - - this._opacitySlider.value = color.alpha; - this._updateSliders(this._colorWheel.rawColor, color); - - delete this._dontUpdateColor; - }, - - colorWheelColorDidChange: function(colorWheel) - { - this._updateColor(); - this._updateSliders(this._colorWheel.rawColor, this._colorWheel.tintedColor); - }, - - sliderValueDidChange: function(slider, value) - { - if (slider === this._opacitySlider) - this.opacity = value; - else if (slider === this._brightnessSlider) - this.brightness = value; - }, - - // Private - - _updateColor: function() - { - if (this._dontUpdateColor) - return; - - var opacity = Math.round(this._opacity * 100) / 100; - var rgba = this._colorWheel.tintedColor.rgb.concat(opacity); - this._color = new WebInspector.Color(WebInspector.Color.Format.RGBA, rgba).toString(this._colorFormat); - this.dispatchEventToListeners(WebInspector.ColorPicker.Event.ColorChanged, {color: this._color}); - }, - - _updateSliders: function(rawColor, tintedColor) - { - var rgba = this._colorWheel.tintedColor.rgb.concat(0); - var transparent = new WebInspector.Color(WebInspector.Color.Format.RGBA, rgba).toString(); - - this._opacitySlider.element.style.backgroundImage = "linear-gradient(90deg, " + transparent + ", " + tintedColor + "), " + this._opacityPattern; - this._brightnessSlider.element.style.backgroundImage = "linear-gradient(90deg, black, " + rawColor + ")"; - } -}; |