Web Inspector: Convert TreeElement classes to ES6
authortimothy@apple.com <timothy@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 26 Mar 2015 23:38:12 +0000 (23:38 +0000)
committertimothy@apple.com <timothy@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 26 Mar 2015 23:38:12 +0000 (23:38 +0000)
https://bugs.webkit.org/show_bug.cgi?id=143111

Reviewed by Joseph Pecoraro.

* UserInterface/Views/ApplicationCacheFrameTreeElement.js:
* UserInterface/Views/ApplicationCacheManifestTreeElement.js:
* UserInterface/Views/BreakpointTreeElement.js:
* UserInterface/Views/CallFrameTreeElement.js:
* UserInterface/Views/ContentFlowTreeElement.js:
* UserInterface/Views/CookieStorageTreeElement.js:
* UserInterface/Views/DOMStorageTreeElement.js:
* UserInterface/Views/DOMTreeElement.js:
* UserInterface/Views/DOMTreeOutline.js:
* UserInterface/Views/DatabaseHostTreeElement.js:
* UserInterface/Views/DatabaseTableTreeElement.js:
* UserInterface/Views/DatabaseTreeElement.js:
* UserInterface/Views/FolderTreeElement.js:
* UserInterface/Views/FolderizedTreeElement.js:
* UserInterface/Views/FrameTreeElement.js:
* UserInterface/Views/GeneralTreeElement.js:
* UserInterface/Views/IndexedDatabaseHostTreeElement.js:
* UserInterface/Views/IndexedDatabaseObjectStoreIndexTreeElement.js:
* UserInterface/Views/IndexedDatabaseObjectStoreTreeElement.js:
* UserInterface/Views/IndexedDatabaseTreeElement.js:
* UserInterface/Views/LegacyConsoleMessageImpl.js:
* UserInterface/Views/LogTreeElement.js:
* UserInterface/Views/NavigationSidebarPanel.js:
* UserInterface/Views/ObjectTreeArrayIndexTreeElement.js:
* UserInterface/Views/ObjectTreeBaseTreeElement.js:
* UserInterface/Views/ObjectTreeMapEntryTreeElement.js:
* UserInterface/Views/ObjectTreePropertyTreeElement.js:
* UserInterface/Views/ObjectTreeSetIndexTreeElement.js:
* UserInterface/Views/ObjectTreeView.js:
* UserInterface/Views/ProfileNodeTreeElement.js:
* UserInterface/Views/PropertiesSection.js:
* UserInterface/Views/ResourceTreeElement.js:
* UserInterface/Views/ScriptTreeElement.js:
* UserInterface/Views/SearchResultTreeElement.js:
* UserInterface/Views/SourceCodeTimelineTreeElement.js:
* UserInterface/Views/SourceCodeTreeElement.js:
* UserInterface/Views/SourceMapResourceTreeElement.js:
* UserInterface/Views/StorageTreeElement.js:
* UserInterface/Views/TimelineDataGrid.js:
* UserInterface/Views/TimelineRecordTreeElement.js:
* UserInterface/Views/TreeElementStatusButton.js:
* UserInterface/Views/TreeOutline.js:
* UserInterface/Views/TreeOutlineDataGridSynchronizer.js:
* UserInterface/Views/TypePropertiesSection.js:
Converted to ES6 classes where possible.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@182042 268f45cc-cd09-0410-ab3c-d52691b4dbfc

45 files changed:
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Views/ApplicationCacheFrameTreeElement.js
Source/WebInspectorUI/UserInterface/Views/ApplicationCacheManifestTreeElement.js
Source/WebInspectorUI/UserInterface/Views/BreakpointTreeElement.js
Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.js
Source/WebInspectorUI/UserInterface/Views/ContentFlowTreeElement.js
Source/WebInspectorUI/UserInterface/Views/CookieStorageTreeElement.js
Source/WebInspectorUI/UserInterface/Views/DOMStorageTreeElement.js
Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js
Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.js
Source/WebInspectorUI/UserInterface/Views/DatabaseHostTreeElement.js
Source/WebInspectorUI/UserInterface/Views/DatabaseTableTreeElement.js
Source/WebInspectorUI/UserInterface/Views/DatabaseTreeElement.js
Source/WebInspectorUI/UserInterface/Views/FolderTreeElement.js
Source/WebInspectorUI/UserInterface/Views/FolderizedTreeElement.js
Source/WebInspectorUI/UserInterface/Views/FrameTreeElement.js
Source/WebInspectorUI/UserInterface/Views/GeneralTreeElement.js
Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseHostTreeElement.js
Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseObjectStoreIndexTreeElement.js
Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseObjectStoreTreeElement.js
Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseTreeElement.js
Source/WebInspectorUI/UserInterface/Views/LegacyConsoleMessageImpl.js
Source/WebInspectorUI/UserInterface/Views/LogTreeElement.js
Source/WebInspectorUI/UserInterface/Views/NavigationSidebarPanel.js
Source/WebInspectorUI/UserInterface/Views/ObjectTreeArrayIndexTreeElement.js
Source/WebInspectorUI/UserInterface/Views/ObjectTreeBaseTreeElement.js
Source/WebInspectorUI/UserInterface/Views/ObjectTreeMapEntryTreeElement.js
Source/WebInspectorUI/UserInterface/Views/ObjectTreePropertyTreeElement.js
Source/WebInspectorUI/UserInterface/Views/ObjectTreeSetIndexTreeElement.js
Source/WebInspectorUI/UserInterface/Views/ObjectTreeView.js
Source/WebInspectorUI/UserInterface/Views/ProfileNodeTreeElement.js
Source/WebInspectorUI/UserInterface/Views/PropertiesSection.js
Source/WebInspectorUI/UserInterface/Views/ResourceTreeElement.js
Source/WebInspectorUI/UserInterface/Views/ScriptTreeElement.js
Source/WebInspectorUI/UserInterface/Views/SearchResultTreeElement.js
Source/WebInspectorUI/UserInterface/Views/SourceCodeTimelineTreeElement.js
Source/WebInspectorUI/UserInterface/Views/SourceCodeTreeElement.js
Source/WebInspectorUI/UserInterface/Views/SourceMapResourceTreeElement.js
Source/WebInspectorUI/UserInterface/Views/StorageTreeElement.js
Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.js
Source/WebInspectorUI/UserInterface/Views/TimelineRecordTreeElement.js
Source/WebInspectorUI/UserInterface/Views/TreeElementStatusButton.js
Source/WebInspectorUI/UserInterface/Views/TreeOutline.js
Source/WebInspectorUI/UserInterface/Views/TreeOutlineDataGridSynchronizer.js
Source/WebInspectorUI/UserInterface/Views/TypePropertiesSection.js

index e588705..4676551 100644 (file)
@@ -1,5 +1,58 @@
 2015-03-26  Timothy Hatcher  <timothy@apple.com>
 
+        Web Inspector: Convert TreeElement classes to ES6
+        https://bugs.webkit.org/show_bug.cgi?id=143111
+
+        Reviewed by Joseph Pecoraro.
+
+        * UserInterface/Views/ApplicationCacheFrameTreeElement.js:
+        * UserInterface/Views/ApplicationCacheManifestTreeElement.js:
+        * UserInterface/Views/BreakpointTreeElement.js:
+        * UserInterface/Views/CallFrameTreeElement.js:
+        * UserInterface/Views/ContentFlowTreeElement.js:
+        * UserInterface/Views/CookieStorageTreeElement.js:
+        * UserInterface/Views/DOMStorageTreeElement.js:
+        * UserInterface/Views/DOMTreeElement.js:
+        * UserInterface/Views/DOMTreeOutline.js:
+        * UserInterface/Views/DatabaseHostTreeElement.js:
+        * UserInterface/Views/DatabaseTableTreeElement.js:
+        * UserInterface/Views/DatabaseTreeElement.js:
+        * UserInterface/Views/FolderTreeElement.js:
+        * UserInterface/Views/FolderizedTreeElement.js:
+        * UserInterface/Views/FrameTreeElement.js:
+        * UserInterface/Views/GeneralTreeElement.js:
+        * UserInterface/Views/IndexedDatabaseHostTreeElement.js:
+        * UserInterface/Views/IndexedDatabaseObjectStoreIndexTreeElement.js:
+        * UserInterface/Views/IndexedDatabaseObjectStoreTreeElement.js:
+        * UserInterface/Views/IndexedDatabaseTreeElement.js:
+        * UserInterface/Views/LegacyConsoleMessageImpl.js:
+        * UserInterface/Views/LogTreeElement.js:
+        * UserInterface/Views/NavigationSidebarPanel.js:
+        * UserInterface/Views/ObjectTreeArrayIndexTreeElement.js:
+        * UserInterface/Views/ObjectTreeBaseTreeElement.js:
+        * UserInterface/Views/ObjectTreeMapEntryTreeElement.js:
+        * UserInterface/Views/ObjectTreePropertyTreeElement.js:
+        * UserInterface/Views/ObjectTreeSetIndexTreeElement.js:
+        * UserInterface/Views/ObjectTreeView.js:
+        * UserInterface/Views/ProfileNodeTreeElement.js:
+        * UserInterface/Views/PropertiesSection.js:
+        * UserInterface/Views/ResourceTreeElement.js:
+        * UserInterface/Views/ScriptTreeElement.js:
+        * UserInterface/Views/SearchResultTreeElement.js:
+        * UserInterface/Views/SourceCodeTimelineTreeElement.js:
+        * UserInterface/Views/SourceCodeTreeElement.js:
+        * UserInterface/Views/SourceMapResourceTreeElement.js:
+        * UserInterface/Views/StorageTreeElement.js:
+        * UserInterface/Views/TimelineDataGrid.js:
+        * UserInterface/Views/TimelineRecordTreeElement.js:
+        * UserInterface/Views/TreeElementStatusButton.js:
+        * UserInterface/Views/TreeOutline.js:
+        * UserInterface/Views/TreeOutlineDataGridSynchronizer.js:
+        * UserInterface/Views/TypePropertiesSection.js:
+        Converted to ES6 classes where possible.
+
+2015-03-26  Timothy Hatcher  <timothy@apple.com>
+
         Web Inspector: Convert sidebar classes to ES6
         https://bugs.webkit.org/show_bug.cgi?id=143108
 
index 7abc54f..bdd558a 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ApplicationCacheFrameTreeElement = function(representedObject)
+WebInspector.ApplicationCacheFrameTreeElement = class ApplicationCacheFrameTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(representedObject instanceof WebInspector.ApplicationCacheFrame);
-
-    WebInspector.GeneralTreeElement.call(this, WebInspector.ApplicationCacheFrameTreeElement.StyleClassName, "", "", representedObject, false);
-
-    this.small = true;
+    constructor(representedObject)
+    {
+        console.assert(representedObject instanceof WebInspector.ApplicationCacheFrame);
 
-    this.updateTitles();
-};
+        super("application-cache-frame", "", "", representedObject, false);
 
-WebInspector.ApplicationCacheFrameTreeElement.StyleClassName = "application-cache-frame";
+        this.small = true;
 
-WebInspector.ApplicationCacheFrameTreeElement.prototype = {
-    constructor: WebInspector.ApplicationCacheFrameTreeElement,
+        this.updateTitles();
+    }
 
-    updateTitles: function()
+    updateTitles()
     {
         var url = this.representedObject.frame.url;
         var parsedURL = parseURL(url);
@@ -57,5 +54,3 @@ WebInspector.ApplicationCacheFrameTreeElement.prototype = {
         this.subtitle = subtitleIsDuplicate ? null : subtitle;
     }
 };
-
-WebInspector.ApplicationCacheFrameTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
index 9f893de..8056576 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ApplicationCacheManifestTreeElement = function(representedObject)
+WebInspector.ApplicationCacheManifestTreeElement = class ApplicationCacheManifestTreeElement extends WebInspector.StorageTreeElement
 {
-    console.assert(representedObject instanceof WebInspector.ApplicationCacheManifest);
-
-    WebInspector.StorageTreeElement.call(this, WebInspector.ApplicationCacheManifestTreeElement.StyleClassName, "", representedObject);
-};
-
-WebInspector.ApplicationCacheManifestTreeElement.StyleClassName = "application-cache-manifest";
+    constructor(representedObject)
+    {
+        console.assert(representedObject instanceof WebInspector.ApplicationCacheManifest);
 
-WebInspector.ApplicationCacheManifestTreeElement.prototype = {
-    constructor: WebInspector.ApplicationCacheManifestTreeElement,
+        super("application-cache-manifest", "", representedObject);
+    }
 
     // Public
 
@@ -43,7 +40,7 @@ WebInspector.ApplicationCacheManifestTreeElement.prototype = {
             this._generateTitles();
 
         return this._name;
-    },
+    }
 
     get secondaryName()
     {
@@ -51,14 +48,14 @@ WebInspector.ApplicationCacheManifestTreeElement.prototype = {
             this._generateTitles();
 
         return this._secondaryName;
-    },
+    }
 
     get categoryName()
     {
         return WebInspector.UIString("Application Cache");
-    },
+    }
 
-    _generateTitles: function()
+    _generateTitles()
     {
         var parsedURL = parseURL(this.representedObject.manifestURL);
 
@@ -70,5 +67,3 @@ WebInspector.ApplicationCacheManifestTreeElement.prototype = {
         this._secondaryName = this._name !== secondaryName ? secondaryName : null;
     }
 };
-
-WebInspector.ApplicationCacheManifestTreeElement.prototype.__proto__ = WebInspector.StorageTreeElement.prototype;
index a09ac08..0866e3f 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013, 2014 Apple Inc. All rights reserved.
+ * Copyright (C) 2013-2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.BreakpointTreeElement = function(breakpoint, className, title)
+WebInspector.BreakpointTreeElement = class BreakpointTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(breakpoint instanceof WebInspector.Breakpoint);
-
-    if (!className)
-        className = WebInspector.BreakpointTreeElement.GenericLineIconStyleClassName;
-
-    WebInspector.GeneralTreeElement.call(this, [WebInspector.BreakpointTreeElement.StyleClassName, className], title, null, breakpoint, false);
-
-    this._breakpoint = breakpoint;
+    constructor(breakpoint, className, title)
+    {
+        console.assert(breakpoint instanceof WebInspector.Breakpoint);
 
-    this._listeners = new WebInspector.EventListenerSet(this, "BreakpointTreeElement listeners");
-    if (!title)
-        this._listeners.register(breakpoint, WebInspector.Breakpoint.Event.LocationDidChange, this._breakpointLocationDidChange);
-    this._listeners.register(breakpoint, WebInspector.Breakpoint.Event.DisabledStateDidChange, this._updateStatus);
-    this._listeners.register(breakpoint, WebInspector.Breakpoint.Event.AutoContinueDidChange, this._updateStatus);
-    this._listeners.register(breakpoint, WebInspector.Breakpoint.Event.ResolvedStateDidChange, this._updateStatus);
-    this._listeners.register(WebInspector.debuggerManager, WebInspector.DebuggerManager.Event.BreakpointsEnabledDidChange, this._updateStatus);
+        if (!className)
+            className = WebInspector.BreakpointTreeElement.GenericLineIconStyleClassName;
 
-    this._listeners.register(WebInspector.probeManager, WebInspector.ProbeManager.Event.ProbeSetAdded, this._probeSetAdded);
-    this._listeners.register(WebInspector.probeManager, WebInspector.ProbeManager.Event.ProbeSetRemoved, this._probeSetRemoved);
+        super(["breakpoint", className], title, null, breakpoint, false);
 
-    this._statusImageElement = document.createElement("img");
-    this._statusImageElement.className = WebInspector.BreakpointTreeElement.StatusImageElementStyleClassName;
-    this._listeners.register(this._statusImageElement, "mousedown", this._statusImageElementMouseDown);
-    this._listeners.register(this._statusImageElement, "click", this._statusImageElementClicked);
+        this._breakpoint = breakpoint;
 
-    if (!title)
-        this._updateTitles();
-    this._updateStatus();
+        this._listeners = new WebInspector.EventListenerSet(this, "BreakpointTreeElement listeners");
+        if (!title)
+            this._listeners.register(breakpoint, WebInspector.Breakpoint.Event.LocationDidChange, this._breakpointLocationDidChange);
+        this._listeners.register(breakpoint, WebInspector.Breakpoint.Event.DisabledStateDidChange, this._updateStatus);
+        this._listeners.register(breakpoint, WebInspector.Breakpoint.Event.AutoContinueDidChange, this._updateStatus);
+        this._listeners.register(breakpoint, WebInspector.Breakpoint.Event.ResolvedStateDidChange, this._updateStatus);
+        this._listeners.register(WebInspector.debuggerManager, WebInspector.DebuggerManager.Event.BreakpointsEnabledDidChange, this._updateStatus);
 
-    this.status = this._statusImageElement;
-    this.small = true;
+        this._listeners.register(WebInspector.probeManager, WebInspector.ProbeManager.Event.ProbeSetAdded, this._probeSetAdded);
+        this._listeners.register(WebInspector.probeManager, WebInspector.ProbeManager.Event.ProbeSetRemoved, this._probeSetRemoved);
 
-    this._iconAnimationLayerElement = document.createElement("span");
-    this.iconElement.appendChild(this._iconAnimationLayerElement);
-};
-
-WebInspector.BreakpointTreeElement.GenericLineIconStyleClassName = "breakpoint-generic-line-icon";
-WebInspector.BreakpointTreeElement.StyleClassName = "breakpoint";
-WebInspector.BreakpointTreeElement.StatusImageElementStyleClassName = "status-image";
-WebInspector.BreakpointTreeElement.StatusImageResolvedStyleClassName = "resolved";
-WebInspector.BreakpointTreeElement.StatusImageAutoContinueStyleClassName = "auto-continue";
-WebInspector.BreakpointTreeElement.StatusImageDisabledStyleClassName = "disabled";
-WebInspector.BreakpointTreeElement.FormattedLocationStyleClassName = "formatted-location";
-WebInspector.BreakpointTreeElement.ProbeDataUpdatedStyleClassName = "data-updated";
+        this._statusImageElement = document.createElement("img");
+        this._statusImageElement.className = WebInspector.BreakpointTreeElement.StatusImageElementStyleClassName;
+        this._listeners.register(this._statusImageElement, "mousedown", this._statusImageElementMouseDown);
+        this._listeners.register(this._statusImageElement, "click", this._statusImageElementClicked);
 
-WebInspector.BreakpointTreeElement.ProbeDataUpdatedAnimationDuration = 400; // milliseconds
+        if (!title)
+            this._updateTitles();
+        this._updateStatus();
 
+        this.status = this._statusImageElement;
+        this.small = true;
 
-WebInspector.BreakpointTreeElement.prototype = {
-    constructor: WebInspector.BreakpointTreeElement,
+        this._iconAnimationLayerElement = document.createElement("span");
+        this.iconElement.appendChild(this._iconAnimationLayerElement);
+    }
 
     // Public
 
     get breakpoint()
     {
         return this._breakpoint;
-    },
+    }
 
     get filterableData()
     {
         return {text: this.breakpoint.url};
-    },
+    }
 
-    ondelete: function()
+    ondelete()
     {
         if (!WebInspector.debuggerManager.isBreakpointRemovable(this._breakpoint))
             return false;
 
         WebInspector.debuggerManager.removeBreakpoint(this._breakpoint);
         return true;
-    },
+    }
 
-    onenter: function()
+    onenter()
     {
         this._breakpoint.cycleToNextMode();
         return true;
-    },
+    }
 
-    onspace: function()
+    onspace()
     {
         this._breakpoint.cycleToNextMode();
         return true;
-    },
+    }
 
-    oncontextmenu: function(event)
+    oncontextmenu(event)
     {
         var contextMenu = new WebInspector.ContextMenu(event);
         this._breakpoint.appendContextMenuItems(contextMenu, this._statusImageElement);
         contextMenu.show();
-    },
+    }
 
-    onattach: function()
+    onattach()
     {
         WebInspector.GeneralTreeElement.prototype.onattach.call(this);
 
@@ -125,9 +112,9 @@ WebInspector.BreakpointTreeElement.prototype = {
         for (var probeSet of WebInspector.probeManager.probeSets)
             if (probeSet.breakpoint === this._breakpoint)
                 this._addProbeSet(probeSet);
-    },
+    }
 
-    ondetach: function()
+    ondetach()
     {
         WebInspector.GeneralTreeElement.prototype.ondetach.call(this);
 
@@ -135,17 +122,17 @@ WebInspector.BreakpointTreeElement.prototype = {
 
         if (this._probeSet)
             this._removeProbeSet(this._probeSet);
-    },
+    }
 
-    removeStatusImage: function()
+    removeStatusImage()
     {
         this._statusImageElement.remove();
         this._statusImageElement = null;
-    },
+    }
 
     // Private
 
-    _updateTitles: function()
+    _updateTitles()
     {
         var sourceCodeLocation = this._breakpoint.sourceCodeLocation;
 
@@ -166,9 +153,9 @@ WebInspector.BreakpointTreeElement.prototype = {
 
             this.tooltip = this.mainTitle + " \u2014 " + WebInspector.UIString("originally %s").format(sourceCodeLocation.originalLocationString());
         }
-    },
+    }
 
-    _updateStatus: function()
+    _updateStatus()
     {
         if (!this._statusImageElement)
             return;
@@ -187,9 +174,9 @@ WebInspector.BreakpointTreeElement.prototype = {
             this._statusImageElement.classList.add(WebInspector.BreakpointTreeElement.StatusImageResolvedStyleClassName);
         else
             this._statusImageElement.classList.remove(WebInspector.BreakpointTreeElement.StatusImageResolvedStyleClassName);
-    },
+    }
 
-    _addProbeSet: function(probeSet)
+    _addProbeSet(probeSet)
     {
         console.assert(probeSet instanceof WebInspector.ProbeSet);
         console.assert(probeSet.breakpoint === this._breakpoint);
@@ -198,9 +185,9 @@ WebInspector.BreakpointTreeElement.prototype = {
         this._probeSet = probeSet;
         probeSet.addEventListener(WebInspector.ProbeSet.Event.SamplesCleared, this._samplesCleared, this);
         probeSet.dataTable.addEventListener(WebInspector.ProbeSetDataTable.Event.FrameInserted, this._dataUpdated, this);
-    },
+    }
 
-    _removeProbeSet: function(probeSet)
+    _removeProbeSet(probeSet)
     {
         console.assert(probeSet instanceof WebInspector.ProbeSet);
         console.assert(probeSet === this._probeSet);
@@ -208,32 +195,32 @@ WebInspector.BreakpointTreeElement.prototype = {
         probeSet.removeEventListener(WebInspector.ProbeSet.Event.SamplesCleared, this._samplesCleared, this);
         probeSet.dataTable.removeEventListener(WebInspector.ProbeSetDataTable.Event.FrameInserted, this._dataUpdated, this);
         delete this._probeSet;
-    },
+    }
 
-    _probeSetAdded: function(event)
+    _probeSetAdded(event)
     {
         var probeSet = event.data.probeSet;
         if (probeSet.breakpoint === this._breakpoint)
             this._addProbeSet(probeSet);
-    },
+    }
 
-    _probeSetRemoved: function(event)
+    _probeSetRemoved(event)
     {
         var probeSet = event.data.probeSet;
         if (probeSet.breakpoint === this._breakpoint)
             this._removeProbeSet(probeSet);
-    },
+    }
 
-    _samplesCleared: function(event)
+    _samplesCleared(event)
     {
         console.assert(this._probeSet);
 
         var oldTable = event.data.oldTable;
         oldTable.removeEventListener(WebInspector.ProbeSetDataTable.Event.FrameInserted, this._dataUpdated, this);
         this._probeSet.dataTable.addEventListener(WebInspector.ProbeSetDataTable.Event.FrameInserted, this._dataUpdated, this);
-    },
+    }
 
-    _dataUpdated: function()
+    _dataUpdated()
     {
         if (this.element.classList.contains(WebInspector.BreakpointTreeElement.ProbeDataUpdatedStyleClassName)) {
             clearTimeout(this._removeIconAnimationTimeoutIdentifier);
@@ -248,10 +235,10 @@ WebInspector.BreakpointTreeElement.prototype = {
         this._removeIconAnimationTimeoutIdentifier = setTimeout(function() {
             this.element.classList.remove(WebInspector.BreakpointTreeElement.ProbeDataUpdatedStyleClassName);
         }.bind(this), WebInspector.BreakpointTreeElement.ProbeDataUpdatedAnimationDuration);
-    },
+    }
 
 
-    _breakpointLocationDidChange: function(event)
+    _breakpointLocationDidChange(event)
     {
         console.assert(event.target === this._breakpoint);
 
@@ -260,18 +247,26 @@ WebInspector.BreakpointTreeElement.prototype = {
             return;
 
         this._updateTitles();
-    },
+    }
 
-    _statusImageElementMouseDown: function(event)
+    _statusImageElementMouseDown(event)
     {
         // To prevent the tree element from selecting.
         event.stopPropagation();
-    },
+    }
 
-    _statusImageElementClicked: function(event)
+    _statusImageElementClicked(event)
     {
         this._breakpoint.cycleToNextMode();
     }
 };
 
-WebInspector.BreakpointTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
+WebInspector.BreakpointTreeElement.GenericLineIconStyleClassName = "breakpoint-generic-line-icon";
+WebInspector.BreakpointTreeElement.StatusImageElementStyleClassName = "status-image";
+WebInspector.BreakpointTreeElement.StatusImageResolvedStyleClassName = "resolved";
+WebInspector.BreakpointTreeElement.StatusImageAutoContinueStyleClassName = "auto-continue";
+WebInspector.BreakpointTreeElement.StatusImageDisabledStyleClassName = "disabled";
+WebInspector.BreakpointTreeElement.FormattedLocationStyleClassName = "formatted-location";
+WebInspector.BreakpointTreeElement.ProbeDataUpdatedStyleClassName = "data-updated";
+
+WebInspector.BreakpointTreeElement.ProbeDataUpdatedAnimationDuration = 400; // milliseconds
index 1fb0329..c49a212 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.CallFrameTreeElement = function(callFrame)
+WebInspector.CallFrameTreeElement = class CallFrameTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(callFrame instanceof WebInspector.CallFrame);
+    constructor(callFrame)
+    {
+        console.assert(callFrame instanceof WebInspector.CallFrame);
 
-    var className = WebInspector.CallFrameTreeElement.FunctionIconStyleClassName;
-    if (callFrame.nativeCode)
-        className = WebInspector.CallFrameTreeElement.NativeIconStyleClassName;
+        var className = WebInspector.CallFrameTreeElement.FunctionIconStyleClassName;
+        if (callFrame.nativeCode)
+            className = WebInspector.CallFrameTreeElement.NativeIconStyleClassName;
 
-    // This is more than likely an event listener function with an "on" prefix and it is
-    // as long or longer than the shortest event listener name -- "oncut".
-    if (callFrame.functionName && callFrame.functionName.startsWith("on") && callFrame.functionName.length >= 5)
-        className = WebInspector.CallFrameTreeElement.EventListenerIconStyleClassName;
+        // This is more than likely an event listener function with an "on" prefix and it is
+        // as long or longer than the shortest event listener name -- "oncut".
+        if (callFrame.functionName && callFrame.functionName.startsWith("on") && callFrame.functionName.length >= 5)
+            className = WebInspector.CallFrameTreeElement.EventListenerIconStyleClassName;
 
-    var title = callFrame.functionName || WebInspector.UIString("(anonymous function)");
+        var title = callFrame.functionName || WebInspector.UIString("(anonymous function)");
 
-    WebInspector.GeneralTreeElement.call(this, className, title, null, callFrame, false);
+        super(className, title, null, callFrame, false);
 
-    if (!callFrame.nativeCode && callFrame.sourceCodeLocation) {
-        var displayScriptURL = callFrame.sourceCodeLocation.displaySourceCode.url;
-        if (displayScriptURL) {
-            this.subtitle = document.createElement("span");
-            callFrame.sourceCodeLocation.populateLiveDisplayLocationString(this.subtitle, "textContent");
-            // Set the tooltip on the entire tree element in onattach, once the element is created.
-            this.tooltipHandledSeparately = true;
+        if (!callFrame.nativeCode && callFrame.sourceCodeLocation) {
+            var displayScriptURL = callFrame.sourceCodeLocation.displaySourceCode.url;
+            if (displayScriptURL) {
+                this.subtitle = document.createElement("span");
+                callFrame.sourceCodeLocation.populateLiveDisplayLocationString(this.subtitle, "textContent");
+                // Set the tooltip on the entire tree element in onattach, once the element is created.
+                this.tooltipHandledSeparately = true;
+            }
         }
-    }
 
-    this._callFrame = callFrame;
-
-    this.small = true;
-};
+        this._callFrame = callFrame;
 
-WebInspector.CallFrameTreeElement.FunctionIconStyleClassName = "function-icon";
-WebInspector.CallFrameTreeElement.EventListenerIconStyleClassName = "event-listener-icon";
-WebInspector.CallFrameTreeElement.NativeIconStyleClassName = "native-icon";
-
-WebInspector.CallFrameTreeElement.prototype = {
-    constructor: WebInspector.CallFrameTreeElement,
+        this.small = true;
+    }
 
     // Public
 
     get callFrame()
     {
         return this._callFrame;
-    },
+    }
 
     // Protected
 
-    onattach: function()
+    onattach()
     {
         WebInspector.GeneralTreeElement.prototype.onattach.call(this);
 
@@ -84,4 +79,6 @@ WebInspector.CallFrameTreeElement.prototype = {
     }
 };
 
-WebInspector.CallFrameTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
+WebInspector.CallFrameTreeElement.FunctionIconStyleClassName = "function-icon";
+WebInspector.CallFrameTreeElement.EventListenerIconStyleClassName = "event-listener-icon";
+WebInspector.CallFrameTreeElement.NativeIconStyleClassName = "native-icon";
index 2469dbc..7e28a63 100644 (file)
@@ -1,4 +1,5 @@
 /*
+ * Copyright (C) 2015 Apple Inc. All rights reserved.
  * Copyright (C) 2013 Adobe Systems Incorporated. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * SUCH DAMAGE.
  */
 
-WebInspector.ContentFlowTreeElement = function(representedObject)
+WebInspector.ContentFlowTreeElement = class ContentFlowTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(representedObject instanceof WebInspector.ContentFlow);
-    WebInspector.GeneralTreeElement.call(this, [WebInspector.ContentFlowTreeElement.StyleClassName, WebInspector.ContentFlowTreeElement.ContentFlowIconStyleClassName], representedObject.name, null, representedObject, false);
+    constructor(representedObject)
+    {
+        console.assert(representedObject instanceof WebInspector.ContentFlow);
 
-    this.small = true;
-};
-
-WebInspector.ContentFlowTreeElement.ContentFlowIconStyleClassName = "content-flow-icon";
+        super([WebInspector.ContentFlowTreeElement.StyleClassName, WebInspector.ContentFlowTreeElement.ContentFlowIconStyleClassName], representedObject.name, null, representedObject, false);
 
-WebInspector.ContentFlowTreeElement.prototype = {
-    constructor: WebInspector.ContentFlowTreeElement
+        this.small = true;
+    }
 };
 
-WebInspector.ContentFlowTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
+WebInspector.ContentFlowTreeElement.ContentFlowIconStyleClassName = "content-flow-icon";
index 249b28c..e1f167f 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.CookieStorageTreeElement = function(representedObject)
+WebInspector.CookieStorageTreeElement = class CookieStorageTreeElement extends WebInspector.StorageTreeElement
 {
-    console.assert(representedObject instanceof WebInspector.CookieStorageObject);
-
-    WebInspector.StorageTreeElement.call(this, WebInspector.CookieStorageTreeElement.CookieIconStyleClassName, WebInspector.displayNameForHost(representedObject.host), representedObject);
-};
-
-WebInspector.CookieStorageTreeElement.CookieIconStyleClassName = "cookie-icon";
+    constructor(representedObject)
+    {
+        console.assert(representedObject instanceof WebInspector.CookieStorageObject);
 
-WebInspector.CookieStorageTreeElement.prototype = {
-    constructor: WebInspector.CookieStorageTreeElement,
+        super(WebInspector.CookieStorageTreeElement.CookieIconStyleClassName, WebInspector.displayNameForHost(representedObject.host), representedObject);
+    }
 
     // Public
 
     get name()
     {
         return this.representedObject.host;
-    },
+    }
 
     get categoryName()
     {
@@ -48,4 +45,4 @@ WebInspector.CookieStorageTreeElement.prototype = {
     }
 };
 
