Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(281)

Side by Side Diff: client/touch/FxUtil.dart

Issue 9382027: Move client/{base, observable, layout, touch, util, view} to samples/ui_lib . (Closed) Base URL: http://dart.googlecode.com/svn/branches/bleeding_edge/dart/
Patch Set: '' Created 8 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
« no previous file with comments | « client/touch/EventUtil.dart ('k') | client/touch/Geometry.dart » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
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
3 // BSD-style license that can be found in the LICENSE file.
4
5 /**
6 * Common effects related helpers.
7 */
8 class FxUtil {
9 /** On transition end event. */
10 static final TRANSITION_END_EVENT = 'webkitTransitionEnd';
11
12 /** The translate3d transform function. */
13 static final TRANSLATE_3D = 'translate3d';
14
15 /** The rotate transform function. */
16 static final ROTATE = 'rotate';
17
18 /** The scale transform function. */
19 static final SCALE = 'scale';
20
21 /** Stops and clears the transition on an element. */
22 static void clearWebkitTransition(Element el) {
23 el.style.transition = '';
24 }
25
26 static void setPosition(Element el, Coordinate point) {
27 num x = point.x;
28 num y = point.y;
29 el.style.transform = '${TRANSLATE_3D}(${x}px,${y}px,0px)';
30 }
31
32 /** Apply a transform using translate3d to an HTML element. */
33 static void setTranslate(Element el, num x, num y, num z) {
34 el.style.transform = '${TRANSLATE_3D}(${x}px,${y}px,${z}px)';
35 }
36
37 /** Apply a -webkit-transform using translate3d to an HTML element. */
38 static void setWebkitTransform(
39 Element el, num x, num y, [num z = 0,
40 num rotation = null, num scale = null,
41 num originX = null, num originY = null]) {
42 final style = el.style;
43 // TODO(jacobr): create a helper class that simplifies building
44 // transformation matricies that will be set as CSS styles. We should
45 // consider using CSSMatrix although that may be overkill.
46 String transform = '${TRANSLATE_3D}(${x}px,${y}px,${z}px)';
47 if (rotation !== null) {
48 transform = transform.concat(' ${ROTATE}(${rotation}deg)');
49 }
50 if (scale !== null) {
51 transform = transform.concat(' ${SCALE}(${scale})');
52 }
53 style.transform = transform;
54 if (originX !== null || originY !== null) {
55 assert(originX !== null && originY !== null);
56 style.transformOrigin = '${originX}px ${originY}px';
57 }
58 }
59
60 /**
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
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
65 * changed.
66 */
67 static Coordinate computeRelativePosition(Element element, Element target) {
68 final testPoint = new Point(0, 0);
69 final pagePoint =
70 window.webkitConvertPointFromNodeToPage(element, testPoint);
71 final pointRelativeToTarget =
72 window.webkitConvertPointFromPageToNode(target, pagePoint);
73 return new Coordinate(pointRelativeToTarget.x, pointRelativeToTarget.y);
74 }
75
76 /** Clear a -webkit-transform from an element. */
77 static void clearWebkitTransform(Element el) {
78 el.style.transform = '';
79 }
80
81 /**
82 * Checks whether an element has a translate3d webkit transform applied.
83 */
84 static bool hasWebkitTransform(Element el) {
85 return el.style.transform.indexOf(TRANSLATE_3D, 0) != -1;
86 }
87
88 /**
89 * Translates [el], an HTML element that has a relative CSS
90 * position, by setting its left and top CSS styles.
91 */
92 static void setLeftAndTop(Element el, num x, num y) {
93 final style = el.style;
94 style.left = '${x}px';
95 style.top = '${y}px';
96 }
97 }
98
99 class TransitionTimingFunction {
100 static final EASE_IN = 'ease-in';
101 static final EASE_OUT = 'ease-out';
102 static final EASE_IN_OUT = 'ease-in-out';
103 }
OLDNEW
« no previous file with comments | « client/touch/EventUtil.dart ('k') | client/touch/Geometry.dart » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698