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

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/components/Spectrum.js

Issue 2573323002: Revert of [DevTools] Remove methods on Common.Event. (Closed)
Patch Set: Created 4 years 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
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 40 matching lines...) Expand 10 before | Expand all | Expand 10 after
51 this._colorElement = this.contentElement.createChild('div', 'spectrum-color' ); 51 this._colorElement = this.contentElement.createChild('div', 'spectrum-color' );
52 this._colorDragElement = this._colorElement.createChild('div', 'spectrum-sat fill') 52 this._colorDragElement = this._colorElement.createChild('div', 'spectrum-sat fill')
53 .createChild('div', 'spectrum-val fill') 53 .createChild('div', 'spectrum-val fill')
54 .createChild('div', 'spectrum-dragger'); 54 .createChild('div', 'spectrum-dragger');
55 var contrastRatioSVG = this._colorElement.createSVGChild('svg', 'spectrum-co ntrast-container fill'); 55 var contrastRatioSVG = this._colorElement.createSVGChild('svg', 'spectrum-co ntrast-container fill');
56 this._contrastRatioLine = contrastRatioSVG.createSVGChild('path', 'spectrum- contrast-line'); 56 this._contrastRatioLine = contrastRatioSVG.createSVGChild('path', 'spectrum- contrast-line');
57 57
58 var toolbar = new UI.Toolbar('spectrum-eye-dropper', this.contentElement); 58 var toolbar = new UI.Toolbar('spectrum-eye-dropper', this.contentElement);
59 this._colorPickerButton = new UI.ToolbarToggle(Common.UIString('Toggle color picker'), 'largeicon-eyedropper'); 59 this._colorPickerButton = new UI.ToolbarToggle(Common.UIString('Toggle color picker'), 'largeicon-eyedropper');
60 this._colorPickerButton.setToggled(true); 60 this._colorPickerButton.setToggled(true);
61 this._colorPickerButton.addEventListener( 61 this._colorPickerButton.addEventListener('click', this._toggleColorPicker.bi nd(this, undefined));
62 UI.ToolbarButton.Events.Click, this._toggleColorPicker.bind(this, undefi ned));
63 toolbar.appendToolbarItem(this._colorPickerButton); 62 toolbar.appendToolbarItem(this._colorPickerButton);
64 63
65 var swatchElement = this.contentElement.createChild('span', 'swatch'); 64 var swatchElement = this.contentElement.createChild('span', 'swatch');
66 this._swatchInnerElement = swatchElement.createChild('span', 'swatch-inner') ; 65 this._swatchInnerElement = swatchElement.createChild('span', 'swatch-inner') ;
67 this._swatchOverlayElement = swatchElement.createChild('span', 'swatch-overl ay'); 66 this._swatchOverlayElement = swatchElement.createChild('span', 'swatch-overl ay');
68 this._swatchOverlayElement.addEventListener('click', this._onCopyIconClick.b ind(this)); 67 this._swatchOverlayElement.addEventListener('click', this._onCopyIconClick.b ind(this));
69 this._swatchOverlayElement.addEventListener('mouseout', this._onCopyIconMous eout.bind(this)); 68 this._swatchOverlayElement.addEventListener('mouseout', this._onCopyIconMous eout.bind(this));
70 this._swatchCopyIcon = UI.Icon.create('largeicon-copy', 'copy-color-icon'); 69 this._swatchCopyIcon = UI.Icon.create('largeicon-copy', 'copy-color-icon');
71 this._swatchCopyIcon.title = Common.UIString('Copy color to clipboard'); 70 this._swatchCopyIcon.title = Common.UIString('Copy color to clipboard');
72 this._swatchOverlayElement.appendChild(this._swatchCopyIcon); 71 this._swatchOverlayElement.appendChild(this._swatchCopyIcon);
(...skipping 57 matching lines...) Expand 10 before | Expand all | Expand 10 after
130 129
131 this._deleteIconToolbar = new UI.Toolbar('delete-color-toolbar'); 130 this._deleteIconToolbar = new UI.Toolbar('delete-color-toolbar');
132 this._deleteButton = new UI.ToolbarButton('', 'largeicon-trash-bin'); 131 this._deleteButton = new UI.ToolbarButton('', 'largeicon-trash-bin');
133 this._deleteIconToolbar.appendToolbarItem(this._deleteButton); 132 this._deleteIconToolbar.appendToolbarItem(this._deleteButton);
134 133
135 var overlay = this.contentElement.createChild('div', 'spectrum-overlay fill' ); 134 var overlay = this.contentElement.createChild('div', 'spectrum-overlay fill' );
136 overlay.addEventListener('click', this._togglePalettePanel.bind(this, false) ); 135 overlay.addEventListener('click', this._togglePalettePanel.bind(this, false) );
137 136
138 this._addColorToolbar = new UI.Toolbar('add-color-toolbar'); 137 this._addColorToolbar = new UI.Toolbar('add-color-toolbar');
139 var addColorButton = new UI.ToolbarButton(Common.UIString('Add to palette'), 'largeicon-add'); 138 var addColorButton = new UI.ToolbarButton(Common.UIString('Add to palette'), 'largeicon-add');
140 addColorButton.addEventListener(UI.ToolbarButton.Events.Click, this._addColo rToCustomPalette, this); 139 addColorButton.addEventListener('click', this._addColorToCustomPalette.bind( this));
141 this._addColorToolbar.appendToolbarItem(addColorButton); 140 this._addColorToolbar.appendToolbarItem(addColorButton);
142 141
143 this._loadPalettes(); 142 this._loadPalettes();
144 new Components.Spectrum.PaletteGenerator(this._generatedPaletteLoaded.bind(t his)); 143 new Components.Spectrum.PaletteGenerator(this._generatedPaletteLoaded.bind(t his));
145 144
146 /** 145 /**
147 * @param {function(!Event)} callback 146 * @param {function(!Event)} callback
148 * @param {!Event} event 147 * @param {!Event} event
149 * @return {boolean} 148 * @return {boolean}
150 * @this {Components.Spectrum} 149 * @this {Components.Spectrum}
(...skipping 51 matching lines...) Expand 10 before | Expand all | Expand 10 after
202 _onCopyIconMouseout() { 201 _onCopyIconMouseout() {
203 this._swatchCopyIcon.setIconType('largeicon-copy'); 202 this._swatchCopyIcon.setIconType('largeicon-copy');
204 } 203 }
205 204
206 _updatePalettePanel() { 205 _updatePalettePanel() {
207 this._palettePanel.removeChildren(); 206 this._palettePanel.removeChildren();
208 var title = this._palettePanel.createChild('div', 'palette-title'); 207 var title = this._palettePanel.createChild('div', 'palette-title');
209 title.textContent = Common.UIString('Color Palettes'); 208 title.textContent = Common.UIString('Color Palettes');
210 var toolbar = new UI.Toolbar('', this._palettePanel); 209 var toolbar = new UI.Toolbar('', this._palettePanel);
211 var closeButton = new UI.ToolbarButton('Return to color picker', 'largeicon- delete'); 210 var closeButton = new UI.ToolbarButton('Return to color picker', 'largeicon- delete');
212 closeButton.addEventListener(UI.ToolbarButton.Events.Click, this._togglePale ttePanel.bind(this, false)); 211 closeButton.addEventListener('click', this._togglePalettePanel.bind(this, fa lse));
213 toolbar.appendToolbarItem(closeButton); 212 toolbar.appendToolbarItem(closeButton);
214 for (var palette of this._palettes.values()) 213 for (var palette of this._palettes.values())
215 this._palettePanel.appendChild(this._createPreviewPaletteElement(palette)) ; 214 this._palettePanel.appendChild(this._createPreviewPaletteElement(palette)) ;
216 } 215 }
217 216
218 /** 217 /**
219 * @param {boolean} show 218 * @param {boolean} show
220 */ 219 */
221 _togglePalettePanel(show) { 220 _togglePalettePanel(show) {
222 if (this._palettePanelShowing === show) 221 if (this._palettePanelShowing === show)
(...skipping 295 matching lines...) Expand 10 before | Expand all | Expand 10 after
518 */ 517 */
519 _paletteColorSelected(colorText, matchUserFormat) { 518 _paletteColorSelected(colorText, matchUserFormat) {
520 var color = Common.Color.parse(colorText); 519 var color = Common.Color.parse(colorText);
521 if (!color) 520 if (!color)
522 return; 521 return;
523 this._innerSetColor( 522 this._innerSetColor(
524 color.hsva(), colorText, matchUserFormat ? this._colorFormat : color.for mat(), 523 color.hsva(), colorText, matchUserFormat ? this._colorFormat : color.for mat(),
525 Components.Spectrum._ChangeSource.Other); 524 Components.Spectrum._ChangeSource.Other);
526 } 525 }
527 526
528 /** 527 _addColorToCustomPalette() {
529 * @param {!Common.Event} event
530 */
531 _addColorToCustomPalette(event) {
532 var palette = this._customPaletteSetting.get(); 528 var palette = this._customPaletteSetting.get();
533 palette.colors.push(this.colorString()); 529 palette.colors.push(this.colorString());
534 this._customPaletteSetting.set(palette); 530 this._customPaletteSetting.set(palette);
535 this._showPalette(this._customPaletteSetting.get(), false); 531 this._showPalette(this._customPaletteSetting.get(), false);
536 } 532 }
537 533
538 /** 534 /**
539 * @param {number} colorIndex 535 * @param {number} colorIndex
540 * @param {!Event} event 536 * @param {!Event} event
541 */ 537 */
(...skipping 510 matching lines...) Expand 10 before | Expand all | Expand 10 after
1052 '#607D8B': 1048 '#607D8B':
1053 ['#ECEFF1', '#CFD8DC', '#B0BEC5', '#90A4AE', '#78909C', '#607D8B', '#546E7 A', '#455A64', '#37474F', '#263238'] 1049 ['#ECEFF1', '#CFD8DC', '#B0BEC5', '#90A4AE', '#78909C', '#607D8B', '#546E7 A', '#455A64', '#37474F', '#263238']
1054 }; 1050 };
1055 1051
1056 Components.Spectrum.MaterialPalette = { 1052 Components.Spectrum.MaterialPalette = {
1057 title: 'Material', 1053 title: 'Material',
1058 mutable: false, 1054 mutable: false,
1059 matchUserFormat: true, 1055 matchUserFormat: true,
1060 colors: Object.keys(Components.Spectrum.MaterialPaletteShades) 1056 colors: Object.keys(Components.Spectrum.MaterialPaletteShades)
1061 }; 1057 };
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698