polymer-paper-rails 0.2.0 → 0.2.5

data/app/assets/components/web-animations-next/src/maxifill-player.js

@@ -0,0 +1,162 @@
+// Copyright 2014 Google Inc. All rights reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+//     You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//     See the License for the specific language governing permissions and
+// limitations under the License.
+
+(function(shared, scope, testing) {
+  scope.Player = function(source) {
+    this.source = source;
+    if (source) {
+      // FIXME: detach existing player.
+      source.player = this;
+    }
+    this._isGroup = false;
+    this._player = null;
+    this._childPlayers = [];
+    this._callback = null;
+    this._rebuildUnderlyingPlayer();
+    // Players are constructed in the idle state.
+    this._player.cancel();
+  };
+
+  // TODO: add a source getter/setter
+  scope.Player.prototype = {
+    _rebuildUnderlyingPlayer: function() {
+      if (this._player) {
+        this._player.cancel();
+        this._player = null;
+      }
+
+      if (!this.source || this.source instanceof window.Animation) {
+        this._player = scope.newUnderlyingPlayerForAnimation(this.source);
+        scope.bindPlayerForAnimation(this);
+      }
+      if (this.source instanceof window.AnimationSequence || this.source instanceof window.AnimationGroup) {
+        this._player = scope.newUnderlyingPlayerForGroup(this.source);
+        scope.bindPlayerForGroup(this);
+      }
+
+      // FIXME: move existing currentTime/startTime/playState to new player
+    },
+    get paused() {
+      return this._player.paused;
+    },
+    get playState() {
+      return this._player.playState;
+    },
+    get onfinish() {
+      return this._onfinish;
+    },
+    set onfinish(v) {
+      if (typeof v == 'function') {
+        this._onfinish = v;
+        this._player.onfinish = (function(e) {
+          e.target = this;
+          v.call(this, e);
+        }).bind(this);
+      } else {
+        this._player.onfinish = v;
+        this.onfinish = this._player.onfinish;
+      }
+    },
+    get currentTime() {
+      return this._player.currentTime;
+    },
+    set currentTime(v) {
+      this._player.currentTime = v;
+      this._register();
+      this._forEachChild(function(child, offset) {
+        child.currentTime = v - offset;
+      });
+    },
+    get startTime() {
+      return this._player.startTime;
+    },
+    set startTime(v) {
+      this._player.startTime = v;
+      this._register();
+      this._forEachChild(function(child, offset) {
+        child.startTime = v + offset;
+      });
+    },
+    get playbackRate() {
+      return this._player.playbackRate;
+    },
+    get finished() {
+      return this._player.finished;
+    },
+    play: function() {
+      this._player.play();
+      this._register();
+      scope.awaitStartTime(this);
+      this._forEachChild(function(child) {
+        var time = child.currentTime;
+        child.play();
+        child.currentTime = time;
+      });
+    },
+    pause: function() {
+      this._player.pause();
+      this._register();
+      this._forEachChild(function(child) {
+        child.pause();
+      });
+    },
+    finish: function() {
+      this._player.finish();
+      this._register();
+      // TODO: child players??
+    },
+    cancel: function() {
+      this._player.cancel();
+      this._register();
+      this._removePlayers();
+    },
+    reverse: function() {
+      this._player.reverse();
+      scope.awaitStartTime(this);
+      this._register();
+      this._forEachChild(function(child, offset) {
+        child.reverse();
+        child.startTime = this.startTime + offset * this.playbackRate;
+        child.currentTime = this.currentTime + offset * this.playbackRate;
+      });
+    },
+    addEventListener: function(type, handler) {
+      var wrapped = handler;
+      if (typeof handler == 'function') {
+        wrapped = (function(e) {
+          e.target = this;
+          handler.call(this, e);
+        }).bind(this);
+        handler._wrapper = wrapped;
+      }
+      this._player.addEventListener(type, wrapped);
+    },
+    removeEventListener: function(type, handler) {
+      this._player.removeEventListener(type, (handler && handler._wrapper) || handler);
+    },
+    _removePlayers: function() {
+      while (this._childPlayers.length)
+        this._childPlayers.pop().cancel();
+    },
+    _forEachChild: function(f) {
+      var offset = 0;
+      this._childPlayers.forEach(function(child) {
+        f.call(this, child, offset);
+        if (this.source instanceof window.AnimationSequence)
+          offset += child.source.activeDuration;
+      }.bind(this));
+    },
+  };
+
+})(webAnimationsShared, webAnimationsMaxifill, webAnimationsTesting);

data/app/assets/components/web-animations-next/src/normalize-keyframes.js

