Devtools Animations: Add cubic bezier easing editor for animations

Source/devtools/front_end/elements/StylesSidebarPane.js

 /*
  * Copyright (C) 2007 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
@@ skipping 31 matching lines @@
 
     var toolbar = new WebInspector.ExtensibleToolbar("styles-sidebarpane-toolbar", this.titleElement);
     toolbar.element.classList.add("styles-pane-toolbar");
     toolbar.makeNarrow();
 
     this._requestShowCallback = requestShowCallback;
     var toolbarPaneContainer = this.bodyElement.createChild("div", "styles-sidebar-toolbar-pane-container");
     this._toolbarPaneElement = toolbarPaneContainer.createChild("div", "styles-sidebar-toolbar-pane");
     this._sectionsContainer = this.bodyElement.createChild("div");
 
-    this._stylesPopoverHelper = new WebInspector.StylesPopoverHelper();
+    this._editorPopoverHelper = new WebInspector.EditorPopoverHelper();
 
     this._linkifier = new WebInspector.Linkifier(new WebInspector.Linkifier.DefaultCSSFormatter());
 
     this.element.classList.add("styles-pane");
     this.element.addEventListener("mousemove", this._mouseMovedOverElement.bind(this), false);
     this._keyDownBound = this._keyDown.bind(this);
     this._keyUpBound = this._keyUp.bind(this);
 }
 
 // Keep in sync with ComputedStyleConstants.h PseudoId enum. Array below contains pseudo id names for corresponding enum indexes.
@@ skipping 233 matching lines @@
         // We should update SSP on main frame navigation only.
         var mainFrameNavigated = node && this.node() && node.ownerDocument !== this.node().ownerDocument;
         if (!mainFrameNavigated && node !== this.node()) {
             this.element.classList.toggle("no-affect", this._isEditingStyle);
             if (this._isEditingStyle) {
                 this._pendingNode = node;
                 return;
             }
         }
 
-        this._stylesPopoverHelper.hide();
+        this._editorPopoverHelper.hide();
         node = WebInspector.SharedSidebarModel.elementNode(node);
 
         this._resetCache();
         WebInspector.ElementsSidebarPane.prototype.setNode.call(this, node);
     },
 
     /**
      * @param {!WebInspector.StylePropertiesSection=} editedSection
      */
     _refreshUpdate: function(editedSection)
@@ skipping 433 matching lines @@
         this.element.ownerDocument.body.addEventListener("keyup", this._keyUpBound, false);
     },
 
     /**
      * @override
      */
     willHide: function()
     {
         this.element.ownerDocument.body.removeEventListener("keydown", this._keyDownBound, false);
         this.element.ownerDocument.body.removeEventListener("keyup", this._keyUpBound, false);
-        this._stylesPopoverHelper.hide();
+        this._editorPopoverHelper.hide();
         this._discardElementUnderMouse();
         WebInspector.ElementsSidebarPane.prototype.willHide.call(this);
     },
 
     _discardElementUnderMouse: function()
     {
         if (this._elementUnderMouse)
             this._elementUnderMouse.classList.remove("styles-panel-hovered");
         delete this._elementUnderMouse;
     },
@@ skipping 1301 matching lines @@
         var color = WebInspector.Color.parse(text);
         if (!color)
             return createTextNode(text);
 
         if (!this._styleRule.editable()) {
             var swatch = WebInspector.ColorSwatch.create();
             swatch.setColorText(text);
             return swatch;
         }
 
-        var stylesPopoverHelper = this._parentPane._stylesPopoverHelper;
-        return new WebInspector.ColowSwatchPopoverIcon(this, stylesPopoverHelper, text).element();
+        var editorPopoverHelper = this._parentPane._editorPopoverHelper;
+        return new WebInspector.ColorSwatchPopoverIcon(this, editorPopoverHelper, text).element();
     },
 
     /**
      * @return {string}
      */
     renderedPropertyText: function()
     {
         return this.nameElement.textContent + ": " + this.valueElement.textContent;
     },
 
     /**
      * @param {string} text
      * @return {!Node}
      */
     _processBezier: function(text)
     {
         var geometry = WebInspector.Geometry.CubicBezier.parse(text);
         if (!geometry || !this._styleRule.editable())
             return createTextNode(text);
-        var stylesPopoverHelper = this._parentPane._stylesPopoverHelper;
-        return new WebInspector.BezierPopoverIcon(this, stylesPopoverHelper, text).element();
+        var editorPopoverHelper = this._parentPane._editorPopoverHelper;
+        return new WebInspector.BezierPopoverIcon(this, editorPopoverHelper, text).element();
     },
 
     _updateState: function()
     {
         if (!this.listItemElement)
             return;
 
         if (this.style().isPropertyImplicit(this.name))
             this.listItemElement.classList.add("implicit");
         else
@@ skipping 1140 matching lines @@
 
     /**
      * @override
      * @return {?WebInspector.ToolbarItem}
      */
     item: function()
     {
         return this._button;
     }
 }