-WebInspector.CookieStorageTreeElement.prototype.__proto__ = WebInspector.StorageTreeElement.prototype;
+WebInspector.CookieStorageTreeElement.CookieIconStyleClassName = "cookie-icon";
index 3b3e60c..bb2fe36 100644 (file)
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.DOMStorageTreeElement = function(representedObject)
+WebInspector.DOMStorageTreeElement = class DOMStorageTreeElement extends WebInspector.StorageTreeElement
 {
-    console.assert(representedObject instanceof WebInspector.DOMStorageObject);
-
-    if (representedObject.isLocalStorage())
-        var className = WebInspector.DOMStorageTreeElement.LocalStorageIconStyleClassName;
-    else
-        var className = WebInspector.DOMStorageTreeElement.SessionStorageIconStyleClassName;
-
-    WebInspector.StorageTreeElement.call(this, className, WebInspector.displayNameForHost(representedObject.host), representedObject);
-};
+    constructor(representedObject)
+    {
+        console.assert(representedObject instanceof WebInspector.DOMStorageObject);
 
-WebInspector.DOMStorageTreeElement.LocalStorageIconStyleClassName = "local-storage-icon";
-WebInspector.DOMStorageTreeElement.SessionStorageIconStyleClassName = "session-storage-icon";
+        if (representedObject.isLocalStorage())
+            var className = WebInspector.DOMStorageTreeElement.LocalStorageIconStyleClassName;
+        else
+            var className = WebInspector.DOMStorageTreeElement.SessionStorageIconStyleClassName;
 
-WebInspector.DOMStorageTreeElement.prototype = {
-    constructor: WebInspector.DOMStorageTreeElement,
+        super(className, WebInspector.displayNameForHost(representedObject.host), representedObject);
+    }
 
     // Public
 
     get name()
     {
         return WebInspector.displayNameForHost(this.representedObject.host);
-    },
+    }
 
     get categoryName()
     {
@@ -56,4 +52,5 @@ WebInspector.DOMStorageTreeElement.prototype = {
     }
 };
 
-WebInspector.DOMStorageTreeElement.prototype.__proto__ = WebInspector.StorageTreeElement.prototype;
+WebInspector.DOMStorageTreeElement.LocalStorageIconStyleClassName = "local-storage-icon";
+WebInspector.DOMStorageTreeElement.SessionStorageIconStyleClassName = "session-storage-icon";
index 806b203..268428e 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2007, 2008, 2013 Apple Inc.  All rights reserved.
+ * Copyright (C) 2007, 2008, 2013, 2015 Apple Inc.  All rights reserved.
  * Copyright (C) 2008 Matt Lilek <webkit@mattlilek.com>
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.DOMTreeElement = function(node, elementCloseTag)
+WebInspector.DOMTreeElement = class DOMTreeElement extends WebInspector.TreeElement
 {
-    this._elementCloseTag = elementCloseTag;
-    var hasChildrenOverride = !elementCloseTag && node.hasChildNodes() && !this._showInlineText(node);
-
-    // The title will be updated in onattach.
-    TreeElement.call(this, "", node, hasChildrenOverride);
-
-    if (this.representedObject.nodeType() === Node.ELEMENT_NODE && !elementCloseTag)
-        this._canAddAttributes = true;
-    this._searchQuery = null;
-    this._expandedChildrenLimit = WebInspector.DOMTreeElement.InitialChildrenLimit;
-};
-
-WebInspector.DOMTreeElement.InitialChildrenLimit = 500;
-WebInspector.DOMTreeElement.MaximumInlineTextChildLength = 80;
-
-// A union of HTML4 and HTML5-Draft elements that explicitly
-// or implicitly (for HTML5) forbid the closing tag.
-// FIXME: Revise once HTML5 Final is published.
-WebInspector.DOMTreeElement.ForbiddenClosingTagElements = [
-    "area", "base", "basefont", "br", "canvas", "col", "command", "embed", "frame",
-    "hr", "img", "input", "isindex", "keygen", "link", "meta", "param", "source"
-].keySet();
+    constructor(node, elementCloseTag)
+    {
+        super("", node);
 
-// These tags we do not allow editing their tag name.
-WebInspector.DOMTreeElement.EditTagBlacklist = [
-    "html", "head", "body"
-].keySet();
+        this._elementCloseTag = elementCloseTag;
+        this.hasChildren = !elementCloseTag && node.hasChildNodes() && !this._showInlineText(node);
 
-WebInspector.DOMTreeElement.SearchHighlightStyleClassName = "search-highlight";
-WebInspector.DOMTreeElement.BouncyHighlightStyleClassName = "bouncy-highlight";
+        if (this.representedObject.nodeType() === Node.ELEMENT_NODE && !elementCloseTag)
+            this._canAddAttributes = true;
+        this._searchQuery = null;
+        this._expandedChildrenLimit = WebInspector.DOMTreeElement.InitialChildrenLimit;
+    }
 
-WebInspector.DOMTreeElement.prototype = {
-    isCloseTag: function()
+    isCloseTag()
     {
         return this._elementCloseTag;
-    },
+    }
 
-    highlightSearchResults: function(searchQuery)
+    highlightSearchResults(searchQuery)
     {
         if (this._searchQuery !== searchQuery) {
             this._updateSearchHighlight(false);
@@ -77,15 +58,15 @@ WebInspector.DOMTreeElement.prototype = {
         this._searchQuery = searchQuery;
         this._searchHighlightsVisible = true;
         this.updateTitle(true);
-    },
+    }
 
-    hideSearchHighlights: function()
+    hideSearchHighlights()
     {
         delete this._searchHighlightsVisible;
         this._updateSearchHighlight(false);
-    },
+    }
 
-    emphasizeSearchHighlight: function()
+    emphasizeSearchHighlight()
     {
         var highlightElement = this.title.querySelector("." + WebInspector.DOMTreeElement.SearchHighlightStyleClassName);
         console.assert(highlightElement);
@@ -116,9 +97,9 @@ WebInspector.DOMTreeElement.prototype = {
         }
 
         this._bouncyHighlightElement.addEventListener("webkitAnimationEnd", animationEnded.bind(this));
-    },
+    }
 
-    _updateSearchHighlight: function(show)
+    _updateSearchHighlight(show)
     {
         if (!this._highlightResult)
             return;
@@ -152,12 +133,12 @@ WebInspector.DOMTreeElement.prototype = {
 
         for (var i = 0, size = this._highlightResult.length; i < size; ++i)
             updater(this._highlightResult[i]);
-    },
+    }
 
     get hovered()
     {
         return this._hovered;
-    },
+    }
 
     set hovered(x)
     {
@@ -174,12 +155,12 @@ WebInspector.DOMTreeElement.prototype = {
                 this.listItemElement.classList.remove("hovered");
             }
         }
-    },
+    }
 
     get expandedChildrenLimit()
     {
         return this._expandedChildrenLimit;
-    },
+    }
 
     set expandedChildrenLimit(x)
     {
@@ -189,7 +170,7 @@ WebInspector.DOMTreeElement.prototype = {
         this._expandedChildrenLimit = x;
         if (this.treeOutline && !this._updateChildrenInProgress)
             this._updateChildren(true);
-    },
+    }
 
     get expandedChildCount()
     {
@@ -199,9 +180,9 @@ WebInspector.DOMTreeElement.prototype = {
         if (count && this.children[count - 1].expandAllButton)
             count--;
         return count;
-    },
+    }
 
-    showChild: function(index)
+    showChild(index)
     {
         console.assert(!this._elementCloseTag);
         if (this._elementCloseTag)
@@ -214,9 +195,9 @@ WebInspector.DOMTreeElement.prototype = {
 
         // Whether index-th child is visible in the children tree
         return this.expandedChildCount > index;
-    },
+    }
 
-    _createTooltipForNode: function()
+    _createTooltipForNode()
     {
         var node = this.representedObject;
         if (!node.nodeName() || node.nodeName().toLowerCase() !== "img")
@@ -256,9 +237,9 @@ WebInspector.DOMTreeElement.prototype = {
             object.release();
         }
         WebInspector.RemoteObject.resolveNode(node, "", resolvedNode.bind(this));
-    },
+    }
 
-    updateSelection: function()
+    updateSelection()
     {
         var listItemElement = this.listItemElement;
         if (!listItemElement)
@@ -277,9 +258,9 @@ WebInspector.DOMTreeElement.prototype = {
         }
 
         this.selectionElement.style.height = listItemElement.offsetHeight + "px";
-    },
+    }
 
-    onattach: function()
+    onattach()
     {
         if (this._hovered) {
             this.updateSelection();
@@ -289,51 +270,46 @@ WebInspector.DOMTreeElement.prototype = {
         this.updateTitle();
         this.listItemElement.draggable = true;
         this.listItemElement.addEventListener("dragstart", this);
-    },
+    }
 
-    onpopulate: function()
+    onpopulate()
     {
         if (this.children.length || this._showInlineText(this.representedObject) || this._elementCloseTag)
             return;
 
         this.updateChildren();
-    },
+    }
 
-    expandRecursively: function()
+    expandRecursively()
     {
-        function callback()
-        {
-            TreeElement.prototype.expandRecursively.call(this, Number.MAX_VALUE);
-        }
-
-        this.representedObject.getSubtree(-1, callback.bind(this));
-    },
+        this.representedObject.getSubtree(-1, super.expandRecursively.bind(this, Number.MAX_VALUE));
+    }
 
-    updateChildren: function(fullRefresh)
+    updateChildren(fullRefresh)
     {
         if (this._elementCloseTag)
             return;
         this.representedObject.getChildNodes(this._updateChildren.bind(this, fullRefresh));
-    },
+    }
 
-    insertChildElement: function(child, index, closingTag)
+    insertChildElement(child, index, closingTag)
     {
         var newElement = new WebInspector.DOMTreeElement(child, closingTag);
         newElement.selectable = this.treeOutline._selectEnabled;
         this.insertChild(newElement, index);
         return newElement;
-    },
+    }
 
-    moveChild: function(child, targetIndex)
+    moveChild(child, targetIndex)
     {
         var wasSelected = child.selected;
         this.removeChild(child);
         this.insertChild(child, targetIndex);
         if (wasSelected)
             child.select();
-    },
+    }
 
-    _updateChildren: function(fullRefresh)
+    _updateChildren(fullRefresh)
     {
         if (this._updateChildrenInProgress || !this.treeOutline._visible)
             return;
@@ -421,25 +397,25 @@ WebInspector.DOMTreeElement.prototype = {
         }
 
         delete this._updateChildrenInProgress;
-    },
+    }
 
-    adjustCollapsedRange: function()
+    adjustCollapsedRange()
     {
         // Ensure precondition: only the tree elements for node children are found in the tree
         // (not the Expand All button or the closing tag).
         if (this.expandAllButtonElement && this.expandAllButtonElement.__treeElement.parent)
             this.removeChild(this.expandAllButtonElement.__treeElement);
 
-        const node = this.representedObject;
+        var node = this.representedObject;
         if (!node.children)
             return;
-        const childNodeCount = node.children.length;
+        var childNodeCount = node.children.length;
 
         // In case some nodes from the expanded range were removed, pull some nodes from the collapsed range into the expanded range at the bottom.
         for (var i = this.expandedChildCount, limit = Math.min(this.expandedChildrenLimit, childNodeCount); i < limit; ++i)
             this.insertChildElement(node.children[i], i);
 
-        const expandedChildCount = this.expandedChildCount;
+        var expandedChildCount = this.expandedChildCount;
         if (childNodeCount > this.expandedChildCount) {
             var targetButtonIndex = expandedChildCount;
             if (!this.expandAllButtonElement) {
@@ -447,7 +423,7 @@ WebInspector.DOMTreeElement.prototype = {
                 button.className = "show-all-nodes";
                 button.value = "";
 
-                var item = new TreeElement(button, null, false);
+                var item = new WebInspector.TreeElement(button, null, false);
                 item.selectable = false;
                 item.expandAllButton = true;
 
@@ -461,32 +437,32 @@ WebInspector.DOMTreeElement.prototype = {
             this.expandAllButtonElement.textContent = WebInspector.UIString("Show All Nodes (%d More)").format(childNodeCount - expandedChildCount);
         } else if (this.expandAllButtonElement)
             delete this.expandAllButtonElement;
-    },
+    }
 
-    handleLoadAllChildren: function()
+    handleLoadAllChildren()
     {
         this.expandedChildrenLimit = Math.max(this.representedObject.childNodeCount, this.expandedChildrenLimit + WebInspector.DOMTreeElement.InitialChildrenLimit);
-    },
+    }
 
-    onexpand: function()
+    onexpand()
     {
         if (this._elementCloseTag)
             return;
 
         this.updateTitle();
         this.treeOutline.updateSelection();
-    },
+    }
 
-    oncollapse: function()
+    oncollapse()
     {
         if (this._elementCloseTag)
             return;
 
         this.updateTitle();
         this.treeOutline.updateSelection();
-    },
+    }
 
-    onreveal: function()
+    onreveal()
     {
         if (this.listItemElement) {
             var tagSpans = this.listItemElement.getElementsByClassName("html-tag-name");
@@ -495,9 +471,9 @@ WebInspector.DOMTreeElement.prototype = {
             else
                 this.listItemElement.scrollIntoViewIfNeeded(false);
         }
-    },
+    }
 
-    onselect: function(treeElement, selectedByUser)
+    onselect(treeElement, selectedByUser)
     {
         this.treeOutline.suppressRevealAndSelect = true;
         this.treeOutline.selectDOMNode(this.representedObject, selectedByUser);
@@ -505,14 +481,14 @@ WebInspector.DOMTreeElement.prototype = {
             WebInspector.domTreeManager.highlightDOMNode(this.representedObject.id);
         this.updateSelection();
         this.treeOutline.suppressRevealAndSelect = false;
-    },
+    }
 
-    ondeselect: function(treeElement)
+    ondeselect(treeElement)
     {
         this.treeOutline.selectDOMNode(null);
-    },
+    }
 
-    ondelete: function()
+    ondelete()
     {
         if (this.representedObject.isInShadowTree())
             return false;
@@ -523,9 +499,9 @@ WebInspector.DOMTreeElement.prototype = {
         else
             this.remove();
         return true;
-    },
+    }
 
-    onenter: function()
+    onenter()
     {
         // On Enter or Return start editing the first attribute
         // or create a new attribute on the selected element.
@@ -536,11 +512,11 @@ WebInspector.DOMTreeElement.prototype = {
 
         // prevent a newline from being immediately inserted
         return true;
-    },
+    }
 
-    selectOnMouseDown: function(event)
+    selectOnMouseDown(event)
     {
-        TreeElement.prototype.selectOnMouseDown.call(this, event);
+        super.selectOnMouseDown(event);
 
         if (this._editing)
             return;
@@ -548,9 +524,9 @@ WebInspector.DOMTreeElement.prototype = {
         // Prevent selecting the nearest word on double click.
         if (event.detail >= 2)
             event.preventDefault();
-    },
+    }
 
-    ondblclick: function(event)
+    ondblclick(event)
     {
         if (this._editing || this._elementCloseTag)
             return;
@@ -560,9 +536,9 @@ WebInspector.DOMTreeElement.prototype = {
 
         if (this.hasChildren && !this.expanded)
             this.expand();
-    },
+    }
 
-    _insertInLastAttributePosition: function(tag, node)
+    _insertInLastAttributePosition(tag, node)
     {
         if (tag.getElementsByClassName("html-attribute").length > 0)
             tag.insertBefore(node, tag.lastChild);
@@ -575,9 +551,9 @@ WebInspector.DOMTreeElement.prototype = {
         }
 
         this.updateSelection();
-    },
+    }
 
-    _startEditingTarget: function(eventTarget)
+    _startEditingTarget(eventTarget)
     {
         if (this.treeOutline.selectedDOMNode() !== this.representedObject)
             return false;
@@ -605,9 +581,9 @@ WebInspector.DOMTreeElement.prototype = {
             return this._addNewAttribute();
 
         return false;
-    },
+    }
 
-    _populateTagContextMenu: function(contextMenu, event)
+    _populateTagContextMenu(contextMenu, event)
     {
         var node = this.representedObject;
         if (!node.isInShadowTree()) {
@@ -629,9 +605,9 @@ WebInspector.DOMTreeElement.prototype = {
 
         this._populateNodeContextMenu(contextMenu);
         this.treeOutline._populateContextMenu(contextMenu, this.representedObject);
-    },
+    }
 
-    _populateForcedPseudoStateItems: function(subMenu)
+    _populateForcedPseudoStateItems(subMenu)
     {
         var node = this.representedObject;
         var enabledPseudoClasses = node.enabledPseudoClasses;
@@ -643,18 +619,18 @@ WebInspector.DOMTreeElement.prototype = {
                 node.setPseudoClassEnabled(pseudoClass, !enabled);
             }, enabled, false);
         });
-    },
+    }
 
-    _populateTextContextMenu: function(contextMenu, textNode)
+    _populateTextContextMenu(contextMenu, textNode)
     {
         var node = this.representedObject;
         if (!node.isInShadowTree())
             contextMenu.appendItem(WebInspector.UIString("Edit Text"), this._startEditingTextNode.bind(this, textNode));
 
         this._populateNodeContextMenu(contextMenu);
-    },
+    }
 
-    _populateNodeContextMenu: function(contextMenu)
+    _populateNodeContextMenu(contextMenu)
     {
         // Add free-form node-related actions.
         var node = this.representedObject;
@@ -663,9 +639,9 @@ WebInspector.DOMTreeElement.prototype = {
         contextMenu.appendItem(WebInspector.UIString("Copy as HTML"), this._copyHTML.bind(this));
         if (!node.isInShadowTree())
             contextMenu.appendItem(WebInspector.UIString("Delete Node"), this.remove.bind(this));
-    },
+    }
 
-    _startEditing: function()
+    _startEditing()
     {
         if (this.treeOutline.selectedDOMNode() !== this.representedObject)
             return false;
@@ -689,9 +665,9 @@ WebInspector.DOMTreeElement.prototype = {
                 return this._startEditingTextNode(textNode);
             return false;
         }
-    },
+    }
 
-    _addNewAttribute: function()
+    _addNewAttribute()
     {
         // Cannot just convert the textual html into an element without
         // a parent node. Use a temporary span container for the HTML.
@@ -704,9 +680,9 @@ WebInspector.DOMTreeElement.prototype = {
         var tag = this.listItemElement.getElementsByClassName("html-tag")[0];
         this._insertInLastAttributePosition(tag, attr);
         return this._startEditingAttribute(attr, attr);
-    },
+    }
 
-    _triggerEditAttribute: function(attributeName)
+    _triggerEditAttribute(attributeName)
     {
         var attributeElements = this.listItemElement.getElementsByClassName("html-attribute-name");
         for (var i = 0, len = attributeElements.length; i < len; ++i) {
@@ -720,9 +696,9 @@ WebInspector.DOMTreeElement.prototype = {
                 }
             }
         }
-    },
+    }
 
-    _startEditingAttribute: function(attribute, elementForSelection)
+    _startEditingAttribute(attribute, elementForSelection)
     {
         if (WebInspector.isBeingEdited(attribute))
             return true;
@@ -756,9 +732,9 @@ WebInspector.DOMTreeElement.prototype = {
         window.getSelection().setBaseAndExtent(elementForSelection, 0, elementForSelection, 1);
 
         return true;
-    },
+    }
 
-    _startEditingTextNode: function(textNode)
+    _startEditingTextNode(textNode)
     {
         if (WebInspector.isBeingEdited(textNode))
             return true;
@@ -769,9 +745,9 @@ WebInspector.DOMTreeElement.prototype = {
         window.getSelection().setBaseAndExtent(textNode, 0, textNode, 1);
 
         return true;
-    },
+    }
 
-    _startEditingTagName: function(tagNameElement)
+    _startEditingTagName(tagNameElement)
     {
         if (!tagNameElement) {
             tagNameElement = this.listItemElement.getElementsByClassName("html-tag-name")[0];
@@ -812,9 +788,9 @@ WebInspector.DOMTreeElement.prototype = {
         this._editing = WebInspector.startEditing(tagNameElement, config);
         window.getSelection().setBaseAndExtent(tagNameElement, 0, tagNameElement, 1);
         return true;
-    },
+    }
 
-    _startEditingAsHTML: function(commitCallback, error, initialValue)
+    _startEditingAsHTML(commitCallback, error, initialValue)
     {
         if (error)
             return;
@@ -868,9 +844,9 @@ WebInspector.DOMTreeElement.prototype = {
         var config = new WebInspector.EditingConfig(commit.bind(this), dispose.bind(this));
         config.setMultiline(true);
         this._editing = WebInspector.startEditing(this._htmlEditElement, config);
-    },
+    }
 
-    _attributeEditingCommitted: function(element, newText, oldText, attributeName, moveDirection)
+    _attributeEditingCommitted(element, newText, oldText, attributeName, moveDirection)
     {
         this._editing = false;
 
@@ -925,9 +901,9 @@ WebInspector.DOMTreeElement.prototype = {
         }
 
         this.representedObject.setAttribute(attributeName, newText, moveToNextAttributeIfNeeded.bind(this));
-    },
+    }
 
-    _tagNameEditingCommitted: function(element, newText, oldText, tagName, moveDirection)
+    _tagNameEditingCommitted(element, newText, oldText, tagName, moveDirection)
     {
         this._editing = false;
         var self = this;
@@ -986,9 +962,9 @@ WebInspector.DOMTreeElement.prototype = {
         }
 
         this.representedObject.setNodeName(newText, changeTagNameCallback);
-    },
+    }
 
-    _textNodeEditingCommitted: function(element, newText)
+    _textNodeEditingCommitted(element, newText)
     {
         this._editing = false;
 
@@ -1001,17 +977,17 @@ WebInspector.DOMTreeElement.prototype = {
             textNode = this.representedObject;
 
         textNode.setNodeValue(newText, this.updateTitle.bind(this));
-    },
+    }
 
-    _editingCancelled: function(element, context)
+    _editingCancelled(element, context)
     {
         this._editing = false;
 
         // Need to restore attributes structure.
         this.updateTitle();
-    },
+    }
 
-    _distinctClosingTagElement: function()
+    _distinctClosingTagElement()
     {
         // FIXME: Improve the Tree Element / Outline Abstraction to prevent crawling the DOM
 
@@ -1027,9 +1003,9 @@ WebInspector.DOMTreeElement.prototype = {
         // null in the case where there isn't a closing tag.
         var tags = this.listItemElement.getElementsByClassName("html-tag");
         return (tags.length === 1 ? null : tags[tags.length - 1]);
-    },
+    }
 
-    updateTitle: function(onlySearchQueryChanged)
+    updateTitle(onlySearchQueryChanged)
     {
         // If we are editing, return early to prevent canceling the edit.
         // After editing is committed updateTitle will be called.
@@ -1048,9 +1024,9 @@ WebInspector.DOMTreeElement.prototype = {
         delete this.selectionElement;
         this.updateSelection();
         this._highlightSearchResults();
-    },
+    }
 
-    _buildAttributeDOM: function(parentElement, name, value, node)
+    _buildAttributeDOM(parentElement, name, value, node)
     {
         var hasText = (value.length > 0);
         var attrSpanElement = parentElement.createChild("span", "html-attribute");
@@ -1087,9 +1063,9 @@ WebInspector.DOMTreeElement.prototype = {
 
         if (hasText)
             attrSpanElement.appendChild(document.createTextNode("\""));
-    },
+    }
 
-    _buildTagDOM: function(parentElement, tagName, isClosingTag, isDistinctTreeElement)
+    _buildTagDOM(parentElement, tagName, isClosingTag, isDistinctTreeElement)
     {
         var node = this.representedObject;
         var classes = [ "html-tag" ];
@@ -1111,13 +1087,20 @@ WebInspector.DOMTreeElement.prototype = {
         }
         tagElement.appendChild(document.createTextNode(">"));
         parentElement.appendChild(document.createTextNode("\u200B"));
-    },
+    }
 
-    _nodeTitleInfo: function()
+    _nodeTitleInfo()
     {
         var node = this.representedObject;
         var info = {titleDOM: document.createDocumentFragment(), hasChildren: this.hasChildren};
 
+        function trimedNodeValue()
+        {
+            // Trim empty lines from the beginning and extra space at the end since most style and script tags begin with a newline
+            // and end with a newline and indentation for the end tag.
+            return node.nodeValue().replace(/^[\n\r]*/, "").replace(/\s*$/, "");
+        }
+
         switch (node.nodeType()) {
             case Node.DOCUMENT_FRAGMENT_NODE:
                 var fragmentElement = info.titleDOM.createChild("span", "webkit-html-fragment");
@@ -1177,13 +1160,6 @@ WebInspector.DOMTreeElement.prototype = {
                 break;
 
             case Node.TEXT_NODE:
-                function trimedNodeValue()
-                {
-                    // Trim empty lines from the beginning and extra space at the end since most style and script tags begin with a newline
-                    // and end with a newline and indentation for the end tag.
-                    return node.nodeValue().replace(/^[\n\r]*/, "").replace(/\s*$/, "");
-                }
-
                 if (node.parentNode && node.parentNode.nodeName().toLowerCase() === "script") {
                     var newNode = info.titleDOM.createChild("span", "html-text-node large");
                     newNode.appendChild(WebInspector.syntaxHighlightStringAsDocumentFragment(trimedNodeValue(), "text/javascript"));
@@ -1237,9 +1213,9 @@ WebInspector.DOMTreeElement.prototype = {
         }
 
         return info;
-    },
+    }
 
-    _singleTextChild: function(node)
+    _singleTextChild(node)
     {
         if (!node)
             return null;
@@ -1253,9 +1229,9 @@ WebInspector.DOMTreeElement.prototype = {
 
         var sibling = firstChild.nextSibling;
         return sibling ? null : firstChild;
-    },
+    }
 
-    _showInlineText: function(node)
+    _showInlineText(node)
     {
         if (node.nodeType() === Node.ELEMENT_NODE) {
             var textChild = this._singleTextChild(node);
@@ -1263,9 +1239,9 @@ WebInspector.DOMTreeElement.prototype = {
                 return true;
         }
         return false;
-    },
+    }
 
-    remove: function()
+    remove()
     {
         var parentElement = this.parent;
         if (!parentElement)
@@ -1285,9 +1261,9 @@ WebInspector.DOMTreeElement.prototype = {
         }
 
         this.representedObject.removeNode(removeNodeCallback);
-    },
+    }
 
-    _editAsHTML: function()
+    _editAsHTML()
     {
         var treeOutline = this.treeOutline;
         var node = this.representedObject;
@@ -1322,14 +1298,14 @@ WebInspector.DOMTreeElement.prototype = {
         }
 
         node.getOuterHTML(this._startEditingAsHTML.bind(this, commitChange));
-    },
+    }
 
-    _copyHTML: function()
+    _copyHTML()
     {
         this.representedObject.copyNode();
-    },
+    }
 
-    _highlightSearchResults: function()
+    _highlightSearchResults()
     {
         if (!this.title || !this._searchQuery || !this._searchHighlightsVisible)
             return;
@@ -1356,13 +1332,30 @@ WebInspector.DOMTreeElement.prototype = {
 
         this._highlightResult = [];
         WebInspector.highlightRangesWithStyleClass(this.title, matchRanges, WebInspector.DOMTreeElement.SearchHighlightStyleClassName, this._highlightResult);
-    },
+    }
 
-    handleEvent: function(event)
+    handleEvent(event)
     {
         if (event.type === "dragstart" && this._editing)
             event.preventDefault();
     }
 };
 
-WebInspector.DOMTreeElement.prototype.__proto__ = TreeElement.prototype;
+WebInspector.DOMTreeElement.InitialChildrenLimit = 500;
+WebInspector.DOMTreeElement.MaximumInlineTextChildLength = 80;
+
+// A union of HTML4 and HTML5-Draft elements that explicitly
+// or implicitly (for HTML5) forbid the closing tag.
+WebInspector.DOMTreeElement.ForbiddenClosingTagElements = [
+    "area", "base", "basefont", "br", "canvas", "col", "command", "embed", "frame",
+    "hr", "img", "input", "isindex", "keygen", "link", "meta", "param", "source",
+    "wbr", "track", "menuitem"
+].keySet();
+
+// These tags we do not allow editing their tag name.
+WebInspector.DOMTreeElement.EditTagBlacklist = [
+    "html", "head", "body"
+].keySet();
+
+WebInspector.DOMTreeElement.SearchHighlightStyleClassName = "search-highlight";
+WebInspector.DOMTreeElement.BouncyHighlightStyleClassName = "bouncy-highlight";
index 885f784..5a596b2 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2007, 2008, 2013 Apple Inc.  All rights reserved.
+ * Copyright (C) 2007, 2008, 2013, 2015 Apple Inc.  All rights reserved.
  * Copyright (C) 2008 Matt Lilek <webkit@mattlilek.com>
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.DOMTreeOutline = function(omitRootDOMNode, selectEnabled, showInElementsPanelEnabled)
+WebInspector.DOMTreeOutline = class DOMTreeOutline extends WebInspector.TreeOutline
 {
-    this.element = document.createElement("ol");
-    this.element.addEventListener("mousedown", this._onmousedown.bind(this), false);
-    this.element.addEventListener("mousemove", this._onmousemove.bind(this), false);
-    this.element.addEventListener("mouseout", this._onmouseout.bind(this), false);
-    this.element.addEventListener("dragstart", this._ondragstart.bind(this), false);
-    this.element.addEventListener("dragover", this._ondragover.bind(this), false);
-    this.element.addEventListener("dragleave", this._ondragleave.bind(this), false);
-    this.element.addEventListener("drop", this._ondrop.bind(this), false);
-    this.element.addEventListener("dragend", this._ondragend.bind(this), false);
-
-    this.element.classList.add(WebInspector.DOMTreeOutline.StyleClassName);
-    this.element.classList.add(WebInspector.SyntaxHighlightedStyleClassName);
-
-    TreeOutline.call(this, this.element);
+    constructor(omitRootDOMNode, selectEnabled, showInElementsPanelEnabled)
+    {
+        var element = document.createElement("ol");
 
-    this._includeRootDOMNode = !omitRootDOMNode;
-    this._selectEnabled = selectEnabled;
-    this._showInElementsPanelEnabled = showInElementsPanelEnabled;
-    this._rootDOMNode = null;
-    this._selectedDOMNode = null;
-    this._eventSupport = new WebInspector.Object();
-    this._editing = false;
+        super(element);
 
-    this._visible = false;
+        element.addEventListener("mousedown", this._onmousedown.bind(this), false);
+        element.addEventListener("mousemove", this._onmousemove.bind(this), false);
+        element.addEventListener("mouseout", this._onmouseout.bind(this), false);
+        element.addEventListener("dragstart", this._ondragstart.bind(this), false);
+        element.addEventListener("dragover", this._ondragover.bind(this), false);
+        element.addEventListener("dragleave", this._ondragleave.bind(this), false);
+        element.addEventListener("drop", this._ondrop.bind(this), false);
+        element.addEventListener("dragend", this._ondragend.bind(this), false);
 
-    this.element.addEventListener("contextmenu", this._contextMenuEventFired.bind(this), true);
+        element.classList.add("dom-tree-outline");
+        element.classList.add(WebInspector.SyntaxHighlightedStyleClassName);
 
-    this._hideElementKeyboardShortcut = new WebInspector.KeyboardShortcut(null, "H", this._hideElement.bind(this), this.element);
-    this._hideElementKeyboardShortcut.implicitlyPreventsDefault = false;
+        this._includeRootDOMNode = !omitRootDOMNode;
+        this._selectEnabled = selectEnabled;
+        this._showInElementsPanelEnabled = showInElementsPanelEnabled;
+        this._rootDOMNode = null;
+        this._selectedDOMNode = null;
+        this._eventSupport = new WebInspector.Object();
+        this._editing = false;
 
-    WebInspector.showShadowDOMSetting.addEventListener(WebInspector.Setting.Event.Changed, this._showShadowDOMSettingChanged, this);
-};
+        this._visible = false;
 
-// FIXME: Move to a WebInspector.Object subclass and we can remove this.
-WebInspector.Object.deprecatedAddConstructorFunctions(WebInspector.DOMTreeOutline);
+        this.element.addEventListener("contextmenu", this._contextMenuEventFired.bind(this), true);
 
-WebInspector.DOMTreeOutline.StyleClassName = "dom-tree-outline";
+        this._hideElementKeyboardShortcut = new WebInspector.KeyboardShortcut(null, "H", this._hideElement.bind(this), this.element);
+        this._hideElementKeyboardShortcut.implicitlyPreventsDefault = false;
 
-WebInspector.DOMTreeOutline.Event = {
-    SelectedNodeChanged: "dom-tree-outline-selected-node-changed"
-};
+        WebInspector.showShadowDOMSetting.addEventListener(WebInspector.Setting.Event.Changed, this._showShadowDOMSettingChanged, this);
+    }
 
-WebInspector.DOMTreeOutline.prototype = {
-    constructor: WebInspector.DOMTreeOutline,
+    // Public
 
-    wireToDomAgent: function()
+    wireToDomAgent()
     {
         this._elementsTreeUpdater = new WebInspector.DOMTreeUpdater(this);
-    },
+    }
 
-    close: function()
+    close()
     {
         if (this._elementsTreeUpdater) {
             this._elementsTreeUpdater.close();
             this._elementsTreeUpdater = null;
         }
-    },
+    }
 
