Permalink
Browse files

Merge pull request #2447 from cacaodev/CPAnimationContext-fixes

Fixed: The animation was reverting back to its initial position.
Fixed: custom layout and custom drawing was not animated in Chrome and Firefox.
  • Loading branch information...
2 parents 42e12fa + 17da8b0 commit 4b55a691503273ee9bcb4cf01025110a8e14a6a0 @cacaodev cacaodev committed on GitHub Oct 17, 2016
Showing with 2,565 additions and 71 deletions.
  1. +16 −19 AppKit/CoreAnimation/CPAnimationContext.j
  2. +12 −34 AppKit/CoreAnimation/CPViewAnimator.j
  3. +14 −18 AppKit/CoreAnimation/CSSAnimation.j
  4. +228 −0 Tests/CucumberTests/CPAnimationContextTest/AppController.j
  5. +94 −0 Tests/CucumberTests/CPAnimationContextTest/CPResponder+CuCapp.j
  6. +591 −0 Tests/CucumberTests/CPAnimationContextTest/CuCapp+Record.j
  7. +14 −0 Tests/CucumberTests/CPAnimationContextTest/Info.plist
  8. +194 −0 Tests/CucumberTests/CPAnimationContextTest/Jakefile
  9. +1 −0 Tests/CucumberTests/CPAnimationContextTest/Resources/MainMenu.cib
  10. +577 −0 Tests/CucumberTests/CPAnimationContextTest/Resources/MainMenu.xib
  11. +177 −0 Tests/CucumberTests/CPAnimationContextTest/features/step_definitions/steps.rb
  12. +30 −0 Tests/CucumberTests/CPAnimationContextTest/features/support/Cucumber+Extensions.j
  13. +62 −0 Tests/CucumberTests/CPAnimationContextTest/features/support/cappuccino_mappings.rb
  14. +20 −0 Tests/CucumberTests/CPAnimationContextTest/features/support/encumber_category.rb
  15. +20 −0 Tests/CucumberTests/CPAnimationContextTest/features/support/env.rb
  16. +7 −0 Tests/CucumberTests/CPAnimationContextTest/features/support/hooks.rb
  17. +97 −0 Tests/CucumberTests/CPAnimationContextTest/features/support/steps_helpers.rb
  18. +23 −0 Tests/CucumberTests/CPAnimationContextTest/features/test_application.feature
  19. +204 −0 Tests/CucumberTests/CPAnimationContextTest/index-debug.html
  20. +166 −0 Tests/CucumberTests/CPAnimationContextTest/index.html
  21. +18 −0 Tests/CucumberTests/CPAnimationContextTest/main.j
