Support for animations

[ansman]

Currently there is no support for keyframes in compass, they are supported in FF, Chrome, Safari and IE10 ATM.

[chriseppstein]

We will add support for this in compass after sass 3.2 ships. Currently it's as a plugin if you want to run against the sass preview release. https://github.com/ericam/compass-animation

[ansman]

Sweet

[ZeeAgency]

I would like to propose those mixins for the future support. It has some little interesting differences with this plugin.

https://github.com/ZeeAgency/compass-animation

Thanks

[chriseppstein]

@ZeeAgency Can you and @ericam discuss what differs and see about merging these two projects? I would love to hear both your thoughts on what is different and why.

[mirisuzanne]

Nice work @ZeeAgency.

The two are very similar. I like what Zee calls "scoped prefixing" - and I think we should use that in core if we can. Although it may be something we want to support at a more basic level, if possible. The current solution is a bit bulky.

Mine follows the compass standard on experimental support, where Zee works around that. That's an interesting discussion topic for how we want to handle prefix support across compass, but we shouldn't apply it to this one module alone. I also included all of animate.css as an optional include - but that should probably remain a plugin rather than moving to core.

The other complaint about mine is the indented syntax, which I used only because interpolation wasn't supported in scss and I wanted to keep things consistent. It's a moot point, as either solution should port entirely to scss for inclusion.

So: I recommend combining the two.

[chriseppstein]

@ericam I agree. this is directionally correct. And there is a core concept here that can be made part of our browser support module. Here's how I refactored it: https://gist.github.com/1943798

[mirisuzanne]

@chriseppstein looks great.

[chriseppstein]

re-opening... this isn't fixed, just delayed.

[chriseppstein]

@paulirish reminds me that -khtml is stupid.

[ZeeAgency]

Ok, I'm back online so...

About scoped prefixing
Indeed, I originally wanted to propose the "scoped prefixing" as a Compass core concept inside "_shared" but planned to refactor before submit it.

@ericam I agree, this was a bulky solution, I refactored it tonight but offline
@chriseppstein your gist refactor is great, didn't think about using @content here too ! Really nice.

Just 2 things :

• How can I have a Sass version allowing me to do @-rules interpolation with SCSS syntax ?
• https://gist.github.com/1946341#file_keyframes.scss Line 34 : I think the original keyframes shouldn't be scoped as some properties would still need some prefixes even if the vendor decided to unprefix keyframes. If he's not too busy we could probably ask @paulirish what he thinks about this one. Sad but probably the best way to go.

Just to say : scoped prefixing would also be useful for Media Queries. pixel-ratio is one case but there's a lot more with Moz introducing some more or less useful ones... and Opera with paged media queries (not the same as @page).

About the experimental support
You're right @ericam : I deliberately did the choice to not follow Compass standard here but for good reasons IMO and I hope we can talk about this with @chriseppstein soon ;-) This is a pretty hot topic but it doesn't require a lot of work and I'm willing to make the corresponding pull requests if needed (especially transforms...).

@ericam Just to say, I hope you didn't feel my README too rude, I'm french and sometimes my english looks harsher than desired ;) Your plugin is great, I just needed to point out the differences and hows & whys I made another one before somebody asked... Also, I wrote faster than searching on github, this was silly.

Thanks for your feedbacks, would be glad to see those in Compass soon.

Julien

PS : KHTML reminds me @paulirish is stupid, oh wait... actually KHTML is dead. Seriously, I only know of 2 people still using old Konqueror but they won't cry if they don't have fancy gradients. I've just followed current Compass standards here ;)

[mirisuzanne]

@ZeeAgency not rude at all! It was very well written, and I was glad to see where you had made different decisions than I had.

Agree with your points here as well. Having just attempted to update the browser support on another module, I'm in favor of the proposed change towards leaving browser-support in the hands of developers. That seems simpler and more robust from both ends - as a dev and a core contributor. That does deserve a ticket of its own. All I was saying earlier is that this module shouldn't be treated different from other modules.

I would go one further in the question of scoping and say that the official syntax should never be scoped in either direction. It should be present inside prefixed chunks, and prefixes should be present within official chunks.

[ZeeAgency]

@ericam About official scoping, I totally agree. That's the behavior I currently have and the only thing I would change from @chriseppstein's gist.

[mirisuzanne]

my plugin (https://github.com/ericam/compass-animation) has been converted to SCSS and updated with scoping.