OLD | NEW |
1 // Copyright (c) 2011, the Dart project authors. Please see the AUTHORS file | 1 // Copyright (c) 2011, the Dart project authors. Please see the AUTHORS file |
2 // for details. All rights reserved. Use of this source code is governed by a | 2 // for details. All rights reserved. Use of this source code is governed by a |
3 // BSD-style license that can be found in the LICENSE file. | 3 // BSD-style license that can be found in the LICENSE file. |
4 | 4 |
5 /** | 5 /** |
6 * Common effects related helpers. | 6 * Common effects related helpers. |
7 */ | 7 */ |
8 class FxUtil { | 8 class FxUtil { |
9 /** On transition end event. */ | 9 /** On transition end event. */ |
10 static const TRANSITION_END_EVENT = 'webkitTransitionEnd'; | 10 static const TRANSITION_END_EVENT = 'webkitTransitionEnd'; |
(...skipping 26 matching lines...) Expand all Loading... |
37 /** Apply a -webkit-transform using translate3d to an HTML element. */ | 37 /** Apply a -webkit-transform using translate3d to an HTML element. */ |
38 static void setWebkitTransform( | 38 static void setWebkitTransform( |
39 Element el, num x, num y, [num z = 0, | 39 Element el, num x, num y, [num z = 0, |
40 num rotation = null, num scale = null, | 40 num rotation = null, num scale = null, |
41 num originX = null, num originY = null]) { | 41 num originX = null, num originY = null]) { |
42 final style = el.style; | 42 final style = el.style; |
43 // TODO(jacobr): create a helper class that simplifies building | 43 // TODO(jacobr): create a helper class that simplifies building |
44 // transformation matricies that will be set as CSS styles. We should | 44 // transformation matricies that will be set as CSS styles. We should |
45 // consider using CSSMatrix although that may be overkill. | 45 // consider using CSSMatrix although that may be overkill. |
46 String transform = '${TRANSLATE_3D}(${x}px,${y}px,${z}px)'; | 46 String transform = '${TRANSLATE_3D}(${x}px,${y}px,${z}px)'; |
47 if (rotation !== null) { | 47 if (rotation != null) { |
48 transform = transform.concat(' ${ROTATE}(${rotation}deg)'); | 48 transform = transform.concat(' ${ROTATE}(${rotation}deg)'); |
49 } | 49 } |
50 if (scale !== null) { | 50 if (scale != null) { |
51 transform = transform.concat(' ${SCALE}(${scale})'); | 51 transform = transform.concat(' ${SCALE}(${scale})'); |
52 } | 52 } |
53 style.transform = transform; | 53 style.transform = transform; |
54 if (originX !== null || originY !== null) { | 54 if (originX != null || originY != null) { |
55 assert(originX !== null && originY !== null); | 55 assert(originX != null && originY != null); |
56 style.transformOrigin = '${originX}px ${originY}px'; | 56 style.transformOrigin = '${originX}px ${originY}px'; |
57 } | 57 } |
58 } | 58 } |
59 | 59 |
60 /** | 60 /** |
61 * Determine the position of an [element] relative to a [target] element. | 61 * Determine the position of an [element] relative to a [target] element. |
62 * Moving the [element] to be a child of [target] and setting the | 62 * Moving the [element] to be a child of [target] and setting the |
63 * [element]'s top and left values to the returned coordinate should result | 63 * [element]'s top and left values to the returned coordinate should result |
64 * in the [element]'s position remaining unchanged while its parent is | 64 * in the [element]'s position remaining unchanged while its parent is |
65 * changed. | 65 * changed. |
(...skipping 28 matching lines...) Expand all Loading... |
94 style.left = '${x}px'; | 94 style.left = '${x}px'; |
95 style.top = '${y}px'; | 95 style.top = '${y}px'; |
96 } | 96 } |
97 } | 97 } |
98 | 98 |
99 class TransitionTimingFunction { | 99 class TransitionTimingFunction { |
100 static const EASE_IN = 'ease-in'; | 100 static const EASE_IN = 'ease-in'; |
101 static const EASE_OUT = 'ease-out'; | 101 static const EASE_OUT = 'ease-out'; |
102 static const EASE_IN_OUT = 'ease-in-out'; | 102 static const EASE_IN_OUT = 'ease-in-out'; |
103 } | 103 } |
OLD | NEW |