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

Side by Side Diff: Source/devtools/front_end/layers/LayersPanel.js

Issue 711423002: DevTools: better visual feedback for hovered objects is Layers3DView (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: addressed review comments, fixed test Created 6 years, 1 month 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 | Annotate | Revision Log
OLDNEW
1 /* 1 /*
2 * Copyright (C) 2013 Google Inc. All rights reserved. 2 * Copyright (C) 2013 Google Inc. 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 are 5 * modification, are permitted provided that the following conditions are
6 * met: 6 * met:
7 * 7 *
8 * * Redistributions of source code must retain the above copyright 8 * * 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 * * Redistributions in binary form must reproduce the above 10 * * Redistributions in binary form must reproduce the above
(...skipping 145 matching lines...) Expand 10 before | Expand all | Expand 10 after
156 this._layers3DView.setLayerTree(this._target.layerTreeModel.layerTree()) ; 156 this._layers3DView.setLayerTree(this._target.layerTreeModel.layerTree()) ;
157 if (this._currentlySelectedLayer && this._currentlySelectedLayer.layer = == event.data) 157 if (this._currentlySelectedLayer && this._currentlySelectedLayer.layer = == event.data)
158 this._layerDetailsView.update(); 158 this._layerDetailsView.update();
159 }, 159 },
160 160
161 /** 161 /**
162 * @param {!WebInspector.Event} event 162 * @param {!WebInspector.Event} event
163 */ 163 */
164 _onObjectSelected: function(event) 164 _onObjectSelected: function(event)
165 { 165 {
166 var activeObject = /** @type {!WebInspector.Layers3DView.ActiveObject} * / (event.data); 166 var selection = /** @type {!WebInspector.Layers3DView.Selection} */ (eve nt.data);
167 this._selectObject(activeObject); 167 this._selectObject(selection);
168 }, 168 },
169 169
170 /** 170 /**
171 * @param {!WebInspector.Event} event 171 * @param {!WebInspector.Event} event
172 */ 172 */
173 _onObjectHovered: function(event) 173 _onObjectHovered: function(event)
174 { 174 {
175 var activeObject = /** @type {!WebInspector.Layers3DView.ActiveObject} * / (event.data); 175 var selection = /** @type {!WebInspector.Layers3DView.Selection} */ (eve nt.data);
176 this._hoverObject(activeObject); 176 this._hoverObject(selection);
177 }, 177 },
178 178
179 /** 179 /**
180 * @param {!WebInspector.Event} event 180 * @param {!WebInspector.Event} event
181 */ 181 */
182 _onSnapshotRequested: function(event) 182 _onSnapshotRequested: function(event)
183 { 183 {
184 var layer = /** @type {!WebInspector.Layer} */ (event.data); 184 var layer = /** @type {!WebInspector.Layer} */ (event.data);
185 this._tabbedPane.selectTab(WebInspector.LayersPanel.DetailsViewTabs.Prof iler); 185 this._tabbedPane.selectTab(WebInspector.LayersPanel.DetailsViewTabs.Prof iler);
186 this._paintProfilerView.profileLayer(layer); 186 this._paintProfilerView.profileLayer(layer);
187 }, 187 },
188 188
189 /** 189 /**
190 * @param {?WebInspector.Layers3DView.ActiveObject} activeObject 190 * @param {?WebInspector.Layers3DView.Selection} selection
191 */ 191 */
192 _selectObject: function(activeObject) 192 _selectObject: function(selection)
193 { 193 {
194 var layer = activeObject && activeObject.layer; 194 var layer = selection && selection.layer;
195 if (this._currentlySelectedLayer === activeObject) 195 if (this._currentlySelectedLayer === selection)
196 return; 196 return;
197 this._currentlySelectedLayer = activeObject; 197 this._currentlySelectedLayer = selection;
198 var node = layer ? layer.nodeForSelfOrAncestor() : null; 198 var node = layer ? layer.nodeForSelfOrAncestor() : null;
199 if (node) 199 if (node)
200 node.highlightForTwoSeconds(); 200 node.highlightForTwoSeconds();
201 else if (this._target) 201 else if (this._target)
202 this._target.domModel.hideDOMNodeHighlight(); 202 this._target.domModel.hideDOMNodeHighlight();
203 this._layerTreeOutline.selectLayer(layer); 203 this._layerTreeOutline.selectLayer(layer);
204 this._layers3DView.selectObject(activeObject); 204 this._layers3DView.selectObject(selection);
205 this._layerDetailsView.setObject(activeObject); 205 this._layerDetailsView.setObject(selection);
206 }, 206 },
207 207
208 /** 208 /**
209 * @param {?WebInspector.Layers3DView.ActiveObject} activeObject 209 * @param {?WebInspector.Layers3DView.Selection} selection
210 */ 210 */
211 _hoverObject: function(activeObject) 211 _hoverObject: function(selection)
212 { 212 {
213 var layer = activeObject && activeObject.layer; 213 var layer = selection && selection.layer;
214 if (this._currentlyHoveredLayer === activeObject) 214 if (this._currentlyHoveredLayer === selection)
215 return; 215 return;
216 this._currentlyHoveredLayer = activeObject; 216 this._currentlyHoveredLayer = selection;
217 var node = layer ? layer.nodeForSelfOrAncestor() : null; 217 var node = layer ? layer.nodeForSelfOrAncestor() : null;
218 if (node) 218 if (node)
219 node.highlight(); 219 node.highlight();
220 else if (this._target) 220 else if (this._target)
221 this._target.domModel.hideDOMNodeHighlight(); 221 this._target.domModel.hideDOMNodeHighlight();
222 this._layerTreeOutline.hoverLayer(layer); 222 this._layerTreeOutline.hoverLayer(layer);
223 this._layers3DView.hoverObject(activeObject); 223 this._layers3DView.hoverObject(selection);
224 }, 224 },
225 225
226 __proto__: WebInspector.PanelWithSidebarTree.prototype 226 __proto__: WebInspector.PanelWithSidebarTree.prototype
227 } 227 }
228 228
229 /** 229 /**
230 * @constructor 230 * @constructor
231 * @implements {WebInspector.Revealer} 231 * @implements {WebInspector.Revealer}
232 */ 232 */
233 WebInspector.LayersPanel.LayerTreeRevealer = function() 233 WebInspector.LayersPanel.LayerTreeRevealer = function()
(...skipping 36 matching lines...) Expand 10 before | Expand all | Expand 10 after
270 270
271 WebInspector.LayersPanelFactory.prototype = { 271 WebInspector.LayersPanelFactory.prototype = {
272 /** 272 /**
273 * @return {!WebInspector.Panel} 273 * @return {!WebInspector.Panel}
274 */ 274 */
275 createPanel: function() 275 createPanel: function()
276 { 276 {
277 return WebInspector.LayersPanel._instance(); 277 return WebInspector.LayersPanel._instance();
278 } 278 }
279 } 279 }
OLDNEW
« no previous file with comments | « LayoutTests/inspector/layers/layers-3d-view-hit-testing.html ('k') | Source/devtools/front_end/timeline/LayerDetailsView.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698