-    setVisible: function(visible, omitFocus)
+    setVisible(visible, omitFocus)
     {
         this._visible = visible;
         if (!this._visible)
@@ -97,22 +90,22 @@ WebInspector.DOMTreeOutline.prototype = {
         this._updateModifiedNodes();
         if (this._selectedDOMNode)
             this._revealAndSelectNode(this._selectedDOMNode, omitFocus);
-    },
+    }
 
-    addEventListener: function(eventType, listener, thisObject)
+    addEventListener(eventType, listener, thisObject)
     {
         this._eventSupport.addEventListener(eventType, listener, thisObject);
-    },
+    }
 
-    removeEventListener: function(eventType, listener, thisObject)
+    removeEventListener(eventType, listener, thisObject)
     {
         this._eventSupport.removeEventListener(eventType, listener, thisObject);
-    },
+    }
 
     get rootDOMNode()
     {
         return this._rootDOMNode;
-    },
+    }
 
     set rootDOMNode(x)
     {
@@ -124,19 +117,19 @@ WebInspector.DOMTreeOutline.prototype = {
         this._isXMLMimeType = x && x.isXMLNode();
 
         this.update();
-    },
+    }
 
     get isXMLMimeType()
     {
         return this._isXMLMimeType;
-    },
+    }
 
-    selectedDOMNode: function()
+    selectedDOMNode()
     {
         return this._selectedDOMNode;
-    },
+    }
 
-    selectDOMNode: function(node, focus)
+    selectDOMNode(node, focus)
     {
         if (this._selectedDOMNode === node) {
             this._revealAndSelectNode(node, !focus);
@@ -153,14 +146,14 @@ WebInspector.DOMTreeOutline.prototype = {
         // Note that _revealAndSelectNode will not do anything for a null node.
         if (!node || this._selectedDOMNode === node)
             this._selectedNodeChanged();
-    },
+    }
 
     get editing()
     {
         return this._editing;
-    },
+    }
 
-    update: function()
+    update()
     {
         var selectedNode = this.selectedTreeElement ? this.selectedTreeElement.representedObject : null;
 
@@ -187,22 +180,22 @@ WebInspector.DOMTreeOutline.prototype = {
 
         if (selectedNode)
             this._revealAndSelectNode(selectedNode, true);
-    },
+    }
 
-    updateSelection: function()
+    updateSelection()
     {
         if (!this.selectedTreeElement)
             return;
         var element = this.treeOutline.selectedTreeElement;
         element.updateSelection();
-    },
+    }
 
-    _selectedNodeChanged: function()
+    _selectedNodeChanged()
     {
         this._eventSupport.dispatchEventToListeners(WebInspector.DOMTreeOutline.Event.SelectedNodeChanged);
-    },
+    }
 
-    findTreeElement: function(node)
+    findTreeElement(node)
     {
         function isAncestorNode(ancestor, node)
         {
@@ -214,16 +207,16 @@ WebInspector.DOMTreeOutline.prototype = {
             return node.parentNode;
         }
 
-        var treeElement = TreeOutline.prototype.findTreeElement.call(this, node, isAncestorNode, parentNode);
+        var treeElement = super.findTreeElement(node, isAncestorNode, parentNode);
         if (!treeElement && node.nodeType() === Node.TEXT_NODE) {
             // The text node might have been inlined if it was short, so try to find the parent element.
-            treeElement = TreeOutline.prototype.findTreeElement.call(this, node.parentNode, isAncestorNode, parentNode);
+            treeElement = super.findTreeElement(node.parentNode, isAncestorNode, parentNode);
         }
 
         return treeElement;
-    },
+    }
 
-    createTreeElementFor: function(node)
+    createTreeElementFor(node)
     {
         var treeElement = this.findTreeElement(node);
         if (treeElement)
@@ -236,16 +229,49 @@ WebInspector.DOMTreeOutline.prototype = {
             return treeElement.children[node.index];
 
         return null;
-    },
+    }
 
     set suppressRevealAndSelect(x)
     {
         if (this._suppressRevealAndSelect === x)
             return;
         this._suppressRevealAndSelect = x;
-    },
+    }
+
+    populateContextMenu(contextMenu, event, treeElement)
+    {
+        var tag = event.target.enclosingNodeOrSelfWithClass("html-tag");
+        var textNode = event.target.enclosingNodeOrSelfWithClass("html-text-node");
+        var commentNode = event.target.enclosingNodeOrSelfWithClass("html-comment");
+
+        var populated = false;
+        if (tag && treeElement._populateTagContextMenu) {
+            if (populated)
+                contextMenu.appendSeparator();
+            treeElement._populateTagContextMenu(contextMenu, event);
+            populated = true;
+        } else if (textNode && treeElement._populateTextContextMenu) {
+            if (populated)
+                contextMenu.appendSeparator();
+            treeElement._populateTextContextMenu(contextMenu, textNode);
+            populated = true;
+        } else if (commentNode && treeElement._populateNodeContextMenu) {
+            if (populated)
+                contextMenu.appendSeparator();
+            treeElement._populateNodeContextMenu(contextMenu, textNode);
+            populated = true;
+        }
+
+        return populated;
+    }
+
+    adjustCollapsedRange()
+    {
+    }
 
-    _revealAndSelectNode: function(node, omitFocus)
+    // Private
+
+    _revealAndSelectNode(node, omitFocus)
     {
         if (!node || this._suppressRevealAndSelect)
             return;
@@ -255,9 +281,9 @@ WebInspector.DOMTreeOutline.prototype = {
             return;
 
         treeElement.revealAndSelect(omitFocus);
-    },
+    }
 
-    _treeElementFromEvent: function(event)
+    _treeElementFromEvent(event)
     {
         var scrollContainer = this.element.parentElement;
 
@@ -281,9 +307,9 @@ WebInspector.DOMTreeOutline.prototype = {
             element = this.treeElementFromPoint(x, y + 2);
 
         return element;
-    },
+    }
 
-    _onmousedown: function(event)
+    _onmousedown(event)
     {
         var element = this._treeElementFromEvent(event);
         if (!element || element.isEventWithinDisclosureTriangle(event)) {
@@ -292,9 +318,9 @@ WebInspector.DOMTreeOutline.prototype = {
         }
 
         element.select();
-    },
+    }
 
-    _onmousemove: function(event)
+    _onmousemove(event)
     {
         var element = this._treeElementFromEvent(event);
         if (element && this._previousHoveredElement === element)
@@ -315,9 +341,9 @@ WebInspector.DOMTreeOutline.prototype = {
         }
 
         WebInspector.domTreeManager.highlightDOMNode(element ? element.representedObject.id : 0);
-    },
+    }
 
-    _onmouseout: function(event)
+    _onmouseout(event)
     {
         var nodeUnderMouse = document.elementFromPoint(event.pageX, event.pageY);
         if (nodeUnderMouse && nodeUnderMouse.isDescendant(this.element))
@@ -329,9 +355,9 @@ WebInspector.DOMTreeOutline.prototype = {
         }
 
         WebInspector.domTreeManager.hideDOMNodeHighlight();
-    },
+    }
 
-    _ondragstart: function(event)
+    _ondragstart(event)
     {
         var treeElement = this._treeElementFromEvent(event);
         if (!treeElement)
@@ -350,9 +376,9 @@ WebInspector.DOMTreeOutline.prototype = {
         WebInspector.domTreeManager.hideDOMNodeHighlight();
 
         return true;
-    },
+    }
 
-    _ondragover: function(event)
+    _ondragover(event)
     {
         if (!this._nodeBeingDragged)
             return false;
@@ -374,16 +400,16 @@ WebInspector.DOMTreeOutline.prototype = {
         event.preventDefault();
         event.dataTransfer.dropEffect = "move";
         return false;
-    },
+    }
 
-    _ondragleave: function(event)
+    _ondragleave(event)
     {
         this._clearDragOverTreeElementMarker();
         event.preventDefault();
         return false;
-    },
+    }
 
-    _isValidDragSourceOrTarget: function(treeElement)
+    _isValidDragSourceOrTarget(treeElement)
     {
         if (!treeElement)
             return false;
@@ -396,11 +422,23 @@ WebInspector.DOMTreeOutline.prototype = {
             return false;
 
         return true;
-    },
+    }
 
-    _ondrop: function(event)
+    _ondrop(event)
     {
         event.preventDefault();
+
+        function callback(error, newNodeId)
+        {
+            if (error)
+                return;
+
+            this._updateModifiedNodes();
+            var newNode = WebInspector.domTreeManager.nodeForId(newNodeId);
+            if (newNode)
+                this.selectDOMNode(newNode, true);
+        }
+
         var treeElement = this._treeElementFromEvent(event);
         if (this._nodeBeingDragged && treeElement) {
             var parentNode;
@@ -415,39 +453,29 @@ WebInspector.DOMTreeOutline.prototype = {
                 anchorNode = dragTargetNode;
             }
 
-            function callback(error, newNodeId)
-            {
-                if (error)
-                    return;
-
-                this._updateModifiedNodes();
-                var newNode = WebInspector.domTreeManager.nodeForId(newNodeId);
-                if (newNode)
-                    this.selectDOMNode(newNode, true);
-            }
             this._nodeBeingDragged.moveTo(parentNode, anchorNode, callback.bind(this));
         }
 
         delete this._nodeBeingDragged;
-    },
+    }
 
-    _ondragend: function(event)
+    _ondragend(event)
     {
         event.preventDefault();
         this._clearDragOverTreeElementMarker();
         delete this._nodeBeingDragged;
-    },
+    }
 
-    _clearDragOverTreeElementMarker: function()
+    _clearDragOverTreeElementMarker()
     {
         if (this._dragOverTreeElement) {
             this._dragOverTreeElement.updateSelection();
             this._dragOverTreeElement.listItemElement.classList.remove("elements-drag-over");
             delete this._dragOverTreeElement;
         }
-    },
+    }
 
-    _contextMenuEventFired: function(event)
+    _contextMenuEventFired(event)
     {
         var treeElement = this._treeElementFromEvent(event);
         if (!treeElement)
@@ -456,46 +484,15 @@ WebInspector.DOMTreeOutline.prototype = {
         var contextMenu = new WebInspector.ContextMenu(event);
         this.populateContextMenu(contextMenu, event, treeElement);
         contextMenu.show();
-    },
-
-    populateContextMenu: function(contextMenu, event, treeElement)
-    {
-        var tag = event.target.enclosingNodeOrSelfWithClass("html-tag");
-        var textNode = event.target.enclosingNodeOrSelfWithClass("html-text-node");
-        var commentNode = event.target.enclosingNodeOrSelfWithClass("html-comment");
-
-        var populated = false;
-        if (tag && treeElement._populateTagContextMenu) {
-            if (populated)
-                contextMenu.appendSeparator();
-            treeElement._populateTagContextMenu(contextMenu, event);
-            populated = true;
-        } else if (textNode && treeElement._populateTextContextMenu) {
-            if (populated)
-                contextMenu.appendSeparator();
-            treeElement._populateTextContextMenu(contextMenu, textNode);
-            populated = true;
-        } else if (commentNode && treeElement._populateNodeContextMenu) {
-            if (populated)
-                contextMenu.appendSeparator();
-            treeElement._populateNodeContextMenu(contextMenu, textNode);
-            populated = true;
-        }
-
-        return populated;
-    },
-
-    adjustCollapsedRange: function()
-    {
-    },
+    }
 
-    _updateModifiedNodes: function()
+    _updateModifiedNodes()
     {
         if (this._elementsTreeUpdater)
             this._elementsTreeUpdater._updateModifiedNodes();
-    },
+    }
 
-    _populateContextMenu: function(contextMenu, domNode)
+    _populateContextMenu(contextMenu, domNode)
     {
         if (!this._showInElementsPanelEnabled)
             return;
@@ -507,9 +504,9 @@ WebInspector.DOMTreeOutline.prototype = {
 
         contextMenu.appendSeparator();
         contextMenu.appendItem(WebInspector.UIString("Reveal in DOM Tree"), revealElement);
-    },
+    }
 
-    _showShadowDOMSettingChanged: function(event)
+    _showShadowDOMSettingChanged(event)
     {
         var nodeToSelect = this.selectedTreeElement ? this.selectedTreeElement.representedObject : null;
         while (nodeToSelect) {
@@ -524,9 +521,9 @@ WebInspector.DOMTreeOutline.prototype = {
 
         if (nodeToSelect)
             this.selectDOMNode(nodeToSelect);
-    },
+    }
 
-    _hideElement: function(event, keyboardShortcut)
+    _hideElement(event, keyboardShortcut)
     {
         if (!this.selectedTreeElement || WebInspector.isEditingAnyField())
             return;
@@ -577,4 +574,6 @@ WebInspector.DOMTreeOutline.prototype = {
     }
 };
 
-WebInspector.DOMTreeOutline.prototype.__proto__ = TreeOutline.prototype;
+WebInspector.DOMTreeOutline.Event = {
+    SelectedNodeChanged: "dom-tree-outline-selected-node-changed"
+};
index 5a52d20..85bc70d 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.DatabaseHostTreeElement = function(host)
+WebInspector.DatabaseHostTreeElement = class DatabaseHostTreeElement extends WebInspector.StorageTreeElement
 {
-    WebInspector.StorageTreeElement.call(this, WebInspector.FolderTreeElement.FolderIconStyleClassName, WebInspector.displayNameForHost(host), null);
-
-    this._host = host;
+    constructor(host)
+    {
+        super(WebInspector.FolderTreeElement.FolderIconStyleClassName, WebInspector.displayNameForHost(host), null);
 
-    this.hasChildren = true;
-};
+        this._host = host;
 
-WebInspector.DatabaseHostTreeElement.prototype = {
-    constructor: WebInspector.DatabaseHostTreeElement,
+        this.hasChildren = true;
+    }
 
     // Public
 
     get name()
     {
         return WebInspector.displayNameForHost(this._host);
-    },
+    }
 
     get categoryName()
     {
         return WebInspector.UIString("Databases");
     }
 };
-
-WebInspector.DatabaseHostTreeElement.prototype.__proto__ = WebInspector.StorageTreeElement.prototype;
index b4a5d46..a52be35 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.DatabaseTableTreeElement = function(representedObject)
+WebInspector.DatabaseTableTreeElement = class DatabaseTableTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(representedObject instanceof WebInspector.DatabaseTableObject);
+    constructor(representedObject)
+    {
+        console.assert(representedObject instanceof WebInspector.DatabaseTableObject);
 
-    WebInspector.GeneralTreeElement.call(this, WebInspector.DatabaseTableTreeElement.DatabaseTableIconStyleClassName, representedObject.name, null, representedObject, false);
+        super("database-table-icon", representedObject.name, null, representedObject, false);
 
-    this.small = true;
+        this.small = true;
+    }
 };
-
-WebInspector.DatabaseTableTreeElement.DatabaseTableIconStyleClassName = "database-table-icon";
-
-WebInspector.DatabaseTableTreeElement.prototype = {
-    constructor: WebInspector.DatabaseTableTreeElement
-};
-
-WebInspector.DatabaseTableTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
index cb4799e..bacc942 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.DatabaseTreeElement = function(representedObject)
+WebInspector.DatabaseTreeElement = class DatabaseTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(representedObject instanceof WebInspector.DatabaseObject);
-
-    WebInspector.GeneralTreeElement.call(this, WebInspector.DatabaseTreeElement.DatabaseIconStyleClassName, representedObject.name, null, representedObject, true);
-
-    this.small = true;
-    this.hasChildren = false;
+    constructor(representedObject)
+    {
+        console.assert(representedObject instanceof WebInspector.DatabaseObject);
 
-    // Since we are initially telling the tree element we don't have any children, make sure that we try to populate
-    // the tree element (which will get a list of tables) when the element is created.
-    this.onpopulate();
-};
+        super("database-icon", representedObject.name, null, representedObject, true);
 
-WebInspector.DatabaseTreeElement.DatabaseIconStyleClassName = "database-icon";
+        this.small = true;
+        this.hasChildren = false;
 
-WebInspector.DatabaseTreeElement.prototype = {
-    constructor: WebInspector.DatabaseTreeElement,
+        // Since we are initially telling the tree element we don't have any children, make sure that we try to populate
+        // the tree element (which will get a list of tables) when the element is created.
+        this.onpopulate();
+    }
 
     // Overrides from TreeElement (Private)
 
-    oncollapse: function()
+    oncollapse()
     {
         this.shouldRefreshChildren = true;
-    },
+    }
 
-    onpopulate: function()
+    onpopulate()
     {
         if (this.children.length && !this.shouldRefreshChildren)
             return;
@@ -71,5 +68,3 @@ WebInspector.DatabaseTreeElement.prototype = {
         this.representedObject.getTableNames(tableNamesCallback.bind(this));
     }
 };
-
-WebInspector.DatabaseTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
index 8cae8b7..2a08835 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.FolderTreeElement = function(title, subtitle, additionalClassNames, representedObject)
+WebInspector.FolderTreeElement = class FolderTreeElement extends WebInspector.GeneralTreeElement
 {
-    var classNames;
-    if (!additionalClassNames)
-        classNames = [];
-    else if (additionalClassNames.constructor === Array)
-        classNames = additionalClassNames;
-    else if (typeof additionalClassNames === "string")
-        classNames = [additionalClassNames];
+    constructor(title, subtitle, additionalClassNames, representedObject)
+    {
+        var classNames;
+        if (!additionalClassNames)
+            classNames = [];
+        else if (additionalClassNames.constructor === Array)
+            classNames = additionalClassNames;
+        else if (typeof additionalClassNames === "string")
+            classNames = [additionalClassNames];
 
-    classNames.unshift(WebInspector.FolderTreeElement.FolderIconStyleClassName);
+        classNames.unshift(WebInspector.FolderTreeElement.FolderIconStyleClassName);
 
-    WebInspector.GeneralTreeElement.call(this, classNames, title, subtitle, representedObject, true);
+        super(classNames, title, subtitle, representedObject, true);
 
-    this.small = true;
-};
-
-WebInspector.FolderTreeElement.FolderIconStyleClassName = "folder-icon";
-
-WebInspector.FolderTreeElement.prototype = {
-    constructor: WebInspector.FolderTreeElement
+        this.small = true;
+    }
 
     // No Methods or Properties
 };
 
-WebInspector.FolderTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
+WebInspector.FolderTreeElement.FolderIconStyleClassName = "folder-icon";
index 4ff0107..1f8c4cb 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2014 Apple Inc. All rights reserved.
+ * Copyright (C) 2014-2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.FolderizedTreeElement = function(classNames, title, subtitle, representedObject, hasChildren)
+WebInspector.FolderizedTreeElement = class FolderizedTreeElement extends WebInspector.GeneralTreeElement
 {
-    WebInspector.GeneralTreeElement.call(this, classNames, title, subtitle, representedObject, hasChildren);
-
-    this.shouldRefreshChildren = true;
-
-    this._folderSettingsKey = "";
-    this._folderTypeMap = new Map;
-    this._folderizeSettingsMap = new Map;
-    this._groupedIntoFolders = false;
-    this._clearNewChildQueue();
-};
+    constructor(classNames, title, subtitle, representedObject, hasChildren)
+    {
+        super(classNames, title, subtitle, representedObject, hasChildren);
 
-WebInspector.FolderizedTreeElement.MediumChildCountThreshold = 5;
-WebInspector.FolderizedTreeElement.LargeChildCountThreshold = 15;
-WebInspector.FolderizedTreeElement.NumberOfMediumCategoriesThreshold = 2;
-WebInspector.FolderizedTreeElement.NewChildQueueUpdateInterval = 500;
+        this.shouldRefreshChildren = true;
 
-WebInspector.FolderizedTreeElement.prototype = {
-    constructor: WebInspector.FolderizedTreeElement,
-    __proto__: WebInspector.GeneralTreeElement.prototype,
+        this._folderSettingsKey = "";
+        this._folderTypeMap = new Map;
+        this._folderizeSettingsMap = new Map;
+        this._groupedIntoFolders = false;
+        this._clearNewChildQueue();
+    }
 
     // Public
 
     get groupedIntoFolders()
     {
         return this._groupedIntoFolders;
-    },
+    }
 
     set folderSettingsKey(x)
     {
         this._folderSettingsKey = x;
-    },
+    }
 
-    registerFolderizeSettings: function(type, folderDisplayName, validateRepresentedObjectCallback, countChildrenCallback, treeElementConstructor)
+    registerFolderizeSettings(type, folderDisplayName, validateRepresentedObjectCallback, countChildrenCallback, treeElementConstructor)
     {
         console.assert(type);
         console.assert(folderDisplayName);
@@ -74,13 +67,13 @@ WebInspector.FolderizedTreeElement.prototype = {
         };
 
         this._folderizeSettingsMap.set(type, settings);
-    },
+    }
 
     // Overrides from TreeElement (Private).
 
-    removeChildren: function()
+    removeChildren()
     {
-        TreeElement.prototype.removeChildren.call(this);
+        super.removeChildren();
 
         this._clearNewChildQueue();
 
@@ -90,11 +83,11 @@ WebInspector.FolderizedTreeElement.prototype = {
         this._folderTypeMap.clear();
 
         this._groupedIntoFolders = false;
-    },
+    }
 
     // Protected
 
-    addChildForRepresentedObject: function(representedObject)
+    addChildForRepresentedObject(representedObject)
     {
         var settings = this._settingsForRepresentedObject(representedObject);
         console.assert(settings);
@@ -108,18 +101,18 @@ WebInspector.FolderizedTreeElement.prototype = {
             childTreeElement = new settings.treeElementConstructor(representedObject);
 
         this._addTreeElement(childTreeElement);
-    },
+    }
 
-    addRepresentedObjectToNewChildQueue: function(representedObject)
+    addRepresentedObjectToNewChildQueue(representedObject)
     {
         // This queue reduces flashing as resources load and change folders when their type becomes known.
 
         this._newChildQueue.push(representedObject);
         if (!this._newChildQueueTimeoutIdentifier)
             this._newChildQueueTimeoutIdentifier = setTimeout(this._populateFromNewChildQueue.bind(this), WebInspector.FolderizedTreeElement.NewChildQueueUpdateInterval);
-    },
+    }
 
-    removeChildForRepresentedObject: function(representedObject)
+    removeChildForRepresentedObject(representedObject)
     {
         this._removeRepresentedObjectFromNewChildQueue(representedObject);
         this.updateParentStatus();
@@ -137,14 +130,14 @@ WebInspector.FolderizedTreeElement.prototype = {
             return;
 
         this._removeTreeElement(childTreeElement);
-    },
+    }
 
-    compareChildTreeElements: function(a, b)
+    compareChildTreeElements(a, b)
     {
         return this._compareTreeElementsByMainTitle(a, b);
-    },
+    }
 
-    updateParentStatus: function()
+    updateParentStatus()
     {
         var hasChildren = false;
         for (var settings of this._folderizeSettingsMap.values()) {
@@ -157,26 +150,26 @@ WebInspector.FolderizedTreeElement.prototype = {
         this.hasChildren = hasChildren;
         if (!this.hasChildren)
             this.removeChildren();
-    },
+    }
 
-    prepareToPopulate: function()
+    prepareToPopulate()
     {
         if (!this._groupedIntoFolders && this._shouldGroupIntoFolders())
             this._groupedIntoFolders = true;
-    },
+    }
 
     // Private
 
-    _clearNewChildQueue: function()
+    _clearNewChildQueue()
     {
         this._newChildQueue = [];
         if (this._newChildQueueTimeoutIdentifier) {
             clearTimeout(this._newChildQueueTimeoutIdentifier);
             this._newChildQueueTimeoutIdentifier = null;
         }
-    },
+    }
 
-    _populateFromNewChildQueue: function()
+    _populateFromNewChildQueue()
     {
         if (!this.children.length) {
             this.updateParentStatus();
@@ -190,14 +183,14 @@ WebInspector.FolderizedTreeElement.prototype = {
             this.addChildForRepresentedObject(this._newChildQueue[i]);
 
         this._clearNewChildQueue();
-    },
+    }
 
-    _removeRepresentedObjectFromNewChildQueue: function(representedObject)
+    _removeRepresentedObjectFromNewChildQueue(representedObject)
     {
         this._newChildQueue.remove(representedObject);
-    },
+    }
 
-    _addTreeElement: function(childTreeElement)
+    _addTreeElement(childTreeElement)
     {
         console.assert(childTreeElement);
         if (!childTreeElement)
@@ -215,27 +208,27 @@ WebInspector.FolderizedTreeElement.prototype = {
 
         if (wasSelected)
             childTreeElement.revealAndSelect(true, false, true, true);
-    },
+    }
 
-    _compareTreeElementsByMainTitle: function(a, b)
+    _compareTreeElementsByMainTitle(a, b)
     {
         return a.mainTitle.localeCompare(b.mainTitle);
-    },
+    }
 
-    _insertFolderTreeElement: function(folderTreeElement)
+    _insertFolderTreeElement(folderTreeElement)
     {
         console.assert(this._groupedIntoFolders);
         console.assert(!folderTreeElement.parent);
         this.insertChild(folderTreeElement, insertionIndexForObjectInListSortedByFunction(folderTreeElement, this.children, this._compareTreeElementsByMainTitle));
-    },
+    }
 
-    _insertChildTreeElement: function(parentTreeElement, childTreeElement)
+    _insertChildTreeElement(parentTreeElement, childTreeElement)
     {
         console.assert(!childTreeElement.parent);
         parentTreeElement.insertChild(childTreeElement, insertionIndexForObjectInListSortedByFunction(childTreeElement, parentTreeElement.children, this.compareChildTreeElements.bind(this)));
-    },
+    }
 
-    _removeTreeElement: function(childTreeElement, suppressOnDeselect, suppressSelectSibling)
+    _removeTreeElement(childTreeElement, suppressOnDeselect, suppressSelectSibling)
     {
         var oldParent = childTreeElement.parent;
         if (!oldParent)
@@ -253,9 +246,9 @@ WebInspector.FolderizedTreeElement.prototype = {
         // Remove the old parent folder if it is now empty.
         if (!oldParent.children.length)
             oldParent.parent.removeChild(oldParent);
-    },
+    }
 
-    _parentTreeElementForRepresentedObject: function(representedObject)
+    _parentTreeElementForRepresentedObject(representedObject)
     {
         if (!this._groupedIntoFolders)
             return this;
@@ -286,24 +279,24 @@ WebInspector.FolderizedTreeElement.prototype = {
         folder = createFolderTreeElement.call(this, settings.type, settings.folderDisplayName);
         this._folderTypeMap.set(settings.type, folder);
         return folder;
-    },
+    }
 
-    _folderTreeElementExpandedStateChange: function(folderTreeElement)
+    _folderTreeElementExpandedStateChange(folderTreeElement)
     {
         console.assert(folderTreeElement.__expandedSetting);
         folderTreeElement.__expandedSetting.value = folderTreeElement.expanded;
-    },
+    }
 
-    _settingsForRepresentedObject: function(representedObject)
+    _settingsForRepresentedObject(representedObject)
     {
         for (var settings of this._folderizeSettingsMap.values()) {
             if (settings.validateRepresentedObjectCallback(representedObject))
                 return settings;
         }
         return null;
-    },
+    }
 
-    _shouldGroupIntoFolders: function()
+    _shouldGroupIntoFolders()
     {
         // Already grouped into folders, keep it that way.
         if (this._groupedIntoFolders)
@@ -358,3 +351,8 @@ WebInspector.FolderizedTreeElement.prototype = {
         return false;
     }
 };
+
+WebInspector.FolderizedTreeElement.MediumChildCountThreshold = 5;
+WebInspector.FolderizedTreeElement.LargeChildCountThreshold = 15;
+WebInspector.FolderizedTreeElement.NumberOfMediumCategoriesThreshold = 2;
+WebInspector.FolderizedTreeElement.NewChildQueueUpdateInterval = 500;
index 6b99937..ae2ba79 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.FrameTreeElement = function(frame, representedObject)
+WebInspector.FrameTreeElement = class FrameTreeElement extends WebInspector.ResourceTreeElement
 {
-    console.assert(frame instanceof WebInspector.Frame);
+    constructor(frame, representedObject)
+    {
+        console.assert(frame instanceof WebInspector.Frame);
 
-    WebInspector.ResourceTreeElement.call(this, frame.mainResource, representedObject || frame);
+        super(frame.mainResource, representedObject || frame);
 
-    this._frame = frame;
+        this._frame = frame;
 
-    this._updateExpandedSetting();
+        this._updateExpandedSetting();
 
-    frame.addEventListener(WebInspector.Frame.Event.MainResourceDidChange, this._mainResourceDidChange, this);
-    frame.addEventListener(WebInspector.Frame.Event.ResourceWasAdded, this._resourceWasAdded, this);
-    frame.addEventListener(WebInspector.Frame.Event.ResourceWasRemoved, this._resourceWasRemoved, this);
-    frame.addEventListener(WebInspector.Frame.Event.ChildFrameWasAdded, this._childFrameWasAdded, this);
-    frame.addEventListener(WebInspector.Frame.Event.ChildFrameWasRemoved, this._childFrameWasRemoved, this);
+        frame.addEventListener(WebInspector.Frame.Event.MainResourceDidChange, this._mainResourceDidChange, this);
+        frame.addEventListener(WebInspector.Frame.Event.ResourceWasAdded, this._resourceWasAdded, this);
+        frame.addEventListener(WebInspector.Frame.Event.ResourceWasRemoved, this._resourceWasRemoved, this);
+        frame.addEventListener(WebInspector.Frame.Event.ChildFrameWasAdded, this._childFrameWasAdded, this);
+        frame.addEventListener(WebInspector.Frame.Event.ChildFrameWasRemoved, this._childFrameWasRemoved, this);
 
-    frame.domTree.addEventListener(WebInspector.DOMTree.Event.ContentFlowWasAdded, this._childContentFlowWasAdded, this);
-    frame.domTree.addEventListener(WebInspector.DOMTree.Event.ContentFlowWasRemoved, this._childContentFlowWasRemoved, this);
-    frame.domTree.addEventListener(WebInspector.DOMTree.Event.RootDOMNodeInvalidated, this._rootDOMNodeInvalidated, this);
+        frame.domTree.addEventListener(WebInspector.DOMTree.Event.ContentFlowWasAdded, this._childContentFlowWasAdded, this);
+        frame.domTree.addEventListener(WebInspector.DOMTree.Event.ContentFlowWasRemoved, this._childContentFlowWasRemoved, this);
+        frame.domTree.addEventListener(WebInspector.DOMTree.Event.RootDOMNodeInvalidated, this._rootDOMNodeInvalidated, this);
 
-    if (this._frame.isMainFrame())
-        this._downloadingPage = false;
+        if (this._frame.isMainFrame())
+            this._downloadingPage = false;
 
-    this.shouldRefreshChildren = true;
-    this.folderSettingsKey = this._frame.url.hash;
-
-    this.registerFolderizeSettings("frames", WebInspector.UIString("Frames"),
-        function(representedObject) { return representedObject instanceof WebInspector.Frame; },
-        function() { return this.frame.childFrames.length; }.bind(this),
-        WebInspector.FrameTreeElement
-    );
-
-    this.registerFolderizeSettings("flows", WebInspector.UIString("Flows"),
-        function(representedObject) { return representedObject instanceof WebInspector.ContentFlow; },
-        function() { return this.frame.domTree.flowsCount; }.bind(this),
-        WebInspector.ContentFlowTreeElement
-    );
-
-    function makeValidateCallback(resourceType) {
-        return function(representedObject) {
-            return representedObject instanceof WebInspector.Resource && representedObject.type === resourceType;
-        };
-    }
+        this.shouldRefreshChildren = true;
+        this.folderSettingsKey = this._frame.url.hash;
 
-    function makeChildCountCallback(frame, resourceType) {
-        return function() {
-            return frame.resourcesWithType(resourceType).length;
-        };
-    }
+        this.registerFolderizeSettings("frames", WebInspector.UIString("Frames"),
+            function(representedObject) { return representedObject instanceof WebInspector.Frame; },
+            function() { return this.frame.childFrames.length; }.bind(this),
+            WebInspector.FrameTreeElement
+        );
 
-    for (var key in WebInspector.Resource.Type) {
-        var value = WebInspector.Resource.Type[key];
-        var folderName = WebInspector.Resource.displayNameForType(value, true);
-        this.registerFolderizeSettings(key, folderName,
-            makeValidateCallback(value),
-            makeChildCountCallback(this.frame, value),
-            WebInspector.ResourceTreeElement
+        this.registerFolderizeSettings("flows", WebInspector.UIString("Flows"),
+            function(representedObject) { return representedObject instanceof WebInspector.ContentFlow; },
+            function() { return this.frame.domTree.flowsCount; }.bind(this),
+            WebInspector.ContentFlowTreeElement
         );
-    }
 
-    this.updateParentStatus();
-};
+        function makeValidateCallback(resourceType) {
+            return function(representedObject) {
+                return representedObject instanceof WebInspector.Resource && representedObject.type === resourceType;
+            };
+        }
 
-WebInspector.FrameTreeElement.prototype = {
-    constructor: WebInspector.FrameTreeElement,
-    __proto__: WebInspector.ResourceTreeElement.prototype,
+        function makeChildCountCallback(frame, resourceType) {
+            return function() {
+                return frame.resourcesWithType(resourceType).length;
+            };
+        }
+
+        for (var key in WebInspector.Resource.Type) {
+            var value = WebInspector.Resource.Type[key];
+            var folderName = WebInspector.Resource.displayNameForType(value, true);
+            this.registerFolderizeSettings(key, folderName,
+                makeValidateCallback(value),
+                makeChildCountCallback(this.frame, value),
+                WebInspector.ResourceTreeElement
+            );
+        }
+
+        this.updateParentStatus();
+    }
 
     // Public
 
     get frame()
     {
         return this._frame;
-    },
+    }
 
-    descendantResourceTreeElementTypeDidChange: function(resourceTreeElement, oldType)
+    descendantResourceTreeElementTypeDidChange(resourceTreeElement, oldType)
     {
         // Called by descendant ResourceTreeElements.
 
         // Add the tree element again, which will move it to the new location
         // based on sorting and possible folder changes.
         this._addTreeElement(resourceTreeElement);
-    },
+    }
 
