Web Inspector: Bezier curve visual editor
authordrousso@apple.com <drousso@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 6 Aug 2015 06:17:59 +0000 (06:17 +0000)
committerdrousso@apple.com <drousso@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 6 Aug 2015 06:17:59 +0000 (06:17 +0000)
commit13b4e63b67af25c87f065e84ccc0d145dd3864ab
tree7cca85b4cbf2fade872fc70fdd862abf24e3da92
parent0209b0b42c99a9dd9d50b5fb21f6417cba53ea32
Web Inspector: Bezier curve visual editor
https://bugs.webkit.org/show_bug.cgi?id=134501

Reviewed by Timothy Hatcher.

Added a visual Cubic Bezier curve editor that is usable in both
the CSS sidebar and the resources panel.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Base/DOMUtilities.js:
(createSVGElement):
* UserInterface/Controllers/CodeMirrorBezierEditingController.js:
(WebInspector.CodeMirrorBezierEditingController):
(WebInspector.CodeMirrorBezierEditingController.prototype.get initialValue):
(WebInspector.CodeMirrorBezierEditingController.prototype.get cssClassName):
(WebInspector.CodeMirrorBezierEditingController.prototype.popoverWillPresent):
(WebInspector.CodeMirrorBezierEditingController.prototype.popoverDidPresent):
(WebInspector.CodeMirrorBezierEditingController.prototype._bezierEditorBezierChanged):
* UserInterface/Images/CubicBezier.svg: Added.
* UserInterface/Main.html:
* UserInterface/Models/Geometry.js:
(WebInspector.Point.prototype.distance):
(WebInspector.Point):
(WebInspector.CubicBezier):
(WebInspector.CubicBezier.fromPoints):
(WebInspector.CubicBezier.fromString):
(WebInspector.CubicBezier.prototype.get inPoint):
(WebInspector.CubicBezier.prototype.get outPoint):
(WebInspector.CubicBezier.prototype.copy):
(WebInspector.CubicBezier.prototype.toString):
(WebInspector.CubicBezier.prototype.solve):
(WebInspector.CubicBezier.prototype._sampleCurveX):
(WebInspector.CubicBezier.prototype._sampleCurveY):
(WebInspector.CubicBezier.prototype._sampleCurveDerivativeX):
(WebInspector.CubicBezier.prototype._solveCurveX):
* UserInterface/Models/TextMarker.js:
* UserInterface/Models/UnitBezier.js: Removed.
* UserInterface/Views/BezierEditor.css: Added.
(.bezier-editor):
(.bezier-editor > .bezier-preview):
(.bezier-editor > .bezier-preview > div):
(.bezier-editor > .bezier-preview-timing):
(.bezier-editor > .bezier-preview-timing.animate):
(.bezier-editor > .bezier-container):
(@keyframes bezierPreview):
(.bezier-editor > .bezier-container):
(.bezier-editor > .bezier-container .linear-curve):
(.bezier-editor > .bezier-container .bezier-curve):
(.bezier-editor > .bezier-container .control-line):
(.bezier-editor > .bezier-container .control-handle):
* UserInterface/Views/BezierEditor.js: Added.
(WebInspector.BezierEditor.createControl):
(WebInspector.BezierEditor):
(WebInspector.BezierEditor.prototype.get element):
(WebInspector.BezierEditor.prototype.set bezier):
(WebInspector.BezierEditor.prototype.get bezier):
(WebInspector.BezierEditor.prototype.handleEvent):
(WebInspector.BezierEditor.prototype._handleMousedown):
(WebInspector.BezierEditor.prototype._handleMousemove):
(WebInspector.BezierEditor.prototype._handleMouseup):
(WebInspector.BezierEditor.prototype._updateControlPointsForMouseEvent):
(WebInspector.BezierEditor.prototype._updateValue.round):
(WebInspector.BezierEditor.prototype._updateValue):
(WebInspector.BezierEditor.prototype._updateBezier):
(WebInspector.BezierEditor.prototype._updateControl):
(WebInspector.BezierEditor.prototype._triggerPreviewAnimation):
(WebInspector.BezierEditor.prototype._resetPreviewAnimation):
* UserInterface/Views/CSSStyleDeclarationTextEditor.css:
(.css-style-text-editor > .CodeMirror .CodeMirror-lines .cubic-bezier-marker):
(.css-style-text-editor > .CodeMirror .CodeMirror-lines .cubic-bezier-marker:hover):
(.css-style-text-editor > .CodeMirror .CodeMirror-lines .cubic-bezier-marker:active):
* UserInterface/Views/CSSStyleDeclarationTextEditor.js:
(WebInspector.CSSStyleDeclarationTextEditor.prototype.didDismissPopover):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._contentChanged):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._updateTextMarkers.update):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._updateTextMarkers):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._createColorSwatches.update):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._createColorSwatches):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._createBezierEditors.update):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._createBezierEditors):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._commentProperty.update):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._commentProperty):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._uncommentRange.update):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._uncommentRange):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._cubicBezierMarkerClicked.updateCodeMirror.update):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._cubicBezierMarkerClicked.updateCodeMirror):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._cubicBezierMarkerClicked):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._resetContent.update):
(WebInspector.CSSStyleDeclarationTextEditor.prototype._resetContent):
* UserInterface/Views/CodeMirrorAdditions.js:
* UserInterface/Views/CodeMirrorTextMarkers.js: Added.
(createCodeMirrorTextMarkers):
(createCodeMirrorColorTextMarkers):
(createCodeMirrorGradientTextMarkers):
(createCodeMirrorCubicBezierTextMarkers):
* UserInterface/Views/Popover.js:
(WebInspector.Popover.prototype._animateFrame):
* UserInterface/Views/SourceCodeTextEditor.js:
(WebInspector.SourceCodeTextEditor.prototype._updateEditableMarkers):
(WebInspector.SourceCodeTextEditor.prototype._tokenTrackingControllerHighlightedMarkedExpression):
* UserInterface/Views/TextEditor.js:
(WebInspector.TextEditor.prototype.createColorMarkers):
(WebInspector.TextEditor.prototype.createGradientMarkers):
(WebInspector.TextEditor.prototype.createCubicBezierMarkers):
(WebInspector.TextEditor.prototype.editingControllerForMarker):

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@188028 268f45cc-cd09-0410-ab3c-d52691b4dbfc
18 files changed:
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
Source/WebInspectorUI/UserInterface/Base/DOMUtilities.js
Source/WebInspectorUI/UserInterface/Controllers/CodeMirrorBezierEditingController.js [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Images/CubicBezier.svg [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Main.html
Source/WebInspectorUI/UserInterface/Models/Geometry.js
Source/WebInspectorUI/UserInterface/Models/TextMarker.js
Source/WebInspectorUI/UserInterface/Models/UnitBezier.js [deleted file]
Source/WebInspectorUI/UserInterface/Views/BezierEditor.css [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Views/BezierEditor.js [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationTextEditor.css
Source/WebInspectorUI/UserInterface/Views/CSSStyleDeclarationTextEditor.js
Source/WebInspectorUI/UserInterface/Views/CodeMirrorAdditions.js
Source/WebInspectorUI/UserInterface/Views/CodeMirrorTextMarkers.js [new file with mode: 0644]
Source/WebInspectorUI/UserInterface/Views/Popover.js
Source/WebInspectorUI/UserInterface/Views/SourceCodeTextEditor.js
Source/WebInspectorUI/UserInterface/Views/TextEditor.js