| OLD | NEW |
| 1 // Copyright (c) 2015 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2015 The Chromium Authors. All rights reserved. |
| 2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
| 4 | 4 |
| 5 /** | 5 /** |
| 6 * @constructor | 6 * @constructor |
| 7 * @param {!WebInspector.AnimationModel.Animation} animation | 7 * @param {!WebInspector.AnimationModel.Animation} animation |
| 8 * @param {!WebInspector.AnimationTimeline} timeline | 8 * @param {!WebInspector.AnimationTimeline} timeline |
| 9 * @param {!Element} parentElement | 9 * @param {!Element} parentElement |
| 10 */ | 10 */ |
| (...skipping 13 matching lines...) Expand all Loading... |
| 24 this._svg.style.marginLeft = "-" + WebInspector.AnimationUI.Options.Animatio
nMargin + "px"; | 24 this._svg.style.marginLeft = "-" + WebInspector.AnimationUI.Options.Animatio
nMargin + "px"; |
| 25 this._svg.addEventListener("contextmenu", this._onContextMenu.bind(this)); | 25 this._svg.addEventListener("contextmenu", this._onContextMenu.bind(this)); |
| 26 this._activeIntervalGroup = this._svg.createSVGChild("g"); | 26 this._activeIntervalGroup = this._svg.createSVGChild("g"); |
| 27 WebInspector.installDragHandle(this._activeIntervalGroup, this._mouseDown.bi
nd(this, WebInspector.AnimationUI.MouseEvents.AnimationDrag, null), this._mouse
Move.bind(this), this._mouseUp.bind(this), "-webkit-grabbing", "-webkit-grab"); | 27 WebInspector.installDragHandle(this._activeIntervalGroup, this._mouseDown.bi
nd(this, WebInspector.AnimationUI.MouseEvents.AnimationDrag, null), this._mouse
Move.bind(this), this._mouseUp.bind(this), "-webkit-grabbing", "-webkit-grab"); |
| 28 | 28 |
| 29 /** @type {!Array.<{group: ?Element, animationLine: ?Element, keyframePoints
: !Object.<number, !Element>, keyframeRender: !Object.<number, !Element>}>} */ | 29 /** @type {!Array.<{group: ?Element, animationLine: ?Element, keyframePoints
: !Object.<number, !Element>, keyframeRender: !Object.<number, !Element>}>} */ |
| 30 this._cachedElements = []; | 30 this._cachedElements = []; |
| 31 | 31 |
| 32 this._movementInMs = 0; | 32 this._movementInMs = 0; |
| 33 this._color = WebInspector.AnimationUI.Color(this._animation); | 33 this._color = WebInspector.AnimationUI.Color(this._animation); |
| 34 } | 34 }; |
| 35 | 35 |
| 36 /** | 36 /** |
| 37 * @enum {string} | 37 * @enum {string} |
| 38 */ | 38 */ |
| 39 WebInspector.AnimationUI.MouseEvents = { | 39 WebInspector.AnimationUI.MouseEvents = { |
| 40 AnimationDrag: "AnimationDrag", | 40 AnimationDrag: "AnimationDrag", |
| 41 KeyframeMove: "KeyframeMove", | 41 KeyframeMove: "KeyframeMove", |
| 42 StartEndpointMove: "StartEndpointMove", | 42 StartEndpointMove: "StartEndpointMove", |
| 43 FinishEndpointMove: "FinishEndpointMove" | 43 FinishEndpointMove: "FinishEndpointMove" |
| 44 } | 44 }; |
| 45 | 45 |
| 46 WebInspector.AnimationUI.prototype = { | 46 WebInspector.AnimationUI.prototype = { |
| 47 /** | 47 /** |
| 48 * @return {!WebInspector.AnimationModel.Animation} | 48 * @return {!WebInspector.AnimationModel.Animation} |
| 49 */ | 49 */ |
| 50 animation: function() | 50 animation: function() |
| 51 { | 51 { |
| 52 return this._animation; | 52 return this._animation; |
| 53 }, | 53 }, |
| 54 | 54 |
| (...skipping 308 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 363 if (!remoteObject) | 363 if (!remoteObject) |
| 364 return; | 364 return; |
| 365 var contextMenu = new WebInspector.ContextMenu(event); | 365 var contextMenu = new WebInspector.ContextMenu(event); |
| 366 contextMenu.appendApplicableItems(remoteObject); | 366 contextMenu.appendApplicableItems(remoteObject); |
| 367 contextMenu.show(); | 367 contextMenu.show(); |
| 368 } | 368 } |
| 369 | 369 |
| 370 this._animation.remoteObjectPromise().then(showContextMenu); | 370 this._animation.remoteObjectPromise().then(showContextMenu); |
| 371 event.consume(true); | 371 event.consume(true); |
| 372 } | 372 } |
| 373 } | 373 }; |
| 374 | 374 |
| 375 WebInspector.AnimationUI.Options = { | 375 WebInspector.AnimationUI.Options = { |
| 376 AnimationHeight: 26, | 376 AnimationHeight: 26, |
| 377 AnimationSVGHeight: 50, | 377 AnimationSVGHeight: 50, |
| 378 AnimationMargin: 7, | 378 AnimationMargin: 7, |
| 379 EndpointsClickRegionSize: 10, | 379 EndpointsClickRegionSize: 10, |
| 380 GridCanvasHeight: 40 | 380 GridCanvasHeight: 40 |
| 381 } | 381 }; |
| 382 | 382 |
| 383 WebInspector.AnimationUI.Colors = { | 383 WebInspector.AnimationUI.Colors = { |
| 384 "Purple": WebInspector.Color.parse("#9C27B0"), | 384 "Purple": WebInspector.Color.parse("#9C27B0"), |
| 385 "Light Blue": WebInspector.Color.parse("#03A9F4"), | 385 "Light Blue": WebInspector.Color.parse("#03A9F4"), |
| 386 "Deep Orange": WebInspector.Color.parse("#FF5722"), | 386 "Deep Orange": WebInspector.Color.parse("#FF5722"), |
| 387 "Blue": WebInspector.Color.parse("#5677FC"), | 387 "Blue": WebInspector.Color.parse("#5677FC"), |
| 388 "Lime": WebInspector.Color.parse("#CDDC39"), | 388 "Lime": WebInspector.Color.parse("#CDDC39"), |
| 389 "Blue Grey": WebInspector.Color.parse("#607D8B"), | 389 "Blue Grey": WebInspector.Color.parse("#607D8B"), |
| 390 "Pink": WebInspector.Color.parse("#E91E63"), | 390 "Pink": WebInspector.Color.parse("#E91E63"), |
| 391 "Green": WebInspector.Color.parse("#0F9D58"), | 391 "Green": WebInspector.Color.parse("#0F9D58"), |
| 392 "Brown": WebInspector.Color.parse("#795548"), | 392 "Brown": WebInspector.Color.parse("#795548"), |
| 393 "Cyan": WebInspector.Color.parse("#00BCD4") | 393 "Cyan": WebInspector.Color.parse("#00BCD4") |
| 394 } | 394 }; |
| 395 | 395 |
| 396 /** | 396 /** |
| 397 * @param {!WebInspector.AnimationModel.Animation} animation | 397 * @param {!WebInspector.AnimationModel.Animation} animation |
| 398 * @return {string} | 398 * @return {string} |
| 399 */ | 399 */ |
| 400 WebInspector.AnimationUI.Color = function(animation) | 400 WebInspector.AnimationUI.Color = function(animation) |
| 401 { | 401 { |
| 402 var names = Object.keys(WebInspector.AnimationUI.Colors); | 402 var names = Object.keys(WebInspector.AnimationUI.Colors); |
| 403 var color = WebInspector.AnimationUI.Colors[names[String.hashCode(animation.
name() || animation.id()) % names.length]]; | 403 var color = WebInspector.AnimationUI.Colors[names[String.hashCode(animation.
name() || animation.id()) % names.length]]; |
| 404 return color.asString(WebInspector.Color.Format.RGB); | 404 return color.asString(WebInspector.Color.Format.RGB); |
| 405 } | 405 }; |
| OLD | NEW |