-    descendantResourceTreeElementMainTitleDidChange: function(resourceTreeElement, oldMainTitle)
+    descendantResourceTreeElementMainTitleDidChange(resourceTreeElement, oldMainTitle)
     {
         // Called by descendant ResourceTreeElements.
 
         // Add the tree element again, which will move it to the new location
         // based on sorting and possible folder changes.
         this._addTreeElement(resourceTreeElement);
-    },
+    }
 
     // Overrides from SourceCodeTreeElement.
 
-    updateSourceMapResources: function()
+    updateSourceMapResources()
     {
         // Frames handle their own SourceMapResources.
 
@@ -131,9 +129,9 @@ WebInspector.FrameTreeElement.prototype = {
 
         if (this.resource && this.resource.sourceMaps.length)
             this.shouldRefreshChildren = true;
-    },
+    }
 
-    onattach: function()
+    onattach()
     {
         // Immediate superclasses are skipped, since Frames handle their own SourceMapResources.
         WebInspector.GeneralTreeElement.prototype.onattach.call(this);
@@ -142,9 +140,9 @@ WebInspector.FrameTreeElement.prototype = {
             WebInspector.notifications.addEventListener(WebInspector.Notification.PageArchiveStarted, this._pageArchiveStarted, this);
             WebInspector.notifications.addEventListener(WebInspector.Notification.PageArchiveEnded, this._pageArchiveEnded, this);
         }
-    },
+    }
 
-    ondetach: function()
+    ondetach()
     {
         WebInspector.ResourceTreeElement.prototype.ondetach.call(this);
 
@@ -152,11 +150,11 @@ WebInspector.FrameTreeElement.prototype = {
             WebInspector.notifications.removeEventListener(WebInspector.Notification.PageArchiveStarted, this._pageArchiveStarted, this);
             WebInspector.notifications.removeEventListener(WebInspector.Notification.PageArchiveEnded, this._pageArchiveEnded, this);
         }
-    },
+    }
 
     // Overrides from FolderizedTreeElement (Protected).
 
-    compareChildTreeElements: function(a, b)
+    compareChildTreeElements(a, b)
     {
         if (a === b)
             return 0;
@@ -169,17 +167,17 @@ WebInspector.FrameTreeElement.prototype = {
 
         if (!aIsResource && !bIsResource) {
             // When both components are not resources then default to base class comparison.
-            return WebInspector.ResourceTreeElement.prototype.compareChildTreeElements.call(this, a, b);
+            return super.compareChildTreeElements(a, b);
         }
 
         // Non-resources should appear before the resources.
         // FIXME: There should be a better way to group the elements by their type.
         return aIsResource ? 1 : -1;
-    },
+    }
 
     // Called from ResourceTreeElement.
 
-    updateStatusForMainFrame: function()
+    updateStatusForMainFrame()
     {
         function loadedImages()
         {
@@ -221,11 +219,11 @@ WebInspector.FrameTreeElement.prototype = {
                 loadedImages.call(this);
             }.bind(this));
         }
-    },
+    }
 
     // Overrides from TreeElement (Private).
 
-    onpopulate: function()
+    onpopulate()
     {
         if (this.children.length && !this.shouldRefreshChildren)
             return;
@@ -252,34 +250,34 @@ WebInspector.FrameTreeElement.prototype = {
         for (var flowKey in flowMap)
             this.addChildForRepresentedObject(flowMap[flowKey]);
 
-    },
+    }
 
-    onexpand: function()
+    onexpand()
     {
         this._expandedSetting.value = true;
         this._frame.domTree.requestContentFlowList();
-    },
+    }
 
-    oncollapse: function()
+    oncollapse()
     {
         // Only store the setting if we have children, since setting hasChildren to false will cause a collapse,
         // and we only care about user triggered collapses.
         if (this.hasChildren)
             this._expandedSetting.value = false;
-    },
+    }
 
     // Private
 
-    _updateExpandedSetting: function()
+    _updateExpandedSetting()
     {
         this._expandedSetting = new WebInspector.Setting("frame-expanded-" + this._frame.url.hash, this._frame.isMainFrame() ? true : false);
         if (this._expandedSetting.value)
             this.expand();
         else
             this.collapse();
-    },
+    }
 
-    _mainResourceDidChange: function(event)
+    _mainResourceDidChange(event)
     {
         this._updateResource(this._frame.mainResource);
 
@@ -294,56 +292,56 @@ WebInspector.FrameTreeElement.prototype = {
             this._updateDownloadButton();
 
         this.shouldRefreshChildren = true;
-    },
+    }
 
-    _resourceWasAdded: function(event)
+    _resourceWasAdded(event)
     {
         this.addRepresentedObjectToNewChildQueue(event.data.resource);
-    },
+    }
 
-    _resourceWasRemoved: function(event)
+    _resourceWasRemoved(event)
     {
         this.removeChildForRepresentedObject(event.data.resource);
-    },
+    }
 
-    _childFrameWasAdded: function(event)
+    _childFrameWasAdded(event)
     {
         this.addRepresentedObjectToNewChildQueue(event.data.childFrame);
-    },
+    }
 
-    _childFrameWasRemoved: function(event)
+    _childFrameWasRemoved(event)
     {
         this.removeChildForRepresentedObject(event.data.childFrame);
-    },
+    }
 
-    _childContentFlowWasAdded: function(event)
+    _childContentFlowWasAdded(event)
     {
         this.addRepresentedObjectToNewChildQueue(event.data.flow);
-    },
+    }
 
-    _childContentFlowWasRemoved: function(event)
+    _childContentFlowWasRemoved(event)
     {
         this.removeChildForRepresentedObject(event.data.flow);
-    },
+    }
 
-    _rootDOMNodeInvalidated: function()
+    _rootDOMNodeInvalidated()
     {
         if (this.expanded)
             this._frame.domTree.requestContentFlowList();
-    },
+    }
 
-    _reloadPageClicked: function(event)
+    _reloadPageClicked(event)
     {
         // Ignore cache when the shift key is pressed.
         PageAgent.reload(event.data.shiftKey);
-    },
+    }
 
-    _downloadButtonClicked: function(event)
+    _downloadButtonClicked(event)
     {
         WebInspector.archiveMainFrame();
-    },
+    }
 
-    _updateDownloadButton: function()
+    _updateDownloadButton()
     {
         console.assert(this._frame.isMainFrame());
         if (!this._downloadButton)
@@ -360,15 +358,15 @@ WebInspector.FrameTreeElement.prototype = {
         }
 
         this._downloadButton.enabled = WebInspector.canArchiveMainFrame();
-    },
+    }
 
-    _pageArchiveStarted: function(event)
+    _pageArchiveStarted(event)
     {
         this._downloadingPage = true;
         this._updateDownloadButton();
-    },
+    }
 
-    _pageArchiveEnded: function(event)
+    _pageArchiveEnded(event)
     {
         this._downloadingPage = false;
         this._updateDownloadButton();
index 0320f14..394577e 100644 (file)
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.GeneralTreeElement = function(classNames, title, subtitle, representedObject, hasChildren)
+WebInspector.GeneralTreeElement = class GeneralTreeElement extends WebInspector.TreeElement
 {
-    TreeElement.call(this, "", representedObject, hasChildren);
-
-    this.classNames = classNames;
-
-    this._tooltipHandledSeparately = false;
-    this._mainTitle = title || "";
-    this._subtitle = subtitle || "";
-    this._status = "";
-};
+    constructor(classNames, title, subtitle, representedObject, hasChildren)
+    {
+        super("", representedObject, hasChildren);
 
-WebInspector.GeneralTreeElement.StyleClassName = "item";
-WebInspector.GeneralTreeElement.DisclosureButtonStyleClassName = "disclosure-button";
-WebInspector.GeneralTreeElement.IconElementStyleClassName = "icon";
-WebInspector.GeneralTreeElement.StatusElementStyleClassName = "status";
-WebInspector.GeneralTreeElement.TitlesElementStyleClassName = "titles";
-WebInspector.GeneralTreeElement.MainTitleElementStyleClassName = "title";
-WebInspector.GeneralTreeElement.SubtitleElementStyleClassName = "subtitle";
-WebInspector.GeneralTreeElement.NoSubtitleStyleClassName = "no-subtitle";
-WebInspector.GeneralTreeElement.SmallStyleClassName = "small";
-WebInspector.GeneralTreeElement.TwoLineStyleClassName = "two-line";
+        this.classNames = classNames;
 
-WebInspector.GeneralTreeElement.Event = {
-    MainTitleDidChange: "general-tree-element-main-title-did-change"
-};
-
-WebInspector.GeneralTreeElement.prototype = {
-    constructor: WebInspector.GeneralTreeElement,
-    __proto__: TreeElement.prototype,
+        this._tooltipHandledSeparately = false;
+        this._mainTitle = title || "";
+        this._subtitle = subtitle || "";
+        this._status = "";
+    }
 
     // Public
 
     get element()
     {
         return this._listItemNode;
-    },
+    }
 
     get iconElement()
     {
         this._createElementsIfNeeded();
         return this._iconElement;
-    },
+    }
 
     get titlesElement()
     {
         this._createElementsIfNeeded();
         return this._titlesElement;
-    },
+    }
 
     get mainTitleElement()
     {
         this._createElementsIfNeeded();
         return this._mainTitleElement;
-    },
+    }
 
     get subtitleElement()
     {
         this._createElementsIfNeeded();
         this._createSubtitleElementIfNeeded();
         return this._subtitleElement;
-    },
+    }
 
     get classNames()
     {
         return this._classNames;
-    },
+    }
 
     set classNames(x)
     {
@@ -107,9 +90,9 @@ WebInspector.GeneralTreeElement.prototype = {
             for (var i = 0; i < this._classNames.length; ++i)
                 this._listItemNode.classList.add(this._classNames[i]);
         }
-    },
+    }
 
-    addClassName: function(className)
+    addClassName(className)
     {
         if (this._classNames.contains(className))
             return;
@@ -118,9 +101,9 @@ WebInspector.GeneralTreeElement.prototype = {
 
         if (this._listItemNode)
             this._listItemNode.classList.add(className);
-    },
+    }
 
-    removeClassName: function(className)
+    removeClassName(className)
     {
         if (!this._classNames.contains(className))
             return;
@@ -129,12 +112,12 @@ WebInspector.GeneralTreeElement.prototype = {
 
         if (this._listItemNode)
             this._listItemNode.classList.remove(className);
-    },
+    }
 
     get small()
     {
         return this._small;
-    },
+    }
 
     set small(x)
     {
@@ -146,12 +129,12 @@ WebInspector.GeneralTreeElement.prototype = {
             else
                 this._listItemNode.classList.remove(WebInspector.GeneralTreeElement.SmallStyleClassName);
         }
-    },
+    }
 
     get twoLine()
     {
         return this._twoLine;
-    },
+    }
 
     set twoLine(x)
     {
@@ -163,12 +146,12 @@ WebInspector.GeneralTreeElement.prototype = {
             else
                 this._listItemNode.classList.remove(WebInspector.GeneralTreeElement.TwoLineStyleClassName);
         }
-    },
+    }
 
     get mainTitle()
     {
         return this._mainTitle;
-    },
+    }
 
     set mainTitle(x)
     {
@@ -176,24 +159,24 @@ WebInspector.GeneralTreeElement.prototype = {
         this._updateTitleElements();
         this.didChange();
         this.dispatchEventToListeners(WebInspector.GeneralTreeElement.Event.MainTitleDidChange);
-    },
+    }
 
     get subtitle()
     {
         return this._subtitle;
-    },
+    }
 
     set subtitle(x)
     {
         this._subtitle = x || "";
         this._updateTitleElements();
         this.didChange();
-    },
+    }
 
     get status()
     {
         return this._status;
-    },
+    }
 
     set status(x)
     {
@@ -207,36 +190,36 @@ WebInspector.GeneralTreeElement.prototype = {
 
         this._status = x || "";
         this._updateStatusElement();
-    },
+    }
 
     get filterableData()
     {
         return {text: [this.mainTitle, this.subtitle]};
-    },
+    }
 
     get tooltipHandledSeparately()
     {
         return this._tooltipHandledSeparately;
-    },
+    }
 
     set tooltipHandledSeparately(x)
     {
         this._tooltipHandledSeparately = x || false;
-    },
+    }
 
     // Overrides from TreeElement (Private)
 
-    isEventWithinDisclosureTriangle: function(event)
+    isEventWithinDisclosureTriangle(event)
     {
         return event.target === this._disclosureButton;
-    },
+    }
 
-    onattach: function()
+    onattach()
     {
         this._createElementsIfNeeded();
         this._updateTitleElements();
 
-        this._listItemNode.classList.add(WebInspector.GeneralTreeElement.StyleClassName);
+        this._listItemNode.classList.add("item");
 
         if (this._classNames) {
             for (var i = 0; i < this._classNames.length; ++i)
@@ -264,25 +247,25 @@ WebInspector.GeneralTreeElement.prototype = {
         }
 
         this._updateStatusElement();
-    },
+    }
 
-    ondetach: function()
+    ondetach()
     {
         if (this._boundContextMenuEventHandler) {
             this._listItemNode.removeEventListener("contextmenu", this._boundContextMenuEventHandler, true);
             delete this._boundContextMenuEventHandler;
         }
-    },
+    }
 
-    onreveal: function()
+    onreveal()
     {
         if (this._listItemNode)
             this._listItemNode.scrollIntoViewIfNeeded(false);
-    },
+    }
 
     // Protected
 
-    callFirstAncestorFunction: function(functionName, args)
+    callFirstAncestorFunction(functionName, args)
     {
         // Call the first ancestor that implements a function named functionName (if any).
         var currentNode = this.parent;
@@ -294,11 +277,11 @@ WebInspector.GeneralTreeElement.prototype = {
 
             currentNode = currentNode.parent;
         }
-    },
+    }
 
     // Private
 
-    _createElementsIfNeeded: function()
+    _createElementsIfNeeded()
     {
         if (this._createdElements)
             return;
@@ -321,9 +304,9 @@ WebInspector.GeneralTreeElement.prototype = {
         this._titlesElement.appendChild(this._mainTitleElement);
 
         this._createdElements = true;
-    },
+    }
 
-    _createSubtitleElementIfNeeded: function()
+    _createSubtitleElementIfNeeded()
     {
         if (this._subtitleElement)
             return;
@@ -331,9 +314,9 @@ WebInspector.GeneralTreeElement.prototype = {
         this._subtitleElement = document.createElement("span");
         this._subtitleElement.className = WebInspector.GeneralTreeElement.SubtitleElementStyleClassName;
         this._titlesElement.appendChild(this._subtitleElement);
-    },
+    }
 
-    _updateTitleElements: function()
+    _updateTitleElements()
     {
         if (!this._createdElements)
             return;
@@ -377,9 +360,9 @@ WebInspector.GeneralTreeElement.prototype = {
             else
                 this._listItemNode.title = subtitleText;
         }
-    },
+    }
 
-    _updateStatusElement: function()
+    _updateStatusElement()
     {
         if (!this._statusElement)
             return;
@@ -394,3 +377,17 @@ WebInspector.GeneralTreeElement.prototype = {
             this._statusElement.textContent = this._status;
     }
 };
+
+WebInspector.GeneralTreeElement.DisclosureButtonStyleClassName = "disclosure-button";
+WebInspector.GeneralTreeElement.IconElementStyleClassName = "icon";
+WebInspector.GeneralTreeElement.StatusElementStyleClassName = "status";
+WebInspector.GeneralTreeElement.TitlesElementStyleClassName = "titles";
+WebInspector.GeneralTreeElement.MainTitleElementStyleClassName = "title";
+WebInspector.GeneralTreeElement.SubtitleElementStyleClassName = "subtitle";
+WebInspector.GeneralTreeElement.NoSubtitleStyleClassName = "no-subtitle";
+WebInspector.GeneralTreeElement.SmallStyleClassName = "small";
+WebInspector.GeneralTreeElement.TwoLineStyleClassName = "two-line";
+
+WebInspector.GeneralTreeElement.Event = {
+    MainTitleDidChange: "general-tree-element-main-title-did-change"
+};
index d642430..0b205bf 100644 (file)
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.IndexedDatabaseHostTreeElement = function(host)
+WebInspector.IndexedDatabaseHostTreeElement = class IndexedDatabaseHostTreeElement extends WebInspector.StorageTreeElement
 {
-    WebInspector.StorageTreeElement.call(this, WebInspector.FolderTreeElement.FolderIconStyleClassName, WebInspector.displayNameForHost(host), null);
-
-    this._host = host;
+    constructor(host)
+    {
+        super(WebInspector.FolderTreeElement.FolderIconStyleClassName, WebInspector.displayNameForHost(host), null);
 
-    this.hasChildren = true;
-};
+        this._host = host;
 
-WebInspector.IndexedDatabaseHostTreeElement.prototype = {
-    constructor: WebInspector.IndexedDatabaseHostTreeElement,
-    __proto__: WebInspector.StorageTreeElement.prototype,
+        this.hasChildren = true;
+    }
 
     // Public
 
     get name()
     {
         return WebInspector.displayNameForHost(this._host);
-    },
+    }
 
     get categoryName()
     {
index eebd1ca..ca81291 100644 (file)
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.IndexedDatabaseObjectStoreIndexTreeElement = function(objectStoreIndex)
+WebInspector.IndexedDatabaseObjectStoreIndexTreeElement = class IndexedDatabaseObjectStoreIndexTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(objectStoreIndex instanceof WebInspector.IndexedDatabaseObjectStoreIndex);
-
-    this._objectStoreIndex = objectStoreIndex;
+    constructor(objectStoreIndex)
+    {
+        console.assert(objectStoreIndex instanceof WebInspector.IndexedDatabaseObjectStoreIndex);
 
-    WebInspector.GeneralTreeElement.call(this, WebInspector.IndexedDatabaseObjectStoreTreeElement.IconStyleClassName, objectStoreIndex.name, null, objectStoreIndex, false);
+        super("database-table-icon", objectStoreIndex.name, null, objectStoreIndex, false);
 
-    this.small = true;
-};
+        this._objectStoreIndex = objectStoreIndex;
 
-WebInspector.IndexedDatabaseObjectStoreIndexTreeElement.IconStyleClassName = "database-table-icon";
-
-WebInspector.IndexedDatabaseObjectStoreIndexTreeElement.prototype = {
-    constructor: WebInspector.IndexedDatabaseObjectStoreIndexTreeElement,
-    __proto__: WebInspector.GeneralTreeElement.prototype,
+        this.small = true;
+    }
 
     // Public
 
index 8f9c7c1..799b9bf 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2014 Apple Inc. All rights reserved.
+ * Copyright (C) 2014-2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.IndexedDatabaseObjectStoreTreeElement = function(objectStore)
+WebInspector.IndexedDatabaseObjectStoreTreeElement = class IndexedDatabaseObjectStoreTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(objectStore instanceof WebInspector.IndexedDatabaseObjectStore);
-
-    this._objectStore = objectStore;
-
-    WebInspector.GeneralTreeElement.call(this, WebInspector.IndexedDatabaseObjectStoreTreeElement.IconStyleClassName, objectStore.name, null, objectStore, !!this._objectStore.indexes.length);
+    constructor(objectStore)
+    {
+        console.assert(objectStore instanceof WebInspector.IndexedDatabaseObjectStore);
 
-    this.small = true;
-};
+        super(WebInspector.IndexedDatabaseObjectStoreTreeElement.IconStyleClassName, objectStore.name, null, objectStore, !!this._objectStore.indexes.length);
 
-WebInspector.IndexedDatabaseObjectStoreTreeElement.IconStyleClassName = "database-table-icon";
+        this._objectStore = objectStore;
 
-WebInspector.IndexedDatabaseObjectStoreTreeElement.prototype = {
-    constructor: WebInspector.IndexedDatabaseObjectStoreTreeElement,
-    __proto__: WebInspector.GeneralTreeElement.prototype,
+        this.small = true;
+    }
 
     // Public
 
     get objectStore()
     {
         return this._objectStore;
-    },
+    }
 
     // Overrides from TreeElement (Protected)
 
-    oncollapse: function()
+    oncollapse()
     {
         this.shouldRefreshChildren = true;
-    },
+    }
 
-    onpopulate: function()
+    onpopulate()
     {
         if (this.children.length && !this.shouldRefreshChildren)
             return;
index 0f7b267..a958c93 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2014 Apple Inc. All rights reserved.
+ * Copyright (C) 2014-2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.IndexedDatabaseTreeElement = function(indexedDatabase)
+WebInspector.IndexedDatabaseTreeElement = class IndexedDatabaseTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(indexedDatabase instanceof WebInspector.IndexedDatabase);
-
-    this._indexedDatabase = indexedDatabase;
-
-    WebInspector.GeneralTreeElement.call(this, WebInspector.IndexedDatabaseTreeElement.IconStyleClassName, indexedDatabase.name, null, indexedDatabase, !!this._indexedDatabase.objectStores.length);
+    constructor(indexedDatabase)
+    {
+        console.assert(indexedDatabase instanceof WebInspector.IndexedDatabase);
 
-    this.small = true;
-};
+        this._indexedDatabase = indexedDatabase;
 
-WebInspector.IndexedDatabaseTreeElement.IconStyleClassName = "database-icon";
+        super("database-icon", indexedDatabase.name, null, indexedDatabase, !!this._indexedDatabase.objectStores.length);
 
-WebInspector.IndexedDatabaseTreeElement.prototype = {
-    constructor: WebInspector.IndexedDatabaseTreeElement,
+        this.small = true;
+    }
 
     // Public
 
     get indexedDatabase()
     {
         return this._indexedDatabase;
-    },
+    }
 
     // Overrides from TreeElement (Protected)
 
-    oncollapse: function()
+    oncollapse()
     {
         this.shouldRefreshChildren = true;
-    },
+    }
 
-    onpopulate: function()
+    onpopulate()
     {
         if (this.children.length && !this.shouldRefreshChildren)
             return;
@@ -66,5 +63,3 @@ WebInspector.IndexedDatabaseTreeElement.prototype = {
             this.appendChild(new WebInspector.IndexedDatabaseObjectStoreTreeElement(objectStore));
     }
 };
-
-WebInspector.IndexedDatabaseTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
index 87604b5..34c2eae 100644 (file)
@@ -139,10 +139,10 @@ WebInspector.LegacyConsoleMessageImpl.prototype = {
         if (this._shouldDumpStackTrace()) {
             var ol = document.createElement("ol");
             ol.className = "outline-disclosure";
-            var treeOutline = new TreeOutline(ol);
+            var treeOutline = new WebInspector.TreeOutline(ol);
 
             var content = this._formattedMessage;
-            var root = new TreeElement(content, null, true);
+            var root = new WebInspector.TreeElement(content, null, true);
             content.treeElementForTest = root;
             treeOutline.appendChild(root);
             if (this.type === WebInspector.LegacyConsoleMessage.MessageType.Trace)
@@ -620,7 +620,7 @@ WebInspector.LegacyConsoleMessageImpl.prototype = {
                 content.appendChild(urlElement);
             }
 
-            var treeElement = new TreeElement(content);
+            var treeElement = new WebInspector.TreeElement(content);
             parentTreeElement.appendChild(treeElement);
         }
     },
index a73d0db..7ffd8db 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.LogTreeElement = function(representedObject)
+WebInspector.LogTreeElement = class LogTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(representedObject instanceof WebInspector.LogObject);
-
-    WebInspector.GeneralTreeElement.call(this, WebInspector.LogTreeElement.StyleClassName, WebInspector.UIString("Console"), representedObject.startDate.toLocaleTimeString(), representedObject, false);
-
-    this._logObject = representedObject;
+    constructor(representedObject)
+    {
+        console.assert(representedObject instanceof WebInspector.LogObject);
 
-    this.small = true;
-};
+        super("log-icon", WebInspector.UIString("Console"), representedObject.startDate.toLocaleTimeString(), representedObject, false);
 
-WebInspector.LogTreeElement.StyleClassName = "log-icon";
+        this._logObject = representedObject;
 
-WebInspector.LogTreeElement.prototype = {
-    constructor: WebInspector.LogTreeElement,
+        this.small = true;
+    }
 
     // Public
 
@@ -46,5 +43,3 @@ WebInspector.LogTreeElement.prototype = {
         return this._logObject;
     }
 };
-
-WebInspector.LogTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
index 54f5c65..ab0ee5c 100644 (file)
@@ -157,7 +157,7 @@ WebInspector.NavigationSidebarPanel = class NavigationSidebarPanel extends WebIn
             contentTreeOutlineElement.classList.add(WebInspector.NavigationSidebarPanel.ContentTreeOutlineElementHiddenStyleClassName);
         this.contentElement.appendChild(contentTreeOutlineElement);
 
-        var contentTreeOutline = new TreeOutline(contentTreeOutlineElement);
+        var contentTreeOutline = new WebInspector.TreeOutline(contentTreeOutlineElement);
         contentTreeOutline.allowsRepeatSelection = true;
 
         if (!suppressFiltering) {
index 2e9efff..6895dc7 100644 (file)
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ObjectTreeArrayIndexTreeElement = function(property, propertyPath)
+WebInspector.ObjectTreeArrayIndexTreeElement = class ObjectTreeArrayIndexTreeElement extends WebInspector.ObjectTreeBaseTreeElement
 {
-    console.assert(property.isIndexProperty(), "ArrayIndexTreeElement expects numeric property names");
-
-    WebInspector.ObjectTreeBaseTreeElement.call(this, property, propertyPath, property);
+    constructor(property, propertyPath)
+    {
+        console.assert(property.isIndexProperty(), "ObjectTreeArrayIndexTreeElement expects numeric property names");
 
-    this.mainTitle = this._titleFragment();
-    this.addClassName("object-tree-property");
-    this.addClassName("object-tree-array-index");
+        super(property, propertyPath, property);
 
-    if (!this.property.hasValue())
-        this.addClassName("accessor");
-};
+        this.mainTitle = this._titleFragment();
+        this.addClassName("object-tree-property");
+        this.addClassName("object-tree-array-index");
 
-WebInspector.ObjectTreeArrayIndexTreeElement.prototype = {
-    constructor: WebInspector.ObjectTreeArrayIndexTreeElement,
-    __proto__: WebInspector.ObjectTreeBaseTreeElement.prototype,
+        if (!this.property.hasValue())
+            this.addClassName("accessor");
+    }
 
     // Protected
 
@@ -48,7 +46,7 @@ WebInspector.ObjectTreeArrayIndexTreeElement.prototype = {
         this.mainTitle = this._titleFragment();
 
         this.removeClassName("accessor");
-    },
+    }
 
     // Private
 
index f40ebf9..55a4fbe 100644 (file)
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ObjectTreeBaseTreeElement = function(representedObject, propertyPath, property)
+WebInspector.ObjectTreeBaseTreeElement = class ObjectTreeBaseTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(representedObject);
-    console.assert(propertyPath instanceof WebInspector.PropertyPath);
-    console.assert(!property || property instanceof WebInspector.PropertyDescriptor);
-
-    this._property = property;
-    this._propertyPath = propertyPath;
+    constructor(representedObject, propertyPath, property)
+    {
+        console.assert(representedObject);
+        console.assert(propertyPath instanceof WebInspector.PropertyPath);
+        console.assert(!property || property instanceof WebInspector.PropertyDescriptor);
 
-    WebInspector.GeneralTreeElement.call(this, null, null, null, representedObject, false);
+        super(null, null, null, representedObject, false);
 
-    this.small = true;
-    this.toggleOnClick = true;
-    this.selectable = false;
-    this.tooltipHandledSeparately = true;
-};
+        this._property = property;
+        this._propertyPath = propertyPath;
 
-WebInspector.ObjectTreeBaseTreeElement.prototype = {
-    constructor: WebInspector.ObjectTreeBaseTreeElement,
-    __proto__: WebInspector.GeneralTreeElement.prototype,
+        this.small = true;
+        this.toggleOnClick = true;
+        this.selectable = false;
+        this.tooltipHandledSeparately = true;
+    }
 
     // Public
 
     get property()
     {
         return this._property;
-    },
+    }
 
     get propertyPath()
     {
         return this._propertyPath;
-    },
+    }
 
     // Protected
 
     oncontextmenu(event)
     {
         this._contextMenuHandler(event);
-    },
+    }
 
     resolvedValue()
     {
@@ -71,7 +69,7 @@ WebInspector.ObjectTreeBaseTreeElement.prototype = {
         if (this._property.hasValue())
             return this._property.value;
         return null;
-    },
+    }
 
     resolvedValuePropertyPath()
     {
@@ -81,19 +79,19 @@ WebInspector.ObjectTreeBaseTreeElement.prototype = {
         if (this._property.hasValue())
             return this._propertyPath.appendPropertyDescriptor(this._property.value, this._property, WebInspector.PropertyPath.Type.Value);
         return null;
-    },
+    }
 
     thisPropertyPath()
     {
         console.assert(this._property);
         return this._propertyPath.appendPropertyDescriptor(null, this._property, this.propertyPathType());
-    },
+    }
 
     hadError()
     {
         console.assert(this._property);
         return this._property.wasThrown || this._getterHadError;
-    },
+    }
 
     propertyPathType()
     {
@@ -105,7 +103,7 @@ WebInspector.ObjectTreeBaseTreeElement.prototype = {
         if (this._property.hasSetter())
             return WebInspector.PropertyPath.Type.Setter;
         return WebInspector.PropertyPath.Type.Value;
-    },
+    }
 
     propertyPathString(propertyPath)
     {
@@ -113,7 +111,7 @@ WebInspector.ObjectTreeBaseTreeElement.prototype = {
             return WebInspector.UIString("Unable to determine path to property from root");
 
         return propertyPath.displayPath(this.propertyPathType());
-    },
+    }
 
     createInteractiveGetterElement()
     {
@@ -134,7 +132,7 @@ WebInspector.ObjectTreeBaseTreeElement.prototype = {
         }.bind(this));
 
         return getterElement;
-    },
+    }
 
     createReadOnlyIconElement()
     {
@@ -142,7 +140,7 @@ WebInspector.ObjectTreeBaseTreeElement.prototype = {
         readOnlyElement.className = "read-only";
         readOnlyElement.title = WebInspector.UIString("Read only");
         return readOnlyElement;
-    },
+    }
 
     // Private
 
@@ -160,7 +158,7 @@ WebInspector.ObjectTreeBaseTreeElement.prototype = {
             WebInspector.quickConsole.prompt.pushHistoryItem(text);
 
         WebInspector.consoleLogViewController.appendImmediateExecutionWithResult(text, resolvedValue);
-    },
+    }
 
     _contextMenuHandler(event)
     {
@@ -184,7 +182,7 @@ WebInspector.ObjectTreeBaseTreeElement.prototype = {
 
         if (!contextMenu.isEmpty())
             contextMenu.show();
-    },
+    }
 
     _appendMenusItemsForObject(contextMenu, resolvedValue)
     {
index fb92d8f..d6ba47e 100644 (file)
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ObjectTreeMapEntryTreeElement = function(object, propertyPath)
+WebInspector.ObjectTreeMapEntryTreeElement = class ObjectTreeMapEntryTreeElement extends WebInspector.ObjectTreeBaseTreeElement
 {
-    console.assert(object instanceof WebInspector.RemoteObject);
-
-    this._object = object;
+    constructor(object, propertyPath)
+    {
+        console.assert(object instanceof WebInspector.RemoteObject);
 
-    // Treat the same as an array-index just with different strings and widths.
-    WebInspector.ObjectTreeBaseTreeElement.call(this, this._object, propertyPath);
+        // Treat the same as an array-index just with different strings and widths.
+        super(this._object, propertyPath);
 
-    this.mainTitle = this._titleFragment();
-    this.addClassName("object-tree-array-index");
-    this.addClassName("object-tree-map-entry");
-};
+        this._object = object;
 
-WebInspector.ObjectTreeMapEntryTreeElement.prototype = {
-    constructor: WebInspector.ObjectTreeMapEntryTreeElement,
-    __proto__: WebInspector.ObjectTreeBaseTreeElement.prototype,
+        this.mainTitle = this._titleFragment();
+        this.addClassName("object-tree-array-index");
+        this.addClassName("object-tree-map-entry");
+    }
 
     // Public
 
     get object()
     {
         return this._object;
-    },
+    }
 
     // Protected
 
     resolvedValue()
     {
         return this._object;
-    },
+    }
 
     propertyPathType()
     {
         return WebInspector.PropertyPath.Type.Value;
-    },
+    }
 
     // Private
 