@@ -0,0 +1,259 @@
+// Copyright 2014 Google Inc. All rights reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+//     You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//     See the License for the specific language governing permissions and
+// limitations under the License.
+
+(function(shared, testing) {
+  var shorthandToLonghand = {
+    background: [
+      'backgroundImage',
+      'backgroundPosition',
+      'backgroundSize',
+      'backgroundRepeat',
+      'backgroundAttachment',
+      'backgroundOrigin',
+      'backgroundClip',
+      'backgroundColor'
+    ],
+    border: [
+      'borderTopColor',
+      'borderTopStyle',
+      'borderTopWidth',
+      'borderRightColor',
+      'borderRightStyle',
+      'borderRightWidth',
+      'borderBottomColor',
+      'borderBottomStyle',
+      'borderBottomWidth',
+      'borderLeftColor',
+      'borderLeftStyle',
+      'borderLeftWidth'
+    ],
+    borderBottom: [
+      'borderBottomWidth',
+      'borderBottomStyle',
+      'borderBottomColor'
+    ],
+    borderColor: [
+      'borderTopColor',
+      'borderRightColor',
+      'borderBottomColor',
+      'borderLeftColor'
+    ],
+    borderLeft: [
+      'borderLeftWidth',
+      'borderLeftStyle',
+      'borderLeftColor'
+    ],
+    borderRadius: [
+      'borderTopLeftRadius',
+      'borderTopRightRadius',
+      'borderBottomRightRadius',
+      'borderBottomLeftRadius'
+    ],
+    borderRight: [
+      'borderRightWidth',
+      'borderRightStyle',
+      'borderRightColor'
+    ],
+    borderTop: [
+      'borderTopWidth',
+      'borderTopStyle',
+      'borderTopColor'
+    ],
+    borderWidth: [
+      'borderTopWidth',
+      'borderRightWidth',
+      'borderBottomWidth',
+      'borderLeftWidth'
+    ],
+    flex: [
+      'flexGrow',
+      'flexShrink',
+      'flexBasis'
+    ],
+    font: [
+      'fontFamily',
+      'fontSize',
+      'fontStyle',
+      'fontVariant',
+      'fontWeight',
+      'lineHeight'
+    ],
+    margin: [
+      'marginTop',
+      'marginRight',
+      'marginBottom',
+      'marginLeft'
+    ],
+    outline: [
+      'outlineColor',
+      'outlineStyle',
+      'outlineWidth'
+    ],
+    padding: [
+      'paddingTop',
+      'paddingRight',
+      'paddingBottom',
+      'paddingLeft'
+    ]
+  };
+
+  var shorthandExpanderElem = document.createElement('div');
+
+  var borderWidthAliases = {
+    thin: '1px',
+    medium: '3px',
+    thick: '5px'
+  };
+
+  var aliases = {
+    borderBottomWidth: borderWidthAliases,
+    borderLeftWidth: borderWidthAliases,
+    borderRightWidth: borderWidthAliases,
+    borderTopWidth: borderWidthAliases,
+    fontSize: {
+      'xx-small': '60%',
+      'x-small': '75%',
+      'small': '89%',
+      'medium': '100%',
+      'large': '120%',
+      'x-large': '150%',
+      'xx-large': '200%'
+    },
+    fontWeight: {
+      normal: '400',
+      bold: '700'
+    },
+    outlineWidth: borderWidthAliases,
+    textShadow: {
+      none: '0px 0px 0px transparent'
+    },
+    boxShadow: {
+      none: '0px 0px 0px 0px transparent'
+    }
+  };
+
+  function antiAlias(property, value) {
+    if (property in aliases) {
+      return aliases[property][value] || value;
+    }
+    return value;
+  }
+
+  // This delegates parsing shorthand value syntax to the browser.
+  function expandShorthandAndAntiAlias(property, value, result) {
+    var longProperties = shorthandToLonghand[property];
+    if (longProperties) {
+      shorthandExpanderElem.style[property] = value;
+      for (var i in longProperties) {
+        var longProperty = longProperties[i];
+        var longhandValue = shorthandExpanderElem.style[longProperty];
+        result[longProperty] = antiAlias(longProperty, longhandValue);
+      }
+    } else {
+      result[property] = antiAlias(property, value);
+    }
+  };
+
+  function normalizeKeyframes(effectInput) {
+    if (!Array.isArray(effectInput) && effectInput !== null)
+      throw new TypeError('Keyframe effect must be null or an array of keyframes');
+
+    if (effectInput == null)
+      return [];
+
+    var keyframeEffect = effectInput.map(function(originalKeyframe) {
+      var keyframe = {};
+      for (var member in originalKeyframe) {
+        var memberValue = originalKeyframe[member];
+        if (member == 'offset') {
+          if (memberValue != null) {
+            memberValue = Number(memberValue);
+            if (!isFinite(memberValue))
+              throw new TypeError('keyframe offsets must be numbers.');
+          }
+        } else if (member == 'composite') {
+          throw {
+            type: DOMException.NOT_SUPPORTED_ERR,
+            name: 'NotSupportedError',
+            message: 'add compositing is not supported'
+          };
+        } else if (member == 'easing') {
+          memberValue = shared.toTimingFunction(memberValue);
+        } else {
+          memberValue = '' + memberValue;
+        }
+        expandShorthandAndAntiAlias(member, memberValue, keyframe);
+      }
+      if (keyframe.offset == undefined)
+        keyframe.offset = null;
+      if (keyframe.easing == undefined)
+        keyframe.easing = shared.toTimingFunction('linear');
+      return keyframe;
+    });
+
+    var everyFrameHasOffset = true;
+    var looselySortedByOffset = true;
+    var previousOffset = -Infinity;
+    for (var i = 0; i < keyframeEffect.length; i++) {
+      var offset = keyframeEffect[i].offset;
+      if (offset != null) {
+        if (offset < previousOffset) {
+          throw {
+            code: DOMException.INVALID_MODIFICATION_ERR,
+            name: 'InvalidModificationError',
+            message: 'Keyframes are not loosely sorted by offset. Sort or specify offsets.'
+          };
+        }
+        previousOffset = offset;
+      } else {
+        everyFrameHasOffset = false;
+      }
+    }
+
+    keyframeEffect = keyframeEffect.filter(function(keyframe) {
+      return keyframe.offset >= 0 && keyframe.offset <= 1;
+    });
+
+    function spaceKeyframes() {
+      var length = keyframeEffect.length;
+      if (keyframeEffect[length - 1].offset == null)
+        keyframeEffect[length - 1].offset = 1;
+      if (length > 1 && keyframeEffect[0].offset == null)
+        keyframeEffect[0].offset = 0;
+
+      var previousIndex = 0;
+      var previousOffset = keyframeEffect[0].offset;
+      for (var i = 1; i < length; i++) {
+        var offset = keyframeEffect[i].offset;
+        if (offset != null) {
+          for (var j = 1; j < i - previousIndex; j++)
+            keyframeEffect[previousIndex + j].offset = previousOffset + (offset - previousOffset) * j / (i - previousIndex);
+          previousIndex = i;
+          previousOffset = offset;
+        }
+      }
+    }
+    if (!everyFrameHasOffset)
+      spaceKeyframes();
+
+    return keyframeEffect;
+  }
+
+  shared.normalizeKeyframes = normalizeKeyframes;
+
+  if (WEB_ANIMATIONS_TESTING) {
+    testing.normalizeKeyframes = normalizeKeyframes;
+  }
+
+})(webAnimationsShared, webAnimationsTesting);

