2008-10-09 Chris Marrin <cmarrin@apple.com>
authorcmarrin@apple.com <cmarrin@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 9 Oct 2008 23:04:07 +0000 (23:04 +0000)
committercmarrin@apple.com <cmarrin@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 9 Oct 2008 23:04:07 +0000 (23:04 +0000)
        Reviewed by Dan Bernstein.

        Fixed > 180 degree rotation bug
        Ensure that validateTransformFunctionList() is called after updating keyframe styles

        https://bugs.webkit.org/show_bug.cgi?id=21420

        Test: animations/big-rotation.html

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

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

LayoutTests/ChangeLog
LayoutTests/animations/big-rotation-expected.txt [new file with mode: 0644]
LayoutTests/animations/big-rotation.html [new file with mode: 0644]
WebCore/ChangeLog
WebCore/page/animation/KeyframeAnimation.cpp

index 58303be..b370a4e 100644 (file)
@@ -1,3 +1,13 @@
+2008-10-09  Chris Marrin  <cmarrin@apple.com>
+
+        Reviewed by Dan Bernstein.
+
+        Testcase for > 180 degree rotation bug fix
+        https://bugs.webkit.org/show_bug.cgi?id=21420
+
+        * animations/big-rotation-expected.txt: Added.
+        * animations/big-rotation.html: Added.
+
 2008-10-09  Darin Adler  <darin@apple.com>
 
         - checked in a missing expected result
diff --git a/LayoutTests/animations/big-rotation-expected.txt b/LayoutTests/animations/big-rotation-expected.txt
new file mode 100644 (file)
index 0000000..e0c7196
--- /dev/null
@@ -0,0 +1,3 @@
+This test shows rotation of > 180 degrees. The box should make one and a half rotations.
+
+PASS
diff --git a/LayoutTests/animations/big-rotation.html b/LayoutTests/animations/big-rotation.html
new file mode 100644 (file)
index 0000000..6a9a5e7
--- /dev/null
@@ -0,0 +1,83 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+   "http://www.w3.org/TR/html4/loose.dtd">
+
+<html lang="en">
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+  <title>Testing Rotations > 180 degrees</title>
+  <style type="text/css" media="screen">
+    #box {
+      //position: absolute;
+      height: 100px;
+      width: 100px;
+      background-color: blue;
+      -webkit-animation-duration: 1.03s;
+      -webkit-animation-timing-function: linear;
+      -webkit-animation-name: "rotate";
+    }
+    @-webkit-keyframes "rotate" {
+        from { -webkit-transform: rotate(0); }
+        to   { -webkit-transform: rotate(558deg); }
+    }
+  </style>
+  <script type="text/javascript" charset="utf-8">
+    if (window.layoutTestController) {
+      layoutTestController.dumpAsText();
+      layoutTestController.waitUntilDone();
+    }
+    
+    result = "PASS";
+    const defaultTolerance = 0.2;
+    const expected =  [ [ -1,0,0,-1 ],
+                        [ 1,0,0,1 ],
+                        [ -1,0,0,-1 ] ];
+    
+    function isEqual(actual, desired, tolerance)
+    {
+        if (tolerance == undefined || tolerance == 0)
+            tolerance = defaultTolerance;
+        var diff = Math.abs(actual - desired);
+        return diff < tolerance;
+    }
+    
+    function snapshot(which)
+    {
+        if (result != "PASS")
+            return;
+            
+        var s = window.getComputedStyle(document.getElementById('box')).webkitTransform;
+        var a = s.split("(");
+        var a = a[1].split(",");
+        for (i = 0; i < 4; ++i)
+            if (!isEqual(a[i], expected[which][i])) {
+                result = "FAIL(property'"+i+"' was:"+a[i]+", expected:"+expected[which][i]+")";
+                return;
+            }
+    }
+
+    function start()
+    {
+        setTimeout("snapshot(0)", 333);
+        setTimeout("snapshot(1)", 667);
+        setTimeout("snapshot(2)", 1000);
+        
+        window.setTimeout(function() {
+            document.getElementById('result').innerHTML = result;
+            if (window.layoutTestController)
+                layoutTestController.notifyDone();
+        }, 1100);
+    }
+    
+    document.addEventListener('webkitAnimationStart', start, false);
+    
+  </script>
+</head>
+<body>
+<p>
+This test shows rotation of > 180 degrees. The box should make one and a half rotations.
+<div id="box">
+</div>
+<div id="result">
+</div>
+</body>
+</html>
index 47a29c0..08b6984 100644 (file)
@@ -1,3 +1,17 @@
+2008-10-09  Chris Marrin  <cmarrin@apple.com>
+
+        Reviewed by Dan Bernstein.
+
+        Fixed > 180 degree rotation bug
+        Ensure that validateTransformFunctionList() is called after updating keyframe styles
+
+        https://bugs.webkit.org/show_bug.cgi?id=21420
+
+        Test: animations/big-rotation.html
+
+        * page/animation/KeyframeAnimation.cpp:
+        (WebCore::KeyframeAnimation::KeyframeAnimation):
+
 2008-10-09  Brady Eidson  <beidson@apple.com>
 
         Reviewed by Anders
index 393f0cb..5b366c6 100644 (file)
@@ -44,9 +44,6 @@ KeyframeAnimation::KeyframeAnimation(const Animation* animation, RenderObject* r
     , m_index(index)
     , m_unanimatedStyle(0)
 {
-    // Set the transform animation list
-    validateTransformFunctionList();
-    
     if (unanimatedStyle) {
         const_cast<RenderStyle*>(unanimatedStyle)->ref();
         m_unanimatedStyle = unanimatedStyle;
@@ -55,6 +52,9 @@ KeyframeAnimation::KeyframeAnimation(const Animation* animation, RenderObject* r
     // Get the keyframe RenderStyles
     if (m_object && m_object->element() && m_object->element()->isElementNode())
         m_object->document()->styleSelector()->keyframeStylesForAnimation(static_cast<Element*>(m_object->element()), unanimatedStyle, m_keyframes);
+
+    // Update the m_transformFunctionListValid flag based on whether the function lists in the keyframes match.
+    validateTransformFunctionList();
 }
 
 KeyframeAnimation::~KeyframeAnimation()