@@ -83,23 +81,21 @@ WebInspector.ObjectTreeMapEntryTreeElement.prototype = {
     }
 };
 
-
-WebInspector.ObjectTreeMapKeyTreeElement = function(object, propertyPath)
+WebInspector.ObjectTreeMapKeyTreeElement = class ObjectTreeMapKeyTreeElement extends WebInspector.ObjectTreeMapEntryTreeElement
 {
-    WebInspector.ObjectTreeMapEntryTreeElement.call(this, object, propertyPath);
-    this.addClassName("key");
-};
-
-WebInspector.ObjectTreeMapKeyTreeElement.prototype = {
-    constructor: WebInspector.ObjectTreeMapKeyTreeElement,
-    __proto__: WebInspector.ObjectTreeMapEntryTreeElement.prototype,
+    constructor(object, propertyPath)
+    {
+        super(object, propertyPath);
 
+        this.addClassName("key");
+    }
+    
     // Protected
 
     displayPropertyName()
     {
         return WebInspector.UIString("key");
-    },
+    }
 
     resolvedValuePropertyPath()
     {
@@ -107,24 +103,23 @@ WebInspector.ObjectTreeMapKeyTreeElement.prototype = {
     }
 };
 
-
-WebInspector.ObjectTreeMapValueTreeElement = function(object, propertyPath, key)
+WebInspector.ObjectTreeMapValueTreeElement = class ObjectTreeMapValueTreeElement extends WebInspector.ObjectTreeMapEntryTreeElement
 {
-    this._key = key;
-    WebInspector.ObjectTreeMapEntryTreeElement.call(this, object, propertyPath);
-    this.addClassName("value");
-};
+    constructor(object, propertyPath, key)
+    {
+        super(object, propertyPath);
 
-WebInspector.ObjectTreeMapValueTreeElement.prototype = {
-    constructor: WebInspector.ObjectTreeMapValueTreeElement,
-    __proto__: WebInspector.ObjectTreeMapEntryTreeElement.prototype,
+        this._key = key;
 
+        this.addClassName("value");
+    }
+    
     // Protected
 
     displayPropertyName()
     {
         return WebInspector.UIString("value");
-    },
+    }
 
     resolvedValuePropertyPath()
     {
index 3516b6c..8c762bd 100644 (file)
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ObjectTreePropertyTreeElement = function(property, propertyPath, mode, prototypeName)
+WebInspector.ObjectTreePropertyTreeElement = class ObjectTreePropertyTreeElement extends WebInspector.ObjectTreeBaseTreeElement
 {
-    this._mode = mode || WebInspector.ObjectTreeView.Mode.Properties;
-    this._prototypeName = prototypeName;
-
-    WebInspector.ObjectTreeBaseTreeElement.call(this, property, propertyPath, property);
+    constructor(property, propertyPath, mode, prototypeName)
+    {
+        super(property, propertyPath, property);
 
-    this.mainTitle = this._titleFragment();
-    this.addClassName("object-tree-property");
+        this._mode = mode || WebInspector.ObjectTreeView.Mode.Properties;
+        this._prototypeName = prototypeName;
 
-    if (this.property.hasValue()) {
-        this.addClassName(this.property.value.type);
-        if (this.property.value.subtype)
-            this.addClassName(this.property.value.subtype);
-    } else
-        this.addClassName("accessor");
+        this.mainTitle = this._titleFragment();
+        this.addClassName("object-tree-property");
 
-    if (this.property.wasThrown)
-        this.addClassName("had-error");
-    if (this.property.name === "__proto__")
-        this.addClassName("prototype-property");
+        if (this.property.hasValue()) {
+            this.addClassName(this.property.value.type);
+            if (this.property.value.subtype)
+                this.addClassName(this.property.value.subtype);
+        } else
+            this.addClassName("accessor");
 
-    this._updateTooltips();
-    this._updateHasChildren();
-};
-
-WebInspector.ObjectTreePropertyTreeElement.prototype = {
-    constructor: WebInspector.ObjectTreePropertyTreeElement,
-    __proto__: WebInspector.ObjectTreeBaseTreeElement.prototype,
+        if (this.property.wasThrown)
+            this.addClassName("had-error");
+        if (this.property.name === "__proto__")
+            this.addClassName("prototype-property");
 
+        this._updateTooltips();
+        this._updateHasChildren();
+    }
+    
     // Protected
 
     onpopulate()
     {
         this._updateChildren();
-    },
+    }
 
     onexpand()
     {
         if (this._previewView)
             this._previewView.showTitle();
-    },
+    }
 
     oncollapse()
     {
         if (this._previewView)
             this._previewView.showPreview();
-    },
+    }
 
     invokedGetter()
     {
@@ -85,7 +83,7 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
         this.removeClassName("accessor");
 
         this._updateHasChildren();
-    },
+    }
 
     // Private
 
@@ -99,7 +97,7 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
             this.hasChildren = !wasThrown && valueHasChildren;
         else
             this.hasChildren = !wasThrown && valueHasChildren && (this.property.name === "__proto__" || this._alwaysDisplayAsProperty());
-    },
+    }
 
     _updateTooltips()
     {
@@ -113,7 +111,7 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
             attributes.push("writable");
 
         this.iconElement.title = attributes.join(" ");
-    },
+    }
 
     _titleFragment()
     {
@@ -124,7 +122,7 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
             return this._createTitlePropertyStyle();
         else
             return this._createTitleAPIStyle();
-    },
+    }
 
     _createTitlePrototype()
     {
@@ -136,7 +134,7 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
         nameElement.textContent = WebInspector.UIString("%s Prototype").format(this._sanitizedPrototypeString(this.property.value));
         nameElement.title = this.propertyPathString(this.thisPropertyPath());
         return nameElement;
-    },
+    }
 
     _createTitlePropertyStyle()
     {
@@ -184,7 +182,7 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
         container.appendChild(nameElement);
         container.appendChild(valueOrGetterElement);
         return container;
-    },
+    }
 
     _createTitleAPIStyle()
     {
@@ -220,7 +218,7 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
         }
 
         return container;
-    },
+    }
 
     _alwaysDisplayAsProperty()
     {
@@ -237,12 +235,12 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
             return true;
 
         return false;
-    },
+    }
 
     _functionPropertyString()
     {
         return "function" + this._functionParameterString();
-    },
+    }
 
     _functionParameterString()
     {
@@ -283,7 +281,7 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
 
         var match = resolvedValue.description.match(/^function.*?(\([^)]+?\))/);
         return match ? match[1] : "()";
-    },
+    }
 
     _sanitizedPrototypeString(value)
     {
@@ -296,7 +294,7 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
             return "RegExp";
 
         return value.description.replace(/Prototype$/, "");
-    },
+    }
 
     _updateChildren()
     {
@@ -310,20 +308,20 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
             resolvedValue.getOwnPropertyDescriptors(this._updateChildrenInternal.bind(this, this._updateProperties, WebInspector.ObjectTreeView.Mode.API));
         else
             resolvedValue.getDisplayablePropertyDescriptors(this._updateChildrenInternal.bind(this, this._updateProperties, this._mode));
-    },
+    }
 
     _updateChildrenInternal(handler, mode, list)
     {
         this.removeChildren();
 
         if (!list) {
-            var errorMessageElement = WebInspector.ObjectTreeView.emptyMessageElement(WebInspector.UIString("Could not fetch properties. Object may no longer exist."));
-            this.appendChild(new TreeElement(errorMessageElement, null, false));
+            var errorMessageElement = WebInspector.ObjectTreeView.createEmptyMessageElement(WebInspector.UIString("Could not fetch properties. Object may no longer exist."));
+            this.appendChild(new WebInspector.TreeElement(errorMessageElement, null, false));
             return;
         }
 
         handler.call(this, list, this.resolvedValuePropertyPath(), mode);
-    },
+    }
 
     _updateEntries(entries, propertyPath, mode)
     {
@@ -336,8 +334,8 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
         }
 
         if (!this.children.length) {
-            var emptyMessageElement = WebInspector.ObjectTreeView.emptyMessageElement(WebInspector.UIString("No Entries."));
-            this.appendChild(new TreeElement(emptyMessageElement, null, false));
+            var emptyMessageElement = WebInspector.ObjectTreeView.createEmptyMessageElement(WebInspector.UIString("No Entries."));
+            this.appendChild(new WebInspector.TreeElement(emptyMessageElement, null, false));
         }
 
         // Show the prototype so users can see the API.
@@ -346,11 +344,11 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
             if (propertyDescriptor)
                 this.appendChild(new WebInspector.ObjectTreePropertyTreeElement(propertyDescriptor, propertyPath, mode));
         }.bind(this));
-    },
+    }
 
     _updateProperties(properties, propertyPath, mode)
     {
-        properties.sort(WebInspector.ObjectTreeView.ComparePropertyDescriptors);
+        properties.sort(WebInspector.ObjectTreeView.comparePropertyDescriptors);
 
         var resolvedValue = this.resolvedValue();
         var isArray = resolvedValue.isArray();
@@ -380,8 +378,8 @@ WebInspector.ObjectTreePropertyTreeElement.prototype = {
         }
 
         if (!this.children.length) {
-            var emptyMessageElement = WebInspector.ObjectTreeView.emptyMessageElement(WebInspector.UIString("No Properties."));
-            this.appendChild(new TreeElement(emptyMessageElement, null, false));
+            var emptyMessageElement = WebInspector.ObjectTreeView.createEmptyMessageElement(WebInspector.UIString("No Properties."));
+            this.appendChild(new WebInspector.TreeElement(emptyMessageElement, null, false));
         }
     }
 };
index 785da60..1e13230 100644 (file)
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ObjectTreeSetIndexTreeElement = function(object, propertyPath)
+WebInspector.ObjectTreeSetIndexTreeElement = class ObjectTreeSetIndexTreeElement extends WebInspector.ObjectTreeBaseTreeElement
 {
-    console.assert(object instanceof WebInspector.RemoteObject);
-
-    this._object = object;
+    constructor(object, propertyPath)
+    {
+        console.assert(object instanceof WebInspector.RemoteObject);
 
-    // Treat the same as an array-index just with different strings and widths.
-    WebInspector.ObjectTreeBaseTreeElement.call(this, this._object, propertyPath);
+        // Treat the same as an array-index just with different strings and widths.
+        super(object, propertyPath);
 
-    this.mainTitle = this._titleFragment();
-    this.addClassName("object-tree-array-index");
-};
+        this._object = object;
 
-WebInspector.ObjectTreeSetIndexTreeElement.prototype = {
-    constructor: WebInspector.ObjectTreeSetIndexTreeElement,
-    __proto__: WebInspector.ObjectTreeBaseTreeElement.prototype,
+        this.mainTitle = this._titleFragment();
+        this.addClassName("object-tree-array-index");
+    }
 
     // Public
 
     get object()
     {
         return this._object;
-    },
+    }
 
     // Protected
 
     resolvedValue()
     {
         return this._object;
-    },
+    }
 
     resolvedValuePropertyPath()
     {
         return this.propertyPath.appendSetIndex(this._object);
-    },
+    }
 
     // Private
 
index 0d553d0..b3b613a 100644 (file)
@@ -64,7 +64,7 @@ WebInspector.ObjectTreeView = function(object, mode, propertyPath, forceExpandin
 
     this._outlineElement = document.createElement("ol");
     this._outlineElement.className = "object-tree-outline";
-    this._outline = new TreeOutline(this._outlineElement);
+    this._outline = new WebInspector.TreeOutline(this._outlineElement);
     this._element.appendChild(this._outlineElement);
 
     // FIXME: Support editable ObjectTrees.
@@ -233,7 +233,7 @@ WebInspector.ObjectTreeView.prototype = {
 
         if (!list) {
             var errorMessageElement = WebInspector.ObjectTreeView.emptyMessageElement(WebInspector.UIString("Could not fetch properties. Object may no longer exist."));
-            this._outline.appendChild(new TreeElement(errorMessageElement, null, false));
+            this._outline.appendChild(new WebInspector.TreeElement(errorMessageElement, null, false));
             return;
         }
 
@@ -252,7 +252,7 @@ WebInspector.ObjectTreeView.prototype = {
 
         if (!this._outline.children.length) {
             var emptyMessageElement = WebInspector.ObjectTreeView.emptyMessageElement(WebInspector.UIString("No Entries."));
-            this._outline.appendChild(new TreeElement(emptyMessageElement, null, false));
+            this._outline.appendChild(new WebInspector.TreeElement(emptyMessageElement, null, false));
         }
 
         // Show the prototype so users can see the API.
@@ -284,7 +284,7 @@ WebInspector.ObjectTreeView.prototype = {
 
         if (!this._outline.children.length) {
             var emptyMessageElement = WebInspector.ObjectTreeView.emptyMessageElement(WebInspector.UIString("No Properties."));
-            this._outline.appendChild(new TreeElement(emptyMessageElement, null, false));
+            this._outline.appendChild(new WebInspector.TreeElement(emptyMessageElement, null, false));
         }
     },
 
index 11ab249..22bbf94 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2014 Apple Inc. All rights reserved.
+ * Copyright (C) 2014-2105 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ProfileNodeTreeElement = function(profileNode, delegate)
+WebInspector.ProfileNodeTreeElement = class ProfileNodeTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(profileNode);
+    constructor(profileNode, delegate)
+    {
+        console.assert(profileNode);
+
+        var title = profileNode.functionName;
+        var subtitle = "";
+
+        if (!title) {
+            switch (profileNode.type) {
+            case WebInspector.ProfileNode.Type.Function:
+                title = WebInspector.UIString("(anonymous function)");
+                break;
+            case WebInspector.ProfileNode.Type.Program:
+                title = WebInspector.UIString("(program)");
+                break;
+            default:
+                title = WebInspector.UIString("(anonymous function)");
+                console.error("Unknown ProfileNode type: " + profileNode.type);
+            }
+        }
 
-    this._profileNode = profileNode;
-    this._delegate = delegate || null;
+        var sourceCodeLocation = profileNode.sourceCodeLocation;
+        if (sourceCodeLocation) {
+            subtitle = document.createElement("span");
+            sourceCodeLocation.populateLiveDisplayLocationString(subtitle, "textContent");
+        }
 
-    var title = profileNode.functionName;
-    var subtitle = "";
+        var className;
 
-    if (!title) {
         switch (profileNode.type) {
         case WebInspector.ProfileNode.Type.Function:
-            title = WebInspector.UIString("(anonymous function)");
+            className = WebInspector.CallFrameTreeElement.FunctionIconStyleClassName;
+            if (!sourceCodeLocation)
+                className = WebInspector.CallFrameTreeElement.NativeIconStyleClassName;
             break;
         case WebInspector.ProfileNode.Type.Program:
-            title = WebInspector.UIString("(program)");
+            className = WebInspector.TimelineRecordTreeElement.EvaluatedRecordIconStyleClass;
             break;
-        default:
-            title = WebInspector.UIString("(anonymous function)");
-            console.error("Unknown ProfileNode type: " + profileNode.type);
         }
-    }
 
-    var sourceCodeLocation = this._profileNode.sourceCodeLocation;
-    if (sourceCodeLocation) {
-        subtitle = document.createElement("span");
-        sourceCodeLocation.populateLiveDisplayLocationString(subtitle, "textContent");
-    }
-
-    var className;
-
-    switch (this._profileNode.type) {
-    case WebInspector.ProfileNode.Type.Function:
-        className = WebInspector.CallFrameTreeElement.FunctionIconStyleClassName;
-        if (!sourceCodeLocation)
-            className = WebInspector.CallFrameTreeElement.NativeIconStyleClassName;
-        break;
-    case WebInspector.ProfileNode.Type.Program:
-        className = WebInspector.TimelineRecordTreeElement.EvaluatedRecordIconStyleClass;
-        break;
-    }
+        console.assert(className);
 
-    console.assert(className);
+        // This is more than likely an event listener function with an "on" prefix and it is
+        // as long or longer than the shortest event listener name -- "oncut".
+        if (profileNode.functionName && profileNode.functionName.startsWith("on") && profileNode.functionName.length >= 5)
+            className = WebInspector.CallFrameTreeElement.EventListenerIconStyleClassName;
 
-    // This is more than likely an event listener function with an "on" prefix and it is
-    // as long or longer than the shortest event listener name -- "oncut".
-    if (profileNode.functionName && profileNode.functionName.startsWith("on") && profileNode.functionName.length >= 5)
-        className = WebInspector.CallFrameTreeElement.EventListenerIconStyleClassName;
+        var hasChildren = !!profileNode.childNodes.length;
 
-    var hasChildren = !!profileNode.childNodes.length;
+        super([className], title, subtitle, profileNode, hasChildren);
 
-    WebInspector.GeneralTreeElement.call(this, [className], title, subtitle, profileNode, hasChildren);
+        this._profileNode = profileNode;
+        this._delegate = delegate || null;
 
-    this.small = true;
-    this.shouldRefreshChildren = true;
+        this.small = true;
+        this.shouldRefreshChildren = true;
 
-    if (sourceCodeLocation)
-        this.tooltipHandledSeparately = true;
-};
-
-WebInspector.ProfileNodeTreeElement.prototype = {
-    constructor: WebInspector.ProfileNodeTreeElement,
-    __proto__: WebInspector.GeneralTreeElement.prototype,
+        if (sourceCodeLocation)
+            this.tooltipHandledSeparately = true;
+    }
 
     // Public
 
     get profileNode()
     {
         return this._profileNode;
-    },
+    }
 
     get filterableData()
     {
         var url = this._profileNode.sourceCodeLocation ? this._profileNode.sourceCodeLocation.sourceCode.url : "";
         return {text: [this.mainTitle, url || ""]};
-    },
+    }
 
     // Protected
 
-    onattach: function()
+    onattach()
     {
         WebInspector.GeneralTreeElement.prototype.onattach.call(this);
 
@@ -114,9 +112,9 @@ WebInspector.ProfileNodeTreeElement.prototype = {
 
         var tooltipPrefix = this.mainTitle + "\n";
         this._profileNode.sourceCodeLocation.populateLiveDisplayLocationTooltip(this.element, tooltipPrefix);
-    },
+    }
 
-    onpopulate: function()
+    onpopulate()
     {
         if (!this.hasChildren || !this.shouldRefreshChildren)
             return;
index 571472b..3477cc5 100644 (file)
@@ -28,7 +28,7 @@ WebInspector.PropertiesSection = function(title, subtitle)
     this.propertiesElement = document.createElement("ol");
     this.propertiesElement.className = "properties properties-tree";
     this.propertiesElement.tabIndex = 0;
-    this.propertiesTreeOutline = new TreeOutline(this.propertiesElement);
+    this.propertiesTreeOutline = new WebInspector.TreeOutline(this.propertiesElement);
     this.propertiesTreeOutline.section = this;
 
     WebInspector.Section.call(this, title, subtitle);
index b8098a9..e888e81 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ResourceTreeElement = function(resource, representedObject)
+WebInspector.ResourceTreeElement = class ResourceTreeElement extends WebInspector.SourceCodeTreeElement
 {
-    console.assert(resource instanceof WebInspector.Resource);
-
-    WebInspector.SourceCodeTreeElement.call(this, resource, [WebInspector.ResourceTreeElement.StyleClassName, WebInspector.ResourceTreeElement.ResourceIconStyleClassName, resource.type], "", "", representedObject || resource, false);
+    constructor(resource, representedObject)
+    {
+        console.assert(resource instanceof WebInspector.Resource);
 
-    this._updateResource(resource);
-};
+        super(resource, ["resource", WebInspector.ResourceTreeElement.ResourceIconStyleClassName, resource.type], "", "", representedObject || resource, false);
 
-WebInspector.ResourceTreeElement.StyleClassName = "resource";
-WebInspector.ResourceTreeElement.ResourceIconStyleClassName = "resource-icon";
-WebInspector.ResourceTreeElement.FailedStyleClassName = "failed";
+        this._updateResource(resource);
+    }
 
-WebInspector.ResourceTreeElement.compareResourceTreeElements = function(a, b)
-{
-    // Compare by type first to keep resources grouped by type when not sorted into folders.
-    var comparisonResult = a.resource.type.localeCompare(b.resource.type);
-    if (comparisonResult !== 0)
-        return comparisonResult;
-
-    // Compare async resource types by their first timestamp so they are in chronological order.
-    if (a.resource.type === WebInspector.Resource.Type.XHR || a.resource.type === WebInspector.Resource.Type.WebSocket)
-        return a.resource.firstTimestamp - b.resource.firstTimestamp || 0;
-
-    // Compare by subtitle when the types are the same. The subtitle is used to show the
-    // domain of the resource. This causes resources to group by domain. If the resource
-    // is on the same domain as the frame it will have an empty subtitle. This is good
-    // because empty string sorts first, so those will appear before external resources.
-    comparisonResult = a.subtitle.localeCompare(b.subtitle);
-    if (comparisonResult !== 0)
-        return comparisonResult;
-
-    // Compare by title when the subtitles are the same.
-    return a.mainTitle.localeCompare(b.mainTitle);
-};
+    // Static
 
-WebInspector.ResourceTreeElement.compareFolderAndResourceTreeElements = function(a, b)
-{
-    var aIsFolder = a instanceof WebInspector.FolderTreeElement;
-    var bIsFolder = b instanceof WebInspector.FolderTreeElement;
-
-    if (aIsFolder && !bIsFolder)
-        return -1;
-    if (!aIsFolder && bIsFolder)
-        return 1;
-    if (aIsFolder && bIsFolder)
+    static compareResourceTreeElements(a, b)
+    {
+        // Compare by type first to keep resources grouped by type when not sorted into folders.
+        var comparisonResult = a.resource.type.localeCompare(b.resource.type);
+        if (comparisonResult !== 0)
+            return comparisonResult;
+
+        // Compare async resource types by their first timestamp so they are in chronological order.
+        if (a.resource.type === WebInspector.Resource.Type.XHR || a.resource.type === WebInspector.Resource.Type.WebSocket)
+            return a.resource.firstTimestamp - b.resource.firstTimestamp || 0;
+
+        // Compare by subtitle when the types are the same. The subtitle is used to show the
+        // domain of the resource. This causes resources to group by domain. If the resource
+        // is on the same domain as the frame it will have an empty subtitle. This is good
+        // because empty string sorts first, so those will appear before external resources.
+        comparisonResult = a.subtitle.localeCompare(b.subtitle);
+        if (comparisonResult !== 0)
+            return comparisonResult;
+
+        // Compare by title when the subtitles are the same.
         return a.mainTitle.localeCompare(b.mainTitle);
+    }
 
-    return WebInspector.ResourceTreeElement.compareResourceTreeElements(a, b);
-};
+    static compareFolderAndResourceTreeElements(a, b)
+    {
+        var aIsFolder = a instanceof WebInspector.FolderTreeElement;
+        var bIsFolder = b instanceof WebInspector.FolderTreeElement;
 
-WebInspector.ResourceTreeElement.prototype = {
-    constructor: WebInspector.ResourceTreeElement,
-    __proto__: WebInspector.SourceCodeTreeElement.prototype,
+        if (aIsFolder && !bIsFolder)
+            return -1;
+        if (!aIsFolder && bIsFolder)
+            return 1;
+        if (aIsFolder && bIsFolder)
+            return a.mainTitle.localeCompare(b.mainTitle);
+
+        return WebInspector.ResourceTreeElement.compareResourceTreeElements(a, b);
+    }
 
     // Public
 
     get resource()
     {
         return this._resource;
-    },
+    }
 
     get filterableData()
     {
         return {text: this._resource.url};
-    },
+    }
 
-    ondblclick: function()
+    ondblclick()
     {
         InspectorFrontendHost.openInNewTab(this._resource.url);
-    },
+    }
 
     // Protected (Used by FrameTreeElement)
 
-    _updateResource: function(resource)
+    _updateResource(resource)
     {
         console.assert(resource instanceof WebInspector.Resource);
 
@@ -125,11 +121,11 @@ WebInspector.ResourceTreeElement.prototype = {
         this._updateTitles();
         this._updateStatus();
         this._updateToolTip();
-    },
+    }
 
     // Protected
 
-    _updateTitles: function()
+    _updateTitles()
     {
         var frame = this._resource.parentFrame;
         var isMainResource = this._resource.isMainResource();
@@ -152,11 +148,11 @@ WebInspector.ResourceTreeElement.prototype = {
 
         if (oldMainTitle !== this.mainTitle)
             this.callFirstAncestorFunction("descendantResourceTreeElementMainTitleDidChange", [this, oldMainTitle]);
-    },
+    }
 
     // Private
 
-    _updateStatus: function()
+    _updateStatus()
     {
         if (this._resource.failed)
             this.addClassName(WebInspector.ResourceTreeElement.FailedStyleClassName);
@@ -174,20 +170,20 @@ WebInspector.ResourceTreeElement.prototype = {
             var spinner = new WebInspector.IndeterminateProgressSpinner;
             this.status = spinner.element;
         }
-    },
+    }
 
-    _updateToolTip: function()
+    _updateToolTip()
     {
         this.tooltip = this._resource.url;
-    },
+    }
 
-    _urlDidChange: function(event)
+    _urlDidChange(event)
     {
         this._updateTitles();
         this._updateToolTip();
-    },
+    }
 
-    _typeDidChange: function(event)
+    _typeDidChange(event)
     {
         this.removeClassName(event.data.oldType);
         this.addClassName(this._resource.type);
@@ -195,3 +191,6 @@ WebInspector.ResourceTreeElement.prototype = {
         this.callFirstAncestorFunction("descendantResourceTreeElementTypeDidChange", [this, event.data.oldType]);
     }
 };
+
+WebInspector.ResourceTreeElement.ResourceIconStyleClassName = "resource-icon";
+WebInspector.ResourceTreeElement.FailedStyleClassName = "failed";
index 920cfa2..b83d260 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.ScriptTreeElement = function(script)
+WebInspector.ScriptTreeElement = class ScriptTreeElement extends WebInspector.SourceCodeTreeElement
 {
-    console.assert(script instanceof WebInspector.Script);
-
-    WebInspector.SourceCodeTreeElement.call(this, script, WebInspector.ScriptTreeElement.StyleClassName, null, null, script, false);
+    constructor(script)
+    {
+        console.assert(script instanceof WebInspector.Script);
 
-    this.mainTitle = script.displayName;
+        super(script, "script", null, null, script, false);
 
-    if (script.url) {
-        // Show the host as the subtitle if it is different from the main title.
-        var subtitle = WebInspector.displayNameForHost(script.urlComponents.host);
-        this.subtitle = this.mainTitle !== subtitle ? subtitle : null;
+        this.mainTitle = script.displayName;
 
-        this.tooltip = script.url;
+        if (script.url) {
+            // Show the host as the subtitle if it is different from the main title.
+            var subtitle = WebInspector.displayNameForHost(script.urlComponents.host);
+            this.subtitle = this.mainTitle !== subtitle ? subtitle : null;
 
-        this.addClassName(WebInspector.ResourceTreeElement.ResourceIconStyleClassName);
-        this.addClassName(WebInspector.Resource.Type.Script);
-    } else
-        this.addClassName(WebInspector.ScriptTreeElement.AnonymousScriptIconStyleClassName);
+            this.tooltip = script.url;
 
-    this._script = script;
-};
+            this.addClassName(WebInspector.ResourceTreeElement.ResourceIconStyleClassName);
+            this.addClassName(WebInspector.Resource.Type.Script);
+        } else
+            this.addClassName(WebInspector.ScriptTreeElement.AnonymousScriptIconStyleClassName);
 
-WebInspector.ScriptTreeElement.AnonymousScriptIconStyleClassName = "anonymous-script-icon";
-WebInspector.ScriptTreeElement.StyleClassName = "script";
-
-WebInspector.ScriptTreeElement.prototype = {
-    constructor: WebInspector.ScriptTreeElement,
+        this._script = script;
+    }
 
     // Public
 
@@ -60,4 +56,4 @@ WebInspector.ScriptTreeElement.prototype = {
     }
 };
 
-WebInspector.ScriptTreeElement.prototype.__proto__ = WebInspector.SourceCodeTreeElement.prototype;
+WebInspector.ScriptTreeElement.AnonymousScriptIconStyleClassName = "anonymous-script-icon";
index 67a38e5..144ef28 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.SearchResultTreeElement = function(representedObject)
+WebInspector.SearchResultTreeElement = class SearchResultTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(representedObject instanceof WebInspector.DOMSearchMatchObject || representedObject instanceof WebInspector.SourceCodeSearchMatchObject);
+    constructor(representedObject)
+    {
+        console.assert(representedObject instanceof WebInspector.DOMSearchMatchObject || representedObject instanceof WebInspector.SourceCodeSearchMatchObject);
 
-    var title = WebInspector.SearchResultTreeElement.truncateAndHighlightTitle(representedObject.title, representedObject.searchTerm, representedObject.sourceCodeTextRange);
+        var title = WebInspector.SearchResultTreeElement.truncateAndHighlightTitle(representedObject.title, representedObject.searchTerm, representedObject.sourceCodeTextRange);
 
-    WebInspector.GeneralTreeElement.call(this, representedObject.className, title, null, representedObject, false);
-    this.small = true;
-};
+        super(representedObject.className, title, null, representedObject, false);
 
-WebInspector.SearchResultTreeElement.CharactersToShowBeforeSearchMatch = 15;
-WebInspector.SearchResultTreeElement.CharactersToShowAfterSearchMatch = 50;
-WebInspector.SearchResultTreeElement.HighlightedStyleClassName = "highlighted";
+        this.small = true;
+    }
 
-WebInspector.SearchResultTreeElement.prototype = {
-    constructor: WebInspector.SearchResultTreeElement,
+    // Static
 
-    // Public
-
-    get filterableData()
+    static truncateAndHighlightTitle(title, searchTerm, sourceCodeTextRange)
     {
-        return {text: this.representedObject.title};
-    }
-};
+        // Use the original location, since those line/column offsets match the line text in title.
+        var textRange = sourceCodeTextRange.textRange;
 
-WebInspector.SearchResultTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
+        var searchTermIndex = textRange.startColumn;
 
-WebInspector.SearchResultTreeElement.truncateAndHighlightTitle = function(title, searchTerm, sourceCodeTextRange)
-{
-    // Use the original location, since those line/column offsets match the line text in title.
-    var textRange = sourceCodeTextRange.textRange;
+        // We should only have one line text ranges, so make sure that is the case.
+        console.assert(textRange.startLine === textRange.endLine);
 
-    var searchTermIndex = textRange.startColumn;
+        // Show some characters before the matching text (if there are enough) for context. TreeOutline takes care of the truncating
+        // at the end of the string.
+        var modifiedTitle = null;
+        if (searchTermIndex > WebInspector.SearchResultTreeElement.CharactersToShowBeforeSearchMatch) {
+            modifiedTitle = "\u2026" + title.substring(searchTermIndex - WebInspector.SearchResultTreeElement.CharactersToShowBeforeSearchMatch);
+            searchTermIndex = WebInspector.SearchResultTreeElement.CharactersToShowBeforeSearchMatch + 1;
+        } else
+            modifiedTitle = title;
 
-    // We should only have one line text ranges, so make sure that is the case.
-    console.assert(textRange.startLine === textRange.endLine);
+        // Truncate the tail of the title so the tooltip isn't so large.
+        modifiedTitle = modifiedTitle.trimEnd(searchTermIndex + searchTerm.length + WebInspector.SearchResultTreeElement.CharactersToShowAfterSearchMatch);
 
-    // Show some characters before the matching text (if there are enough) for context. TreeOutline takes care of the truncating
-    // at the end of the string.
-    var modifiedTitle = null;
-    if (searchTermIndex > WebInspector.SearchResultTreeElement.CharactersToShowBeforeSearchMatch) {
-        modifiedTitle = "\u2026" + title.substring(searchTermIndex - WebInspector.SearchResultTreeElement.CharactersToShowBeforeSearchMatch);
-        searchTermIndex = WebInspector.SearchResultTreeElement.CharactersToShowBeforeSearchMatch + 1;
-    } else
-        modifiedTitle = title;
+        console.assert(modifiedTitle.substring(searchTermIndex, searchTermIndex + searchTerm.length).toLowerCase() === searchTerm.toLowerCase());
 
-    // Truncate the tail of the title so the tooltip isn't so large.
-    modifiedTitle = modifiedTitle.trimEnd(searchTermIndex + searchTerm.length + WebInspector.SearchResultTreeElement.CharactersToShowAfterSearchMatch);
+        var highlightedTitle = document.createDocumentFragment();
 
-    console.assert(modifiedTitle.substring(searchTermIndex, searchTermIndex + searchTerm.length).toLowerCase() === searchTerm.toLowerCase());
+        highlightedTitle.appendChild(document.createTextNode(modifiedTitle.substring(0, searchTermIndex)));
 
-    var highlightedTitle = document.createDocumentFragment();
+        var highlightSpan = document.createElement("span");
+        highlightSpan.className = "highlighted";
+        highlightSpan.appendChild(document.createTextNode(modifiedTitle.substring(searchTermIndex, searchTermIndex + searchTerm.length)));
+        highlightedTitle.appendChild(highlightSpan);
 
-    highlightedTitle.appendChild(document.createTextNode(modifiedTitle.substring(0, searchTermIndex)));
+        highlightedTitle.appendChild(document.createTextNode(modifiedTitle.substring(searchTermIndex + searchTerm.length)));
 
-    var highlightSpan = document.createElement("span");
-    highlightSpan.className = WebInspector.SearchResultTreeElement.HighlightedStyleClassName;
-    highlightSpan.appendChild(document.createTextNode(modifiedTitle.substring(searchTermIndex, searchTermIndex + searchTerm.length)));
-    highlightedTitle.appendChild(highlightSpan);
+        return highlightedTitle;
+    }
 