data/app/assets/components/web-animations-next/src/number-handler.js

@@ -0,0 +1,72 @@
+// Copyright 2014 Google Inc. All rights reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+//   You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//   See the License for the specific language governing permissions and
+// limitations under the License.
+
+(function(scope, testing) {
+
+  function numberToString(x) {
+    return x.toFixed(3).replace('.000', '');
+  }
+
+  function clamp(min, max, x) {
+    return Math.min(max, Math.max(min, x));
+  }
+
+  function parseNumber(string) {
+    if (/^\s*[-+]?(\d*\.)?\d+\s*$/.test(string))
+      return Number(string);
+  }
+
+  function mergeNumbers(left, right) {
+    return [left, right, numberToString];
+  }
+
+  // FIXME: This should probably go in it's own handler.
+  function mergeFlex(left, right) {
+    if (left == 0)
+      return;
+    return clampedMergeNumbers(0, Infinity)(left, right);
+  }
+
+  function mergePositiveIntegers(left, right) {
+    return [left, right, function(x) {
+      return Math.round(clamp(1, Infinity, x));
+    }];
+  }
+
+  function clampedMergeNumbers(min, max) {
+    return function(left, right) {
+      return [left, right, function(x) {
+        return numberToString(clamp(min, max, x));
+      }];
+    };
+  }
+
+  function round(left, right) {
+    return [left, right, Math.round];
+  }
+
+  scope.clamp = clamp;
+  scope.addPropertiesHandler(parseNumber, clampedMergeNumbers(0, Infinity), ['border-image-width', 'line-height']);
+  scope.addPropertiesHandler(parseNumber, clampedMergeNumbers(0, 1), ['opacity', 'shape-image-threshold']);
+  scope.addPropertiesHandler(parseNumber, clampedMergeNumbers(0.01, Infinity), ['zoom']);
+  scope.addPropertiesHandler(parseNumber, mergeFlex, ['flex-grow', 'flex-shrink']);
+  scope.addPropertiesHandler(parseNumber, mergeNumbers, ['zoom']);
+  scope.addPropertiesHandler(parseNumber, mergePositiveIntegers, ['orphans', 'widows']);
+  scope.addPropertiesHandler(parseNumber, round, ['z-index']);
+
+  scope.parseNumber = parseNumber;
+  scope.mergeNumbers = mergeNumbers;
+  scope.numberToString = numberToString;
+
+})(webAnimationsMinifill, webAnimationsTesting);