Alternative syntax for element.animate list of keyframes

third_party/WebKit/Source/core/animation/EffectInput.cpp

 /*
  * Copyright (C) 2013 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions are
  * met:
  *
  *     * Redistributions of source code must retain the above copyright
  * notice, this list of conditions and the following disclaimer.
  *     * Redistributions in binary form must reproduce the above
@@ skipping 29 matching lines @@
 #include "core/dom/Document.h"
 #include "core/dom/Element.h"
 #include "core/dom/ExceptionCode.h"
 #include "core/dom/NodeComputedStyle.h"
 #include "wtf/ASCIICType.h"
 #include "wtf/HashSet.h"
 #include "wtf/NonCopyingSort.h"
 
 namespace blink {
 
-EffectModel* EffectInput::convert(Element* element, const Vector<Dictionary>& keyframeDictionaryVector, ExceptionState& exceptionState)
+namespace {
+
+bool compareKeyframes(const RefPtr<StringKeyframe>& a, const RefPtr<StringKeyframe>& b)
+{
+    return a->offset() < b->offset();
+}
+
+} // namespace
+
+EffectModel* EffectInput::convert(Element* element, const EffectModelOrDictionarySequenceOrDictionary& effectInput, ExceptionState& exceptionState)
+{
+    if (effectInput.isEffectModel())
+        return effectInput.getAsEffectModel();
+    if (effectInput.isDictionarySequence())
+        return convert(element, effectInput.getAsDictionarySequence(), exceptionState, true);
+    if (effectInput.isDictionary()) {
+        return convert(element, effectInput.getAsDictionary(), exceptionState);
+    }
+    return nullptr;
+}
+
+bool EffectInput::setKeyframeValue(Element* element, StringKeyframe& keyframe, const String& property, const String& value)
+{
+    StyleSheetContents* styleSheetContents = element->document().elementSheet().contents();
+    CSSPropertyID cssProperty = AnimationInputHelpers::keyframeAttributeToCSSProperty(property, element->document());
+    if (cssProperty != CSSPropertyInvalid) {
+        keyframe.setCSSPropertyValue(cssProperty, value, element, styleSheetContents);
+        return CompositorAnimations::isCompositableProperty(cssProperty);
+    }
+    cssProperty = AnimationInputHelpers::keyframeAttributeToPresentationAttribute(property, *element);
+    if (cssProperty != CSSPropertyInvalid) {
+        keyframe.setPresentationAttributeValue(cssProperty, value, element, styleSheetContents);
+        return false;
+    }
+    const QualifiedName* svgAttribute = AnimationInputHelpers::keyframeAttributeToSVGAttribute(property, *element);
+    if (svgAttribute)
+        keyframe.setSVGAttributeValue(*svgAttribute, value);
+    return false;
+}
+
+EffectModel* EffectInput::createEffectModelFromKeyframes(Element* element, const StringKeyframeVector& keyframes, bool encounteredCompositableProperty, ExceptionState& exceptionState)
+{
+    // TODO(alancutter): Remove this once composited animations no longer depend on AnimatableValues.
+    if (encounteredCompositableProperty && element->inActiveDocument())
+        element->document().updateLayoutTreeForNodeIfNeeded(element);
+
+    StringKeyframeEffectModel* keyframeEffectModel = StringKeyframeEffectModel::create(keyframes);
+    if (!RuntimeEnabledFeatures::cssAdditiveAnimationsEnabled()) {
+        for (const auto& keyframeGroup : keyframeEffectModel->getPropertySpecificKeyframeGroups()) {
+            PropertyHandle property = keyframeGroup.key;
+            if (!property.isCSSProperty())
+                continue;
+
+            for (const auto& keyframe : keyframeGroup.value->keyframes()) {
+                if (keyframe->isNeutral()) {
+                    exceptionState.throwDOMException(NotSupportedError, "Partial keyframes are not supported.");
+                    return nullptr;
+                }
+                if (keyframe->composite() != EffectModel::CompositeReplace) {
+                    exceptionState.throwDOMException(NotSupportedError, "Additive animations are not supported.");
+                    return nullptr;
+                }
+            }
+        }
+    }
+    keyframeEffectModel->forceConversionsToAnimatableValues(*element, element->computedStyle());
+
+    return keyframeEffectModel;
+}
+
+EffectModel* EffectInput::convert(Element* element, const Vector<Dictionary>& keyframeDictionaryVector, ExceptionState& exceptionState, bool keyframesSpecifiedAsList)
 {
     if (!element)
         return nullptr;
 
-    StyleSheetContents* styleSheetContents = element->document().elementSheet().contents();
     StringKeyframeVector keyframes;
     double lastOffset = 0;
     bool encounteredCompositableProperty = false;
 
     for (const auto& keyframeDictionary : keyframeDictionaryVector) {
         RefPtr<StringKeyframe> keyframe = StringKeyframe::create();
 
         ScriptValue scriptValue;
         bool frameHasOffset = DictionaryHelper::get(keyframeDictionary, "offset", scriptValue) && !scriptValue.isNull();
 
         if (frameHasOffset) {
             double offset;
             DictionaryHelper::get(keyframeDictionary, "offset", offset);
 
             // Keyframes with offsets outside the range [0.0, 1.0] are an error.
             if (std::isnan(offset)) {
                 exceptionState.throwDOMException(InvalidModificationError, "Non numeric offset provided");
+                return nullptr;
             }
 
             if (offset < 0 || offset > 1) {
                 exceptionState.throwDOMException(InvalidModificationError, "Offsets provided outside the range [0, 1]");
                 return nullptr;
             }
 
             if (offset < lastOffset) {
                 exceptionState.throwDOMException(InvalidModificationError, "Keyframes with specified offsets are not sorted");
                 return nullptr;
             }
 
             lastOffset = offset;
 
             keyframe->setOffset(offset);
         }
-        keyframes.append(keyframe);
 
         String compositeString;
         DictionaryHelper::get(keyframeDictionary, "composite", compositeString);
         if (compositeString == "add")
             keyframe->setComposite(EffectModel::CompositeAdd);
         // TODO(alancutter): Support "accumulate" keyframe composition.
 
         String timingFunctionString;
         if (DictionaryHelper::get(keyframeDictionary, "easing", timingFunctionString)) {
             if (RefPtr<TimingFunction> timingFunction = AnimationInputHelpers::parseTimingFunction(timingFunctionString))
                 keyframe->setEasing(timingFunction);
         }
 
         Vector<String> keyframeProperties;
         keyframeDictionary.getPropertyNames(keyframeProperties);
         for (const auto& property : keyframeProperties) {
-            String value;
-            DictionaryHelper::get(keyframeDictionary, property, value);
-
-            CSSPropertyID cssProperty = AnimationInputHelpers::keyframeAttributeToCSSProperty(property, element->document());
-            if (cssProperty != CSSPropertyInvalid) {
-                if (!encounteredCompositableProperty && CompositorAnimations::isCompositableProperty(cssProperty))
-                    encounteredCompositableProperty = true;
-
-                keyframe->setCSSPropertyValue(cssProperty, value, element, styleSheetContents);
-                continue;
-            }
-
             if (property == "offset"
                 || property == "composite"
                 || property == "easing") {
                 continue;
             }
 
-            cssProperty = AnimationInputHelpers::keyframeAttributeToPresentationAttribute(property, *element);
-            if (cssProperty != CSSPropertyInvalid) {
-                keyframe->setPresentationAttributeValue(cssProperty, value, element, styleSheetContents);
-                continue;
+            Vector<String> values;
+            if (DictionaryHelper::get(keyframeDictionary, property, values)) {
+                String exceptionMessage = keyframesSpecifiedAsList ?
+                    "Lists of values not permitted in array-form list of keyframes" :
+                    "Offsets and keyframe-specific composite operations not permitted in object-form list of keyframes";
+                exceptionState.throwDOMException(InvalidModificationError, exceptionMessage);
+                return nullptr;
             }
 
-            const QualifiedName* svgAttribute = AnimationInputHelpers::keyframeAttributeToSVGAttribute(property, *element);
-            if (svgAttribute)
-                keyframe->setSVGAttributeValue(*svgAttribute, value);
+            String value;
+            DictionaryHelper::get(keyframeDictionary, property, value);
+
+            encounteredCompositableProperty |= setKeyframeValue(element, *keyframe.get(), property, value);
+        }
+        keyframes.append(keyframe);
+    }
+
+    return createEffectModelFromKeyframes(element, keyframes, encounteredCompositableProperty, exceptionState);
+}
+
+EffectModel* EffectInput::convert(Element* element, const Dictionary& keyframeDictionary, ExceptionState& exceptionState)
+{
+    if (!element)
+        return nullptr;
+
+    ScriptValue scriptValue;
+    String compositeString;
+    bool frameHasOffset = DictionaryHelper::get(keyframeDictionary, "offset", scriptValue) && !scriptValue.isNull();
+    bool frameHasComposite = DictionaryHelper::get(keyframeDictionary, "composite", compositeString);

[alancutter (OOO until 2018), 2016/02/25 06:52:27]

I think the spec wants us to apply the composite value to all keyframes just
like easing despite it missing from the dictionary definition. The later parts
of the spec treat it in the same way as easing. Will need to clarify with spec
editor on this.

[suzyh_UTC10 (ex-contributor), 2016/02/26 04:35:31]

Changed as discussed offline.

+    if (frameHasOffset || frameHasComposite) {
+        Vector<Dictionary> keyframeDictionaryVector;
+        keyframeDictionaryVector.append(keyframeDictionary);
+        return convert(element, keyframeDictionaryVector, exceptionState, false);
+    }

[alancutter (OOO until 2018), 2016/02/25 06:52:27]

I don't think this behaviour matches spec, I interpret the spec to ignore the
offset in single keyframes. I suspect this is a change in behaviour and would
result in some test cases failing though. Will need to clarify with spec editor
on this.

[suzyh_UTC10 (ex-contributor), 2016/02/26 04:35:31]

Changed as discussed offline.

+
+    StringKeyframeVector keyframes;
+    bool encounteredCompositableProperty = false;
+
+    String timingFunctionString;
+    RefPtr<TimingFunction> timingFunction = nullptr;
+    if (DictionaryHelper::get(keyframeDictionary, "easing", timingFunctionString))
+        timingFunction = AnimationInputHelpers::parseTimingFunction(timingFunctionString);
+
+    Vector<String> keyframeProperties;
+    keyframeDictionary.getPropertyNames(keyframeProperties);
+    for (const auto& property : keyframeProperties) {
+        if (property == "offset"
+            || property == "composite"
+            || property == "easing") {
+            continue;
+        }
+
+        Vector<String> values;
+        bool isList = DictionaryHelper::get(keyframeDictionary, property, values);
+        if (!isList) {
+            String value;
+            DictionaryHelper::get(keyframeDictionary, property, value);
+            values.append(value);
+        }
+
+        size_t numKeyframes = values.size();
+
+        Vector<double> offsets;
+        if (numKeyframes == 1) {
+            offsets.append(1.0);
+        } else {
+            for (size_t i = 0; i < numKeyframes; ++i) {
+                offsets.append(i / (numKeyframes - 1.0));
+            }
+        }
+
+        for (size_t i = 0; i < numKeyframes; ++i) {
+            RefPtr<StringKeyframe> keyframe = StringKeyframe::create();
+            keyframe->setOffset(offsets[i]);
+
+            const String& value = values[i];
+
+            if (timingFunction)
+                keyframe->setEasing(timingFunction);
+
+            encounteredCompositableProperty |= setKeyframeValue(element, *keyframe.get(), property, value);
+            keyframes.append(keyframe);
         }
     }
 
-    // TODO(alancutter): Remove this once composited animations no longer depend on AnimatableValues.
-    if (encounteredCompositableProperty && element->inActiveDocument())
-        element->document().updateLayoutTreeForNode(element);
+    std::sort(keyframes.begin(), keyframes.end(), compareKeyframes);
 
-    StringKeyframeEffectModel* keyframeEffectModel = StringKeyframeEffectModel::create(keyframes);
-    if (!RuntimeEnabledFeatures::cssAdditiveAnimationsEnabled()) {
-        for (const auto& keyframeGroup : keyframeEffectModel->getPropertySpecificKeyframeGroups()) {
-            PropertyHandle property = keyframeGroup.key;
-            if (!property.isCSSProperty())
-                continue;
-
-            for (const auto& keyframe : keyframeGroup.value->keyframes()) {
-                if (keyframe->isNeutral()) {
-                    exceptionState.throwDOMException(NotSupportedError, "Partial keyframes are not supported.");
-                    return nullptr;
-                }
-                if (keyframe->composite() != EffectModel::CompositeReplace) {
-                    exceptionState.throwDOMException(NotSupportedError, "Additive animations are not supported.");
-                    return nullptr;
-                }
-            }
-        }
-    }
-    keyframeEffectModel->forceConversionsToAnimatableValues(*element, element->computedStyle());
-
-    return keyframeEffectModel;
-}
-
-EffectModel* EffectInput::convert(Element* element, const EffectModelOrDictionarySequenceOrDictionary& effectInput, ExceptionState& exceptionState)
-{
-    if (effectInput.isEffectModel())
-        return effectInput.getAsEffectModel();
-    if (effectInput.isDictionarySequence())
-        return convert(element, effectInput.getAsDictionarySequence(), exceptionState);
-    if (effectInput.isDictionary()) {
-        Vector<Dictionary> keyframes;
-        keyframes.append(effectInput.getAsDictionary());
-        return convert(element, keyframes, exceptionState);
-    }
-    return nullptr;
+    return createEffectModelFromKeyframes(element, keyframes, encounteredCompositableProperty, exceptionState);
 }
 
 } // namespace blink