Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(410)

Side by Side Diff: Source/devtools/front_end/Spectrum.js

Issue 143953014: Listen for input and change event to change color opacity value (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Created 6 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 /* 1 /*
2 * Copyright (C) 2011 Brian Grinstead All rights reserved. 2 * Copyright (C) 2011 Brian Grinstead All rights reserved.
3 * 3 *
4 * Redistribution and use in source and binary forms, with or without 4 * Redistribution and use in source and binary forms, with or without
5 * modification, are permitted provided that the following conditions 5 * modification, are permitted provided that the following conditions
6 * are met: 6 * are met:
7 * 7 *
8 * 1. Redistributions of source code must retain the above copyright 8 * 1. Redistributions of source code must retain the above copyright
9 * notice, this list of conditions and the following disclaimer. 9 * notice, this list of conditions and the following disclaimer.
10 * 2. Redistributions in binary form must reproduce the above copyright 10 * 2. Redistributions in binary form must reproduce the above copyright
(...skipping 38 matching lines...) Expand 10 before | Expand all | Expand 10 after
49 this.slideHelper = this._sliderElement.createChild("div", "spectrum-slider") ; 49 this.slideHelper = this._sliderElement.createChild("div", "spectrum-slider") ;
50 50
51 var rangeContainer = this.element.createChild("div", "spectrum-range-contain er"); 51 var rangeContainer = this.element.createChild("div", "spectrum-range-contain er");
52 var alphaLabel = rangeContainer.createChild("label"); 52 var alphaLabel = rangeContainer.createChild("label");
53 alphaLabel.textContent = WebInspector.UIString("\u03B1:"); 53 alphaLabel.textContent = WebInspector.UIString("\u03B1:");
54 54
55 this._alphaElement = rangeContainer.createChild("input", "spectrum-range"); 55 this._alphaElement = rangeContainer.createChild("input", "spectrum-range");
56 this._alphaElement.setAttribute("type", "range"); 56 this._alphaElement.setAttribute("type", "range");
57 this._alphaElement.setAttribute("min", "0"); 57 this._alphaElement.setAttribute("min", "0");
58 this._alphaElement.setAttribute("max", "100"); 58 this._alphaElement.setAttribute("max", "100");
59 this._alphaElement.addEventListener("input", alphaDrag.bind(this), false);
59 this._alphaElement.addEventListener("change", alphaDrag.bind(this), false); 60 this._alphaElement.addEventListener("change", alphaDrag.bind(this), false);
tkent 2014/01/27 01:20:42 Do we need to listen 'change' event?
60 61
61 var swatchElement = document.createElement("span"); 62 var swatchElement = document.createElement("span");
62 swatchElement.className = "swatch"; 63 swatchElement.className = "swatch";
63 this._swatchInnerElement = swatchElement.createChild("span", "swatch-inner") ; 64 this._swatchInnerElement = swatchElement.createChild("span", "swatch-inner") ;
64 65
65 var displayContainer = this.element.createChild("div"); 66 var displayContainer = this.element.createChild("div");
66 displayContainer.appendChild(swatchElement); 67 displayContainer.appendChild(swatchElement);
67 this._displayElement = displayContainer.createChild("span", "source-code spe ctrum-display-value"); 68 this._displayElement = displayContainer.createChild("span", "source-code spe ctrum-display-value");
68 69
69 WebInspector.Spectrum.draggable(this._sliderElement, hueDrag.bind(this)); 70 WebInspector.Spectrum.draggable(this._sliderElement, hueDrag.bind(this));
(...skipping 372 matching lines...) Expand 10 before | Expand all | Expand 10 after
442 443
443 WebInspector.ColorSwatch.prototype = { 444 WebInspector.ColorSwatch.prototype = {
444 /** 445 /**
445 * @param {string} colorString 446 * @param {string} colorString
446 */ 447 */
447 setColorString: function(colorString) 448 setColorString: function(colorString)
448 { 449 {
449 this._swatchInnerElement.style.backgroundColor = colorString; 450 this._swatchInnerElement.style.backgroundColor = colorString;
450 } 451 }
451 } 452 }
OLDNEW
« no previous file with comments | « no previous file | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698