| 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 * @unrestricted | 5 * @unrestricted |
| 6 */ | 6 */ |
| 7 Animation.AnimationUI = class { | 7 Animation.AnimationUI = class { |
| 8 /** | 8 /** |
| 9 * @param {!Animation.AnimationModel.Animation} animation | 9 * @param {!Animation.AnimationModel.Animation} animation |
| 10 * @param {!Animation.AnimationTimeline} timeline | 10 * @param {!Animation.AnimationTimeline} timeline |
| (...skipping 185 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 196 var stepFunction = Animation.AnimationTimeline.StepTimingFunction.parse(ea
sing); | 196 var stepFunction = Animation.AnimationTimeline.StepTimingFunction.parse(ea
sing); |
| 197 group.removeChildren(); | 197 group.removeChildren(); |
| 198 /** @const */ var offsetMap = {'start': 0, 'middle': 0.5, 'end': 1}; | 198 /** @const */ var offsetMap = {'start': 0, 'middle': 0.5, 'end': 1}; |
| 199 /** @const */ var offsetWeight = offsetMap[stepFunction.stepAtPosition]; | 199 /** @const */ var offsetWeight = offsetMap[stepFunction.stepAtPosition]; |
| 200 for (var i = 0; i < stepFunction.steps; i++) | 200 for (var i = 0; i < stepFunction.steps; i++) |
| 201 createStepLine(group, (i + offsetWeight) * width / stepFunction.steps, t
his._color); | 201 createStepLine(group, (i + offsetWeight) * width / stepFunction.steps, t
his._color); |
| 202 } | 202 } |
| 203 } | 203 } |
| 204 | 204 |
| 205 redraw() { | 205 redraw() { |
| 206 var durationWithDelay = | |
| 207 this._delay() + this._duration() * this._animation.source().iterations()
+ this._animation.source().endDelay(); | |
| 208 var maxWidth = this._timeline.width() - Animation.AnimationUI.Options.Animat
ionMargin; | 206 var maxWidth = this._timeline.width() - Animation.AnimationUI.Options.Animat
ionMargin; |
| 209 | 207 |
| 210 this._svg.setAttribute('width', (maxWidth + 2 * Animation.AnimationUI.Option
s.AnimationMargin).toFixed(2)); | 208 this._svg.setAttribute('width', (maxWidth + 2 * Animation.AnimationUI.Option
s.AnimationMargin).toFixed(2)); |
| 211 this._activeIntervalGroup.style.transform = | 209 this._activeIntervalGroup.style.transform = |
| 212 'translateX(' + (this._delay() * this._timeline.pixelMsRatio()).toFixed(
2) + 'px)'; | 210 'translateX(' + (this._delay() * this._timeline.pixelMsRatio()).toFixed(
2) + 'px)'; |
| 213 | 211 |
| 214 this._nameElement.style.transform = 'translateX(' + | 212 this._nameElement.style.transform = 'translateX(' + |
| 215 (this._delay() * this._timeline.pixelMsRatio() + Animation.AnimationUI.O
ptions.AnimationMargin).toFixed(2) + | 213 (this._delay() * this._timeline.pixelMsRatio() + Animation.AnimationUI.O
ptions.AnimationMargin).toFixed(2) + |
| 216 'px)'; | 214 'px)'; |
| 217 this._nameElement.style.width = (this._duration() * this._timeline.pixelMsRa
tio()).toFixed(2) + 'px'; | 215 this._nameElement.style.width = (this._duration() * this._timeline.pixelMsRa
tio()).toFixed(2) + 'px'; |
| (...skipping 188 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 406 'Light Blue': Common.Color.parse('#03A9F4'), | 404 'Light Blue': Common.Color.parse('#03A9F4'), |
| 407 'Deep Orange': Common.Color.parse('#FF5722'), | 405 'Deep Orange': Common.Color.parse('#FF5722'), |
| 408 'Blue': Common.Color.parse('#5677FC'), | 406 'Blue': Common.Color.parse('#5677FC'), |
| 409 'Lime': Common.Color.parse('#CDDC39'), | 407 'Lime': Common.Color.parse('#CDDC39'), |
| 410 'Blue Grey': Common.Color.parse('#607D8B'), | 408 'Blue Grey': Common.Color.parse('#607D8B'), |
| 411 'Pink': Common.Color.parse('#E91E63'), | 409 'Pink': Common.Color.parse('#E91E63'), |
| 412 'Green': Common.Color.parse('#0F9D58'), | 410 'Green': Common.Color.parse('#0F9D58'), |
| 413 'Brown': Common.Color.parse('#795548'), | 411 'Brown': Common.Color.parse('#795548'), |
| 414 'Cyan': Common.Color.parse('#00BCD4') | 412 'Cyan': Common.Color.parse('#00BCD4') |
| 415 }; | 413 }; |
| OLD | NEW |