2011-06-22 Young Han Lee <joybro@company100.net>
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 22 Jun 2011 19:57:13 +0000 (19:57 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 22 Jun 2011 19:57:13 +0000 (19:57 +0000)
        Reviewed by Simon Fraser.

        animation-timing-function property with a list uses first item for all animations
        https://bugs.webkit.org/show_bug.cgi?id=60303

        When an element has multiple animations that have different timingFunctions,
        the progress of each animation should be calculated using its respective timingFunction.
        But at this point, the timingFunction of the first animation is only used for the
        calculation, regardless of how many animations the element has.

        The code for getting a timingFunction is changed by this patch
        so that the timingFunction of the correct animation searched by its name will be used.

        * animations/multiple-animations-timing-function-expected.txt: Added.
        * animations/multiple-animations-timing-function.html: Added.
2011-06-22  Young Han Lee  <joybro@company100.net>

        Reviewed by Simon Fraser.

        animation-timing-function property with a list uses first item for all animations
        https://bugs.webkit.org/show_bug.cgi?id=60303

        When an element has multiple animations that have different timingFunctions,
        the progress of each animation should be calculated using its respective timingFunction.
        But at this point, the timingFunction of the first animation is only used for the
        calculation, regardless of how many animations the element has.

        The code for getting a timingFunction is changed by this patch
        so that the timingFunction of the correct animation searched by its name will be used.

        Test: animations/multiple-animations-timing-function.html

        * page/animation/KeyframeAnimation.cpp:
        (WebCore::getAnimationFromStyleByName):
        (WebCore::KeyframeAnimation::fetchIntervalEndpointsForProperty):

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@89462 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/animations/multiple-animations-timing-function-expected.txt [new file with mode: 0644]
LayoutTests/animations/multiple-animations-timing-function.html [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/page/animation/KeyframeAnimation.cpp

index 59dd19d..cae2a59 100644 (file)
@@ -1,3 +1,21 @@
+2011-06-22  Young Han Lee  <joybro@company100.net>
+
+        Reviewed by Simon Fraser.
+
+        animation-timing-function property with a list uses first item for all animations
+        https://bugs.webkit.org/show_bug.cgi?id=60303
+
+        When an element has multiple animations that have different timingFunctions,
+        the progress of each animation should be calculated using its respective timingFunction.
+        But at this point, the timingFunction of the first animation is only used for the
+        calculation, regardless of how many animations the element has.
+
+        The code for getting a timingFunction is changed by this patch
+        so that the timingFunction of the correct animation searched by its name will be used.
+
+        * animations/multiple-animations-timing-function-expected.txt: Added.
+        * animations/multiple-animations-timing-function.html: Added.
+
 2011-06-22  Sheriff Bot  <webkit.review.bot@gmail.com>
 
         Unreviewed, rolling out r89407, r89409, r89410, and r89411.
diff --git a/LayoutTests/animations/multiple-animations-timing-function-expected.txt b/LayoutTests/animations/multiple-animations-timing-function-expected.txt
new file mode 100644 (file)
index 0000000..f9aaea3
--- /dev/null
@@ -0,0 +1,5 @@
+PASS - "left" property for "box" element at 0.5s saw something close to: 18
+PASS - "left" property for "box" element at 1.5s saw something close to: 124
+PASS - "top" property for "box" element at 0.5s saw something close to: 75
+PASS - "top" property for "box" element at 1.5s saw something close to: 181
+
diff --git a/LayoutTests/animations/multiple-animations-timing-function.html b/LayoutTests/animations/multiple-animations-timing-function.html
new file mode 100644 (file)
index 0000000..f157b16
--- /dev/null
@@ -0,0 +1,42 @@
+<html>
+<head>
+    <style>
+        #box {
+            position: relative;
+            height: 100px;
+            width: 100px;
+            margin: 20px;
+            background-color: red;
+            -webkit-animation:
+                horizontal 2s ease-in 1 alternate,
+                vertical 2s ease-out 1 alternate;
+        }
+
+        @-webkit-keyframes horizontal {
+            from { left: 0px;   }
+            to   { left: 200px; }
+        }
+
+        @-webkit-keyframes vertical {
+            from { top: 0px;   }
+            to   { top: 200px; }
+        }
+    </style>
+    <script src="resources/animation-test-helpers.js" type="text/javascript" charset="utf-8"></script>
+    <script type="text/javascript" charset="utf-8">
+        const expectedValues = [
+          // [animation-name, time, element-id, property, expected-value, tolerance]
+          ["horizontal", 0.5, "box", "left", 18, 10],
+          ["horizontal", 1.5, "box", "left", 124, 10],
+          ["vertical", 0.5, "box", "top", 75, 10],
+          ["vertical", 1.5, "box", "top", 181, 10],
+        ];
+
+        runAnimationTest(expectedValues);
+    </script>
+</head>
+<body>
+    <div id="box"></div>
+    <div id="result"></div>
+</body>
+</html>
index 4d6c789..6e1cf23 100644 (file)
@@ -1,3 +1,24 @@
+2011-06-22  Young Han Lee  <joybro@company100.net>
+
+        Reviewed by Simon Fraser.
+
+        animation-timing-function property with a list uses first item for all animations
+        https://bugs.webkit.org/show_bug.cgi?id=60303
+
+        When an element has multiple animations that have different timingFunctions,
+        the progress of each animation should be calculated using its respective timingFunction.
+        But at this point, the timingFunction of the first animation is only used for the
+        calculation, regardless of how many animations the element has.
+
+        The code for getting a timingFunction is changed by this patch
+        so that the timingFunction of the correct animation searched by its name will be used.
+
+        Test: animations/multiple-animations-timing-function.html
+
+        * page/animation/KeyframeAnimation.cpp:
+        (WebCore::getAnimationFromStyleByName):
+        (WebCore::KeyframeAnimation::fetchIntervalEndpointsForProperty):
+
 2011-06-22  Sheriff Bot  <webkit.review.bot@gmail.com>
 
         Unreviewed, rolling out r89407, r89409, r89410, and r89411.
index 5f19fe4..00b3047 100644 (file)
@@ -65,6 +65,19 @@ KeyframeAnimation::~KeyframeAnimation()
         endAnimation();
 }
 
+static const Animation* getAnimationFromStyleByName(const RenderStyle* style, const AtomicString& name)
+{
+    if (!style->animations())
+        return 0;
+
+    for (size_t i = 0; i < style->animations()->size(); i++) {
+        if (name == style->animations()->animation(i)->name())
+            return style->animations()->animation(i);
+    }
+
+    return 0;
+}
+
 void KeyframeAnimation::fetchIntervalEndpointsForProperty(int property, const RenderStyle*& fromStyle, const RenderStyle*& toStyle, double& prog) const
 {
     // Find the first key
@@ -136,10 +149,8 @@ void KeyframeAnimation::fetchIntervalEndpointsForProperty(int property, const Re
     scale = 1.0 / (nextKeyframe.key() - prevKeyframe.key());
 
     const TimingFunction* timingFunction = 0;
-    if (fromStyle->animations() && fromStyle->animations()->size() > 0) {
-        // We get the timing function from the first animation, because we've synthesized a RenderStyle for each keyframe.
-        timingFunction = fromStyle->animations()->animation(0)->timingFunction().get();
-    }
+    if (const Animation* matchedAnimation = getAnimationFromStyleByName(fromStyle, name()))
+        timingFunction = matchedAnimation->timingFunction().get();
 
     prog = progress(scale, offset, timingFunction);
 }