-    highlightedTitle.appendChild(document.createTextNode(modifiedTitle.substring(searchTermIndex + searchTerm.length)));
+    // Public
 
-    return highlightedTitle;
+    get filterableData()
+    {
+        return {text: this.representedObject.title};
+    }
 };
+
+WebInspector.SearchResultTreeElement.CharactersToShowBeforeSearchMatch = 15;
+WebInspector.SearchResultTreeElement.CharactersToShowAfterSearchMatch = 50;
index 0c63556..1d3580a 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.SourceCodeTimelineTreeElement = function(sourceCodeTimeline, subtitleNameStyle, includeTimerIdentifierInMainTitle)
+WebInspector.SourceCodeTimelineTreeElement = class SourceCodeTimelineTreeElement extends WebInspector.TimelineRecordTreeElement
 {
-    console.assert(sourceCodeTimeline);
-
-    this._sourceCodeTimeline = sourceCodeTimeline;
+    constructor(sourceCodeTimeline, subtitleNameStyle, includeTimerIdentifierInMainTitle)
+    {
+        console.assert(sourceCodeTimeline);
 
-    subtitleNameStyle = subtitleNameStyle || WebInspector.SourceCodeLocation.NameStyle.None;
+        subtitleNameStyle = subtitleNameStyle || WebInspector.SourceCodeLocation.NameStyle.None;
 
-    WebInspector.TimelineRecordTreeElement.call(this, sourceCodeTimeline.records[0], subtitleNameStyle, includeTimerIdentifierInMainTitle, sourceCodeTimeline.sourceCodeLocation, sourceCodeTimeline);
-};
+        super(sourceCodeTimeline.records[0], subtitleNameStyle, includeTimerIdentifierInMainTitle, sourceCodeTimeline.sourceCodeLocation, sourceCodeTimeline);
 
-WebInspector.SourceCodeTimelineTreeElement.prototype = {
-    constructor: WebInspector.SourceCodeTimelineTreeElement,
-    __proto__: WebInspector.TimelineRecordTreeElement.prototype,
+        this._sourceCodeTimeline = sourceCodeTimeline;
+    }
 
     // Public
 
-    record: undefined,
+    get record()
+    {
+        return undefined;
+    }
 
     get sourceCodeTimeline()
     {
index 8703d7b..3573450 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.SourceCodeTreeElement = function(sourceCode, classNames, title, subtitle, representedObject, hasChildren)
+WebInspector.SourceCodeTreeElement = class SourceCodeTreeElement extends WebInspector.FolderizedTreeElement
 {
-    console.assert(sourceCode instanceof WebInspector.SourceCode);
+    constructor(sourceCode, classNames, title, subtitle, representedObject, hasChildren)
+    {
+        console.assert(sourceCode instanceof WebInspector.SourceCode);
 
-    WebInspector.FolderizedTreeElement.call(this, classNames, title, subtitle, representedObject || sourceCode, hasChildren);
+        super(classNames, title, subtitle, representedObject || sourceCode, hasChildren);
 
-    this.small = true;
+        this.small = true;
 
-    this._updateSourceCode(sourceCode);
-};
-
-WebInspector.SourceCodeTreeElement.prototype = {
-    constructor: WebInspector.SourceCodeTreeElement,
-    __proto__: WebInspector.FolderizedTreeElement.prototype,
+        this._updateSourceCode(sourceCode);
+    }
 
     // Public
 
-    updateSourceMapResources: function()
+    updateSourceMapResources()
     {
         if (!this.treeOutline || !this.treeOutline.includeSourceMapResourceChildren)
             return;
@@ -50,18 +48,18 @@ WebInspector.SourceCodeTreeElement.prototype = {
 
         if (!this.hasChildren)
             this.removeChildren();
-    },
+    }
 
     // Overrides from TreeElement
 
-    onattach: function()
+    onattach()
     {
         WebInspector.GeneralTreeElement.prototype.onattach.call(this);
 
         this.updateSourceMapResources();
-    },
+    }
 
-    onpopulate: function()
+    onpopulate()
     {
         if (!this.treeOutline || !this.treeOutline.includeSourceMapResourceChildren)
             return;
@@ -130,11 +128,11 @@ WebInspector.SourceCodeTreeElement.prototype = {
 
         for (var i = 0; i < this.children.length; ++i)
             findAndCombineFolderChains(this.children[i], null);
-    },
+    }
 
     // Protected
 
-    createFoldersAsNeededForSubpath: function(subpath)
+    createFoldersAsNeededForSubpath(subpath)
     {
         if (!subpath)
             return this;
@@ -169,9 +167,9 @@ WebInspector.SourceCodeTreeElement.prototype = {
         }
 
         return currentFolderTreeElement;
-    },
+    }
 
-    descendantResourceTreeElementTypeDidChange: function(childTreeElement, oldType)
+    descendantResourceTreeElementTypeDidChange(childTreeElement, oldType)
     {
         // Called by descendant SourceMapResourceTreeElements.
 
@@ -185,11 +183,11 @@ WebInspector.SourceCodeTreeElement.prototype = {
 
         if (wasSelected)
             childTreeElement.revealAndSelect(true, false, true, true);
-    },
+    }
 
     // Protected (ResourceTreeElement calls this when its Resource changes dynamically for Frames)
 
-    _updateSourceCode: function(sourceCode)
+    _updateSourceCode(sourceCode)
     {
         console.assert(sourceCode instanceof WebInspector.SourceCode);
 
index 5d1b484..08722a2 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.SourceMapResourceTreeElement = function(sourceMapResource, representedObject)
+WebInspector.SourceMapResourceTreeElement = class SourceMapResourceTreeElement extends WebInspector.ResourceTreeElement
 {
-    console.assert(sourceMapResource instanceof WebInspector.SourceMapResource);
-
-    WebInspector.ResourceTreeElement.call(this, sourceMapResource);
-
-    console.assert(this.resource === sourceMapResource);
+    constructor(sourceMapResource, representedObject)
+    {
+        console.assert(sourceMapResource instanceof WebInspector.SourceMapResource);
 
-    this.addClassName(WebInspector.SourceMapResourceTreeElement.StyleClassName);
-};
+        super(sourceMapResource);
 
-WebInspector.SourceMapResourceTreeElement.StyleClassName = "source-map-resource";
+        console.assert(this.resource === sourceMapResource);
 
-WebInspector.SourceMapResourceTreeElement.prototype = {
-    constructor: WebInspector.SourceMapResourceTreeElement,
+        this.addClassName("source-map-resource");
+    }
 
     // Protected
 
-    _updateTitles: function()
+    _updateTitles()
     {
         var oldMainTitle = this.mainTitle;
         this.mainTitle = this.resource.displayName;
@@ -56,5 +53,3 @@ WebInspector.SourceMapResourceTreeElement.prototype = {
             this.callFirstAncestorFunction("descendantResourceTreeElementMainTitleDidChange", [this, oldMainTitle]);
     }
 };
-
-WebInspector.SourceMapResourceTreeElement.prototype.__proto__ = WebInspector.ResourceTreeElement.prototype;
index dc72e8b..6286a7a 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.StorageTreeElement = function(classNames, title, representedObject)
+WebInspector.StorageTreeElement = class StorageTreeElement extends WebInspector.GeneralTreeElement
 {
-    WebInspector.GeneralTreeElement.call(this, classNames, title, null, representedObject, false);
-
-    this.small = true;
-    this.flattened = false;
-};
+    constructor(classNames, title, representedObject)
+    {
+        super(classNames, title, null, representedObject, false);
 
-WebInspector.StorageTreeElement.prototype = {
-    constructor: WebInspector.StorageTreeElement,
+        this.small = true;
+        this.flattened = false;
+    }
 
     // Public
 
     get flattened()
     {
         return this._flattened;
-    },
+    }
 
     set flattened(flattened)
     {
@@ -57,11 +56,11 @@ WebInspector.StorageTreeElement.prototype = {
         this.mainTitle = this.categoryName;
         this.subtitle = this.name;
         this._updateChildrenTitles();
-    },
+    }
 
     // Private
 
-    _updateChildrenTitles: function()
+    _updateChildrenTitles()
     {
         for (var i = 0; i < this.children.length; ++i) {
             if (typeof this.children[i].updateTitles === "function")
@@ -69,5 +68,3 @@ WebInspector.StorageTreeElement.prototype = {
         }
     }
 };
-
-WebInspector.StorageTreeElement.prototype.__proto__ = WebInspector.GeneralTreeElement.prototype;
index 74ca3d5..b559b8f 100644 (file)
@@ -461,7 +461,7 @@ WebInspector.TimelineDataGrid.prototype = {
         if (!this._popoverCallStackTreeOutline) {
             var contentElement = document.createElement("ol");
             contentElement.classList.add("timeline-data-grid-tree-outline");
-            this._popoverCallStackTreeOutline = new TreeOutline(contentElement);
+            this._popoverCallStackTreeOutline = new WebInspector.TreeOutline(contentElement);
             this._popoverCallStackTreeOutline.onselect = this._popoverCallStackTreeElementSelected.bind(this);
         } else
             this._popoverCallStackTreeOutline.removeChildren();
index 07d6fe9..985eafc 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2014 Apple Inc. All rights reserved.
+ * Copyright (C) 2014-2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.TimelineRecordTreeElement = function(timelineRecord, subtitleNameStyle, includeTimerIdentifierInMainTitle, sourceCodeLocation, representedObject)
+WebInspector.TimelineRecordTreeElement = class TimelineRecordTreeElement extends WebInspector.GeneralTreeElement
 {
-    console.assert(timelineRecord);
-
-    this._record = timelineRecord;
-    this._sourceCodeLocation = sourceCodeLocation || timelineRecord.sourceCodeLocation || null;
+    constructor(timelineRecord, subtitleNameStyle, includeTimerIdentifierInMainTitle, sourceCodeLocation, representedObject)
+    {
+        console.assert(timelineRecord);
 
-    var title = "";
-    var subtitle = "";
+        sourceCodeLocation = sourceCodeLocation || timelineRecord.sourceCodeLocation || null;
 
-    if (this._sourceCodeLocation) {
-        subtitle = document.createElement("span");
+        var title = "";
+        var subtitle = "";
 
-        if (subtitleNameStyle !== WebInspector.SourceCodeLocation.NameStyle.None)
-            this._sourceCodeLocation.populateLiveDisplayLocationString(subtitle, "textContent", null, subtitleNameStyle);
-        else
-            this._sourceCodeLocation.populateLiveDisplayLocationString(subtitle, "textContent", null, WebInspector.SourceCodeLocation.NameStyle.None, WebInspector.UIString("line "));
-    }
+        if (sourceCodeLocation) {
+            subtitle = document.createElement("span");
 
-    var iconStyleClass = null;
+            if (subtitleNameStyle !== WebInspector.SourceCodeLocation.NameStyle.None)
+                sourceCodeLocation.populateLiveDisplayLocationString(subtitle, "textContent", null, subtitleNameStyle);
+            else
+                sourceCodeLocation.populateLiveDisplayLocationString(subtitle, "textContent", null, WebInspector.SourceCodeLocation.NameStyle.None, WebInspector.UIString("line "));
+        }
 
-    switch (timelineRecord.type) {
-    case WebInspector.TimelineRecord.Type.Layout:
-        title = WebInspector.LayoutTimelineRecord.displayNameForEventType(timelineRecord.eventType);
+        var iconStyleClass = null;
+
+        switch (timelineRecord.type) {
+        case WebInspector.TimelineRecord.Type.Layout:
+            title = WebInspector.LayoutTimelineRecord.displayNameForEventType(timelineRecord.eventType);
+
+            switch (timelineRecord.eventType) {
+            case WebInspector.LayoutTimelineRecord.EventType.InvalidateStyles:
+            case WebInspector.LayoutTimelineRecord.EventType.RecalculateStyles:
+                iconStyleClass = WebInspector.TimelineRecordTreeElement.StyleRecordIconStyleClass;
+                break;
+            case WebInspector.LayoutTimelineRecord.EventType.InvalidateLayout:
+            case WebInspector.LayoutTimelineRecord.EventType.ForcedLayout:
+            case WebInspector.LayoutTimelineRecord.EventType.Layout:
+                iconStyleClass = WebInspector.TimelineRecordTreeElement.LayoutRecordIconStyleClass;
+                break;
+            case WebInspector.LayoutTimelineRecord.EventType.Paint:
+                iconStyleClass = WebInspector.TimelineRecordTreeElement.PaintRecordIconStyleClass;
+                break;
+            default:
+                console.error("Unknown LayoutTimelineRecord eventType: " + timelineRecord.eventType, timelineRecord);
+            }
 
-        switch (timelineRecord.eventType) {
-        case WebInspector.LayoutTimelineRecord.EventType.InvalidateStyles:
-        case WebInspector.LayoutTimelineRecord.EventType.RecalculateStyles:
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.StyleRecordIconStyleClass;
-            break;
-        case WebInspector.LayoutTimelineRecord.EventType.InvalidateLayout:
-        case WebInspector.LayoutTimelineRecord.EventType.ForcedLayout:
-        case WebInspector.LayoutTimelineRecord.EventType.Layout:
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.LayoutRecordIconStyleClass;
-            break;
-        case WebInspector.LayoutTimelineRecord.EventType.Paint:
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.PaintRecordIconStyleClass;
             break;
-        default:
-            console.error("Unknown LayoutTimelineRecord eventType: " + timelineRecord.eventType, timelineRecord);
-        }
-
-        break;
 
-    case WebInspector.TimelineRecord.Type.Script:
-        title = WebInspector.ScriptTimelineRecord.EventType.displayName(timelineRecord.eventType, timelineRecord.details, includeTimerIdentifierInMainTitle);
+        case WebInspector.TimelineRecord.Type.Script:
+            title = WebInspector.ScriptTimelineRecord.EventType.displayName(timelineRecord.eventType, timelineRecord.details, includeTimerIdentifierInMainTitle);
+
+            switch (timelineRecord.eventType) {
+            case WebInspector.ScriptTimelineRecord.EventType.ScriptEvaluated:
+                iconStyleClass = WebInspector.TimelineRecordTreeElement.EvaluatedRecordIconStyleClass;
+                break;
+            case WebInspector.ScriptTimelineRecord.EventType.EventDispatched:
+                iconStyleClass = WebInspector.TimelineRecordTreeElement.EventRecordIconStyleClass;
+                break;
+            case WebInspector.ScriptTimelineRecord.EventType.ProbeSampleRecorded:
+                iconStyleClass = WebInspector.TimelineRecordTreeElement.ProbeRecordIconStyleClass;
+                break;
+            case WebInspector.ScriptTimelineRecord.EventType.ConsoleProfileRecorded:
+                iconStyleClass = WebInspector.TimelineRecordTreeElement.ConsoleProfileIconStyleClass;
+                break;
+            case WebInspector.ScriptTimelineRecord.EventType.TimerFired:
+            case WebInspector.ScriptTimelineRecord.EventType.TimerInstalled:
+            case WebInspector.ScriptTimelineRecord.EventType.TimerRemoved:
+                iconStyleClass = WebInspector.TimelineRecordTreeElement.TimerRecordIconStyleClass;
+                break;
+            case WebInspector.ScriptTimelineRecord.EventType.AnimationFrameFired:
+            case WebInspector.ScriptTimelineRecord.EventType.AnimationFrameRequested:
+            case WebInspector.ScriptTimelineRecord.EventType.AnimationFrameCanceled:
+                iconStyleClass = WebInspector.TimelineRecordTreeElement.AnimationRecordIconStyleClass;
+                break;
+            default:
+                console.error("Unknown ScriptTimelineRecord eventType: " + timelineRecord.eventType, timelineRecord);
+            }
 
-        switch (timelineRecord.eventType) {
-        case WebInspector.ScriptTimelineRecord.EventType.ScriptEvaluated:
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.EvaluatedRecordIconStyleClass;
-            break;
-        case WebInspector.ScriptTimelineRecord.EventType.EventDispatched:
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.EventRecordIconStyleClass;
-            break;
-        case WebInspector.ScriptTimelineRecord.EventType.ProbeSampleRecorded:
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.ProbeRecordIconStyleClass;
-            break;
-        case WebInspector.ScriptTimelineRecord.EventType.ConsoleProfileRecorded:
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.ConsoleProfileIconStyleClass;
             break;
-        case WebInspector.ScriptTimelineRecord.EventType.TimerFired:
-        case WebInspector.ScriptTimelineRecord.EventType.TimerInstalled:
-        case WebInspector.ScriptTimelineRecord.EventType.TimerRemoved:
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.TimerRecordIconStyleClass;
-            break;
-        case WebInspector.ScriptTimelineRecord.EventType.AnimationFrameFired:
-        case WebInspector.ScriptTimelineRecord.EventType.AnimationFrameRequested:
-        case WebInspector.ScriptTimelineRecord.EventType.AnimationFrameCanceled:
-            iconStyleClass = WebInspector.TimelineRecordTreeElement.AnimationRecordIconStyleClass;
+
+        case WebInspector.TimelineRecord.Type.RunLoop:
+            title = WebInspector.UIString("Runloop Executed");
+            iconStyleClass = WebInspector.TimelineRecordTreeElement.RunLoopRecordIconStyleClass;
             break;
+
         default:
-            console.error("Unknown ScriptTimelineRecord eventType: " + timelineRecord.eventType, timelineRecord);
+            console.error("Unknown TimelineRecord type: " + timelineRecord.type, timelineRecord);
         }
 
-        break;
-
-    case WebInspector.TimelineRecord.Type.RunLoop:
-        title = WebInspector.UIString("Runloop Executed");
-        iconStyleClass = WebInspector.TimelineRecordTreeElement.RunLoopRecordIconStyleClass;
-        break;
-
-    default:
-        console.error("Unknown TimelineRecord type: " + timelineRecord.type, timelineRecord);
-    }
+        super([iconStyleClass], title, subtitle, representedObject || timelineRecord, false);
 
-    WebInspector.GeneralTreeElement.call(this, [iconStyleClass], title, subtitle, representedObject || timelineRecord, false);
+        this._record = timelineRecord;
+        this._sourceCodeLocation = sourceCodeLocation;
 
-    this.small = true;
+        this.small = true;
 
-    if (this._sourceCodeLocation)
-        this.tooltipHandledSeparately = true;
-};
-
-WebInspector.TimelineRecordTreeElement.StyleRecordIconStyleClass = "style-record";
-WebInspector.TimelineRecordTreeElement.LayoutRecordIconStyleClass = "layout-record";
-WebInspector.TimelineRecordTreeElement.PaintRecordIconStyleClass = "paint-record";
-WebInspector.TimelineRecordTreeElement.RunLoopRecordIconStyleClass = "runloop-record";
-WebInspector.TimelineRecordTreeElement.EvaluatedRecordIconStyleClass = "evaluated-record";
-WebInspector.TimelineRecordTreeElement.EventRecordIconStyleClass = "event-record";
-WebInspector.TimelineRecordTreeElement.TimerRecordIconStyleClass = "timer-record";
-WebInspector.TimelineRecordTreeElement.AnimationRecordIconStyleClass = "animation-record";
-WebInspector.TimelineRecordTreeElement.ProbeRecordIconStyleClass = "probe-record";
-WebInspector.TimelineRecordTreeElement.ConsoleProfileIconStyleClass = "console-profile-record";
-
-WebInspector.TimelineRecordTreeElement.prototype = {
-    constructor: WebInspector.TimelineRecordTreeElement,
-    __proto__: WebInspector.GeneralTreeElement.prototype,
+        if (this._sourceCodeLocation)
+            this.tooltipHandledSeparately = true;
+    }
 
     // Public
 
     get record()
     {
         return this._record;
-    },
+    }
 
     get filterableData()
     {
         var url = this._sourceCodeLocation ? this._sourceCodeLocation.sourceCode.url : "";
         return {text: [this.mainTitle, url || "", this._record.details || ""]};
-    },
+    }
 
     // Protected
 
-    onattach: function()
+    onattach()
     {
         WebInspector.GeneralTreeElement.prototype.onattach.call(this);
 
@@ -159,3 +148,14 @@ WebInspector.TimelineRecordTreeElement.prototype = {
         this._sourceCodeLocation.populateLiveDisplayLocationTooltip(this.element, tooltipPrefix);
     }
 };
+
+WebInspector.TimelineRecordTreeElement.StyleRecordIconStyleClass = "style-record";
+WebInspector.TimelineRecordTreeElement.LayoutRecordIconStyleClass = "layout-record";
+WebInspector.TimelineRecordTreeElement.PaintRecordIconStyleClass = "paint-record";
+WebInspector.TimelineRecordTreeElement.RunLoopRecordIconStyleClass = "runloop-record";
+WebInspector.TimelineRecordTreeElement.EvaluatedRecordIconStyleClass = "evaluated-record";
+WebInspector.TimelineRecordTreeElement.EventRecordIconStyleClass = "event-record";
+WebInspector.TimelineRecordTreeElement.TimerRecordIconStyleClass = "timer-record";
+WebInspector.TimelineRecordTreeElement.AnimationRecordIconStyleClass = "animation-record";
+WebInspector.TimelineRecordTreeElement.ProbeRecordIconStyleClass = "probe-record";
+WebInspector.TimelineRecordTreeElement.ConsoleProfileIconStyleClass = "console-profile-record";
index 56c144c..2ee3ac8 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.TreeElementStatusButton = function(element) {
-    // FIXME: Convert this to a WebInspector.Object subclass, and call super().
-    // WebInspector.Object.call(this);
-
-    console.assert(element);
-
-    this._element = element;
-    this._element.classList.add(WebInspector.TreeElementStatusButton.StyleClassName);
-    this._element.addEventListener("click", this._clicked.bind(this));
-};
-
-WebInspector.TreeElementStatusButton.StyleClassName = "status-button";
-WebInspector.TreeElementStatusButton.DisabledStyleClassName = "disabled";
+WebInspector.TreeElementStatusButton = class TreeElementStatusButton extends WebInspector.Object
+{
+    constructor(element)
+    {
+        super();
 
-WebInspector.TreeElementStatusButton.Event = {
-    Clicked: "status-button-clicked"
-};
+        console.assert(element);
 
-WebInspector.TreeElementStatusButton.prototype = {
-    constructor: WebInspector.TreeElementStatusButton,
+        this._element = element;
+        this._element.classList.add("status-button");
+        this._element.addEventListener("click", this._clicked.bind(this));
+    }
 
     // Public
 
     get element()
     {
         return this._element;
-    },
+    }
 
     get hidden()
     {
         return !this._element.classList.contains(WebInspector.TreeElementStatusButton.DisabledStyleClassName);
-    },
+    }
 
     set hidden(flag)
     {
         this._element.classList.toggle("hidden", flag);
-    },
+    }
 
     get enabled()
     {
         return !this._element.classList.contains(WebInspector.TreeElementStatusButton.DisabledStyleClassName);
-    },
+    }
 
     set enabled(flag)
     {
@@ -72,11 +64,11 @@ WebInspector.TreeElementStatusButton.prototype = {
             this._element.classList.remove(WebInspector.TreeElementStatusButton.DisabledStyleClassName);
         else
             this._element.classList.add(WebInspector.TreeElementStatusButton.DisabledStyleClassName);
-    },
+    }
 
     // Private
 
-    _clicked: function(event)
+    _clicked(event)
     {
         if (!this.enabled)
             return;
@@ -87,4 +79,8 @@ WebInspector.TreeElementStatusButton.prototype = {
     }
 };
 
-WebInspector.TreeElementStatusButton.prototype.__proto__ = WebInspector.Object.prototype;
+WebInspector.TreeElementStatusButton.DisabledStyleClassName = "disabled";
+
+WebInspector.TreeElementStatusButton.Event = {
+    Clicked: "status-button-clicked"
+};
index 27cb058..2c0f9de 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2007, 2013 Apple Inc.  All rights reserved.
+ * Copyright (C) 2007, 2013, 2015 Apple Inc.  All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-function TreeOutline(listNode)
+WebInspector.TreeOutline = class TreeOutline extends WebInspector.Object
 {
-    // FIXME: Convert this to a WebInspector.Object subclass, and call super().
-    // WebInspector.Object.call(this);
-
-    this.element = listNode;
-
-    this.children = [];
-    this.selectedTreeElement = null;
-    this._childrenListNode = listNode;
-    this._childrenListNode.removeChildren();
-    this._knownTreeElements = [];
-    this._treeElementsExpandedState = [];
-    this.expandTreeElementsWhenArrowing = false;
-    this.allowsRepeatSelection = false;
-    this.root = true;
-    this.hasChildren = false;
-    this.expanded = true;
-    this.selected = false;
-    this.treeOutline = this;
-
-    this._childrenListNode.tabIndex = 0;
-    this._childrenListNode.addEventListener("keydown", this._treeKeyDown.bind(this), true);
-}
-
-TreeOutline._knownTreeElementNextIdentifier = 1;
-TreeOutline.prototype.constructor = TreeOutline;
-
-TreeOutline.prototype.appendChild = function(child)
-{
-    if (!child)
-        throw "child can't be undefined or null";
-
-    var lastChild = this.children[this.children.length - 1];
-    if (lastChild) {
-        lastChild.nextSibling = child;
-        child.previousSibling = lastChild;
-    } else {
-        child.previousSibling = null;
-        child.nextSibling = null;
-    }
+    constructor(listNode)
+    {
+        super();
 
-    var isFirstChild = !this.children.length;
+        this.element = listNode;
 
-    this.children.push(child);
-    this.hasChildren = true;
-    child.parent = this;
-    child.treeOutline = this.treeOutline;
-    child.treeOutline._rememberTreeElement(child);
+        this.children = [];
+        this.selectedTreeElement = null;
+        this._childrenListNode = listNode;
+        this._childrenListNode.removeChildren();
+        this._knownTreeElements = [];
+        this._treeElementsExpandedState = [];
+        this.expandTreeElementsWhenArrowing = false;
+        this.allowsRepeatSelection = false;
+        this.root = true;
+        this.hasChildren = false;
+        this.expanded = true;
+        this.selected = false;
+        this.treeOutline = this;
 
-    var current = child.children[0];
-    while (current) {
-        current.treeOutline = this.treeOutline;
-        current.treeOutline._rememberTreeElement(current);
-        current = current.traverseNextTreeElement(false, child, true);
+        this._childrenListNode.tabIndex = 0;
+        this._childrenListNode.addEventListener("keydown", this._treeKeyDown.bind(this), true);
     }
 
-    if (child.hasChildren && child.treeOutline._treeElementsExpandedState[child.identifier] !== undefined)
-        child.expanded = child.treeOutline._treeElementsExpandedState[child.identifier];
-
-    if (this._childrenListNode)
-        child._attach();
-
-    if (this.treeOutline.onadd)
-        this.treeOutline.onadd(child);
+    // Methods
 
-    if (isFirstChild && this.expanded)
-        this.expand();
-};
+    appendChild(child)
+    {
+        if (!child)
+            throw "child can't be undefined or null";
 
-TreeOutline.prototype.insertChild = function(child, index)
-{
-    if (!child)
-        throw "child can't be undefined or null";
-
-    var previousChild = (index > 0 ? this.children[index - 1] : null);
-    if (previousChild) {
-        previousChild.nextSibling = child;
-        child.previousSibling = previousChild;
-    } else {
-        child.previousSibling = null;
-    }
+        var lastChild = this.children[this.children.length - 1];
+        if (lastChild) {
+            lastChild.nextSibling = child;
+            child.previousSibling = lastChild;
+        } else {
+            child.previousSibling = null;
+            child.nextSibling = null;
+        }
 
-    var nextChild = this.children[index];
-    if (nextChild) {
-        nextChild.previousSibling = child;
-        child.nextSibling = nextChild;
-    } else {
-        child.nextSibling = null;
-    }
+        var isFirstChild = !this.children.length;
 
-    var isFirstChild = !this.children.length;
+        this.children.push(child);
+        this.hasChildren = true;
+        child.parent = this;
+        child.treeOutline = this.treeOutline;
+        child.treeOutline._rememberTreeElement(child);
 
-    this.children.splice(index, 0, child);
-    this.hasChildren = true;
-    child.parent = this;
-    child.treeOutline = this.treeOutline;
-    child.treeOutline._rememberTreeElement(child);
+        var current = child.children[0];
+        while (current) {
+            current.treeOutline = this.treeOutline;
+            current.treeOutline._rememberTreeElement(current);
+            current = current.traverseNextTreeElement(false, child, true);
+        }
 
-    var current = child.children[0];
-    while (current) {
-        current.treeOutline = this.treeOutline;
-        current.treeOutline._rememberTreeElement(current);
-        current = current.traverseNextTreeElement(false, child, true);
-    }
+        if (child.hasChildren && child.treeOutline._treeElementsExpandedState[child.identifier] !== undefined)
+            child.expanded = child.treeOutline._treeElementsExpandedState[child.identifier];
 
-    if (child.hasChildren && child.treeOutline._treeElementsExpandedState[child.identifier] !== undefined)
-        child.expanded = child.treeOutline._treeElementsExpandedState[child.identifier];
+        if (this._childrenListNode)
+            child._attach();
 
-    if (this._childrenListNode)
-        child._attach();
+        if (this.treeOutline.onadd)
+            this.treeOutline.onadd(child);
 
-    if (this.treeOutline.onadd)
-        this.treeOutline.onadd(child);
+        if (isFirstChild && this.expanded)
+            this.expand();
+    }
 
-    if (isFirstChild && this.expanded)
-        this.expand();
-};
+    insertChild(child, index)
+    {
+        if (!child)
+            throw "child can't be undefined or null";
 
-TreeOutline.prototype.removeChildAtIndex = function(childIndex, suppressOnDeselect, suppressSelectSibling)
-{
-    if (childIndex < 0 || childIndex >= this.children.length)
-        throw "childIndex out of range";
-
-    var child = this.children[childIndex];
-    this.children.splice(childIndex, 1);
-
-    var parent = child.parent;
-    if (child.deselect(suppressOnDeselect)) {
-        if (child.previousSibling && !suppressSelectSibling)
-            child.previousSibling.select(true, false);
-        else if (child.nextSibling && !suppressSelectSibling)
-            child.nextSibling.select(true, false);
-        else if (!suppressSelectSibling)
-            parent.select(true, false);
-    }
+        var previousChild = (index > 0 ? this.children[index - 1] : null);
+        if (previousChild) {
+            previousChild.nextSibling = child;
+            child.previousSibling = previousChild;
+        } else {
+            child.previousSibling = null;
+        }
 
-    if (child.previousSibling)
-        child.previousSibling.nextSibling = child.nextSibling;
-    if (child.nextSibling)
-        child.nextSibling.previousSibling = child.previousSibling;
+        var nextChild = this.children[index];
+        if (nextChild) {
+            nextChild.previousSibling = child;
+            child.nextSibling = nextChild;
+        } else {
+            child.nextSibling = null;
+        }
 
-    if (child.treeOutline) {
-        child.treeOutline._forgetTreeElement(child);
-        child.treeOutline._forgetChildrenRecursive(child);
-    }
+        var isFirstChild = !this.children.length;
 
-    child._detach();
-    child.treeOutline = null;
-    child.parent = null;
-    child.nextSibling = null;
-    child.previousSibling = null;
+        this.children.splice(index, 0, child);
+        this.hasChildren = true;
+        child.parent = this;
+        child.treeOutline = this.treeOutline;
+        child.treeOutline._rememberTreeElement(child);
 
-    if (this.treeOutline && this.treeOutline.onremove)
-        this.treeOutline.onremove(child);
-};
+        var current = child.children[0];
+        while (current) {
+            current.treeOutline = this.treeOutline;
+            current.treeOutline._rememberTreeElement(current);
+            current = current.traverseNextTreeElement(false, child, true);
+        }
 
-TreeOutline.prototype.removeChild = function(child, suppressOnDeselect, suppressSelectSibling)
-{
-    if (!child)
-        throw "child can't be undefined or null";
+        if (child.hasChildren && child.treeOutline._treeElementsExpandedState[child.identifier] !== undefined)
+            child.expanded = child.treeOutline._treeElementsExpandedState[child.identifier];
 
-    var childIndex = this.children.indexOf(child);
-    if (childIndex === -1)
-        throw "child not found in this node's children";
+        if (this._childrenListNode)
+            child._attach();
 
-    this.removeChildAtIndex(childIndex, suppressOnDeselect, suppressSelectSibling);
+        if (this.treeOutline.onadd)
+            this.treeOutline.onadd(child);
 
-    if (!this.children.length) {
-        this._listItemNode.classList.remove("parent");
-        this.hasChildren = false;
+        if (isFirstChild && this.expanded)
+            this.expand();
     }
-};
 
-TreeOutline.prototype.removeChildren = function(suppressOnDeselect)
-{
-    var treeOutline = this.treeOutline;
+    removeChildAtIndex(childIndex, suppressOnDeselect, suppressSelectSibling)
+    {
+        if (childIndex < 0 || childIndex >= this.children.length)
+            throw "childIndex out of range";
+
+        var child = this.children[childIndex];
+        this.children.splice(childIndex, 1);
+
+        var parent = child.parent;
+        if (child.deselect(suppressOnDeselect)) {
+            if (child.previousSibling && !suppressSelectSibling)
+                child.previousSibling.select(true, false);
+            else if (child.nextSibling && !suppressSelectSibling)
+                child.nextSibling.select(true, false);
+            else if (!suppressSelectSibling)
+                parent.select(true, false);
+        }
 
-    for (var i = 0; i < this.children.length; ++i) {
-        var child = this.children[i];
-        child.deselect(suppressOnDeselect);
+        if (child.previousSibling)
+            child.previousSibling.nextSibling = child.nextSibling;
+        if (child.nextSibling)
+            child.nextSibling.previousSibling = child.previousSibling;
 
         if (child.treeOutline) {
             child.treeOutline._forgetTreeElement(child);
@@ -219,376 +179,439 @@ TreeOutline.prototype.removeChildren = function(suppressOnDeselect)
         child.nextSibling = null;
         child.previousSibling = null;
 
-        if (treeOutline && treeOutline.onremove)
-            treeOutline.onremove(child);
+        if (this.treeOutline && this.treeOutline.onremove)
+            this.treeOutline.onremove(child);
     }
 
-    this.children = [];
-};
+    removeChild(child, suppressOnDeselect, suppressSelectSibling)
+    {
+        if (!child)
+            throw "child can't be undefined or null";
 
-TreeOutline.prototype.removeChildrenRecursive = function(suppressOnDeselect)
-{
-    var childrenToRemove = this.children;
+        var childIndex = this.children.indexOf(child);
+        if (childIndex === -1)
+            throw "child not found in this node's children";
 
-    var treeOutline = this.treeOutline;
+        this.removeChildAtIndex(childIndex, suppressOnDeselect, suppressSelectSibling);
 
-    var child = this.children[0];
-    while (child) {
-        if (child.children.length)
-            childrenToRemove = childrenToRemove.concat(child.children);
-        child = child.traverseNextTreeElement(false, this, true);
+        if (!this.children.length) {
+            this._listItemNode.classList.remove("parent");
+            this.hasChildren = false;
+        }
     }
 
-    for (var i = 0; i < childrenToRemove.length; ++i) {
-        child = childrenToRemove[i];
-        child.deselect(suppressOnDeselect);
+    removeChildren(suppressOnDeselect)
+    {
+        var treeOutline = this.treeOutline;
 
-        if (child.treeOutline)
-            child.treeOutline._forgetTreeElement(child);
+        for (var i = 0; i < this.children.length; ++i) {
+            var child = this.children[i];
+            child.deselect(suppressOnDeselect);
 
-        child._detach();
-        child.children = [];
-        child.treeOutline = null;
-        child.parent = null;
-        child.nextSibling = null;
-        child.previousSibling = null;
+            if (child.treeOutline) {
+                child.treeOutline._forgetTreeElement(child);
+                child.treeOutline._forgetChildrenRecursive(child);
+            }
+
+            child._detach();
+            child.treeOutline = null;
+            child.parent = null;
+            child.nextSibling = null;
+            child.previousSibling = null;
+
+            if (treeOutline && treeOutline.onremove)
+                treeOutline.onremove(child);
+        }
 
-        if (treeOutline && treeOutline.onremove)
-            treeOutline.onremove(child);
+        this.children = [];
     }
 
-    this.children = [];
-};
+    removeChildrenRecursive(suppressOnDeselect)
+    {
+        var childrenToRemove = this.children;
 
-TreeOutline.prototype._rememberTreeElement = function(element)
-{
-    if (!this._knownTreeElements[element.identifier])
-        this._knownTreeElements[element.identifier] = [];
+        var treeOutline = this.treeOutline;
 
-    // check if the element is already known
-    var elements = this._knownTreeElements[element.identifier];
-    if (elements.indexOf(element) !== -1)
-        return;
+        var child = this.children[0];
+        while (child) {
+            if (child.children.length)
+                childrenToRemove = childrenToRemove.concat(child.children);
+            child = child.traverseNextTreeElement(false, this, true);
+        }
 
-    // add the element
-    elements.push(element);
-};
+        for (var i = 0; i < childrenToRemove.length; ++i) {
+            child = childrenToRemove[i];
+            child.deselect(suppressOnDeselect);
 
-TreeOutline.prototype._forgetTreeElement = function(element)
-{
-    if (this.selectedTreeElement === element)
-        this.selectedTreeElement = null;
-    if (this._knownTreeElements[element.identifier])
-        this._knownTreeElements[element.identifier].remove(element, true);
-};
+            if (child.treeOutline)
+                child.treeOutline._forgetTreeElement(child);
 
-TreeOutline.prototype._forgetChildrenRecursive = function(parentElement)
-{
-    var child = parentElement.children[0];
-    while (child) {
-        this._forgetTreeElement(child);
-        child = child.traverseNextTreeElement(false, parentElement, true);
+            child._detach();
+            child.children = [];
+            child.treeOutline = null;
+            child.parent = null;
+            child.nextSibling = null;
+            child.previousSibling = null;
+
+            if (treeOutline && treeOutline.onremove)
+                treeOutline.onremove(child);
+        }
+
+        this.children = [];
     }
-};
 
-TreeOutline.prototype.getCachedTreeElement = function(representedObject)
-{
-    if (!representedObject)
-        return null;
+    _rememberTreeElement(element)
+    {
+        if (!this._knownTreeElements[element.identifier])
+            this._knownTreeElements[element.identifier] = [];
 
-    if (representedObject.__treeElementIdentifier) {
-        // If this representedObject has a tree element identifier, and it is a known TreeElement
-        // in our tree we can just return that tree element.
-        var elements = this._knownTreeElements[representedObject.__treeElementIdentifier];
-        if (elements) {
-            for (var i = 0; i < elements.length; ++i)
-                if (elements[i].representedObject === representedObject)
-                    return elements[i];
-        }
+        // check if the element is already known
+        var elements = this._knownTreeElements[element.identifier];
+        if (elements.indexOf(element) !== -1)
+            return;
+
+        // add the element
+        elements.push(element);
     }
-    return null;
-};
 
-TreeOutline.prototype.findTreeElement = function(representedObject, isAncestor, getParent)
-{
-    if (!representedObject)
-        return null;
+    _forgetTreeElement(element)
+    {
+        if (this.selectedTreeElement === element)
+            this.selectedTreeElement = null;
+        if (this._knownTreeElements[element.identifier])
+            this._knownTreeElements[element.identifier].remove(element, true);
+    }
 
-    var cachedElement = this.getCachedTreeElement(representedObject);
-    if (cachedElement)
-        return cachedElement;
-
-    // The representedObject isn't known, so we start at the top of the tree and work down to find the first
-    // tree element that represents representedObject or one of its ancestors.
-    var item;
-    var found = false;
-    for (var i = 0; i < this.children.length; ++i) {
-        item = this.children[i];
-        if (item.representedObject === representedObject || (isAncestor && isAncestor(item.representedObject, representedObject))) {
-            found = true;
-            break;
+    _forgetChildrenRecursive(parentElement)
+    {
+        var child = parentElement.children[0];
+        while (child) {
+            this._forgetTreeElement(child);
+            child = child.traverseNextTreeElement(false, parentElement, true);
         }
     }
 
-    if (!found)
+    getCachedTreeElement(representedObject)
+    {
+        if (!representedObject)
+            return null;
+
+        if (representedObject.__treeElementIdentifier) {
+            // If this representedObject has a tree element identifier, and it is a known TreeElement
+            // in our tree we can just return that tree element.
+            var elements = this._knownTreeElements[representedObject.__treeElementIdentifier];
+            if (elements) {
+                for (var i = 0; i < elements.length; ++i)
+                    if (elements[i].representedObject === representedObject)
+                        return elements[i];
+            }
+        }
         return null;
-
-    // Make sure the item that we found is connected to the root of the tree.
-    // Build up a list of representedObject's ancestors that aren't already in our tree.
-    var ancestors = [];
-    var currentObject = representedObject;
-    while (currentObject) {
-        ancestors.unshift(currentObject);
-        if (currentObject === item.representedObject)
-            break;
-        currentObject = getParent(currentObject);
     }
 
-    // For each of those ancestors we populate them to fill in the tree.
-    for (var i = 0; i < ancestors.length; ++i) {
-        // Make sure we don't call findTreeElement with the same representedObject
-        // again, to prevent infinite recursion.
-        if (ancestors[i] === representedObject)
-            continue;
-
-        // FIXME: we could do something faster than findTreeElement since we will know the next
-        // ancestor exists in the tree.
-        item = this.findTreeElement(ancestors[i], isAncestor, getParent);
-        if (item)
-            item.onpopulate();
-    }
+    findTreeElement(representedObject, isAncestor, getParent)
+    {
+        if (!representedObject)
+            return null;
+
+        var cachedElement = this.getCachedTreeElement(representedObject);
+        if (cachedElement)
+            return cachedElement;
+
+        // The representedObject isn't known, so we start at the top of the tree and work down to find the first
+        // tree element that represents representedObject or one of its ancestors.
+        var item;
+        var found = false;
+        for (var i = 0; i < this.children.length; ++i) {
+            item = this.children[i];
+            if (item.representedObject === representedObject || (isAncestor && isAncestor(item.representedObject, representedObject))) {
+                found = true;
+                break;
+            }
+        }
 
-    return this.getCachedTreeElement(representedObject);
-};
+        if (!found)
+            return null;
+
+        // Make sure the item that we found is connected to the root of the tree.
+        // Build up a list of representedObject's ancestors that aren't already in our tree.
+        var ancestors = [];
+        var currentObject = representedObject;
+        while (currentObject) {
+            ancestors.unshift(currentObject);
+            if (currentObject === item.representedObject)
+                break;
+            currentObject = getParent(currentObject);
+        }
 
-TreeOutline.prototype._treeElementDidChange = function(treeElement)
-{
-    if (treeElement.treeOutline !== this)
-        return;
+        // For each of those ancestors we populate them to fill in the tree.
+        for (var i = 0; i < ancestors.length; ++i) {
+            // Make sure we don't call findTreeElement with the same representedObject
+            // again, to prevent infinite recursion.
+            if (ancestors[i] === representedObject)
+                continue;
+
+            // FIXME: we could do something faster than findTreeElement since we will know the next
+            // ancestor exists in the tree.
+            item = this.findTreeElement(ancestors[i], isAncestor, getParent);
+            if (item)
+                item.onpopulate();
+        }
 
-    if (this.onchange)
-        this.onchange(treeElement);
-};
+        return this.getCachedTreeElement(representedObject);
+    }
 
-TreeOutline.prototype.treeElementFromNode = function(node)
-{
-    var listNode = node.enclosingNodeOrSelfWithNodeNameInArray(["ol", "li"]);
-    if (listNode)
-        return listNode.parentTreeElement || listNode.treeElement;
-    return null;
-};
+    _treeElementDidChange(treeElement)
+    {
+        if (treeElement.treeOutline !== this)
+            return;
 
-TreeOutline.prototype.treeElementFromPoint = function(x, y)
-{
-    var node = this._childrenListNode.ownerDocument.elementFromPoint(x, y);
-    if (!node)
+        if (this.onchange)
+            this.onchange(treeElement);
+    }
+
+    treeElementFromNode(node)
+    {
+        var listNode = node.enclosingNodeOrSelfWithNodeNameInArray(["ol", "li"]);
+        if (listNode)
+            return listNode.parentTreeElement || listNode.treeElement;
         return null;
+    }
 
-    return this.treeElementFromNode(node);
-};
+    treeElementFromPoint(x, y)
+    {
+        var node = this._childrenListNode.ownerDocument.elementFromPoint(x, y);
+        if (!node)
+            return null;
 
-TreeOutline.prototype._treeKeyDown = function(event)
-{
-    if (event.target !== this._childrenListNode)
-        return;
-
-    if (!this.selectedTreeElement || event.shiftKey || event.metaKey || event.ctrlKey)
-        return;
-
-    var handled = false;
-    var nextSelectedElement;
-    if (event.keyIdentifier === "Up" && !event.altKey) {
-        nextSelectedElement = this.selectedTreeElement.traversePreviousTreeElement(true);
-        while (nextSelectedElement && !nextSelectedElement.selectable)
-            nextSelectedElement = nextSelectedElement.traversePreviousTreeElement(!this.expandTreeElementsWhenArrowing);
-        handled = nextSelectedElement ? true : false;
-    } else if (event.keyIdentifier === "Down" && !event.altKey) {
-        nextSelectedElement = this.selectedTreeElement.traverseNextTreeElement(true);
-        while (nextSelectedElement && !nextSelectedElement.selectable)
-            nextSelectedElement = nextSelectedElement.traverseNextTreeElement(!this.expandTreeElementsWhenArrowing);
-        handled = nextSelectedElement ? true : false;
-    } else if (event.keyIdentifier === "Left") {
-        if (this.selectedTreeElement.expanded) {
-            if (event.altKey)
-                this.selectedTreeElement.collapseRecursively();
-            else
-                this.selectedTreeElement.collapse();
-            handled = true;
-        } else if (this.selectedTreeElement.parent && !this.selectedTreeElement.parent.root) {
-            handled = true;
-            if (this.selectedTreeElement.parent.selectable) {
-                nextSelectedElement = this.selectedTreeElement.parent;
-                while (nextSelectedElement && !nextSelectedElement.selectable)
-                    nextSelectedElement = nextSelectedElement.parent;
-                handled = nextSelectedElement ? true : false;
-            } else if (this.selectedTreeElement.parent)
-                this.selectedTreeElement.parent.collapse();
-        }
-    } else if (event.keyIdentifier === "Right") {
-        if (!this.selectedTreeElement.revealed()) {
-            this.selectedTreeElement.reveal();
-            handled = true;
-        } else if (this.selectedTreeElement.hasChildren) {
-            handled = true;
+        return this.treeElementFromNode(node);
+    }
+
+    _treeKeyDown(event)
+    {
+        if (event.target !== this._childrenListNode)
+            return;
+
+        if (!this.selectedTreeElement || event.shiftKey || event.metaKey || event.ctrlKey)
+            return;
+
+        var handled = false;
+        var nextSelectedElement;
+        if (event.keyIdentifier === "Up" && !event.altKey) {
+            nextSelectedElement = this.selectedTreeElement.traversePreviousTreeElement(true);
+            while (nextSelectedElement && !nextSelectedElement.selectable)
+                nextSelectedElement = nextSelectedElement.traversePreviousTreeElement(!this.expandTreeElementsWhenArrowing);
+            handled = nextSelectedElement ? true : false;
+        } else if (event.keyIdentifier === "Down" && !event.altKey) {
+            nextSelectedElement = this.selectedTreeElement.traverseNextTreeElement(true);
+            while (nextSelectedElement && !nextSelectedElement.selectable)
+                nextSelectedElement = nextSelectedElement.traverseNextTreeElement(!this.expandTreeElementsWhenArrowing);
+            handled = nextSelectedElement ? true : false;
+        } else if (event.keyIdentifier === "Left") {
             if (this.selectedTreeElement.expanded) {
-                nextSelectedElement = this.selectedTreeElement.children[0];
-                while (nextSelectedElement && !nextSelectedElement.selectable)
-                    nextSelectedElement = nextSelectedElement.nextSibling;
-                handled = nextSelectedElement ? true : false;
-            } else {
                 if (event.altKey)
-                    this.selectedTreeElement.expandRecursively();
+                    this.selectedTreeElement.collapseRecursively();
                 else
-                    this.selectedTreeElement.expand();
+                    this.selectedTreeElement.collapse();
+                handled = true;
+            } else if (this.selectedTreeElement.parent && !this.selectedTreeElement.parent.root) {
+                handled = true;
+                if (this.selectedTreeElement.parent.selectable) {
+                    nextSelectedElement = this.selectedTreeElement.parent;
+                    while (nextSelectedElement && !nextSelectedElement.selectable)
+                        nextSelectedElement = nextSelectedElement.parent;
+                    handled = nextSelectedElement ? true : false;
+                } else if (this.selectedTreeElement.parent)
+                    this.selectedTreeElement.parent.collapse();
+            }
+        } else if (event.keyIdentifier === "Right") {
+            if (!this.selectedTreeElement.revealed()) {
+                this.selectedTreeElement.reveal();
+                handled = true;
+            } else if (this.selectedTreeElement.hasChildren) {
+                handled = true;
+                if (this.selectedTreeElement.expanded) {
+                    nextSelectedElement = this.selectedTreeElement.children[0];
+                    while (nextSelectedElement && !nextSelectedElement.selectable)
+                        nextSelectedElement = nextSelectedElement.nextSibling;
+                    handled = nextSelectedElement ? true : false;
+                } else {
+                    if (event.altKey)
+                        this.selectedTreeElement.expandRecursively();
+                    else
+                        this.selectedTreeElement.expand();
+                }
             }
+        } else if (event.keyCode === 8 /* Backspace */ || event.keyCode === 46 /* Delete */) {
+            if (this.selectedTreeElement.ondelete)
+                handled = this.selectedTreeElement.ondelete();
+            if (!handled && this.treeOutline.ondelete)
+                handled = this.treeOutline.ondelete(this.selectedTreeElement);
+        } else if (isEnterKey(event)) {
+            if (this.selectedTreeElement.onenter)
+                handled = this.selectedTreeElement.onenter();
+            if (!handled && this.treeOutline.onenter)
+                handled = this.treeOutline.onenter(this.selectedTreeElement);
+        } else if (event.keyIdentifier === "U+0020" /* Space */) {
+            if (this.selectedTreeElement.onspace)
+                handled = this.selectedTreeElement.onspace();
+            if (!handled && this.treeOutline.onspace)
+                handled = this.treeOutline.onspace(this.selectedTreeElement);
+        }
+
+        if (nextSelectedElement) {
+            nextSelectedElement.reveal();
+            nextSelectedElement.select(false, true);
+        }
+
+        if (handled) {
+            event.preventDefault();
+            event.stopPropagation();
         }
-    } else if (event.keyCode === 8 /* Backspace */ || event.keyCode === 46 /* Delete */) {
-        if (this.selectedTreeElement.ondelete)
-            handled = this.selectedTreeElement.ondelete();
-        if (!handled && this.treeOutline.ondelete)
-            handled = this.treeOutline.ondelete(this.selectedTreeElement);
-    } else if (isEnterKey(event)) {
-        if (this.selectedTreeElement.onenter)
-            handled = this.selectedTreeElement.onenter();
-        if (!handled && this.treeOutline.onenter)
-            handled = this.treeOutline.onenter(this.selectedTreeElement);
-    } else if (event.keyIdentifier === "U+0020" /* Space */) {
-        if (this.selectedTreeElement.onspace)
-            handled = this.selectedTreeElement.onspace();
-        if (!handled && this.treeOutline.onspace)
-            handled = this.treeOutline.onspace(this.selectedTreeElement);
     }
 
-    if (nextSelectedElement) {
-        nextSelectedElement.reveal();
-        nextSelectedElement.select(false, true);
+    expand()
+    {
+        // this is the root, do nothing
     }
 
-    if (handled) {
-        event.preventDefault();
-        event.stopPropagation();
+    collapse()
+    {
+        // this is the root, do nothing
     }
-};
 
-TreeOutline.prototype.expand = function()
-{
-    // this is the root, do nothing
-};
+    revealed()
+    {
+        return true;
+    }
 
-TreeOutline.prototype.collapse = function()
-{
-    // this is the root, do nothing
-};
+    reveal()
+    {
+        // this is the root, do nothing
+    }
 
-TreeOutline.prototype.revealed = function()
-{
-    return true;
-};
+    select()
+    {
+        // this is the root, do nothing
+    }
 
-TreeOutline.prototype.reveal = function()
-{
-    // this is the root, do nothing
+    revealAndSelect(omitFocus)
+    {
+        // this is the root, do nothing
+    }
 };
 
-TreeOutline.prototype.select = function()
-{
-    // this is the root, do nothing
-};
+WebInspector.TreeOutline._knownTreeElementNextIdentifier = 1;
 
-TreeOutline.prototype.revealAndSelect = function(omitFocus)
+WebInspector.TreeElement = class TreeElement extends WebInspector.Object
 {
-    // this is the root, do nothing
-};
+    constructor(title, representedObject, hasChildren)
+    {
+        super();
 
-TreeOutline.prototype.__proto__ = WebInspector.Object.prototype;
+        this._title = title;
+        this.representedObject = (representedObject || {});
 
-function TreeElement(title, representedObject, hasChildren)
-{
-    // FIXME: Convert this to a WebInspector.Object subclass, and call super().
-    // WebInspector.Object.call(this);
+        if (this.representedObject.__treeElementIdentifier)
+            this.identifier = this.representedObject.__treeElementIdentifier;
+        else {
+            this.identifier = WebInspector.TreeOutline._knownTreeElementNextIdentifier++;
+            this.representedObject.__treeElementIdentifier = this.identifier;
+        }
 
-    this._title = title;
-    this.representedObject = (representedObject || {});
+        this._hidden = false;
+        this._selectable = true;
+        this.expanded = false;
+        this.selected = false;
+        this.hasChildren = hasChildren;
+        this.children = [];
+        this.treeOutline = null;
+        this.parent = null;
+        this.previousSibling = null;
+        this.nextSibling = null;
+        this._listItemNode = null;
+    }
+
+    // Methods
+
+    appendChild() { return WebInspector.TreeOutline.prototype.appendChild.apply(this, arguments); }
+    insertChild() { return WebInspector.TreeOutline.prototype.insertChild.apply(this, arguments); }
+    removeChild() { return WebInspector.TreeOutline.prototype.removeChild.apply(this, arguments); }
+    removeChildAtIndex() { return WebInspector.TreeOutline.prototype.removeChildAtIndex.apply(this, arguments); }
+    removeChildren() { return WebInspector.TreeOutline.prototype.removeChildren.apply(this, arguments); }
+    removeChildrenRecursive() { return WebInspector.TreeOutline.prototype.removeChildrenRecursive.apply(this, arguments); }
 
-    if (this.representedObject.__treeElementIdentifier)
-        this.identifier = this.representedObject.__treeElementIdentifier;
-    else {
-        this.identifier = TreeOutline._knownTreeElementNextIdentifier++;
-        this.representedObject.__treeElementIdentifier = this.identifier;
+    get arrowToggleWidth()
+    {
+        return 10;
     }
 
-    this._hidden = false;
-    this._selectable = true;
-    this.expanded = false;
-    this.selected = false;
-    this.hasChildren = hasChildren;
-    this.children = [];
-    this.treeOutline = null;
-    this.parent = null;
-    this.previousSibling = null;
-    this.nextSibling = null;
-    this._listItemNode = null;
-}
-
-TreeElement.prototype = {
-    constructor: TreeElement,
-
-    arrowToggleWidth: 10,
-
-    get selectable() {
+    get selectable()
+    {
         if (this._hidden)
             return false;
         return this._selectable;
-    },
+    }
 
-    set selectable(x) {
+    set selectable(x)
+    {
         this._selectable = x;
-    },
+    }
 
-    get listItemElement() {
+    get listItemElement()
+    {
         return this._listItemNode;
-    },
+    }
 
-    get childrenListElement() {
+    get childrenListElement()
+    {
         return this._childrenListNode;
-    },
+    }
 
-    get title() {
+    get title()
+    {
         return this._title;
-    },
+    }
 
-    set title(x) {
+    set title(x)
+    {
         this._title = x;
         this._setListItemNodeContent();
         this.didChange();
-    },
+    }
 
-    get titleHTML() {
+    get titleHTML()
+    {
         return this._titleHTML;
-    },
+    }
 
-    set titleHTML(x) {
+    set titleHTML(x)
+    {
         this._titleHTML = x;
         this._setListItemNodeContent();
         this.didChange();
-    },
+    }
 
-    get tooltip() {
+    get tooltip()
+    {
         return this._tooltip;
-    },
+    }
 
-    set tooltip(x) {
+    set tooltip(x)
+    {
         this._tooltip = x;
         if (this._listItemNode)
             this._listItemNode.title = x ? x : "";
         this.didChange();
-    },
+    }
 
-    get hasChildren() {
+    get hasChildren()
+    {
         return this._hasChildren;
-    },
+    }
 
-    set hasChildren(x) {
+    set hasChildren(x)
+    {
         if (this._hasChildren === x)
             return;
 
@@ -605,13 +628,15 @@ TreeElement.prototype = {
         }
 
         this.didChange();
-    },
+    }
 
-    get hidden() {
+    get hidden()
+    {
         return this._hidden;
-    },
+    }
 
-    set hidden(x) {
+    set hidden(x)
+    {
         if (this._hidden === x)
             return;
 
@@ -631,27 +656,29 @@ TreeElement.prototype = {
 
         if (this.treeOutline && this.treeOutline.onhidden)
             this.treeOutline.onhidden(this, x);
-    },
+    }
 
-    get shouldRefreshChildren() {
+    get shouldRefreshChildren()
+    {
         return this._shouldRefreshChildren;
-    },
+    }
 
-    set shouldRefreshChildren(x) {
+    set shouldRefreshChildren(x)
+    {
         this._shouldRefreshChildren = x;
         if (x && this.expanded)
             this.expand();
-    },
+    }
 
-    _fireDidChange: function()
+    _fireDidChange()
     {
         delete this._didChangeTimeoutIdentifier;
 
         if (this.treeOutline)
             this.treeOutline._treeElementDidChange(this);
-    },
+    }
 
-    didChange: function()
+    didChange()
     {
         if (!this.treeOutline)
             return;
@@ -659,9 +686,9 @@ TreeElement.prototype = {
         // Prevent telling the TreeOutline multiple times in a row by delaying it with a timeout.
         if (!this._didChangeTimeoutIdentifier)
             this._didChangeTimeoutIdentifier = setTimeout(this._fireDidChange.bind(this), 0);
-    },
+    }
 
-    _setListItemNodeContent: function()
+    _setListItemNodeContent()
     {
         if (!this._listItemNode)
             return;
@@ -679,401 +706,393 @@ TreeElement.prototype = {
             this._listItemNode.appendChild(this._title);
         }
     }
-};
 
-TreeElement.prototype.appendChild = TreeOutline.prototype.appendChild;
-TreeElement.prototype.insertChild = TreeOutline.prototype.insertChild;
-TreeElement.prototype.removeChild = TreeOutline.prototype.removeChild;
-TreeElement.prototype.removeChildAtIndex = TreeOutline.prototype.removeChildAtIndex;
-TreeElement.prototype.removeChildren = TreeOutline.prototype.removeChildren;
-TreeElement.prototype.removeChildrenRecursive = TreeOutline.prototype.removeChildrenRecursive;
+    _attach()
+    {
+        if (!this._listItemNode || this.parent._shouldRefreshChildren) {
+            if (this._listItemNode && this._listItemNode.parentNode)
+                this._listItemNode.parentNode.removeChild(this._listItemNode);
 
-TreeElement.prototype._attach = function()
-{
-    if (!this._listItemNode || this.parent._shouldRefreshChildren) {
-        if (this._listItemNode && this._listItemNode.parentNode)
-            this._listItemNode.parentNode.removeChild(this._listItemNode);
+            this._listItemNode = this.treeOutline._childrenListNode.ownerDocument.createElement("li");
+            this._listItemNode.treeElement = this;
+            this._setListItemNodeContent();
+            this._listItemNode.title = this._tooltip ? this._tooltip : "";
 
-        this._listItemNode = this.treeOutline._childrenListNode.ownerDocument.createElement("li");
-        this._listItemNode.treeElement = this;
-        this._setListItemNodeContent();
-        this._listItemNode.title = this._tooltip ? this._tooltip : "";
+            if (this.hidden)
+                this._listItemNode.classList.add("hidden");
+            if (this.hasChildren)
+                this._listItemNode.classList.add("parent");
+            if (this.expanded)
+                this._listItemNode.classList.add("expanded");
+            if (this.selected)
+                this._listItemNode.classList.add("selected");
+
+            this._listItemNode.addEventListener("mousedown", WebInspector.TreeElement.treeElementMouseDown);
+            this._listItemNode.addEventListener("click", WebInspector.TreeElement.treeElementToggled);
+            this._listItemNode.addEventListener("dblclick", WebInspector.TreeElement.treeElementDoubleClicked);
+
+            if (this.onattach)
+                this.onattach(this);
+        }
 
-        if (this.hidden)
-            this._listItemNode.classList.add("hidden");
-        if (this.hasChildren)
-            this._listItemNode.classList.add("parent");
-        if (this.expanded)
-            this._listItemNode.classList.add("expanded");
+        var nextSibling = null;
+        if (this.nextSibling && this.nextSibling._listItemNode && this.nextSibling._listItemNode.parentNode === this.parent._childrenListNode)
+            nextSibling = this.nextSibling._listItemNode;
+        this.parent._childrenListNode.insertBefore(this._listItemNode, nextSibling);
+        if (this._childrenListNode)
+            this.parent._childrenListNode.insertBefore(this._childrenListNode, this._listItemNode.nextSibling);
         if (this.selected)
-            this._listItemNode.classList.add("selected");
-
-        this._listItemNode.addEventListener("mousedown", TreeElement.treeElementMouseDown, false);
-        this._listItemNode.addEventListener("click", TreeElement.treeElementToggled, false);
-        this._listItemNode.addEventListener("dblclick", TreeElement.treeElementDoubleClicked, false);
-
-        if (this.onattach)
-            this.onattach(this);
+            this.select();
+        if (this.expanded)
+            this.expand();
     }
 
-    var nextSibling = null;
-    if (this.nextSibling && this.nextSibling._listItemNode && this.nextSibling._listItemNode.parentNode === this.parent._childrenListNode)
-        nextSibling = this.nextSibling._listItemNode;
-    this.parent._childrenListNode.insertBefore(this._listItemNode, nextSibling);
-    if (this._childrenListNode)
-        this.parent._childrenListNode.insertBefore(this._childrenListNode, this._listItemNode.nextSibling);
-    if (this.selected)
-        this.select();
-    if (this.expanded)
-        this.expand();
-};
+    _detach()
+    {
+        if (this.ondetach)
+            this.ondetach(this);
+        if (this._listItemNode && this._listItemNode.parentNode)
+            this._listItemNode.parentNode.removeChild(this._listItemNode);
+        if (this._childrenListNode && this._childrenListNode.parentNode)
+            this._childrenListNode.parentNode.removeChild(this._childrenListNode);
+    }
 
-TreeElement.prototype._detach = function()
-{
-    if (this.ondetach)
-        this.ondetach(this);
-    if (this._listItemNode && this._listItemNode.parentNode)
-        this._listItemNode.parentNode.removeChild(this._listItemNode);
-    if (this._childrenListNode && this._childrenListNode.parentNode)
-        this._childrenListNode.parentNode.removeChild(this._childrenListNode);
-};
+    static treeElementMouseDown(event)
+    {
+        var element = event.currentTarget;
+        if (!element || !element.treeElement || !element.treeElement.selectable)
+            return;
 
-TreeElement.treeElementMouseDown = function(event)
-{
-    var element = event.currentTarget;
-    if (!element || !element.treeElement || !element.treeElement.selectable)
-        return;
+        if (element.treeElement.isEventWithinDisclosureTriangle(event)) {
+            event.preventDefault();
+            return;
+        }
 
-    if (element.treeElement.isEventWithinDisclosureTriangle(event)) {
-        event.preventDefault();
-        return;
+        element.treeElement.selectOnMouseDown(event);
     }
 
-    element.treeElement.selectOnMouseDown(event);
-};
+    static treeElementToggled(event)
+    {
+        var element = event.currentTarget;
+        if (!element || !element.treeElement)
+            return;
 
-TreeElement.treeElementToggled = function(event)
-{
-    var element = event.currentTarget;
-    if (!element || !element.treeElement)
-        return;
-
-    var toggleOnClick = element.treeElement.toggleOnClick && !element.treeElement.selectable;
-    var isInTriangle = element.treeElement.isEventWithinDisclosureTriangle(event);
-    if (!toggleOnClick && !isInTriangle)
-        return;
-
-    if (element.treeElement.expanded) {
-        if (event.altKey)
-            element.treeElement.collapseRecursively();
-        else
-            element.treeElement.collapse();
-    } else {
-        if (event.altKey)
-            element.treeElement.expandRecursively();
-        else
-            element.treeElement.expand();
-    }
-    event.stopPropagation();
-};
+        var toggleOnClick = element.treeElement.toggleOnClick && !element.treeElement.selectable;
+        var isInTriangle = element.treeElement.isEventWithinDisclosureTriangle(event);
+        if (!toggleOnClick && !isInTriangle)
+            return;
 
-TreeElement.treeElementDoubleClicked = function(event)
-{
-    var element = event.currentTarget;
-    if (!element || !element.treeElement)
-        return;
+        if (element.treeElement.expanded) {
+            if (event.altKey)
+                element.treeElement.collapseRecursively();
+            else
+                element.treeElement.collapse();
+        } else {
+            if (event.altKey)
+                element.treeElement.expandRecursively();
+            else
+                element.treeElement.expand();
+        }
+        event.stopPropagation();
+    }
 
-    if (element.treeElement.isEventWithinDisclosureTriangle(event))
-        return;
+    static treeElementDoubleClicked(event)
+    {
+        var element = event.currentTarget;
+        if (!element || !element.treeElement)
+            return;
 
-    if (element.treeElement.ondblclick)
-        element.treeElement.ondblclick.call(element.treeElement, event);
-    else if (element.treeElement.hasChildren && !element.treeElement.expanded)
-        element.treeElement.expand();
-};
+        if (element.treeElement.isEventWithinDisclosureTriangle(event))
+            return;
 
-TreeElement.prototype.collapse = function()
-{
-    if (this._listItemNode)
-        this._listItemNode.classList.remove("expanded");
-    if (this._childrenListNode)
-        this._childrenListNode.classList.remove("expanded");
+        if (element.treeElement.ondblclick)
+            element.treeElement.ondblclick.call(element.treeElement, event);
+        else if (element.treeElement.hasChildren && !element.treeElement.expanded)
+            element.treeElement.expand();
+    }
 
-    this.expanded = false;
-    if (this.treeOutline)
-        this.treeOutline._treeElementsExpandedState[this.identifier] = false;
+    collapse()
+    {
+        if (this._listItemNode)
+            this._listItemNode.classList.remove("expanded");
+        if (this._childrenListNode)
+            this._childrenListNode.classList.remove("expanded");
 
-    if (this.oncollapse)
-        this.oncollapse(this);
+        this.expanded = false;
+        if (this.treeOutline)
+            this.treeOutline._treeElementsExpandedState[this.identifier] = false;
 
-    if (this.treeOutline && this.treeOutline.oncollapse)
-        this.treeOutline.oncollapse(this);
-};
+        if (this.oncollapse)
+            this.oncollapse(this);
 
-TreeElement.prototype.collapseRecursively = function()
-{
-    var item = this;
-    while (item) {
-        if (item.expanded)
-            item.collapse();
-        item = item.traverseNextTreeElement(false, this, true);
+        if (this.treeOutline && this.treeOutline.oncollapse)
+            this.treeOutline.oncollapse(this);
     }
-};
 
-TreeElement.prototype.expand = function()
-{
-    if (this.expanded && !this._shouldRefreshChildren && this._childrenListNode)
-        return;
+    collapseRecursively()
+    {
+        var item = this;
+        while (item) {
+            if (item.expanded)
+                item.collapse();
+            item = item.traverseNextTreeElement(false, this, true);
+        }
+    }
 
-    // Set this before onpopulate. Since onpopulate can add elements and call onadd, this makes
-    // sure the expanded flag is true before calling those functions. This prevents the possibility
-    // of an infinite loop if onpopulate or onadd were to call expand.
+    expand()
+    {
+        if (this.expanded && !this._shouldRefreshChildren && this._childrenListNode)
+            return;
 
-    this.expanded = true;
-    if (this.treeOutline)
-        this.treeOutline._treeElementsExpandedState[this.identifier] = true;
+        // Set this before onpopulate. Since onpopulate can add elements and call onadd, this makes
+        // sure the expanded flag is true before calling those functions. This prevents the possibility
+        // of an infinite loop if onpopulate or onadd were to call expand.
 
-    // If there are no children, return. We will be expanded once we have children.
-    if (!this.hasChildren)
-        return;
+        this.expanded = true;
+        if (this.treeOutline)
+            this.treeOutline._treeElementsExpandedState[this.identifier] = true;
 
-    if (this.treeOutline && (!this._childrenListNode || this._shouldRefreshChildren)) {
-        if (this._childrenListNode && this._childrenListNode.parentNode)
-            this._childrenListNode.parentNode.removeChild(this._childrenListNode);
+        // If there are no children, return. We will be expanded once we have children.
+        if (!this.hasChildren)
+            return;
 
-        this._childrenListNode = this.treeOutline._childrenListNode.ownerDocument.createElement("ol");
-        this._childrenListNode.parentTreeElement = this;
-        this._childrenListNode.classList.add("children");
+        if (this.treeOutline && (!this._childrenListNode || this._shouldRefreshChildren)) {
+            if (this._childrenListNode && this._childrenListNode.parentNode)
+                this._childrenListNode.parentNode.removeChild(this._childrenListNode);
 
-        if (this.hidden)
-            this._childrenListNode.classList.add("hidden");
+            this._childrenListNode = this.treeOutline._childrenListNode.ownerDocument.createElement("ol");
+            this._childrenListNode.parentTreeElement = this;
+            this._childrenListNode.classList.add("children");
 
-        this.onpopulate();
+            if (this.hidden)
+                this._childrenListNode.classList.add("hidden");
 
-        for (var i = 0; i < this.children.length; ++i)
-            this.children[i]._attach();
+            this.onpopulate();
 
-        delete this._shouldRefreshChildren;
-    }
+            for (var i = 0; i < this.children.length; ++i)
+                this.children[i]._attach();
 
-    if (this._listItemNode) {
-        this._listItemNode.classList.add("expanded");
-        if (this._childrenListNode && this._childrenListNode.parentNode !== this._listItemNode.parentNode)
-            this.parent._childrenListNode.insertBefore(this._childrenListNode, this._listItemNode.nextSibling);
-    }
+            delete this._shouldRefreshChildren;
+        }
 
-    if (this._childrenListNode)
-        this._childrenListNode.classList.add("expanded");
+        if (this._listItemNode) {
+            this._listItemNode.classList.add("expanded");
+            if (this._childrenListNode && this._childrenListNode.parentNode !== this._listItemNode.parentNode)
+                this.parent._childrenListNode.insertBefore(this._childrenListNode, this._listItemNode.nextSibling);
+        }
 
-    if (this.onexpand)
-        this.onexpand(this);
+        if (this._childrenListNode)
+            this._childrenListNode.classList.add("expanded");
 
-    if (this.treeOutline && this.treeOutline.onexpand)
-        this.treeOutline.onexpand(this);
-};
+        if (this.onexpand)
+            this.onexpand(this);
 
-TreeElement.prototype.expandRecursively = function(maxDepth)
-{
-    var item = this;
-    var info = {};
-    var depth = 0;
-
-    // The Inspector uses TreeOutlines to represents object properties, so recursive expansion
-    // in some case can be infinite, since JavaScript objects can hold circular references.
-    // So default to a recursion cap of 3 levels, since that gives fairly good results.
-    if (maxDepth === undefined)
-        maxDepth = 3;
-
-    while (item) {
-        if (depth < maxDepth)
-            item.expand();
-        item = item.traverseNextTreeElement(false, this, (depth >= maxDepth), info);
-        depth += info.depthChange;
+        if (this.treeOutline && this.treeOutline.onexpand)
+            this.treeOutline.onexpand(this);
     }
-};
-
-TreeElement.prototype.hasAncestor = function(ancestor) {
-    if (!ancestor)
-        return false;
 
-    var currentNode = this.parent;
-    while (currentNode) {
-        if (ancestor === currentNode)
-            return true;
-        currentNode = currentNode.parent;
+    expandRecursively(maxDepth)
+    {
+        var item = this;
+        var info = {};
+        var depth = 0;
+
+        // The Inspector uses TreeOutlines to represents object properties, so recursive expansion
+        // in some case can be infinite, since JavaScript objects can hold circular references.
+        // So default to a recursion cap of 3 levels, since that gives fairly good results.
+        if (maxDepth === undefined)
+            maxDepth = 3;
+
+        while (item) {
+            if (depth < maxDepth)
+                item.expand();
+            item = item.traverseNextTreeElement(false, this, (depth >= maxDepth), info);
+            depth += info.depthChange;
+        }
     }
 
-    return false;
-};
+    hasAncestor(ancestor)
+        {
+        if (!ancestor)
+            return false;
 
-TreeElement.prototype.reveal = function()
-{
-    var currentAncestor = this.parent;
-    while (currentAncestor && !currentAncestor.root) {
-        if (!currentAncestor.expanded)
-            currentAncestor.expand();
-        currentAncestor = currentAncestor.parent;
+        var currentNode = this.parent;
+        while (currentNode) {
+            if (ancestor === currentNode)
+                return true;
+            currentNode = currentNode.parent;
+        }
+
+        return false;
     }
 
-    if (this.onreveal)
-        this.onreveal(this);
-};
+    reveal()
+    {
+        var currentAncestor = this.parent;
+        while (currentAncestor && !currentAncestor.root) {
+            if (!currentAncestor.expanded)
+                currentAncestor.expand();
+            currentAncestor = currentAncestor.parent;
+        }
 
-TreeElement.prototype.revealed = function()
-{
-    if (this.hidden)
-        return false;
+        if (this.onreveal)
+            this.onreveal(this);
+    }
 
-    var currentAncestor = this.parent;
-    while (currentAncestor && !currentAncestor.root) {
-        if (!currentAncestor.expanded)
-            return false;
-        if (currentAncestor.hidden)
+    revealed()
+    {
+        if (this.hidden)
             return false;
-        currentAncestor = currentAncestor.parent;
-    }
 
-    return true;
-};
+        var currentAncestor = this.parent;
+        while (currentAncestor && !currentAncestor.root) {
+            if (!currentAncestor.expanded)
+                return false;
+            if (currentAncestor.hidden)
+                return false;
+            currentAncestor = currentAncestor.parent;
+        }
 
-TreeElement.prototype.selectOnMouseDown = function(event)
-{
-    this.select(false, true);
-};
+        return true;
+    }
 
-TreeElement.prototype.select = function(omitFocus, selectedByUser, suppressOnSelect, suppressOnDeselect)
-{
-    if (!this.treeOutline || !this.selectable)
-        return;
+    selectOnMouseDown(event)
+    {
+        this.select(false, true);
+    }
 
-    if (this.selected && !this.treeOutline.allowsRepeatSelection)
-        return;
+    select(omitFocus, selectedByUser, suppressOnSelect, suppressOnDeselect)
+    {
+        if (!this.treeOutline || !this.selectable)
+            return;
 
-    if (!omitFocus)
-        this.treeOutline._childrenListNode.focus();
+        if (this.selected && !this.treeOutline.allowsRepeatSelection)
+            return;
 
-    // Focusing on another node may detach "this" from tree.
-    if (!this.treeOutline)
-        return;
+        if (!omitFocus)
+            this.treeOutline._childrenListNode.focus();
 
-    this.treeOutline.processingSelectionChange = true;
+        // Focusing on another node may detach "this" from tree.
+        if (!this.treeOutline)
+            return;
 
-    if (!this.selected) {
-        if (this.treeOutline.selectedTreeElement)
-            this.treeOutline.selectedTreeElement.deselect(suppressOnDeselect);
+        this.treeOutline.processingSelectionChange = true;
 
-        this.selected = true;
-        this.treeOutline.selectedTreeElement = this;
+        if (!this.selected) {
+            if (this.treeOutline.selectedTreeElement)
+                this.treeOutline.selectedTreeElement.deselect(suppressOnDeselect);
 
-        if (this._listItemNode)
-            this._listItemNode.classList.add("selected");
-    }
+            this.selected = true;
+            this.treeOutline.selectedTreeElement = this;
 
-    if (this.onselect && !suppressOnSelect)
-        this.onselect(this, selectedByUser);
+            if (this._listItemNode)
+                this._listItemNode.classList.add("selected");
+        }
 
-    if (this.treeOutline.onselect && !suppressOnSelect)
-        this.treeOutline.onselect(this, selectedByUser);
+        if (this.onselect && !suppressOnSelect)
+            this.onselect(this, selectedByUser);
 
-    delete this.treeOutline.processingSelectionChange;
-};
+        if (this.treeOutline.onselect && !suppressOnSelect)
+            this.treeOutline.onselect(this, selectedByUser);
 
-TreeElement.prototype.revealAndSelect = function(omitFocus, selectedByUser, suppressOnSelect, suppressOnDeselect)
-{
-    this.reveal();
-    this.select(omitFocus, selectedByUser, suppressOnSelect, suppressOnDeselect);
-};
+        delete this.treeOutline.processingSelectionChange;
+    }
 
-TreeElement.prototype.deselect = function(suppressOnDeselect)
-{
-    if (!this.treeOutline || this.treeOutline.selectedTreeElement !== this || !this.selected)
-        return false;
+    revealAndSelect(omitFocus, selectedByUser, suppressOnSelect, suppressOnDeselect)
+    {
+        this.reveal();
+        this.select(omitFocus, selectedByUser, suppressOnSelect, suppressOnDeselect);
+    }
 
-    this.selected = false;
-    this.treeOutline.selectedTreeElement = null;
+    deselect(suppressOnDeselect)
+    {
+        if (!this.treeOutline || this.treeOutline.selectedTreeElement !== this || !this.selected)
+            return false;
 
-    if (this._listItemNode)
-        this._listItemNode.classList.remove("selected");
+        this.selected = false;
+        this.treeOutline.selectedTreeElement = null;
 
-    if (this.ondeselect && !suppressOnDeselect)
-        this.ondeselect(this);
+        if (this._listItemNode)
+            this._listItemNode.classList.remove("selected");
 
-    if (this.treeOutline.ondeselect && !suppressOnDeselect)
-        this.treeOutline.ondeselect(this);
+        if (this.ondeselect && !suppressOnDeselect)
+            this.ondeselect(this);
 
-    return true;
-};
+        if (this.treeOutline.ondeselect && !suppressOnDeselect)
+            this.treeOutline.ondeselect(this);
 
-TreeElement.prototype.onpopulate = function()
-{
-    // Overriden by subclasses.
-};
+        return true;
+    }
 
-TreeElement.prototype.traverseNextTreeElement = function(skipUnrevealed, stayWithin, dontPopulate, info)
-{
-    if (!dontPopulate && this.hasChildren)
-        this.onpopulate.call(this); // FIXME: This shouldn't need to use call, but this is working around a JSC bug. https://webkit.org/b/74811
+    onpopulate()
+    {
+        // Overriden by subclasses.
+    }
 
-    if (info)
-        info.depthChange = 0;
+    traverseNextTreeElement(skipUnrevealed, stayWithin, dontPopulate, info)
+    {
+        if (!dontPopulate && this.hasChildren)
+            this.onpopulate.call(this); // FIXME: This shouldn't need to use call, but this is working around a JSC bug. https://webkit.org/b/74811
 
-    var element = skipUnrevealed ? (this.revealed() ? this.children[0] : null) : this.children[0];
-    if (element && (!skipUnrevealed || (skipUnrevealed && this.expanded))) {
         if (info)
-            info.depthChange = 1;
-        return element;
-    }
+            info.depthChange = 0;
 
-    if (this === stayWithin)
-        return null;
+        var element = skipUnrevealed ? (this.revealed() ? this.children[0] : null) : this.children[0];
+        if (element && (!skipUnrevealed || (skipUnrevealed && this.expanded))) {
+            if (info)
+                info.depthChange = 1;
+            return element;
+        }
 
-    element = skipUnrevealed ? (this.revealed() ? this.nextSibling : null) : this.nextSibling;
-    if (element)
-        return element;
+        if (this === stayWithin)
+            return null;
 
-    element = this;
-    while (element && !element.root && !(skipUnrevealed ? (element.revealed() ? element.nextSibling : null) : element.nextSibling) && element.parent !== stayWithin) {
-        if (info)
-            info.depthChange -= 1;
-        element = element.parent;
-    }
+        element = skipUnrevealed ? (this.revealed() ? this.nextSibling : null) : this.nextSibling;
+        if (element)
+            return element;
 
-    if (!element)
-        return null;
+        element = this;
+        while (element && !element.root && !(skipUnrevealed ? (element.revealed() ? element.nextSibling : null) : element.nextSibling) && element.parent !== stayWithin) {
+            if (info)
+                info.depthChange -= 1;
+            element = element.parent;
+        }
 
-    return (skipUnrevealed ? (element.revealed() ? element.nextSibling : null) : element.nextSibling);
-};
+        if (!element)
+            return null;
 
-TreeElement.prototype.traversePreviousTreeElement = function(skipUnrevealed, dontPopulate)
-{
-    var element = skipUnrevealed ? (this.revealed() ? this.previousSibling : null) : this.previousSibling;
-    if (!dontPopulate && element && element.hasChildren)
-        element.onpopulate();
+        return (skipUnrevealed ? (element.revealed() ? element.nextSibling : null) : element.nextSibling);
+    }
 
-    while (element && (skipUnrevealed ? (element.revealed() && element.expanded ? element.children[element.children.length - 1] : null) : element.children[element.children.length - 1])) {
-        if (!dontPopulate && element.hasChildren)
+    traversePreviousTreeElement(skipUnrevealed, dontPopulate)
+    {
+        var element = skipUnrevealed ? (this.revealed() ? this.previousSibling : null) : this.previousSibling;
+        if (!dontPopulate && element && element.hasChildren)
             element.onpopulate();
-        element = (skipUnrevealed ? (element.revealed() && element.expanded ? element.children[element.children.length - 1] : null) : element.children[element.children.length - 1]);
-    }
 
-    if (element)
-        return element;
+        while (element && (skipUnrevealed ? (element.revealed() && element.expanded ? element.children[element.children.length - 1] : null) : element.children[element.children.length - 1])) {
+            if (!dontPopulate && element.hasChildren)
+                element.onpopulate();
+            element = (skipUnrevealed ? (element.revealed() && element.expanded ? element.children[element.children.length - 1] : null) : element.children[element.children.length - 1]);
+        }
 
-    if (!this.parent || this.parent.root)
-        return null;
+        if (element)
+            return element;
 
-    return this.parent;
-};
+        if (!this.parent || this.parent.root)
+            return null;
 
-TreeElement.prototype.isEventWithinDisclosureTriangle = function(event)
-{
-    if (!document.contains(this._listItemNode))
-        return false;
+        return this.parent;
+    }
 
-    // FIXME: We should not use getComputedStyle(). For that we need to get rid of using ::before for disclosure triangle. (http://webk.it/74446)
-    var computedLeftPadding = window.getComputedStyle(this._listItemNode).getPropertyCSSValue("padding-left").getFloatValue(CSSPrimitiveValue.CSS_PX);
-    var left = this._listItemNode.totalOffsetLeft + computedLeftPadding;
-    return event.pageX >= left && event.pageX <= left + this.arrowToggleWidth && this.hasChildren;
-};
+    isEventWithinDisclosureTriangle(event)
+    {
+        if (!document.contains(this._listItemNode))
+            return false;
 
-TreeElement.prototype.__proto__ = WebInspector.Object.prototype;
+        // FIXME: We should not use getComputedStyle(). For that we need to get rid of using ::before for disclosure triangle. (http://webk.it/74446)
+        var computedLeftPadding = window.getComputedStyle(this._listItemNode).getPropertyCSSValue("padding-left").getFloatValue(CSSPrimitiveValue.CSS_PX);
+        var left = this._listItemNode.totalOffsetLeft + computedLeftPadding;
+        return event.pageX >= left && event.pageX <= left + this.arrowToggleWidth && this.hasChildren;
+    }
+};
index ae9f844..77434b8 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Apple Inc. All rights reserved.
+ * Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-WebInspector.TreeOutlineDataGridSynchronizer = function(treeOutline, dataGrid, delegate)
+WebInspector.TreeOutlineDataGridSynchronizer = class TreeOutlineDataGridSynchronizer extends WebInspector.Object
 {
-    // FIXME: Convert this to a WebInspector.Object subclass, and call super().
-    // WebInspector.Object.call(this);
-
-    this._treeOutline = treeOutline;
-    this._dataGrid = dataGrid;
-    this._delegate = delegate || null;
-    this._enabled = true;
-
-    this._treeOutline.element.parentNode.addEventListener("scroll", this._treeOutlineScrolled.bind(this));
-    this._dataGrid.scrollContainer.addEventListener("scroll", this._dataGridScrolled.bind(this));
-
-    this._treeOutline.__dataGridNode = this._dataGrid;
-
-    this._dataGrid.addEventListener(WebInspector.DataGrid.Event.ExpandedNode, this._dataGridNodeExpanded, this);
-    this._dataGrid.addEventListener(WebInspector.DataGrid.Event.CollapsedNode, this._dataGridNodeCollapsed, this);
-    this._dataGrid.addEventListener(WebInspector.DataGrid.Event.SelectedNodeChanged, this._dataGridNodeSelected, this);
-
-    // FIXME: This is a hack. TreeOutline should just dispatch events via WebInspector.Object.
-    var existingOnAdd = treeOutline.onadd;
-    var existingOnRemove = treeOutline.onremove;
-    var existingOnExpand = treeOutline.onexpand;
-    var existingOnCollapse = treeOutline.oncollapse;
-    var existingOnHidden = treeOutline.onhidden;
-    var existingOnSelect = treeOutline.onselect;
-
-    treeOutline.onadd = function(element) {
-        this._treeElementAdded(element);
-        if (existingOnAdd)
-            existingOnAdd.call(treeOutline, element);
-    }.bind(this);
-
-    treeOutline.onremove = function(element) {
-        this._treeElementRemoved(element);
-        if (existingOnRemove)
-            existingOnRemove.call(treeOutline, element);
-    }.bind(this);
-
-    treeOutline.onexpand = function(element) {
-        this._treeElementExpanded(element);
-        if (existingOnExpand)
-            existingOnExpand.call(treeOutline, element);
-    }.bind(this);
-
-    treeOutline.oncollapse = function(element) {
-        this._treeElementCollapsed(element);
-        if (existingOnCollapse)
-            existingOnCollapse.call(treeOutline, element);
-    }.bind(this);
-
-    treeOutline.onhidden = function(element, hidden) {
-        this._treeElementHiddenChanged(element, hidden);
-        if (existingOnHidden)
-            existingOnHidden.call(treeOutline, element, hidden);
-    }.bind(this);
-
-    treeOutline.onselect = function(element, selectedByUser) {
-        this._treeElementSelected(element, selectedByUser);
-        if (existingOnSelect)
-            existingOnSelect.call(treeOutline, element, selectedByUser);
-    }.bind(this);
-};
-
-WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
-    constructor: WebInspector.TreeOutlineDataGridSynchronizer,
-    __proto__: WebInspector.Object.prototype,
+    constructor(treeOutline, dataGrid, delegate)
+    {
+        super();
+
+        this._treeOutline = treeOutline;
+        this._dataGrid = dataGrid;
+        this._delegate = delegate || null;
+        this._enabled = true;
+
+        this._treeOutline.element.parentNode.addEventListener("scroll", this._treeOutlineScrolled.bind(this));
+        this._dataGrid.scrollContainer.addEventListener("scroll", this._dataGridScrolled.bind(this));
+
+        this._treeOutline.__dataGridNode = this._dataGrid;
+
+        this._dataGrid.addEventListener(WebInspector.DataGrid.Event.ExpandedNode, this._dataGridNodeExpanded, this);
+        this._dataGrid.addEventListener(WebInspector.DataGrid.Event.CollapsedNode, this._dataGridNodeCollapsed, this);
+        this._dataGrid.addEventListener(WebInspector.DataGrid.Event.SelectedNodeChanged, this._dataGridNodeSelected, this);
+
+        // FIXME: This is a hack. TreeOutline should just dispatch events via WebInspector.Object.
+        var existingOnAdd = treeOutline.onadd;
+        var existingOnRemove = treeOutline.onremove;
+        var existingOnExpand = treeOutline.onexpand;
+        var existingOnCollapse = treeOutline.oncollapse;
+        var existingOnHidden = treeOutline.onhidden;
+        var existingOnSelect = treeOutline.onselect;
+
+        treeOutline.onadd = function(element) {
+            this._treeElementAdded(element);
+            if (existingOnAdd)
+                existingOnAdd.call(treeOutline, element);
+        }.bind(this);
+
+        treeOutline.onremove = function(element) {
+            this._treeElementRemoved(element);
+            if (existingOnRemove)
+                existingOnRemove.call(treeOutline, element);
+        }.bind(this);
+
+        treeOutline.onexpand = function(element) {
+            this._treeElementExpanded(element);
+            if (existingOnExpand)
+                existingOnExpand.call(treeOutline, element);
+        }.bind(this);
+
+        treeOutline.oncollapse = function(element) {
+            this._treeElementCollapsed(element);
+            if (existingOnCollapse)
+                existingOnCollapse.call(treeOutline, element);
+        }.bind(this);
+
+        treeOutline.onhidden = function(element, hidden) {
+            this._treeElementHiddenChanged(element, hidden);
+            if (existingOnHidden)
+                existingOnHidden.call(treeOutline, element, hidden);
+        }.bind(this);
+
+        treeOutline.onselect = function(element, selectedByUser) {
+            this._treeElementSelected(element, selectedByUser);
+            if (existingOnSelect)
+                existingOnSelect.call(treeOutline, element, selectedByUser);
+        }.bind(this);
+    }
 
     // Public
 
     get treeOutline()
     {
         return this._treeOutline;
-    },
+    }
 
     get dataGrid()
     {
         return this._dataGrid;
-    },
+    }
 
     get delegate()
     {
         return this._delegate;
-    },
+    }
 
     get enabled()
     {
         return this._enabled;
-    },
+    }
 
     set enabled(x)
     {
         this._enabled = x || false;
-    },
+    }
 
-    associate: function(treeElement, dataGridNode)
+    associate(treeElement, dataGridNode)
     {
         console.assert(treeElement);
         console.assert(dataGridNode);
 
         treeElement.__dataGridNode = dataGridNode;
         dataGridNode.__treeElement = treeElement;
-    },
+    }
 
-    synchronize: function()
+    synchronize()
     {
         this._dataGrid.scrollContainer.scrollTop = this._treeOutline.element.parentNode.scrollTop;
         if (this._treeOutline.selectedTreeElement)
             this._treeOutline.selectedTreeElement.__dataGridNode.select(true);
         else if (this._dataGrid.selectedNode)
             this._dataGrid.selectedNode.deselect(true);
-    },
+    }
 
-    treeElementForDataGridNode: function(dataGridNode)
+    treeElementForDataGridNode(dataGridNode)
     {
         return dataGridNode.__treeElement || null;
-    },
+    }
 
-    dataGridNodeForTreeElement: function(treeElement)
+    dataGridNodeForTreeElement(treeElement)
     {
         if (treeElement.__dataGridNode)
             return treeElement.__dataGridNode;
@@ -154,11 +151,11 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
         }
 
         return null;
-    },
+    }
 
     // Private
 
-    _treeOutlineScrolled: function(event)
+    _treeOutlineScrolled(event)
     {
         if (!this._enabled)
             return;
@@ -170,9 +167,9 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
 
         this._ignoreNextDataGridScrollEvent = true;
         this._dataGrid.scrollContainer.scrollTop = this._treeOutline.element.parentNode.scrollTop;
-    },
+    }
 
-    _dataGridScrolled: function(event)
+    _dataGridScrolled(event)
     {
         if (!this._enabled)
             return;
@@ -184,9 +181,9 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
 
         this._ignoreNextTreeOutlineScrollEvent = true;
         this._treeOutline.element.parentNode.scrollTop = this._dataGrid.scrollContainer.scrollTop;
-    },
+    }
 
-    _dataGridNodeSelected: function(event)
+    _dataGridNodeSelected(event)
     {
         if (!this._enabled)
             return;
@@ -194,9 +191,9 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
         var dataGridNode = this._dataGrid.selectedNode;
         if (dataGridNode)
             dataGridNode.__treeElement.select(true, true, true, true);
-    },
+    }
 
-    _dataGridNodeExpanded: function(event)
+    _dataGridNodeExpanded(event)
     {
         if (!this._enabled)
             return;
@@ -206,9 +203,9 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
 
         if (!dataGridNode.__treeElement.expanded)
             dataGridNode.__treeElement.expand();
-    },
+    }
 
-    _dataGridNodeCollapsed: function(event)
+    _dataGridNodeCollapsed(event)
     {
         if (!this._enabled)
             return;
@@ -218,9 +215,9 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
 
         if (dataGridNode.__treeElement.expanded)
             dataGridNode.__treeElement.collapse();
-    },
+    }
 
-    _treeElementSelected: function(treeElement, selectedByUser)
+    _treeElementSelected(treeElement, selectedByUser)
     {
         if (!this._enabled)
             return;
@@ -229,9 +226,9 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
         console.assert(dataGridNode);
 
         dataGridNode.select(true);
-    },
+    }
 
-    _treeElementAdded: function(treeElement)
+    _treeElementAdded(treeElement)
     {
         if (!this._enabled)
             return;
@@ -246,9 +243,9 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
         console.assert(childIndex !== -1);
 
         parentDataGridNode.insertChild(dataGridNode, childIndex);
-    },
+    }
 
-    _treeElementRemoved: function(treeElement)
+    _treeElementRemoved(treeElement)
     {
         if (!this._enabled)
             return;
@@ -258,9 +255,9 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
 
         if (dataGridNode.parent)
             dataGridNode.parent.removeChild(dataGridNode);
-    },
+    }
 
-    _treeElementExpanded: function(treeElement)
+    _treeElementExpanded(treeElement)
     {
         if (!this._enabled)
             return;
@@ -270,9 +267,9 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
 
         if (!dataGridNode.expanded)
             dataGridNode.expand();
-    },
+    }
 
-    _treeElementCollapsed: function(treeElement)
+    _treeElementCollapsed(treeElement)
     {
         if (!this._enabled)
             return;
@@ -282,9 +279,9 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
 
         if (dataGridNode.expanded)
             dataGridNode.collapse();
-    },
+    }
 
-    _treeElementHiddenChanged: function(treeElement, hidden)
+    _treeElementHiddenChanged(treeElement, hidden)
     {
         if (!this._enabled)
             return;
@@ -295,5 +292,3 @@ WebInspector.TreeOutlineDataGridSynchronizer.prototype = {
         dataGridNode.element.classList.toggle("hidden", hidden);
     }
 };
-
-WebInspector.TreeOutlineDataGridSynchronizer.prototype.__proto__ = WebInspector.Object.prototype;
index 94604c7..929ad42 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2014 Apple Inc. All rights reserved.
+ * Copyright (C) 2014-2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
@@ -68,7 +68,7 @@ WebInspector.TypePropertiesSection.prototype = {
             var title = document.createElement("div");
             title.className = "info";
             title.textContent = this.emptyPlaceholder;
-            var infoElement = new TreeElement(title, null, false);
+            var infoElement = new WebInspector.TreeElement(title, null, false);
             this.propertiesTreeOutline.appendChild(infoElement);
         }
 
@@ -125,25 +125,23 @@ WebInspector.TypePropertiesSection.PropertyComparator = function(propertyA, prop
     return diff;
 };
 
-WebInspector.TypePropertyTreeElement = function(property)
+WebInspector.TypePropertyTreeElement = class TypePropertyTreeElement extends WebInspector.TreeElement
 {
-    this.property = property;
-
-    this.nameElement = document.createElement("span");
-    this.nameElement.className = "name";
-    this.nameElement.textContent = this.property.name;
+    constructor(property)
+    {
+        super(this.nameElement, null, false);
 
-    TreeElement.call(this, this.nameElement, null, false);
+        this.property = property;
 
-    this.toggleOnClick = true;
-    this.hasChildren = !!this.property.structure;
-};
+        this.nameElement = document.createElement("span");
+        this.nameElement.className = "name";
+        this.nameElement.textContent = this.property.name;
 
-WebInspector.TypePropertyTreeElement.prototype = {
-    constructor: WebInspector.TypePropertyTreeElement,
-    __proto__: TreeElement.prototype,
+        this.toggleOnClick = true;
+        this.hasChildren = !!this.property.structure;
+    }
 
-    onpopulate: function()
+    onpopulate()
     {
         this.removeChildren();
 
@@ -184,4 +182,3 @@ WebInspector.TypePropertyTreeElement.prototype = {
             this.appendChild(new WebInspector.TypePropertyTreeElement(property));
     }
 };
-