OLD | NEW |
1 /* | 1 /* |
2 * Copyright (C) 2007, 2008 Apple Inc. All rights reserved. | 2 * Copyright (C) 2007, 2008 Apple Inc. All rights reserved. |
3 * Copyright (C) 2008 Matt Lilek <webkit@mattlilek.com> | 3 * Copyright (C) 2008 Matt Lilek <webkit@mattlilek.com> |
4 * Copyright (C) 2009 Joseph Pecoraro | 4 * Copyright (C) 2009 Joseph Pecoraro |
5 * | 5 * |
6 * Redistribution and use in source and binary forms, with or without | 6 * Redistribution and use in source and binary forms, with or without |
7 * modification, are permitted provided that the following conditions | 7 * modification, are permitted provided that the following conditions |
8 * are met: | 8 * are met: |
9 * | 9 * |
10 * 1. Redistributions of source code must retain the above copyright | 10 * 1. Redistributions of source code must retain the above copyright |
(...skipping 95 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
106 | 106 |
107 this._nodeSearchButton = new WebInspector.StatusBarButton(WebInspector.UIStr
ing("Select an element in the page to inspect it."), "node-search-status-bar-ite
m"); | 107 this._nodeSearchButton = new WebInspector.StatusBarButton(WebInspector.UIStr
ing("Select an element in the page to inspect it."), "node-search-status-bar-ite
m"); |
108 this._nodeSearchButton.addEventListener("click", this.toggleSearchingForNode
.bind(this), false); | 108 this._nodeSearchButton.addEventListener("click", this.toggleSearchingForNode
.bind(this), false); |
109 | 109 |
110 this.element.appendChild(this.contentElement); | 110 this.element.appendChild(this.contentElement); |
111 this.element.appendChild(this.sidebarElement); | 111 this.element.appendChild(this.sidebarElement); |
112 this.element.appendChild(this.sidebarResizeElement); | 112 this.element.appendChild(this.sidebarResizeElement); |
113 | 113 |
114 this._registerShortcuts(); | 114 this._registerShortcuts(); |
115 | 115 |
116 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.NodeInse
rted, this._nodeUpdated.bind(this, true)); | 116 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.NodeInse
rted, this._nodeInserted, this); |
117 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.NodeRemo
ved, this._nodeRemoved, this); | 117 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.NodeRemo
ved, this._nodeRemoved, this); |
118 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.AttrModi
fied, this._attributesUpdated, this); | 118 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.AttrModi
fied, this._attributesUpdated, this); |
119 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.Characte
rDataModified, this._nodeUpdated.bind(this, false)); | 119 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.Characte
rDataModified, this._characterDataModified, this); |
120 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.Document
Updated, this._documentUpdated, this); | 120 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.Document
Updated, this._documentUpdated, this); |
121 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.ChildNod
eCountUpdated, this._childNodeCountUpdated, this); | 121 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.ChildNod
eCountUpdated, this._childNodeCountUpdated, this); |
122 WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.ShadowRo
otUpdated, this._nodeUpdated.bind(this, true)); | |
123 | 122 |
124 this.recentlyModifiedNodes = []; | 123 this.recentlyModifiedNodes = []; |
125 } | 124 } |
126 | 125 |
127 WebInspector.ElementsPanel.prototype = { | 126 WebInspector.ElementsPanel.prototype = { |
128 get toolbarItemLabel() | 127 get toolbarItemLabel() |
129 { | 128 { |
130 return WebInspector.UIString("Elements"); | 129 return WebInspector.UIString("Elements"); |
131 }, | 130 }, |
132 | 131 |
(...skipping 292 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
425 startEditingStyle: function() | 424 startEditingStyle: function() |
426 { | 425 { |
427 this._isEditingStyle = true; | 426 this._isEditingStyle = true; |
428 }, | 427 }, |
429 | 428 |
430 endEditingStyle: function() | 429 endEditingStyle: function() |
431 { | 430 { |
432 delete this._isEditingStyle; | 431 delete this._isEditingStyle; |
433 }, | 432 }, |
434 | 433 |
435 _nodeUpdated: function(hierarchyUpdated, event) | |
436 { | |
437 var updatedNodeDetails = { node: event.data }; | |
438 if (hierarchyUpdated) | |
439 updatedNodeDetails.parent = event.data.parentNode; | |
440 this.recentlyModifiedNodes.push(updatedNodeDetails); | |
441 if (this.visible) | |
442 this._updateModifiedNodesSoon(); | |
443 }, | |
444 | |
445 _attributesUpdated: function(event) | 434 _attributesUpdated: function(event) |
446 { | 435 { |
447 this._nodeUpdated(false, event); | 436 this.recentlyModifiedNodes.push({node: event.data, updated: true}); |
| 437 if (this.visible) |
| 438 this._updateModifiedNodesSoon(); |
448 | 439 |
449 if (!this._isEditingStyle && event.data === this.focusedDOMNode) | 440 if (!this._isEditingStyle && event.data === this.focusedDOMNode) |
450 this._styleSheetChanged(); | 441 this._styleSheetChanged(); |
451 }, | 442 }, |
452 | 443 |
453 _nodeRemoved: function(event) | 444 _characterDataModified: function(event) |
454 { | 445 { |
455 this.recentlyModifiedNodes.push({node: event.data.node, parent: event.da
ta.parent}); | 446 this.recentlyModifiedNodes.push({node: event.data, updated: true}); |
456 if (this.visible) | 447 if (this.visible) |
457 this._updateModifiedNodesSoon(); | 448 this._updateModifiedNodesSoon(); |
458 }, | 449 }, |
| 450 |
| 451 _nodeInserted: function(event) |
| 452 { |
| 453 this.recentlyModifiedNodes.push({node: event.data, parent: event.data.pa
rentNode, inserted: true}); |
| 454 if (this.visible) |
| 455 this._updateModifiedNodesSoon(); |
| 456 }, |
| 457 |
| 458 _nodeRemoved: function(event) |
| 459 { |
| 460 this.recentlyModifiedNodes.push({node: event.data.node, parent: event.da
ta.parent, removed: true}); |
| 461 if (this.visible) |
| 462 this._updateModifiedNodesSoon(); |
| 463 }, |
459 | 464 |
460 _childNodeCountUpdated: function(event) | 465 _childNodeCountUpdated: function(event) |
461 { | 466 { |
462 var treeElement = this.treeOutline.findTreeElement(event.data); | 467 var treeElement = this.treeOutline.findTreeElement(event.data); |
463 if (treeElement) | 468 if (treeElement) |
464 treeElement.hasChildren = event.data.hasChildNodes(); | 469 treeElement.hasChildren = event.data.hasChildNodes(); |
465 }, | 470 }, |
466 | 471 |
467 _updateModifiedNodesSoon: function() | 472 _updateModifiedNodesSoon: function() |
468 { | 473 { |
469 if ("_updateModifiedNodesTimeout" in this) | 474 if ("_updateModifiedNodesTimeout" in this) |
470 return; | 475 return; |
471 this._updateModifiedNodesTimeout = setTimeout(this.updateModifiedNodes.b
ind(this), 0); | 476 this._updateModifiedNodesTimeout = setTimeout(this.updateModifiedNodes.b
ind(this), 0); |
472 }, | 477 }, |
473 | 478 |
474 updateModifiedNodes: function() | 479 updateModifiedNodes: function() |
475 { | 480 { |
476 if ("_updateModifiedNodesTimeout" in this) { | 481 if ("_updateModifiedNodesTimeout" in this) { |
477 clearTimeout(this._updateModifiedNodesTimeout); | 482 clearTimeout(this._updateModifiedNodesTimeout); |
478 delete this._updateModifiedNodesTimeout; | 483 delete this._updateModifiedNodesTimeout; |
479 } | 484 } |
480 | 485 |
481 var updatedParentTreeElements = []; | 486 var updatedParentTreeElements = []; |
482 var updateBreadcrumbs = false; | 487 var updateBreadcrumbs = false; |
483 | 488 |
484 for (var i = 0; i < this.recentlyModifiedNodes.length; ++i) { | 489 for (var i = 0; i < this.recentlyModifiedNodes.length; ++i) { |
485 var parent = this.recentlyModifiedNodes[i].parent; | 490 var parent = this.recentlyModifiedNodes[i].parent; |
486 var node = this.recentlyModifiedNodes[i].node; | 491 var node = this.recentlyModifiedNodes[i].node; |
487 | 492 |
488 if (!parent) { | 493 if (this.recentlyModifiedNodes[i].updated) { |
489 var nodeItem = this.treeOutline.findTreeElement(node); | 494 var nodeItem = this.treeOutline.findTreeElement(node); |
490 if (nodeItem) | 495 if (nodeItem) |
491 nodeItem.updateTitle(); | 496 nodeItem.updateTitle(); |
492 continue; | 497 continue; |
493 } | 498 } |
494 | 499 |
| 500 if (!parent) |
| 501 continue; |
| 502 |
495 var parentNodeItem = this.treeOutline.findTreeElement(parent); | 503 var parentNodeItem = this.treeOutline.findTreeElement(parent); |
496 if (parentNodeItem && !parentNodeItem.alreadyUpdatedChildren) { | 504 if (parentNodeItem && !parentNodeItem.alreadyUpdatedChildren) { |
497 parentNodeItem.updateChildren(); | 505 parentNodeItem.updateChildren(); |
498 parentNodeItem.alreadyUpdatedChildren = true; | 506 parentNodeItem.alreadyUpdatedChildren = true; |
499 updatedParentTreeElements.push(parentNodeItem); | 507 updatedParentTreeElements.push(parentNodeItem); |
500 } | 508 } |
501 | 509 |
502 if (!updateBreadcrumbs && (this.focusedDOMNode === parent || isAnces
torNode(this.focusedDOMNode, parent))) | 510 if (!updateBreadcrumbs && (this.focusedDOMNode === parent || isAnces
torNode(this.focusedDOMNode, parent))) |
503 updateBreadcrumbs = true; | 511 updateBreadcrumbs = true; |
504 } | 512 } |
(...skipping 149 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
654 break | 662 break |
655 | 663 |
656 case Node.COMMENT_NODE: | 664 case Node.COMMENT_NODE: |
657 crumbTitle = "<!-->"; | 665 crumbTitle = "<!-->"; |
658 break; | 666 break; |
659 | 667 |
660 case Node.DOCUMENT_TYPE_NODE: | 668 case Node.DOCUMENT_TYPE_NODE: |
661 crumbTitle = "<!DOCTYPE>"; | 669 crumbTitle = "<!DOCTYPE>"; |
662 break; | 670 break; |
663 | 671 |
664 case Node.SHADOW_ROOT_NODE: | |
665 crumbTitle = "(shadow)"; | |
666 break; | |
667 | |
668 default: | 672 default: |
669 crumbTitle = this.treeOutline.nodeNameToCorrectCase(current.
nodeName()); | 673 crumbTitle = this.treeOutline.nodeNameToCorrectCase(current.
nodeName()); |
670 } | 674 } |
671 | 675 |
672 if (!crumb.childNodes.length) { | 676 if (!crumb.childNodes.length) { |
673 var nameElement = document.createElement("span"); | 677 var nameElement = document.createElement("span"); |
674 nameElement.textContent = crumbTitle; | 678 nameElement.textContent = crumbTitle; |
675 crumb.appendChild(nameElement); | 679 crumb.appendChild(nameElement); |
676 crumb.title = crumbTitle; | 680 crumb.title = crumbTitle; |
677 } | 681 } |
(...skipping 469 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1147 this.setSearchingForNode(!this._nodeSearchButton.toggled); | 1151 this.setSearchingForNode(!this._nodeSearchButton.toggled); |
1148 }, | 1152 }, |
1149 | 1153 |
1150 elementsToRestoreScrollPositionsFor: function() | 1154 elementsToRestoreScrollPositionsFor: function() |
1151 { | 1155 { |
1152 return [ this.contentElement, this.sidebarElement ]; | 1156 return [ this.contentElement, this.sidebarElement ]; |
1153 } | 1157 } |
1154 } | 1158 } |
1155 | 1159 |
1156 WebInspector.ElementsPanel.prototype.__proto__ = WebInspector.Panel.prototype; | 1160 WebInspector.ElementsPanel.prototype.__proto__ = WebInspector.Panel.prototype; |
OLD | NEW |