Handle direction control in compositor Animations

ManualTests/animation/compositor-animation-direction.html

Index: ManualTests/animation/compositor-animation-direction.html
diff --git a/ManualTests/animation/compositor-animation-delay.html b/ManualTests/animation/compositor-animation-direction.html
similarity index 71%
copy from ManualTests/animation/compositor-animation-delay.html
copy to ManualTests/animation/compositor-animation-direction.html
index e502c262fca46dc9e8f4d53679466fa48bd32d0c..096e9d8c0d54b6b5aad2302c1f29d23b04f51e82 100644
--- a/ManualTests/animation/compositor-animation-delay.html
+++ b/ManualTests/animation/compositor-animation-direction.html
@@ -6,26 +6,26 @@ div {
     width: 100px;
     background: blue;
     -webkit-transform: translateZ(0);
-    -webkit-animation-direction: alternate;
     -webkit-animation-duration: 2s;
     -webkit-animation-timing-function: linear;
-    -webkit-animation-iteration-count: 6;
+    -webkit-animation-fill-mode: both;
+    -webkit-animation-iteration-count: 2;
 }
 
 .test0 {
-    -webkit-animation-delay: -30s;
+    -webkit-animation-direction: normal;
 }
 
 .test1 {
-    -webkit-animation-delay: -3s;
+     -webkit-animation-direction: reverse;
 }
 
 .test2 {
-    -webkit-animation-delay: 0s;
+     -webkit-animation-direction: alternate;
 }
 
 .test3 {
-    -webkit-animation-delay: 3s;
+     -webkit-animation-direction: reverse;
 }
 
 .anim-left {
@@ -67,24 +67,25 @@ offset between them).
 </p>
 <hr>
 
-Start delay -30s (starts 30 seconds into animation by which the animation has finished, hence no animation)
+Direction normal
 <br>
 <div class='test0 anim-left'></div>
 <div class='test0 anim-transform'></div>
 
-Start delay -3s (starts 3 seconds into the animation, should finish first.)
+Direction reverse
 <br>
 <div class='test1 anim-left'></div>
 <div class='test1 anim-transform'></div>
 
-Start delay 0s (no start delay, should finish second.)
+Direction alternate
 <br>
 <div class='test2 anim-left'></div>
 <div class='test2 anim-transform'></div>
 
-Start delay 3s (starts 3 seconds after page load, should finish last.)
+Direction alternate-reverse
 <br>
 <div class='test3 anim-left'></div>
 <div class='test3 anim-transform'></div>
+
 </body>
 </html>