Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(544)

Unified Diff: pkg/polymer/lib/elements/polymer-animation/polymer-animation-group.html

Issue 175443005: [polymer] import all elements (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: updated from bower Created 6 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: pkg/polymer/lib/elements/polymer-animation/polymer-animation-group.html
diff --git a/pkg/polymer/lib/elements/polymer-animation/polymer-animation-group.html b/pkg/polymer/lib/elements/polymer-animation/polymer-animation-group.html
new file mode 100644
index 0000000000000000000000000000000000000000..cc954ed979a56f1273d89cb1e9f13c1a0027809c
--- /dev/null
+++ b/pkg/polymer/lib/elements/polymer-animation/polymer-animation-group.html
@@ -0,0 +1,117 @@
+<link rel="import" href="../polymer/polymer.html">
+<link rel="import" href="polymer-animation.html">
+
+<polymer-element name="polymer-animation-group" extends="polymer-animation" attributes="type">
+ <script>
+ (function() {
+ var ANIMATION_GROUPS = {
+ 'par': ParGroup,
+ 'seq': SeqGroup
+ };
+ /**
+ * @module Animation
+ */
+ /**
+ * Component for a group of animations.
+ *
+ * @class polymer-animation-group
+ */
+ Polymer('polymer-animation-group', {
+ /**
+ * If specified the target will be assigned to all child animations.
+ * @property target
+ * @type HTMLElement|Node
+ * @default null
+ */
+ targetSelector: '',
+ /**
+ * If specified and not "auto" the duration will apply to the group
+ * and propagate to any child animations that is not a group and does
+ * not specify a duration.
+ * @property duration
+ * @type number
+ * @default "auto"
+ */
+ duration: 'auto',
+ /**
+ * Group type. 'par' for parallel and 'seq' for sequence.
+ * @property type
+ * @type String
+ * @default 'par'
+ */
+ type: 'par',
+ typeChanged: function() {
+ this.apply();
+ },
+ targetChanged: function() {
+ // Only propagate target to children animations if it's defined.
+ if (this.target) {
+ this.doOnChildren(function(c) {
+ c.target = this.target;
+ }.bind(this));
+ }
+ },
+ durationChanged: function() {
+ if (this.duration && this.duration !== 'auto') {
+ this.doOnChildren(function(c) {
+ // Propagate to children that is not a group and has no
+ // duration specified.
+ if (!c.type && (!c.duration || c.duration === 'auto')) {
+ c.duration = this.duration;
+ }
+ }.bind(this));
+ }
+ },
+ doOnChildren: function(inFn) {
+ var children = this.children;
+ if (!children.length) {
+ children = this.webkitShadowRoot ? this.webkitShadowRoot.childNodes : [];
+ }
+ Array.prototype.forEach.call(children, function(c) {
+ // TODO <template> in the way
+ c.apply && inFn(c);
+ }, this);
+ },
+ makeAnimation: function() {
+ return new ANIMATION_GROUPS[this.type](this.childAnimations, this.timingProps);
+ },
+ hasTarget: function() {
+ var ht = this.target !== null;
+ if (!ht) {
+ this.doOnChildren(function(c) {
+ ht = ht || c.hasTarget();
+ }.bind(this));
+ }
+ return ht;
+ },
+ apply: function() {
+ // Propagate target and duration to child animations first.
+ this.durationChanged();
+ this.targetChanged();
+ this.doOnChildren(function(c) {
+ c.apply();
+ });
+ return this.super();
+ },
+ get childAnimationElements() {
+ var list = [];
+ this.doOnChildren(function(c) {
+ if (c.makeAnimation) {
+ list.push(c);
+ }
+ });
+ return list;
+ },
+ get childAnimations() {
+ var list = [];
+ this.doOnChildren(function(c) {
+ if (c.animation) {
+ list.push(c.animation);
+ }
+ });
+ return list;
+ }
+ });
+ })();
+ </script>
+</polymer-element>

Powered by Google App Engine
This is Rietveld 408576698