@@ -163,9 +163,13 @@ CPLog.debug(_cmd + "context stack =" + _CPAnimationContextStack);
{
if (needsFrameTimer)
[self stopFrameUpdaterWithIdentifier:objectId];
- else if (animationCompletion)
+
+ if (animationCompletion)
animationCompletion();
+ if (needsFrameTimer || animationCompletion)
+ [[CPRunLoop currentRunLoop] performSelectors];
+
if (_completionHandlerAgent)
_completionHandlerAgent.decrement();
};
@@ -289,7 +293,7 @@ CPLog.debug(_cmd + "context stack =" + _CPAnimationContextStack);
cssAnimations.push(cssAnimation);
}
- var css_mapping = [[aTargetView class] cssPropertiesForKeyPath:keyPath];
+ var css_mapping = [[aTargetView class] _cssPropertiesForKeyPath:keyPath];
[css_mapping enumerateObjectsUsingBlock:function(aDict, anIndex, stop)
{
@@ -299,9 +303,6 @@ CPLog.debug(_cmd + "context stack =" + _CPAnimationContextStack);
cssAnimation.addPropertyAnimation(property, getter, duration, anAction.keytimes, anAction.values, timingFunctions, completionFunction);
}];
-
- if (needsFrameTimer)
- cssAnimation.setRemoveAnimationPropertyOnCompletion(false);
}
if (needsFrameTimer)
@@ -611,46 +612,42 @@ CFRunLoopRemoveObserver = function(runloop, observer, mode)
var FrameUpdater = function(anIdentifier)
{
this._identifier = anIdentifier;
+ this._requestId = null;
this._duration = 0;
this._stop = false;
this._targets = [];
this._callbacks = [];
+
var frameUpdater = this;
this._updateFunction = function(timestamp)
{
+ if (frameUpdater._startDate == null)
+ frameUpdater._startDate = timestamp;
+
if (frameUpdater._stop)
return;
- if (this._startDate == null)
- this._startDate = timestamp;
-
for (var i = 0; i < frameUpdater._callbacks.length; i++)
frameUpdater._callbacks[i]();
- if (timestamp - this._startDate < frameUpdater._duration * 1000)
+ if (timestamp - frameUpdater._startDate < frameUpdater._duration * 1000)
window.requestAnimationFrame(frameUpdater._updateFunction);
};
};
FrameUpdater.prototype.start = function()
{
- window.requestAnimationFrame(this._updateFunction);
+ this._requestId = window.requestAnimationFrame(this._updateFunction);
};
FrameUpdater.prototype.stop = function()
{
-CPLog.debug("stop FrameUpdater with id " + this.identifier());
+ // window.cancelAnimationFrame support is Chrome 24, Firefox 23, IE 10, Opera 15, Safari 6.1
+ if (window.cancelAnimationFrame)
+ window.cancelAnimationFrame(this._requestId);
this._stop = true;
-
- var targets = this._targets;
-
- for (var i = 0; i < targets.length; i++)
- {
- CPLog.debug(targets[i] + " Remove animation-name property");
- targets[i]._DOMElement.style.removeProperty(CPBrowserCSSProperty("animation-name"));
- }
};
FrameUpdater.prototype.updateFunction = function()
@@ -6,35 +6,6 @@
{
}
-- (void)viewWillMoveToSuperview:(CPView)aSuperview
-{
- var orderInAnim = [self animationForKey:@"CPAnimationTriggerOrderIn"];
-
- if (orderInAnim && [orderInAnim isKindOfClass:[CAPropertyAnimation class]])
- {
- [_target setValue:[orderInAnim fromValue] forKeyPath:[orderInAnim keyPath]];
- }
-
- [_target viewWillMoveToSuperview:aSuperview];
-}
-
-- (void)viewDidMoveToSuperview
-{
- var orderInAnim = [self animationForKey:@"CPAnimationTriggerOrderIn"];
-
- if (orderInAnim && [orderInAnim isKindOfClass:[CAPropertyAnimation class]])
- {
- [self _setTargetValue:YES withKeyPath:@"CPAnimationTriggerOrderIn" fallback:nil completion:function()
- {
- [_target setValue:[orderInAnim toValue] forKeyPath:[orderInAnim keyPath]];
- }];
- }
- else
- {
- [_target viewDidMoveToSuperview];
- }
-}
-
- (void)removeFromSuperview
{
[self _setTargetValue:nil withKeyPath:@"CPAnimationTriggerOrderOut" setter:_cmd];
@@ -139,7 +110,7 @@ var DEFAULT_CSS_PROPERTIES = nil;
@implementation CPView (CPAnimatablePropertyContainer)
-+ (CPDictionary)defaultCSSProperties
++ (CPDictionary)_defaultCSSProperties
{
if (DEFAULT_CSS_PROPERTIES == nil)
{
@@ -160,9 +131,9 @@ var DEFAULT_CSS_PROPERTIES = nil;
return DEFAULT_CSS_PROPERTIES;
}
-+ (CPArray)cssPropertiesForKeyPath:(CPString)aKeyPath
++ (CPArray)_cssPropertiesForKeyPath:(CPString)aKeyPath
{
- return [[self defaultCSSProperties] objectForKey:aKeyPath];
+ return [[self _defaultCSSProperties] objectForKey:aKeyPath];
}
+ (Class)animatorClass
@@ -190,7 +161,14 @@ var DEFAULT_CSS_PROPERTIES = nil;
+ (CAAnimation)defaultAnimationForKey:(CPString)aKey
{
- if ([self cssPropertiesForKeyPath:aKey] !== nil)
+ // TODO: remove when supported.
+ if (aKey == @"CPAnimationTriggerOrderIn")
+ {
+ CPLog.warn("CPView animated key path CPAnimationTriggerOrderIn is not supported yet.");
+ return nil;
+ }
+
+ if ([self _cssPropertiesForKeyPath:aKey] !== nil)
return [CAAnimation animation];
return nil;
@@ -219,4 +197,4 @@ var DEFAULT_CSS_PROPERTIES = nil;
_animationsDictionary = [animationsDict copy];
}
-@end
+@end
@@ -51,7 +51,6 @@ CSSAnimation = function(aTarget/*DOM Element*/, anIdentifier)
this.animationsdurations = [];
this.islive = false;
this.didBuildDOMElements = false;
- this.removeAnimationPropertyOnCompletion = true;
animation = this;
CURRENT_ANIMATIONS[anIdentifier] = animation;
@@ -177,21 +176,21 @@ CSSAnimation.prototype.endEventListener = function()
if (idx !== -1)
inFlightAnimationsNames.splice(idx, 1);
- if (inFlightAnimationsNames.length == 0)
- {
- for (var i = 0; i < animationsNames.length; i++)
- {
- var completion = animation.completionFunctionForAnimationName(animationsNames[i]);
- if (completion)
- completion();
- }
+ if (inFlightAnimationsNames.length > 0)
+ return;
- var eventTarget = event.target,
- style = eventTarget.style;
+ for (var i = 0; i < animationsNames.length; i++)
+ {
+ var completion = animation.completionFunctionForAnimationName(animationsNames[i]);
+ if (completion)
+ completion();
+ }
- if (animation.removeAnimationPropertyOnCompletion)
- style.removeProperty(ANIMATION_NAME_PROPERTY);
+ var eventTarget = event.target,
+ style = eventTarget.style;
+ try {
+ style.removeProperty(ANIMATION_NAME_PROPERTY);
style.removeProperty(ANIMATION_DURATION_PROPERTY);
style.removeProperty(ANIMATION_FILL_MODE_PROPERTY);
style.removeProperty("-webkit-backface-visibility");
@@ -204,6 +203,8 @@ CSSAnimation.prototype.endEventListener = function()
eventTarget.removeEventListener(ANIMATION_END_EVENT_NAME, AnimationEndListener);
animation.listener = null;
delete (CURRENT_ANIMATIONS[animation.identifier]);
+ } catch (err) {
+ CPLog.warn("CSSAnimation.j - " + err);
}
};
@@ -260,11 +261,6 @@ CSSAnimation.prototype.buildDOMElements = function()
this.didBuildDOMElements = true;
}
-CSSAnimation.prototype.setRemoveAnimationPropertyOnCompletion = function(flag)
-{
- this.removeAnimationPropertyOnCompletion = flag;
-}
-
CSSAnimation.prototype.start = function()
{
if (this.propertyanimations.length == 0 || this.islive)
Oops, something went wrong.

0 comments on commit 4b55a69

Please sign in to comment.